Fixed bug in CSV node

This commit is contained in:
Ian Arawjo 2023-05-11 22:38:55 -04:00
parent 8a0988ae9c
commit 8c3b2c58aa
4 changed files with 30 additions and 27 deletions

View File

@ -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]);

View File

@ -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>

View File

@ -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) => (

View File

@ -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;
}