feat: client tab in deal editor

src/app/deals/drawers/DealEditorDrawer/tabs/GeneralTab/GeneralTab.tsx

@@ -1,9 +1,10 @@
 import React, { FC } from "react";
-import { Flex, Stack, TextInput } from "@mantine/core";
+import { Stack, TextInput } from "@mantine/core";
 import { useForm } from "@mantine/form";
 import Footer from "@/app/deals/drawers/DealEditorDrawer/tabs/GeneralTab/components/Footer";
 import BoardSelect from "@/components/selects/BoardSelect/BoardSelect";
 import StatusSelect from "@/components/selects/StatusSelect/StatusSelect";
+import FormFlexRow from "@/components/ui/FormFlexRow/FormFlexRow";
 import { BoardSchema, DealSchema, StatusSchema } from "@/lib/client";
 import { utcDateTimeToLocalString } from "@/utils/datetime";
 
@@ -40,10 +41,7 @@ const GeneralTab: FC<Props> = ({ value, onDelete, onChange }) => {
     return (
         <form onSubmit={form.onSubmit(onSubmit)}>
             <Stack p={"md"}>
-                <Flex
-                    gap={"md"}
-                    w={"100%"}
-                    direction={{ base: "column", sm: "row" }}>
+                <FormFlexRow>
                     <TextInput
                         label={"Название"}
                         {...form.getInputProps("name")}
@@ -55,11 +53,8 @@ const GeneralTab: FC<Props> = ({ value, onDelete, onChange }) => {
                         readOnly
                         flex={1}
                     />
-                </Flex>
-                <Flex
-                    gap={"md"}
-                    w={"100%"}
-                    direction={{ base: "column", sm: "row" }}>
+                </FormFlexRow>
+                <FormFlexRow>
                     <BoardSelect
                         label={"Доска"}
                         {...form.getInputProps("board")}
@@ -76,7 +71,7 @@ const GeneralTab: FC<Props> = ({ value, onDelete, onChange }) => {
                         boardId={form.values.board?.id}
                         flex={1}
                     />
-                </Flex>
+                </FormFlexRow>
                 <Footer
                     form={form}
                     onDelete={() => onDelete(value)}