From 9a7def7c48ee397d2300962a0b3a3afb0ede710f Mon Sep 17 00:00:00 2001 From: anovazzi1 Date: Fri, 27 Oct 2023 16:25:37 -0300 Subject: [PATCH] feat(extraSidebarComponent): add import statement for getTagsIds function from storeUtils The import statement for the `getTagsIds` function from `storeUtils` was added to the `extraSidebarComponent` file. This function is used to retrieve the IDs of tags based on their names. fix(extraSidebarComponent): remove duplicate getTagsIds function The duplicate `getTagsIds` function in the `extraSidebarComponent` file was removed to avoid conflicts and improve code organization. feat(extraSidebarComponent): update saveFlowStore function call to use getTagsIds function The `saveFlowStore` function call in the `extraSidebarComponent` file was updated to use the `getTagsIds` function instead of directly passing the selected tags array. This change ensures that the IDs of the selected tags are used in the function call. feat(nodeToolbarComponent): add import statement for getTagsIds function from storeUtils The import statement for the `getTagsIds` function from `storeUtils` was added to the `nodeToolbarComponent` file. This function is used to retrieve the IDs of tags based on their names. fix(nodeToolbarComponent): remove duplicate getTagsIds function The duplicate `getTagsIds` function in the `nodeToolbarComponent` file was removed to avoid conflicts and improve code organization. feat(nodeToolbarComponent): update saveFlowStore function call to use getTagsIds function The `saveFlowStore` function call in the `nodeToolbarComponent` file was updated to use the `getTagsIds` function instead of directly passing the selected tags array. This change ensures that the IDs of the selected tags are used in the function call. feat(storeUtils): add getTagsIds function The `getTagsIds` function was added to the `storeUtils` file. This function takes an array of tag names and a reference to the tag list with IDs, and returns an array of tag IDs based on the names. This function is used in the `extraSidebarComponent` and `nodeToolbarComponent` files to retrieve the IDs of selected tags. --- .../components/extraSidebarComponent/index.tsx | 9 ++------- .../components/nodeToolbarComponent/index.tsx | 15 ++++++++++----- src/frontend/src/utils/storeUtils.ts | 9 +++++++++ 3 files changed, 21 insertions(+), 12 deletions(-) diff --git a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx index 4aeeea93d..8e583b920 100644 --- a/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx @@ -16,6 +16,7 @@ import ConfirmationModal from "../../../../modals/ConfirmationModal"; import ExportModal from "../../../../modals/exportModal"; import { APIClassType, APIObjectType } from "../../../../types/api"; import { FlowType } from "../../../../types/flow"; +import { getTagsIds } from "../../../../utils/storeUtils"; import { nodeColors, nodeIconsLucide, @@ -78,12 +79,6 @@ export default function ExtraSidebar(): JSX.Element { }); } - function getTagsIds(tags: string[]) { - return tags - .map((tag) => tagListId.current.find((tagObj) => tagObj.name === tag))! - .map((tag) => tag!.id); - } - // Handle showing components after use search input function handleSearchInput(e: string) { if (e === "") { @@ -151,7 +146,7 @@ export default function ExtraSidebar(): JSX.Element { }; saveFlowStore( saveFlow, - getTagsIds(Array.from(selectedTags)), + getTagsIds(Array.from(selectedTags), tagListId), sharePublic ).then( () => { diff --git a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx index f9677a170..021d69c22 100644 --- a/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/nodeToolbarComponent/index.tsx @@ -1,5 +1,5 @@ import { cloneDeep } from "lodash"; -import { useContext, useEffect, useState } from "react"; +import { useContext, useEffect, useRef, useState } from "react"; import { useReactFlow, useUpdateNodeInternals } from "reactflow"; import ShadTooltip from "../../../../components/ShadTooltipComponent"; import IconComponent from "../../../../components/genericIconComponent"; @@ -13,7 +13,7 @@ import { } from "../../../../components/ui/select-custom"; import { alertContext } from "../../../../contexts/alertContext"; import { TabsContext } from "../../../../contexts/tabsContext"; -import { saveFlowStore } from "../../../../controllers/API"; +import { getStoreTags, saveFlowStore } from "../../../../controllers/API"; import ConfirmationModal from "../../../../modals/ConfirmationModal"; import EditNodeModal from "../../../../modals/EditNodeModal"; import { nodeToolbarPropsType } from "../../../../types/components"; @@ -23,6 +23,7 @@ import { expandGroupNode, updateFlowPosition, } from "../../../../utils/reactflowUtils"; +import { getTagsIds } from "../../../../utils/storeUtils"; import { classNames } from "../../../../utils/utils"; export default function NodeToolbarComponent({ @@ -72,10 +73,14 @@ export default function NodeToolbarComponent({ const [sharePublic, setSharePublic] = useState(true); const [tags, setTags] = useState([]); const [selectedTags, setSelectedTags] = useState>(new Set()); + const tagListId = useRef<{ id: string; name: string }[]>([]); useEffect(() => { - //TODO: get tags from api - setTags(["teste1", "teste2"]); + getStoreTags().then((res) => { + tagListId.current = res; + let tags = res.map((tag) => tag.name); + setTags(tags); + }); }, []); function handleTagSelection(tag: string) { @@ -95,7 +100,7 @@ export default function NodeToolbarComponent({ saveComponent(componentFlow).then(() => { saveFlowStore( createFlowComponent(componentFlow), - Array.from(selectedTags), + getTagsIds(Array.from(selectedTags), tagListId), sharePublic ).then( (_) => { diff --git a/src/frontend/src/utils/storeUtils.ts b/src/frontend/src/utils/storeUtils.ts index aa8d0c3f7..b31f3ab44 100644 --- a/src/frontend/src/utils/storeUtils.ts +++ b/src/frontend/src/utils/storeUtils.ts @@ -12,3 +12,12 @@ export default function cloneFLowWithParent( childFLow.is_component = is_component; return childFLow; } + +export function getTagsIds( + tags: string[], + tagListId: { current: { name: string; id: string }[] } +) { + return tags + .map((tag) => tagListId.current.find((tagObj) => tagObj.name === tag))! + .map((tag) => tag!.id); +}