refactor: remove unused router imports and clearProductDraft calls in product draft hooks

resources/js/hooks/use-product-draft.ts

@@ -1,4 +1,5 @@
-import { useEffect, useRef, useCallback } from 'react';
+import { useEffect, useRef } from 'react';
+import { router } from '@inertiajs/react';
 import {
     saveProductDraft,
     clearProductDraft,
@@ -17,22 +18,22 @@ export function useProductDraftSave(
     const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
     const dataRef = useRef(data);
     dataRef.current = data;
+    const submittedRef = useRef(false);
 
-    const flush = useCallback(() => {
+    useEffect(() => {
-        if (timeoutRef.current) {
+        return router.on('before', () => {
-            clearTimeout(timeoutRef.current);
+            submittedRef.current = true;
-            timeoutRef.current = null;
+        });
-        }
+    }, []);
-        const ok = saveProductDraft(type, dataRef.current, userId, productId);
-        return ok;
-    }, [type, userId, productId]);
 
     useEffect(() => {
         if (timeoutRef.current) {
             clearTimeout(timeoutRef.current);
         }
         timeoutRef.current = setTimeout(() => {
-            saveProductDraft(type, dataRef.current, userId, productId);
+            if (!submittedRef.current) {
+                saveProductDraft(type, dataRef.current, userId, productId);
+            }
             timeoutRef.current = null;
         }, delay);
 
@@ -48,21 +49,11 @@ export function useProductDraftSave(
             if (timeoutRef.current) {
                 clearTimeout(timeoutRef.current);
             }
-            saveProductDraft(type, dataRef.current, userId, productId);
+            if (submittedRef.current) {
-        };
+                clearProductDraft(type, userId, productId);
-    }, [type, userId, productId]);
+            } else {
-
+                saveProductDraft(type, dataRef.current, userId, productId);
-    return { flush };
+            }
-}
-
-export function useProductDraftClear(
-    type: DraftType,
-    userId?: number,
-    productId?: number,
-) {
-    useEffect(() => {
-        return () => {
-            clearProductDraft(type, userId, productId);
         };
     }, [type, userId, productId]);
 }

resources/js/pages/admin/master/product/create.tsx

@@ -1,4 +1,4 @@
-import { Form, Head, router, usePage } from '@inertiajs/react';
+import { Form, Head, usePage } from '@inertiajs/react';
 import {
     ArrowLeft,
     Copy,
@@ -7,7 +7,7 @@ import {
     Plus,
     Trash2,
 } from 'lucide-react';
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { useCallback, useRef, useState } from 'react';
 import { ConfirmDialog } from '@/components/confirm-dialog';
 import { FileUploadMultiple } from '@/components/file-upload-multiple';
 import InputError from '@/components/input-error';
@@ -19,7 +19,7 @@ import { Label } from '@/components/ui/label';
 import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
 import { Textarea } from '@/components/ui/textarea';
 import { useProductDraftSave } from '@/hooks/use-product-draft';
-import { loadProductDraft, clearProductDraft } from '@/lib/product-draft';
+import { loadProductDraft } from '@/lib/product-draft';
 import { getTemporaryUrl } from '@/lib/upload';
 import { index as productIndex, store } from '@/routes/admin/master/products';
 
@@ -128,12 +128,6 @@ export default function ProductCreate({ categories }: Props) {
 
     useProductDraftSave('create', draftData, userId);
 
-    useEffect(() => {
-        return router.on('success', () => {
-            clearProductDraft('create', userId);
-        });
-    }, [userId]);
-
     const addVariant = useCallback(() => {
         setVariants((prev) => [
             ...prev,

resources/js/pages/admin/master/product/edit.tsx

@@ -1,4 +1,4 @@
-import { Form, Head, router, usePage } from '@inertiajs/react';
+import { Form, Head, usePage } from '@inertiajs/react';
 import {
     ArrowLeft,
     Copy,
@@ -7,7 +7,7 @@ import {
     Plus,
     Trash2,
 } from 'lucide-react';
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { useCallback, useRef, useState } from 'react';
 import { ConfirmDialog } from '@/components/confirm-dialog';
 import { FileUploadMultiple } from '@/components/file-upload-multiple';
 import InputError from '@/components/input-error';
@@ -19,7 +19,7 @@ import { Label } from '@/components/ui/label';
 import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group';
 import { Textarea } from '@/components/ui/textarea';
 import { useProductDraftSave } from '@/hooks/use-product-draft';
-import { loadProductDraft, clearProductDraft } from '@/lib/product-draft';
+import { loadProductDraft } from '@/lib/product-draft';
 import { getTemporaryUrl } from '@/lib/upload';
 import { index as productIndex, update } from '@/routes/admin/master/products';
 
@@ -211,12 +211,6 @@ export default function ProductEdit({ product, categories }: Props) {
 
     useProductDraftSave('edit', draftData, userId, product.id);
 
-    useEffect(() => {
-        return router.on('success', () => {
-            clearProductDraft('edit', userId, product.id);
-        });
-    }, [userId, product.id]);
-
     const addVariant = useCallback(() => {
         setVariants((prev) => [
             ...prev,