feat: filling deals from excel file

src/components/Dnd/Board/Board.tsx

@@ -9,6 +9,7 @@ import classNames from "classnames";
 import { getPluralForm } from "../../../shared/lib/utils.ts";
 import { groupBy, has, sum, uniq } from "lodash";
 import { DealGroupView } from "../DealGroupView/DealGroupView.tsx";
+import CreateDealsFromFileButton from "../CreateDealsFromFileButton/CreateDealsFromFileButton.tsx";
 
 type Props = {
     droppableId: string;
@@ -181,8 +182,10 @@ export const Board: FC<Props> = ({
                         )}
                         {...provided.droppableProps}>
                         {withCreateButton && (
-                            <CreateDealButton onClick={() => {
-                            }} />
+                            <>
+                                <CreateDealButton />
+                                <CreateDealsFromFileButton />
+                            </>
                         )}
                         {getDealsAndGroups().map(obj => {
                             if (isGroup(obj)) {

src/components/Dnd/CreateDealButton/CreateDealButton.tsx

@@ -1,4 +1,4 @@
-import { FC, useState } from "react";
+import { useState } from "react";
 
 import styles from "./CreateDealButton.module.css";
 import { Text, Transition } from "@mantine/core";
@@ -8,10 +8,7 @@ import { useQueryClient } from "@tanstack/react-query";
 import { dateWithoutTimezone } from "../../../shared/lib/date.ts";
 import { usePrefillDealContext } from "../../../pages/LeadsPage/contexts/PrefillDealContext.tsx";
 
-type Props = {
-    onClick: () => void;
-};
-const CreateDealButton: FC<Props> = () => {
+const CreateDealButton = () => {
     const [isCreating, setIsCreating] = useState(false);
     const [isTransitionEnded, setIsTransitionEnded] = useState(true);
     const queryClient = useQueryClient();

src/components/Dnd/CreateDealsFromFileButton/CreateDealsFromFileButton.module.css

@@ -0,0 +1,19 @@
+.container {
+    /*background-color: red;*/
+    min-height: 5rem;
+    display: flex;
+    justify-content: center;
+    align-items: stretch;
+    text-align: center;
+    flex-direction: column;
+    border: dashed var(--item-border-size) var(--mantine-color-default-border);
+    border-radius: var(--item-border-radius);
+    cursor: pointer;
+}
+
+.container:hover {
+    background-color: light-dark(
+        var(--mantine-color-default-hover),
+        var(--mantine-color-gray-filled-hover)
+    );
+}

src/components/Dnd/CreateDealsFromFileButton/CreateDealsFromFileButton.tsx

@@ -0,0 +1,17 @@
+import styles from "./CreateDealsFromFileButton.module.css";
+import { Text } from "@mantine/core";
+import { usePrefillDealsWithExcelContext } from "../../../pages/LeadsPage/contexts/PrefillDealsWithExcelContext.tsx";
+
+const CreateDealsFromFileButton = () => {
+    const { prefillWithExcelOnOpen } = usePrefillDealsWithExcelContext();
+
+    return (
+        <div
+            className={styles["container"]}
+            onClick={prefillWithExcelOnOpen}>
+            <Text>Добавление из файла</Text>
+        </div>
+    );
+};
+
+export default CreateDealsFromFileButton;