Merge pull request #227 from code0-tech/feat/#202

Adding module grouping to next node dialog

Author: nicosammito

src/app/(flow)/layout.tsx

@@ -12,7 +12,7 @@ import {
     FunctionDefinition,
     Namespace,
     NamespaceProject,
-    Runtime, User
+    Runtime, RuntimeModule, User
 } from "@code0-tech/sagittarius-graphql-types";
 import {usePersistentReactiveArrayService} from "@/hooks/usePersistentReactiveArrayService";
 import {UserService} from "@edition/user/services/User.service";
@@ -33,6 +33,7 @@ import {ProjectView} from "@edition/project/services/Project.view";
 import {RoleView} from "@edition/role/services/Role.view";
 import {useUserSession} from "@edition/user/hooks/User.session.hook";
 import {Layout} from "@code0-tech/pictor/dist/components/layout/Layout";
+import {ModuleService} from "@ce/module/services/Module.service";
 
 export default function FlowLayout({bar, tab, children}: {
     bar: React.ReactNode,
@@ -66,6 +67,7 @@ export default function FlowLayout({bar, tab, children}: {
     const functions = usePersistentReactiveArrayService<FunctionDefinition, FunctionService>(`dashboard::functions::${currentSession?.id}`, (store) => new FunctionService(graphqlClient, store))
     const datatype = usePersistentReactiveArrayService<DataType, DatatypeService>(`dashboard::datatypes::${currentSession?.id}`, (store) => new DatatypeService(graphqlClient, store))
     const flowtype = usePersistentReactiveArrayService<FlowType, FlowTypeService>(`dashboard::flowtypes::${currentSession?.id}`, (store) => new FlowTypeService(graphqlClient, store))
+    const module = usePersistentReactiveArrayService<RuntimeModule, ModuleService>(`dashboard::modules::${currentSession?.id}`, (store) => new ModuleService(graphqlClient, store))
 
 
     const runtimeId = React.useMemo(() => project[1].getById(projectId, {namespaceId})?.primaryRuntime?.id, [projectId, project[0], namespaceId])
@@ -77,10 +79,11 @@ export default function FlowLayout({bar, tab, children}: {
         functions[1].values({namespaceId, projectId, runtimeId})
         datatype[1].values({namespaceId, projectId, runtimeId})
         flowtype[1].values({namespaceId, projectId, runtimeId})
+        module[1].values({namespaceId, projectId})
     }, [runtimeId, namespaceId, projectId, currentSession, flow, functions, datatype, flowtype])
 
     return <ContextStoreProvider
-        services={[user, organization, member, namespace, runtime, project, role, flow, functions, datatype, flowtype]}>
+        services={[user, organization, member, namespace, runtime, project, role, flow, functions, datatype, flowtype, module]}>
         <Layout layoutGap={0} style={{zIndex: 0}} showLayoutSplitter={false} leftContent={
             <Flex p={0.7} pt={1} align={"center"} style={{flexDirection: "column", gap: "0.7rem"}}>
                 <div style={{

src/packages/ce/src/datatype/services/fragments/DataType.basic.fragment.graphql

@@ -28,4 +28,8 @@ fragment BasicDataType on DataType {
     runtime {
         id
     }
+    runtimeModule {
+        __typename
+        id
+    }
 }

src/packages/ce/src/datatype/services/fragments/DataType.fragment.graphql

@@ -32,6 +32,11 @@ fragment DataType on DataType {
         id
     }
 
+    runtimeModule {
+        __typename
+        id
+    }
+
     rules (first: $firstRule, after: $afterRule) {
         __typename
         count

src/packages/ce/src/flow/components/panels/FlowPanelControlComponent.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import {Flow, NodeFunction} from "@code0-tech/sagittarius-graphql-types";
+import {Flow, LiteralValue, NodeFunction, ReferenceValue} from "@code0-tech/sagittarius-graphql-types";
 import {
     Badge,
     Button,
@@ -15,7 +15,6 @@ import {Panel} from "@xyflow/react";
 import {ButtonGroup} from "@code0-tech/pictor/dist/components/button-group/ButtonGroup";
 import {FlowService} from "@edition/flow/services/Flow.service";
 import {SuggestionDialogComponent} from "@edition/function/components/suggestion/SuggestionDialogComponent";
-import {FunctionSuggestion} from "@edition/function/components/suggestion/FunctionSuggestionComponent.view";
 import {Suggestion} from "@edition/function/components/suggestion/Suggestion.util";
 import {useHotkeys} from "react-hotkeys-hook";
 import {useSelectedFunctionNode} from "@edition/function/hooks/FunctionNode.selected.hook";
@@ -51,14 +50,14 @@ export const FlowPanelControlComponent: React.FC<FlowPanelControlComponentProps>
         })
     }, [selectedNode, flowService, flowStore])
 
-    const addNodeToFlow = React.useCallback((suggestion: FunctionSuggestion | Suggestion) => {
-        if (flowId && suggestion.value.__typename === "NodeFunction" && selectedNode?.id.includes("NodeFunction")) {
+    const addNodeToFlow = React.useCallback((suggestion: NodeFunction | ReferenceValue | LiteralValue) => {
+        if (flowId && suggestion.__typename === "NodeFunction" && selectedNode?.id.includes("NodeFunction")) {
             startTransition(async () => {
-                await flowService.addNextNodeById(flowId, selectedNode?.id as NodeFunction['id'], suggestion.value as NodeFunction)
+                await flowService.addNextNodeById(flowId, selectedNode?.id as NodeFunction['id'], suggestion as NodeFunction)
             })
-        } else if (suggestion.value.__typename === "NodeFunction") {
+        } else if (suggestion.__typename === "NodeFunction") {
             startTransition(async () => {
-                await flowService.addNextNodeById(flowId, null, suggestion.value as NodeFunction)
+                await flowService.addNextNodeById(flowId, null, suggestion as NodeFunction)
             })
         }
     }, [flowId, flowService, flowStore, selectedNode])

src/packages/ce/src/flowtype/services/fragments/FlowType.fragment.graphql

@@ -27,6 +27,10 @@ fragment FlowType on FlowType {
     runtime {
         id
     }
+    runtimeModule {
+        __typename
+        id
+    }
     signature
     flowTypeSettings {
         __typename