time tracking

src/components/DebouncedNumberInput/DebouncedNumberInput.tsx

@@ -0,0 +1,34 @@
+import {NumberInput, NumberInputProps} from "@mantine/core";
+import {useEffect, useState} from "react";
+import {useDebouncedValue} from "@mantine/hooks";
+import {isNumber, omit} from "lodash";
+
+
+type Props = NumberInputProps;
+
+const DebouncedNumberInput = (props: Props) => {
+    const [value, setValue] = useState<number | string>(props.defaultValue || props.value || '');
+    const [debounced] = useDebouncedValue(value, 200);
+
+    useEffect(() => {
+        if (!props.onChange) return;
+        props.onChange(debounced);
+    }, [debounced])
+
+    useEffect(() => {
+        if (!isNumber(props.value)) return;
+        setValue(props.value);
+    }, [props.value])
+
+    const restProps = omit(props, ["onChange", "value"])
+    return (
+        <NumberInput
+            value={value}
+            onChange={setValue}
+            {...restProps}
+        />
+    )
+}
+
+
+export default DebouncedNumberInput;

src/components/Dnd/CreateDealButton/CreateDealButton.tsx

@@ -4,8 +4,8 @@ import styles from './CreateDealButton.module.css';
 import {Text, Transition} from '@mantine/core';
 import CreateDealFrom from "../CreateDealForm/CreateDealFrom.tsx";
 import {DealService} from "../../../client";
-import {dateWithoutTimezone} from "../../../shared/lib/utils.ts";
 import {useQueryClient} from "@tanstack/react-query";
+import {dateWithoutTimezone} from "../../../shared/lib/date.ts";
 
 type Props = {
     onClick: () => void;