feat: module dependencies

src/app/deals/drawers/ProjectEditorDrawer/tabs/ModulesTab/ModulesTab.tsx

@@ -1,7 +1,7 @@
 import { FC } from "react";
-import { isEqual } from "lodash";
 import { Button, Stack } from "@mantine/core";
 import { useForm } from "@mantine/form";
+import resolveDependencies from "@/app/deals/drawers/ProjectEditorDrawer/tabs/ModulesTab/utils/resolveDependencies";
 import { ProjectSchema } from "@/lib/client";
 import ModulesTable from "./components/ModulesTable";
 
@@ -16,8 +16,16 @@ export const ModulesTab: FC<Props> = ({ value, onChange }) => {
     });
 
     const onSubmit = (values: ProjectSchema) => {
-        onChange(values);
-        form.setInitialValues(values);
+        const modulesWithDependencies = resolveDependencies(
+            values.builtInModules
+        );
+        const updatedValues = {
+            ...values,
+            builtInModules: modulesWithDependencies,
+        };
+        form.setValues(updatedValues);
+        form.resetDirty();
+        onChange(updatedValues);
     };
 
     return (
@@ -32,7 +40,7 @@ export const ModulesTab: FC<Props> = ({ value, onChange }) => {
                 <Button
                     type={"submit"}
                     variant={"default"}
-                    disabled={isEqual(value, form.values)}>
+                    disabled={!form.isDirty()}>
                     Сохранить
                 </Button>
             </Stack>

src/app/deals/drawers/ProjectEditorDrawer/tabs/ModulesTab/components/ModulesTable.tsx

@@ -1,28 +1,29 @@
-import { FC, useRef } from "react";
+import { FC } from "react";
 import { Divider, Stack } from "@mantine/core";
 import useModulesTableColumns from "@/app/deals/drawers/ProjectEditorDrawer/tabs/ModulesTab/hooks/useModulesTableColumns";
 import BaseTable from "@/components/ui/BaseTable/BaseTable";
-import { BuiltInModuleSchema } from "@/lib/client";
-import { MODULES } from "@/modules/modules";
+import useBuiltInModulesList from "@/hooks/lists/useBuiltInModulesList";
+import { BuiltInModuleSchemaOutput } from "@/lib/client";
 
 type Props = {
-    selectedRecords: BuiltInModuleSchema[];
-    onSelectedRecordsChange: (records: BuiltInModuleSchema[]) => void;
+    selectedRecords: BuiltInModuleSchemaOutput[];
+    onSelectedRecordsChange: (records: BuiltInModuleSchemaOutput[]) => void;
 };
 
 const ModulesTable: FC<Props> = props => {
     const columns = useModulesTableColumns();
-    const modules = useRef(
-        Object.values(MODULES).map(module => module.modelData)
-    );
+    const { builtInModules } = useBuiltInModulesList();
 
     return (
         <Stack gap={0}>
             <Divider />
             <BaseTable
-                records={modules.current}
+                records={builtInModules}
                 columns={columns}
                 verticalSpacing={"md"}
+                allRecordsSelectionCheckboxProps={{
+                    hidden: true,
+                }}
                 {...props}
             />
         </Stack>

src/app/deals/drawers/ProjectEditorDrawer/tabs/ModulesTab/hooks/useModulesTableColumns.tsx

@@ -1,6 +1,8 @@
 import { useMemo } from "react";
+import { IconInfoCircle } from "@tabler/icons-react";
 import { DataTableColumn } from "mantine-datatable";
-import { BuiltInModuleSchema } from "@/lib/client";
+import { em, Group, Text, Tooltip } from "@mantine/core";
+import { BuiltInModuleSchemaOutput } from "@/lib/client";
 
 const useModulesTableColumns = () => {
     return useMemo(
@@ -9,14 +11,34 @@ const useModulesTableColumns = () => {
                 {
                     accessor: "label",
                     title: "Название",
-                    width: "30%",
+                    width: "20%",
                 },
                 {
                     title: "Описание",
                     accessor: "description",
-                    width: "70%",
+                    width: "50%",
                 },
-            ] as DataTableColumn<BuiltInModuleSchema>[],
+                {
+                    title: (
+                        <Group gap={"sm"}>
+                            <Text>Зависит от модулей</Text>
+                            <Tooltip
+                                label={
+                                    "Зависимости автоматически подключатся при сохранении"
+                                }>
+                                <IconInfoCircle size={em(25)} />
+                            </Tooltip>
+                        </Group>
+                    ),
+                    accessor: "dependsOn",
+                    width: "30%",
+                    render: module => (
+                        <Text>
+                            {module.dependsOn?.map(m => m.label).join(", ")}
+                        </Text>
+                    ),
+                },
+            ] as DataTableColumn<BuiltInModuleSchemaOutput>[],
         []
     );
 };

src/app/deals/drawers/ProjectEditorDrawer/tabs/ModulesTab/utils/resolveDependencies.ts

@@ -0,0 +1,22 @@
+import { uniqBy } from "lodash";
+import { BuiltInModuleSchemaOutput } from "@/lib/client";
+
+const resolveDependencies = (
+    modules: BuiltInModuleSchemaOutput[]
+): BuiltInModuleSchemaOutput[] => {
+    const resolved = new Set<number>();
+    const result: BuiltInModuleSchemaOutput[] = [];
+
+    const addModule = (module: BuiltInModuleSchemaOutput) => {
+        if (resolved.has(module.id)) return;
+        resolved.add(module.id);
+
+        module.dependsOn.forEach(addModule);
+        result.push(module);
+    };
+
+    modules.forEach(addModule);
+    return uniqBy(result, "id");
+};
+
+export default resolveDependencies;