feat: refactor DFlowFolderContextMenu to streamline flow management and remove unused dialogs

Author: nicosammito

src/components/d-flow-folder/DFlowFolderContextMenu.tsx

@@ -26,8 +26,8 @@ import {DFlowFolderCreateDialog} from "./DFlowFolderCreateDialog";
 
 export interface DFlowFolderContextMenuGroupData {
     name: string
-    flows: Flow[]
-    type: "group"
+    flow: Flow[]
+    type: "folder"
 }
 
 export interface DFlowFolderContextMenuItemData {
@@ -49,48 +49,8 @@ export const DFlowFolderContextMenu: React.FC<DFlowFolderContextMenuProps> = (pr
     const flowTypeStore = useStore(DFlowTypeReactiveService)
 
     const flowTypes = React.useMemo(() => flowTypeService.values(), [flowTypeStore])
-    const [deleteDialogOpen, setDeleteDialogOpen] = React.useState(false)
-    const [renameDialogOpen, setRenameDialogOpen] = React.useState(false)
-    const [createDialogOpen, setCreateDialogOpen] = React.useState(false)
-    const [flowTypeId, setFlowTypeId] = React.useState<FlowType['id']>(null)
 
     return <>
-        <Dialog open={deleteDialogOpen} onOpenChange={(open) => setDeleteDialogOpen(open)}>
-            <DialogPortal>
-                <DialogContent autoFocus showCloseButton
-                               title={props.contextData.type == "item" ? "Remove flow" : "Remove folder"}>
-                    <Text size={"md"} hierarchy={"secondary"}>
-                        {props.contextData.type == "item" ? "Are you sure you want to remove flow" : "Are you sure you want to remove folder"} {" "}
-                        <Badge color={"info"}>
-                            <Text size={"md"} style={{color: "inherit"}}>{props.contextData.name}</Text>
-                        </Badge> {" "}
-                        {props.contextData.type == "group" ? ", all flows and sub-folders inside " : ""}from the this
-                        project?
-                    </Text>
-                    <Flex justify={"space-between"} align={"center"}>
-                        <DialogClose asChild>
-                            <Button color={"secondary"}>No, go back!</Button>
-                        </DialogClose>
-                        <DialogClose asChild>
-                            <Button color={"error"} onClick={() => {
-                                if (props.contextData.type === "item") {
-                                    props.onDelete?.(props.contextData.flow)
-                                } else if (props.contextData.type === "group") {
-                                    props.contextData.flows.forEach(flow => {
-                                        props.onDelete?.(flow)
-                                    })
-                                }
-                            }}>Yes, remove!</Button>
-                        </DialogClose>
-                    </Flex>
-                </DialogContent>
-            </DialogPortal>
-        </Dialog>
-
-        <DFlowFolderRenameDialog onOpenChange={open => setRenameDialogOpen(open)} open={renameDialogOpen} {...props}/>
-
-        <DFlowFolderCreateDialog flowTypeId={flowTypeId} onOpenChange={open => setCreateDialogOpen(open)} open={createDialogOpen} {...props}/>
-
         <ContextMenu>
             <ContextMenuTrigger asChild>
                 {children}
@@ -107,19 +67,18 @@ export const DFlowFolderContextMenu: React.FC<DFlowFolderContextMenuProps> = (pr
                         <ContextMenuSubContent>
                             {flowTypes.map(flowType => {
                                 return <ContextMenuItem key={flowType.id} onSelect={() => {
-                                    setFlowTypeId(flowType.id)
-                                    setCreateDialogOpen(true)
+                                    props.onCreate?.(flowType.id)
                                 }}>
                                     {flowType.names?.nodes!![0]?.content ?? flowType.id}
                                 </ContextMenuItem>
                             })}
                         </ContextMenuSubContent>
                         <ContextMenuSeparator/>
-                        <ContextMenuItem onSelect={() => setRenameDialogOpen(true)}>
+                        <ContextMenuItem onSelect={() => props.onRename?.(props.contextData)}>
                             <IconEdit size={12} color={"purple"}/>
                             <Text>Rename</Text>
                         </ContextMenuItem>
-                        <ContextMenuItem onSelect={() => setDeleteDialogOpen(true)}>
+                        <ContextMenuItem onSelect={() => props.onDelete?.(props.contextData)}>
                             <IconTrash size={12} color={"red"}/>
                             <Text>Delete</Text>
                         </ContextMenuItem>