jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

fix folders changing orders when editing a name

Browse source
This commit is contained in:
cristhianzl 2024-06-17 10:20:04 -03:00
commit d59f0b4034
1 changed files with 53 additions and 43 deletions
Download patch file Download diff file Expand all files Collapse all files

96
src/frontend/src/components/sidebarComponent/components/sideBarFolderButtons/index.tsx
View file

@ -104,6 +104,57 @@ const SideBarFoldersButtonsComponent = ({
folders.map((obj) => ({ name: obj.name, edit: false })); folders.map((obj) => ({ name: obj.name, edit: false }));
}, [folders]); }, [folders]);
const handleEditNameFolder = async (item) => {
const newEditFolders = editFolders.map((obj) => {
if (obj.name === item.name) {
return { name: item.name, edit: false };
}
return { name: obj.name, edit: false };
});
setEditFolderName(newEditFolders);
if (foldersNames[item.name].trim() !== "") {
setFoldersNames((old) => ({
...old,
[item.name]: foldersNames[item.name],
}));
const body = {
...item,
name: foldersNames[item.name],
flows: item.flows?.length > 0 ? item.flows : [],
components:
item.components?.length > 0
? item.components
: [],
};
const updatedFolder = await updateFolder(
body,
item.id!
);
const updatedFolderIndex = folders.findIndex(
(f) => f.id === updatedFolder.id
);
const updateFolders = [...folders];
updateFolders[updatedFolderIndex] = updatedFolder;
setFolders(updateFolders);
setFoldersNames({});
setEditFolderName(
folders.map((obj) => ({
name: obj.name,
edit: false,
}))
);
} else {
setFoldersNames((old) => ({
...old,
[item.name]: item.name,
}));
}
}
return ( return (
<> <>
<div className="flex shrink-0 items-center justify-between gap-2"> <div className="flex shrink-0 items-center justify-between gap-2">
@ -227,49 +278,8 @@ const SideBarFoldersButtonsComponent = ({
handleKeyDown(e, e.key, ""); handleKeyDown(e, e.key, "");
}} }}
autoFocus={true} autoFocus={true}
onBlur={async () => { onBlur={async () => { handleEditNameFolder(item)
const newEditFolders = editFolders.map((obj) => {
if (obj.name === item.name) {
return { name: item.name, edit: false };
}
return { name: obj.name, edit: false };
});
setEditFolderName(newEditFolders);
if (foldersNames[item.name].trim() !== "") {
setFoldersNames((old) => ({
...old,
[item.name]: foldersNames[item.name],
}));
const body = {
...item,
name: foldersNames[item.name],
flows: item.flows?.length > 0 ? item.flows : [],
components:
item.components?.length > 0
? item.components
: [],
};
const updatedFolder = await updateFolder(
body,
item.id!
);
const updateFolders = folders.filter(
(f) => f.name !== item.name
);
setFolders([...updateFolders, updatedFolder]);
setFoldersNames({});
setEditFolderName(
folders.map((obj) => ({
name: obj.name,
edit: false,
}))
);
} else {
setFoldersNames((old) => ({
...old,
[item.name]: item.name,
}));
}
}} }}
value={foldersNames[item.name]} value={foldersNames[item.name]}
id={`input-folder-${item.name}`} id={`input-folder-${item.name}`}