diff --git a/src/components/pages/production/recording/grading/form/useGradingFormHandlers.ts b/src/components/pages/production/recording/grading/form/useGradingFormHandlers.ts
new file mode 100644
index 00000000..c24a644b
--- /dev/null
+++ b/src/components/pages/production/recording/grading/form/useGradingFormHandlers.ts
@@ -0,0 +1,88 @@
+import { useCallback, useState } from 'react';
+import { useRouter } from 'next/navigation';
+import { toast } from 'react-hot-toast';
+import { useModal } from '@/components/Modal';
+import { RecordingApi } from '@/services/api/production';
+import {
+  CreateGradingPayload,
+  UpdateGradingPayload,
+} from '@/types/api/production/recording';
+import { isResponseError } from '@/lib/api-helper';
+import { type BaseApiResponse } from '@/types/api/api-general';
+
+export const useGradingFormHandlers = (gradingId?: number) => {
+  const router = useRouter();
+  const deleteModal = useModal();
+  const [recordingFormErrorMessage, setRecordingFormErrorMessage] =
+    useState('');
+  const [isDeleteLoading, setIsDeleteLoading] = useState(false);
+
+  const createGradingHandler = useCallback(
+    async (payload: CreateGradingPayload) => {
+      const res = await RecordingApi.customRequest('gradings', {
+        method: 'POST',
+        payload,
+      }) as BaseApiResponse<unknown>;
+      if (isResponseError(res)) {
+        setRecordingFormErrorMessage(res.message);
+        return;
+      }
+      toast.success(res?.message || 'Successfully added Grading!');
+      router.push('/production/recording');
+    },
+    [router]
+  );
+
+  const updateGradingHandler = useCallback(
+    async (gradingId: number, payload: UpdateGradingPayload) => {
+      const res = await RecordingApi.customRequest(`gradings/${gradingId}`, {
+        method: 'PUT',
+        payload,
+      }) as BaseApiResponse<unknown>;
+      if (isResponseError(res)) {
+        setRecordingFormErrorMessage(res.message);
+        return;
+      }
+      toast.success(res?.message || 'Successfully updated Grading!');
+      router.refresh();
+      router.push('/production/recording');
+    },
+    [router]
+  );
+
+  const deleteRecordingClickHandler = useCallback(() => {
+    deleteModal.openModal();
+  }, [deleteModal]);
+
+  const confirmationModalDeleteClickHandler = useCallback(async () => {
+    if (!gradingId) return;
+
+    setIsDeleteLoading(true);
+    try {
+      const res = await RecordingApi.customRequest(`gradings/${gradingId}`, {
+        method: 'DELETE',
+      }) as BaseApiResponse<unknown>;
+      if (isResponseError(res)) {
+        setRecordingFormErrorMessage(res.message);
+        return;
+      }
+      deleteModal.closeModal();
+      toast.success(res?.message || 'Successfully delete Grading!');
+      router.push('/production/recording');
+    } catch (error) {
+      setRecordingFormErrorMessage('Failed to delete Grading');
+    } finally {
+      setIsDeleteLoading(false);
+    }
+  }, [deleteModal, gradingId, router]);
+
+  return {
+    deleteModal,
+    recordingFormErrorMessage,
+    isDeleteLoading,
+    createGradingHandler,
+    updateGradingHandler,
+    deleteRecordingClickHandler,
+    confirmationModalDeleteClickHandler,
+  };
+};
\ No newline at end of file
diff --git a/src/types/api/production/recording.d.ts b/src/types/api/production/recording.d.ts
index 55272533..171ba09e 100644
--- a/src/types/api/production/recording.d.ts
+++ b/src/types/api/production/recording.d.ts
@@ -93,6 +93,16 @@ export type CreateGradingPayload = {
   }[];
 };
 
+export type UpdateGradingPayload = CreateGradingPayload;
+
+export type CreateGradingRecordingPayload = {
+  recording_egg_id: number;
+  eggs_grading: {
+    grade: string;
+    qty: number;
+  }[];
+};
+
 export type CreateEggPayload = {
   product_warehouse_id: number;
   qty: number;