feat: a few tabs for module, deal services tab for mobiles

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/FulfillmentBaseTab.tsx

@@ -1,7 +1,7 @@
 import { FC } from "react";
 import { DealSchema } from "@/lib/client";
-import FulfillmentBaseTabBody from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/FulfillmentBaseTabBody/FulfillmentBaseTabBody";
-import { FulfillmentBaseContextProvider } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/contexts/FulfillmentBaseContext";
+import { FulfillmentBaseContextProvider } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
+import FulfillmentBaseTabBody from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/FulfillmentBaseTabBody/FulfillmentBaseTabBody";
 
 type Props = {
     value: DealSchema;

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealInfoView/DealInfoView.tsx

@@ -1,8 +1,8 @@
 import { Flex, Stack } from "@mantine/core";
-import DealServicesTable from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/DealInfoView/components/DealServicesTable/DealServicesTable";
-import ProductsActions from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/DealInfoView/components/ProductsActions/ProductsActions";
-import TotalPriceLabel from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/DealInfoView/components/TotalPriceLabel/TotalPriceLabel";
-import styles from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/FulfillmentBaseTab.module.css";
+import ProductsActions from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealInfoView/components/ProductsActions/ProductsActions";
+import TotalPriceLabel from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealInfoView/components/TotalPriceLabel/TotalPriceLabel";
+import DealServicesTable from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealServicesTable/DealServicesTable";
+import styles from "@/modules/dealModularEditorTabs/FulfillmentBase/FulfillmentBase.module.css";
 
 const DealInfoView = () => (
     <Stack

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealInfoView/components/ProductsActions/ProductsActions.tsx

@@ -1,7 +1,7 @@
 import { FC } from "react";
 import { Button, Flex } from "@mantine/core";
 import { modals } from "@mantine/modals";
-import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/contexts/FulfillmentBaseContext";
+import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
 
 const ProductsActions: FC = () => {
     const { deal, dealProductsList, productsCrud, dealProductsCrud } =

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealInfoView/components/TotalPriceLabel/TotalPriceLabel.tsx

@@ -1,7 +1,7 @@
 import { useMemo } from "react";
 import { Flex, Title } from "@mantine/core";
-import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/contexts/FulfillmentBaseContext";
-import styles from "../../../../FulfillmentBaseTab.module.css";
+import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
+import styles from "../../../../../FulfillmentBase.module.css";
 
 const TotalPriceLabel = () => {
     const {

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealServicesTable/DealServicesTable.tsx

@@ -1,16 +1,14 @@
 import { FC } from "react";
 import { Flex, ScrollArea } from "@mantine/core";
-import DealServicesTitle from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/DealInfoView/components/DealServicesTable/components/DealServicesTitle";
-import DealServicesTotalLabel from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/DealInfoView/components/DealServicesTable/components/DealServicesTotalLabel";
-import ServicesActions from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/DealInfoView/components/DealServicesTable/components/ServicesActions";
-import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/contexts/FulfillmentBaseContext";
-import DealServiceRow from "./components/DealServiceRow";
+import DealServiceRow from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealServicesTable/components/DealServiceRow";
+import DealServicesTitle from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealServicesTable/components/DealServicesTitle";
+import ServicesActions from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealServicesTable/components/ServicesActions";
+import DealServicesTotalLabel from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/components/DealServicesTotalLabel/DealServicesTotalLabel";
+import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
 
 const DealServicesTable: FC = () => {
     const { dealServicesList, dealServicesCrud } = useFulfillmentBaseContext();
 
-    // const isLocked = isDealLocked(deal); // TODO bills
-
     return (
         <Flex
             direction={"column"}
@@ -20,7 +18,7 @@ const DealServicesTable: FC = () => {
             <ScrollArea
                 flex={1}
                 scrollbars={"y"}
-                offsetScrollbars={"y"}>
+                offsetScrollbars={"present"}>
                 <Flex
                     direction={"column"}
                     gap={"sm"}>
@@ -34,7 +32,7 @@ const DealServicesTable: FC = () => {
                     ))}
                 </Flex>
             </ScrollArea>
-            <DealServicesTotalLabel />
+            <DealServicesTotalLabel mt={"sm"} />
             <ServicesActions />
         </Flex>
     );

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealServicesTable/components/DealServiceRow.tsx

@@ -1,11 +1,11 @@
 import { FC } from "react";
 import { IconTrash } from "@tabler/icons-react";
 import { isNumber } from "lodash";
-import { Divider, Group, NumberInput, Stack, Text } from "@mantine/core";
+import { Divider, Group, NumberInput, rem, Stack, Text } from "@mantine/core";
 import { useDebouncedCallback } from "@mantine/hooks";
 import ActionIconWithTip from "@/components/ui/ActionIconWithTip/ActionIconWithTip";
 import { DealServiceSchema } from "@/lib/client";
-import LockCheckbox from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/LockCheckbox/LockCheckbox";
+import LockCheckbox from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/LockCheckbox/LockCheckbox";
 
 type Props = {
     value: DealServiceSchema;
@@ -64,6 +64,7 @@ const DealServiceRow: FC<Props> = ({ value, onChange, onDelete }) => {
                             display: "flex",
                             cursor: "pointer",
                             pointerEvents: "auto",
+                            paddingRight: rem(10),
                         },
                     }}
                     rightSection={

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealServicesTable/components/ServicesActions.tsx

@@ -1,8 +1,8 @@
 import { Button, Flex } from "@mantine/core";
 import { modals } from "@mantine/modals";
 import { addKitToDeal, ServicesKitSchema } from "@/lib/client";
-import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/contexts/FulfillmentBaseContext";
-import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/types/service";
+import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
+import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/types/service";
 
 const ServicesActions = () => {
     const { dealServicesList, dealServicesCrud, deal } =

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/FulfillmentBaseTabBody/FulfillmentBaseTabBody.tsx

@@ -1,7 +1,7 @@
 import { Flex, ScrollArea, Stack } from "@mantine/core";
-import DealInfoView from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/DealInfoView/DealInfoView";
-import ProductView from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/ProductView/ProductView";
-import { useFulfillmentBaseContext } from "../../contexts/FulfillmentBaseContext";
+import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
+import DealInfoView from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/DealInfoView/DealInfoView";
+import ProductView from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductView/ProductView";
 
 const FulfillmentBaseTabBody = () => {
     const { dealProductsList } = useFulfillmentBaseContext();

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductSelect/ProductSelect.tsx

@@ -6,7 +6,7 @@ import ObjectSelect, {
     ObjectSelectProps,
 } from "@/components/selects/ObjectSelect/ObjectSelect";
 import { ProductSchema } from "@/lib/client";
-import useProductsList from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/hooks/lists/useProductsList";
+import useProductsList from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/hooks/lists/useProductsList";
 import renderProductOption from "./utils/renderProductOption";
 
 type RestProps = {

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductSelect/utils/renderProductOption.tsx

@@ -5,7 +5,7 @@ import {
     Tooltip,
 } from "@mantine/core";
 import { ProductSchema } from "@/lib/client";
-import ProductFieldsList from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/ProductView/components/ProductFieldsList";
+import ProductFieldsList from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductView/components/ProductFieldsList";
 
 const renderProductOption = (
     products: ProductSchema[]

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductView/ProductView.tsx

@@ -16,12 +16,12 @@ import {
     duplicateProductServices,
     ServicesKitSchema,
 } from "@/lib/client";
-import ProductFieldsList from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/ProductView/components/ProductFieldsList";
-import ProductViewActions from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/ProductView/components/ProductViewActions";
-import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/contexts/FulfillmentBaseContext";
-import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/types/service";
+import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
+import ProductFieldsList from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductView/components/ProductFieldsList";
+import ProductViewActions from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductView/components/ProductViewActions";
+import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/types/service";
 import ProductServicesTable from "./components/ProductServicesTable";
-import styles from "../../FulfillmentBaseTab.module.css";
+import styles from "../../../FulfillmentBase.module.css";
 
 type Props = {
     dealProduct: DealProductSchema;

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductView/components/ProductServicesTable.tsx

@@ -5,8 +5,8 @@ import { modals } from "@mantine/modals";
 import ActionIconWithTip from "@/components/ui/ActionIconWithTip/ActionIconWithTip";
 import BaseTable from "@/components/ui/BaseTable/BaseTable";
 import { DealProductSchema, ProductServiceSchema } from "@/lib/client";
-import useProductServicesTableColumns from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/ProductView/hooks/useProductServicesTableColumns";
-import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/contexts/FulfillmentBaseContext";
+import useProductServicesTableColumns from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductView/hooks/useProductServicesTableColumns";
+import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
 
 type Props = {
     dealProduct: DealProductSchema;

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductView/components/ProductViewActions.tsx

@@ -4,7 +4,7 @@ import { Flex } from "@mantine/core";
 import { modals } from "@mantine/modals";
 import ActionIconWithTip from "@/components/ui/ActionIconWithTip/ActionIconWithTip";
 import { DealProductSchema } from "@/lib/client";
-import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/contexts/FulfillmentBaseContext";
+import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
 
 type Props = {
     dealProduct: DealProductSchema;

src/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ServiceSelect/ServiceSelect.tsx

@@ -9,8 +9,8 @@ import ObjectSelect, {
     ObjectSelectProps,
 } from "@/components/selects/ObjectSelect/ObjectSelect";
 import { ServiceSchema } from "@/lib/client";
-import useServicesList from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/hooks/lists/useServicesList";
-import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/types/service";
+import useServicesList from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/hooks/lists/useServicesList";
+import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/types/service";
 
 type RestProps = {
     filterType?: ServiceType;

src/modules/dealModularEditorTabs/FulfillmentBase/mobile/CommonServicesTab.tsx

@@ -0,0 +1,18 @@
+import { FC } from "react";
+import { DealSchema } from "@/lib/client";
+import { FulfillmentBaseContextProvider } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
+import DealServicesTable from "@/modules/dealModularEditorTabs/FulfillmentBase/mobile/components/DealServiceTable/DealServicesTable";
+
+type Props = {
+    value: DealSchema;
+};
+
+const CommonServicesTab: FC<Props> = ({ value }) => {
+    return (
+        <FulfillmentBaseContextProvider deal={value}>
+            <DealServicesTable />
+        </FulfillmentBaseContextProvider>
+    );
+};
+
+export default CommonServicesTab;

src/modules/dealModularEditorTabs/FulfillmentBase/mobile/ProductsTab.tsx

@@ -0,0 +1,17 @@
+import { FC } from "react";
+import { DealSchema } from "@/lib/client";
+import { FulfillmentBaseContextProvider } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
+
+type Props = {
+    value: DealSchema;
+};
+
+const ProductsTab: FC<Props> = ({ value }) => {
+    return (
+        <FulfillmentBaseContextProvider deal={value}>
+            <></>
+        </FulfillmentBaseContextProvider>
+    );
+};
+
+export default ProductsTab;

src/modules/dealModularEditorTabs/FulfillmentBase/mobile/components/AddDealServiceButton/AddDealServiceButton.tsx

@@ -0,0 +1,40 @@
+import { FC } from "react";
+import { IconPlus } from "@tabler/icons-react";
+import { ButtonProps, Text } from "@mantine/core";
+import { modals } from "@mantine/modals";
+import InlineButton from "@/components/ui/InlineButton/InlineButton";
+import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
+
+type Props = ButtonProps;
+
+const AddDealServiceButton: FC<Props> = props => {
+    const { dealServicesList, dealServicesCrud, deal } =
+        useFulfillmentBaseContext();
+
+    const onCreateClick = () => {
+        const serviceIdsToExclude = dealServicesList.dealServices.map(
+            service => service.service.id
+        );
+        modals.openContextModal({
+            modal: "dealServiceEditorModal",
+            innerProps: {
+                onCreate: values =>
+                    dealServicesCrud.onCreate({ ...values, dealId: deal.id }),
+                serviceIdsToExclude,
+                isEditing: false,
+            },
+            withCloseButton: false,
+        });
+    };
+
+    return (
+        <InlineButton
+            {...props}
+            onClick={onCreateClick}>
+            <IconPlus />
+            <Text>Добавить услугу</Text>
+        </InlineButton>
+    );
+};
+
+export default AddDealServiceButton;

src/modules/dealModularEditorTabs/FulfillmentBase/mobile/components/DealServiceTable/DealServicesTable.tsx

@@ -0,0 +1,66 @@
+import { FC } from "react";
+import { Flex, ScrollArea, Stack } from "@mantine/core";
+import { modals } from "@mantine/modals";
+import BaseTable from "@/components/ui/BaseTable/BaseTable";
+import { DealServiceSchema } from "@/lib/client";
+import AddDealServiceButton from "@/modules/dealModularEditorTabs/FulfillmentBase/mobile/components/AddDealServiceButton/AddDealServiceButton";
+import useDealServicesTableColumns from "@/modules/dealModularEditorTabs/FulfillmentBase/mobile/components/DealServiceTable/useDealServicesTableColumns";
+import DealServicesTotalLabel from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/components/DealServicesTotalLabel/DealServicesTotalLabel";
+import { useFulfillmentBaseContext } from "../../../shared/contexts/FulfillmentBaseContext";
+
+const DealServicesTable: FC = () => {
+    const { dealServicesList, dealServicesCrud } = useFulfillmentBaseContext();
+
+    const onChange = (item: DealServiceSchema) => {
+        const serviceIdsToExclude = dealServicesList.dealServices.map(
+            dealService => dealService.service.id
+        );
+
+        modals.openContextModal({
+            modal: "dealServiceEditorModal",
+            innerProps: {
+                entity: item,
+                onChange: values =>
+                    dealServicesCrud.onUpdate(
+                        item.dealId,
+                        item.serviceId,
+                        values
+                    ),
+                serviceIdsToExclude,
+                isEditing: true,
+            },
+            withCloseButton: false,
+        });
+    };
+
+    const columns = useDealServicesTableColumns({
+        onDelete: dealServicesCrud.onDelete,
+        onChange,
+    });
+
+    return (
+        <ScrollArea
+            m={"xs"}
+            h={"calc(100vh - 140px)"}
+            scrollbars={"y"}
+            type={"scroll"}>
+            <Stack gap={"sm"}>
+                <Flex
+                    p={"sm"}
+                    bd={"1px solid var(--mantine-color-default-border)"}
+                    bdrs={"lg"}>
+                    <DealServicesTotalLabel order={5} />
+                </Flex>
+                <BaseTable
+                    records={dealServicesList.dealServices}
+                    columns={columns}
+                    groups={undefined}
+                    idAccessor={"serviceId"}
+                    withTableBorder
+                />
+                <AddDealServiceButton size={"lg"} />
+            </Stack>
+        </ScrollArea>
+    );
+};
+export default DealServicesTable;

src/modules/dealModularEditorTabs/FulfillmentBase/mobile/components/DealServiceTable/useDealServicesTableColumns.tsx

@@ -0,0 +1,57 @@
+import { useMemo } from "react";
+import { IconEdit, IconTrash } from "@tabler/icons-react";
+import { DataTableColumn } from "mantine-datatable";
+import { ActionIcon, Flex } from "@mantine/core";
+import { DealServiceSchema } from "@/lib/client";
+
+type Props = {
+    onChange: (dealService: DealServiceSchema) => void;
+    onDelete: (dealService: DealServiceSchema) => void;
+};
+
+const useDealServicesTableColumns = ({ onChange, onDelete }: Props) => {
+    return useMemo(
+        () =>
+            [
+                {
+                    accessor: "service.name",
+                    title: "Название",
+                    width: "53%",
+                },
+                {
+                    accessor: "quantity",
+                    title: "Кол-во",
+                    width: "17%",
+                },
+                {
+                    accessor: "price",
+                    title: "Цена",
+                    width: "30%",
+                },
+                {
+                    accessor: "actions",
+                    title: "Действия",
+                    textAlign: "center",
+                    width: "0%",
+                    render: dealService => (
+                        <Flex gap={"sm"}>
+                            <ActionIcon
+                                variant={"subtle"}
+                                c={"red"}
+                                onClick={() => onDelete(dealService)}>
+                                <IconTrash />
+                            </ActionIcon>
+                            <ActionIcon
+                                variant={"subtle"}
+                                onClick={() => onChange(dealService)}>
+                                <IconEdit />
+                            </ActionIcon>
+                        </Flex>
+                    ),
+                },
+            ] as DataTableColumn<DealServiceSchema>[],
+        [onChange, onDelete]
+    );
+};
+
+export default useDealServicesTableColumns;

src/modules/dealModularEditorTabs/FulfillmentBase/shared/components/DealServicesTotalLabel/DealServicesTotalLabel.tsx

@@ -1,8 +1,10 @@
-import { useMemo } from "react";
-import { Title } from "@mantine/core";
-import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/contexts/FulfillmentBaseContext";
+import { FC, useMemo } from "react";
+import { Title, TitleProps } from "@mantine/core";
+import { useFulfillmentBaseContext } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext";
 
-const DealServicesTotalLabel = () => {
+type Props = TitleProps;
+
+const DealServicesTotalLabel: FC<Props> = ({ order = 3, ...props }) => {
     const { dealServicesList } = useFulfillmentBaseContext();
     const total = useMemo(
         () =>
@@ -16,9 +18,9 @@ const DealServicesTotalLabel = () => {
     return (
         <Title
             style={{ textAlign: "end" }}
-            mt={"sm"}
-            order={3}>
-            Итог: {total.toFixed(2)}₽
+            order={order}
+            {...props}>
+            Итог: {total.toLocaleString("ru")}₽
         </Title>
     );
 };

src/modules/dealModularEditorTabs/FulfillmentBase/shared/contexts/FulfillmentBaseContext.tsx

@@ -3,22 +3,25 @@
 import { DealSchema } from "@/lib/client";
 import { getProductsQueryKey } from "@/lib/client/@tanstack/react-query.gen";
 import makeContext from "@/lib/contextFactory/contextFactory";
-import useDealServicesCrud, {
-    DealServicesCrud,
-} from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/hooks/cruds/useDealServiceCrud";
-import useProductServiceCrud, {
-    DealProductServicesCrud,
-} from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/hooks/cruds/useProductServiceCrud";
-import useDealServicesList, {
-    DealServicesList,
-} from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/hooks/lists/useDealServicesList";
 import useDealProductCrud, {
     DealProductsCrud,
-} from "../hooks/cruds/useDealProductCrud";
-import { ProductsCrud, useProductsCrud } from "../hooks/cruds/useProductsCrud";
+} from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/hooks/cruds/useDealProductCrud";
+import useDealServicesCrud, {
+    DealServicesCrud,
+} from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/hooks/cruds/useDealServicesCrud";
+import {
+    ProductsCrud,
+    useProductsCrud,
+} from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/hooks/cruds/useProductsCrud";
+import useProductServiceCrud, {
+    DealProductServicesCrud,
+} from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/hooks/cruds/useProductServiceCrud";
 import useDealProductsList, {
     DealProductsList,
-} from "../hooks/lists/useDealProductsList";
+} from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/hooks/lists/useDealProductsList";
+import useDealServicesList, {
+    DealServicesList,
+} from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/hooks/lists/useDealServicesList";
 
 type FulfillmentBaseContextState = {
     deal: DealSchema;

src/modules/dealModularEditorTabs/FulfillmentBase/shared/hooks/cruds/useDealServicesCrud.tsx

@@ -29,7 +29,7 @@ export type DealServicesCrud = {
     onDelete: (data: DealServiceSchema, onSuccess?: () => void) => void;
 };
 
-const useDealServiceCrud = ({ dealId }: Props): DealServicesCrud => {
+const useDealServicesCrud = ({ dealId }: Props): DealServicesCrud => {
     const queryKey = getDealServicesQueryKey({ path: { dealId } });
     const key = "getDealServices";
     const { queryClient, onError, onSettled } = getCommonQueryClient({
@@ -150,4 +150,4 @@ const useDealServiceCrud = ({ dealId }: Props): DealServicesCrud => {
     };
 };
 
-export default useDealServiceCrud;
+export default useDealServicesCrud;

src/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/DealProductEditorModal/DealProductEditorModal.tsx

@@ -11,7 +11,8 @@ import {
 import BaseFormModal, {
     CreateEditFormProps,
 } from "@/modals/base/BaseFormModal/BaseFormModal";
-import ProductSelect from "../../components/ProductSelect/ProductSelect";
+import ProductSelect
+    from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductSelect/ProductSelect";
 
 type RestProps = {
     clientId: number;

src/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/DealServiceEditorModal/DealServiceEditorModal.tsx

@@ -11,7 +11,7 @@ import {
 import BaseFormModal, {
     CreateEditFormProps,
 } from "@/modals/base/BaseFormModal/BaseFormModal";
-import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/types/service";
+import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/types/service";
 import ServiceWithPriceInput from "./components/ServiceWithPriceInput";
 
 type RestProps = {

src/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/DealServiceEditorModal/components/ServiceWithPriceInput.tsx

@@ -9,8 +9,8 @@ import {
 } from "@mantine/core";
 import { ObjectSelectProps } from "@/components/selects/ObjectSelect/ObjectSelect";
 import { ServiceSchema } from "@/lib/client";
-import ServiceSelect from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/ServiceSelect/ServiceSelect";
-import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/types/service";
+import ServiceSelect from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ServiceSelect/ServiceSelect";
+import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/types/service";
 
 type ServiceProps = Omit<ObjectSelectProps<ServiceSchema>, "data">;
 type PriceProps = NumberInputProps;

src/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/ProductEditorModal/ProductEditorModal.tsx

@@ -11,7 +11,7 @@ import {
 import BaseFormModal, {
     CreateEditFormProps,
 } from "@/modals/base/BaseFormModal/BaseFormModal";
-import ProductImageDropzone from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/components/ProductImageDropzone/ProductImageDropzone";
+import ProductImageDropzone from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/components/ProductImageDropzone/ProductImageDropzone";
 import BaseFormInputProps from "@/utils/baseFormInputProps";
 
 type Props = CreateEditFormProps<

src/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/ProductServiceEditorModal/ProductServiceEditorModal.tsx

@@ -12,8 +12,8 @@ import {
 import BaseFormModal, {
     CreateEditFormProps,
 } from "@/modals/base/BaseFormModal/BaseFormModal";
-import ServiceWithPriceInput from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/modals/DealServiceEditorModal/components/ServiceWithPriceInput";
-import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/types/service";
+import ServiceWithPriceInput from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/DealServiceEditorModal/components/ServiceWithPriceInput";
+import { ServiceType } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/types/service";
 
 type RestProps = {
     quantity: number;

src/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/ServicesKitSelectModal/ServicesKitSelectModal.tsx

@@ -5,7 +5,7 @@ import { useForm } from "@mantine/form";
 import { ContextModalProps } from "@mantine/modals";
 import { ServicesKitSchema } from "@/lib/client";
 import BaseFormModalActions from "@/modals/base/BaseFormModal/BaseFormModalActions";
-import ServicesKitSelect from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/modals/ServicesKitSelectModal/components/ServicesKitSelect";
+import ServicesKitSelect from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/ServicesKitSelectModal/components/ServicesKitSelect";
 
 type Props = {
     onSelect: (kit: ServicesKitSchema) => void;

src/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/ServicesKitSelectModal/components/ServicesKitSelect.tsx

@@ -3,7 +3,7 @@ import ObjectSelect, {
     ObjectSelectProps,
 } from "@/components/selects/ObjectSelect/ObjectSelect";
 import { ServicesKitSchema } from "@/lib/client";
-import useServicesKitsList from "@/modules/dealModularEditorTabs/FulfillmentBaseTab/hooks/lists/useServicesKitsList";
+import useServicesKitsList from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/hooks/lists/useServicesKitsList";
 
 type Props = Omit<ObjectSelectProps<ServicesKitSchema>, "data">;
 

src/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/index.ts

@@ -0,0 +1,6 @@
+export { default as ServicesKitSelectModal } from "./ServicesKitSelectModal/ServicesKitSelectModal";
+export { default as ProductEditorModal } from "./ProductEditorModal/ProductEditorModal";
+export { default as DuplicateServicesModal } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/DuplicateServicesModal/DuplicateServicesModal";
+export { default as DealServiceEditorModal } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/DealServiceEditorModal/DealServiceEditorModal";
+export { default as DealProductEditorModal } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/DealProductEditorModal/DealProductEditorModal";
+export { default as ProductServiceEditorModal } from "@/modules/dealModularEditorTabs/FulfillmentBase/shared/modals/ProductServiceEditorModal/ProductServiceEditorModal";

src/modules/dealModularEditorTabs/index.ts

@@ -0,0 +1,3 @@
+export { default as CommonServicesTab } from "@/modules/dealModularEditorTabs/FulfillmentBase/mobile/CommonServicesTab";
+export { default as FulfillmentBaseTab } from "@/modules/dealModularEditorTabs/FulfillmentBase/desktop/FulfillmentBaseTab";
+export { default as ProductsTab } from "@/modules/dealModularEditorTabs/FulfillmentBase/mobile/ProductsTab";