mirror of
https://github.com/ianarawjo/ChainForge.git
synced 2025-03-14 16:26:45 +00:00
Fixed bug in CSV node
This commit is contained in:
parent
8a0988ae9c
commit
8c3b2c58aa
@ -21,6 +21,7 @@ const CsvNode = ({ data, id }) => {
|
||||
|
||||
const processCsv = (csv) => {
|
||||
var matches = csv.match(/(\s*"[^"]+"\s*|\s*[^,]+|,)(?=,|$)/g);
|
||||
if (!matches) return;
|
||||
for (var n = 0; n < matches.length; ++n) {
|
||||
matches[n] = matches[n].trim();
|
||||
if (matches[n] == ',') matches[n] = '';
|
||||
@ -45,7 +46,7 @@ const CsvNode = ({ data, id }) => {
|
||||
}, [id, setDataPropsForNode]);
|
||||
|
||||
const handKeyDown = useCallback((event) => {
|
||||
if (event.key === 'Enter') {
|
||||
if (event.key === 'Enter' && data.text && data.text.trim().length > 0) {
|
||||
setIsEditing(false);
|
||||
setCsvInput(null);
|
||||
}
|
||||
@ -57,14 +58,14 @@ const CsvNode = ({ data, id }) => {
|
||||
}, []);
|
||||
|
||||
const handleOnBlur = useCallback((event) => {
|
||||
setIsEditing(false);
|
||||
setCsvInput(null);
|
||||
}, []);
|
||||
if (data.text && data.text.trim().length > 0)
|
||||
setIsEditing(false);
|
||||
}, [data.text]);
|
||||
|
||||
// render csv div
|
||||
const renderCsvDiv = useCallback(() => {
|
||||
// Take the data.text as csv (only 1 row), and get individual elements
|
||||
const elements = data.fields;
|
||||
const elements = data.fields || [];
|
||||
|
||||
// generate a HTML code that highlights the elements
|
||||
const html = [];
|
||||
@ -76,36 +77,39 @@ const CsvNode = ({ data, id }) => {
|
||||
}
|
||||
});
|
||||
|
||||
setContentDiv(<div className='csv-div nowheel' onClick={handleDivOnClick}>
|
||||
{html}
|
||||
</div>);
|
||||
setCountText(<Text size="xs" style={{ marginTop: '5px' }} color='blue' align='right'>{elements.length} elements</Text>);
|
||||
setContentDiv(
|
||||
<div className='csv-div nowheel' onClick={handleDivOnClick}>
|
||||
{html}
|
||||
</div>
|
||||
);
|
||||
setCountText(
|
||||
<Text size="xs" style={{ marginTop: '5px' }} color='blue' align='right'>{elements.length} elements</Text>
|
||||
);
|
||||
}, [data.text, handleDivOnClick]);
|
||||
|
||||
// When isEditing changes, add input
|
||||
useEffect(() => {
|
||||
if (!isEditing) {
|
||||
if (!isEditing && data.text && data.text.trim().length > 0) {
|
||||
setCsvInput(null);
|
||||
renderCsvDiv();
|
||||
return;
|
||||
}
|
||||
if (!csvInput) {
|
||||
var text_val = data.text || '';
|
||||
setCsvInput(
|
||||
<div className="input-field" key={id}>
|
||||
<textarea id={id} name={id} className="text-field-fixed nodrag csv-input" rows="2" cols="40" defaultValue={text_val} onChange={handleInputChange} placeholder='Paste your CSV text here' onKeyDown={handKeyDown} onBlur={handleOnBlur} autoFocus={true}/>
|
||||
</div>
|
||||
);
|
||||
setContentDiv(null);
|
||||
setCountText(null);
|
||||
}
|
||||
|
||||
var text_val = data.text || '';
|
||||
setCsvInput(
|
||||
<div className="input-field" key={id}>
|
||||
<textarea id={id} name={id} className="text-field-fixed nodrag csv-input" rows="2" cols="40" defaultValue={text_val} onChange={handleInputChange} placeholder='Paste your CSV text here' onKeyDown={handKeyDown} onBlur={handleOnBlur} autoFocus={true}/>
|
||||
</div>
|
||||
);
|
||||
setContentDiv(null);
|
||||
setCountText(null);
|
||||
}, [isEditing]);
|
||||
|
||||
// when data.text changes, update the content div
|
||||
useEffect(() => {
|
||||
// When in editing mode, don't update the content div
|
||||
if (isEditing) return;
|
||||
if (!data.text) return;
|
||||
if (isEditing || !data.text) return;
|
||||
|
||||
renderCsvDiv();
|
||||
|
||||
}, [id, data.text]);
|
||||
|
@ -146,7 +146,7 @@ const InspectorNode = ({ data, id }) => {
|
||||
type="target"
|
||||
position="left"
|
||||
id="input"
|
||||
style={{ top: "30%", background: '#555' }}
|
||||
style={{ top: "50%", background: '#555' }}
|
||||
onConnect={handleOnConnect}
|
||||
/>
|
||||
</div>
|
||||
|
@ -15,7 +15,6 @@ const allLLMs = [
|
||||
{ name: "GPT4", emoji: "🥵", model: "gpt-4", temp: 1.0 },
|
||||
{ name: "Alpaca 7B", emoji: "🦙", model: "alpaca.7B", temp: 0.5 },
|
||||
{ name: "Claude v1", emoji: "📚", model: "claude-v1", temp: 0.5 },
|
||||
{ name: "Ian Chatbot", emoji: "💩", model: "test", temp: 0.5 }
|
||||
];
|
||||
const initLLMs = [allLLMs[0]];
|
||||
|
||||
@ -462,7 +461,7 @@ const PromptNode = ({ data, id }) => {
|
||||
const resp_boxes = responses_by_llm[llm].map((res_obj, idx) => {
|
||||
const num_resp = res_obj['responses'].length;
|
||||
const resp_prevs = res_obj['responses'].map((r, i) =>
|
||||
(<pre className="small-response" key={i}><i>{truncStr(r, 40)}</i><b>({i+1} of {num_resp})</b></pre>)
|
||||
(<pre className="small-response" key={i}><i>{truncStr(r, 33)}</i><b>({i+1} of {num_resp})</b></pre>)
|
||||
);
|
||||
const vars = vars_to_str(res_obj.vars);
|
||||
const var_tags = vars.map((v, i) => (
|
||||
|
@ -45,12 +45,12 @@ code {
|
||||
}
|
||||
|
||||
.csv-div {
|
||||
width: 350px;
|
||||
width: 290px;
|
||||
max-height: 250px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.csv-input {
|
||||
width: 350px;
|
||||
width: 290px;
|
||||
height: 150px;
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user