From be666c5158db3749b3b9f81d29275792b354bc11 Mon Sep 17 00:00:00 2001
From: AlexSserb <aserbin190@gmail.com>
Date: Tue, 4 Mar 2025 12:38:18 +0400
Subject: [PATCH] fix: worktime table input fix

---
 .../hooks/useWorkTableColumns.tsx             | 52 +++++++++++--------
 1 file changed, 29 insertions(+), 23 deletions(-)

diff --git a/src/pages/AdminPage/tabs/WorkTimeTable/hooks/useWorkTableColumns.tsx b/src/pages/AdminPage/tabs/WorkTimeTable/hooks/useWorkTableColumns.tsx
index 31a3818..f1df73a 100644
--- a/src/pages/AdminPage/tabs/WorkTimeTable/hooks/useWorkTableColumns.tsx
+++ b/src/pages/AdminPage/tabs/WorkTimeTable/hooks/useWorkTableColumns.tsx
@@ -29,20 +29,20 @@ type Props = {
     range: dayjs.Dayjs[];
 };
 const useWorkTableColumns = ({
-    month,
-    onUpdate,
-    data,
-    selectedCells,
-    setSelectedCells,
-    selectedBoundaries,
-    range,
-}: Props) => {
+                                 month,
+                                 onUpdate,
+                                 data,
+                                 selectedCells,
+                                 setSelectedCells,
+                                 selectedBoundaries,
+                                 range,
+                             }: Props) => {
     const totalAmount = useMemo(() => {
         return data.reduce((acc, value) => {
             if (value.data) {
                 const sum = value.data.reduce(
                     (innerAcc, item) => innerAcc + item.amount,
-                    0
+                    0,
                 );
                 return acc + sum;
             }
@@ -103,15 +103,15 @@ const useWorkTableColumns = ({
                 mantineTableBodyCellProps: ({ cell }) => ({
                     style: selectedCells.includes(cell.id)
                         ? {
-                              backgroundColor:
-                                  "var(--mantine-primary-color-filled)",
-                              ...getBorderStyles(cell.id),
-                          }
+                            backgroundColor:
+                                "var(--mantine-primary-color-filled)",
+                            ...getBorderStyles(cell.id),
+                        }
                         : {},
                     onClick: () => {
                         const result = processSelectedCells(
                             selectedCells,
-                            cell.id
+                            cell.id,
                         );
                         setSelectedCells(result);
                     },
@@ -119,21 +119,27 @@ const useWorkTableColumns = ({
                 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
                 // @ts-expect-error
                 Cell: ({ cell, row }) => {
+                    let prevValue = formatValue(cell.renderValue());
+
+                    const onAccept = (value: string) => {
+                        if (value === prevValue) return;
+                        prevValue = value;
+                        return /^\d\d:\d\d$/.test(value) &&
+                            onUpdate(
+                                date.toDate(),
+                                row.original.userId,
+                                value,
+                            );
+                    }
+
                     return (
                         <Flex direction={"column"}>
                             <Input
                                 component={IMaskInput}
                                 mask="00:00"
-                                onAccept={value => {
-                                    return /^\d\d:\d\d$/.test(value) &&
-                                        onUpdate(
-                                            date.toDate(),
-                                            row.original.userId,
-                                            value,
-                                        );
-                                }}
+                                onAccept={onAccept}
                                 styles={{ input: { textAlign: "center" } }}
-                                defaultValue={formatValue(cell.renderValue())}
+                                value={formatValue(cell.renderValue())}
                             />
                         </Flex>
                     );