diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml
index c37bfd35..6028a8cb 100644
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@@ -127,6 +127,7 @@ build:dev:
     NEXT_PUBLIC_LTI_URL: 'https://dev-lti-erp.mbugroup.id'
     NEXT_PUBLIC_SSO_LOGIN_URL: 'https://dev-auth-erp.mbugroup.id'
     NEXT_PUBLIC_API_BASE_URL: 'https://dev-api-lti.mbugroup.id/api'
+    NEXT_PUBLIC_CLIENT_ID: 'Lumbung-Telur-Indonesia'
 
 deploy:dev:
   <<: *deploy_template
diff --git a/next.config.ts b/next.config.ts
index c781a8ac..b2d25eb6 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -3,6 +3,7 @@ import type { NextConfig } from 'next';
 const nextConfig: NextConfig = {
   output: 'export',
   images: { unoptimized: true },
+  trailingSlash: true,
 };
 
 export default nextConfig;
diff --git a/src/app/marketing/page.tsx b/src/app/marketing/page.tsx
index 99a80b64..c30ee501 100644
--- a/src/app/marketing/page.tsx
+++ b/src/app/marketing/page.tsx
@@ -7,4 +7,5 @@ const Marketing = () => {
     </div>
   );
 };
+
 export default Marketing;
diff --git a/src/app/page.tsx b/src/app/page.tsx
index db9638df..9cc0177d 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,11 +1,29 @@
-import { redirect } from 'next/navigation';
+'use client';
+
+import { useEffect } from 'react';
+import { usePathname, useRouter } from 'next/navigation';
+import { useAuth } from '@/services/hooks/useAuth';
+import { redirectToSSO } from '@/lib/auth-helper';
 
 export default function Home() {
-  redirect('/dashboard');
+  const { user, isLoadingUser } = useAuth();
 
-  return (
-    <main className='w-full h-full min-h-screen flex flex-row justify-center items-center'>
-      <h1>LTI ERP</h1>
-    </main>
-  );
+  const router = useRouter();
+  const pathname = usePathname();
+
+  useEffect(() => {
+    if (pathname === '/') {
+      router.replace('/dashboard');
+    }
+  }, [pathname]);
+
+  if (isLoadingUser) {
+    return (
+      <main className='w-full h-full min-h-screen flex flex-row justify-center items-center'>
+        <span className='loading loading-spinner loading-lg'></span>
+      </main>
+    );
+  }
+
+  return <>Loading...</>;
 }
diff --git a/src/app/production/recording/grading/add/page.tsx b/src/app/production/recording/grading/add/page.tsx
deleted file mode 100644
index 9b918d98..00000000
--- a/src/app/production/recording/grading/add/page.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-'use client';
-
-import { useRouter, useSearchParams } from 'next/navigation';
-import useSWR from 'swr';
-import GradingForm from '@/components/pages/production/recording/grading/form/GradingForm';
-import { RecordingApi } from '@/services/api/production';
-import { isResponseSuccess } from '@/lib/api-helper';
-
-const AddGrading = () => {
-  const router = useRouter();
-  const searchParams = useSearchParams();
-
-  const recordingId = searchParams.get('recording_id');
-
-  const { data: recording, isLoading: isLoadingRecording } = useSWR(
-    recordingId && recordingId !== 'new' ? [recordingId] : null,
-    ([id]) => RecordingApi.getSingle(parseInt(id))
-  );
-
-  if (
-    recordingId &&
-    recordingId !== 'new' &&
-    !isLoadingRecording &&
-    (!recording || !isResponseSuccess(recording))
-  ) {
-    router.replace('/404');
-    return;
-  }
-
-  return (
-    <div className='w-full p-4 flex flex-row justify-center'>
-      {recordingId && recordingId !== 'new' && isLoadingRecording && (
-        <span className='loading loading-spinner loading-xl' />
-      )}
-      {(!recordingId ||
-        recordingId === 'new' ||
-        (!isLoadingRecording && recording && isResponseSuccess(recording))) && (
-        <GradingForm
-          type='add'
-          initialValues={
-            isResponseSuccess(recording) ? recording.data?.eggs?.[0] : undefined
-          }
-        />
-      )}
-    </div>
-  );
-};
-
-export default AddGrading;
diff --git a/src/app/production/recording/grading/detail/edit/page.tsx b/src/app/production/recording/grading/detail/edit/page.tsx
deleted file mode 100644
index 0a65f528..00000000
--- a/src/app/production/recording/grading/detail/edit/page.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-'use client';
-
-import { useRouter, useSearchParams } from 'next/navigation';
-import useSWR from 'swr';
-import GradingForm from '@/components/pages/production/recording/grading/form/GradingForm';
-import { RecordingApi } from '@/services/api/production';
-import { isResponseSuccess } from '@/lib/api-helper';
-
-const EditGrading = () => {
-  const router = useRouter();
-  const searchParams = useSearchParams();
-
-  const recordingId = searchParams.get('recordingId');
-  const gradingId = searchParams.get('gradingId');
-
-  const { data: recording, isLoading: isLoadingRecording } = useSWR(
-    recordingId ? [recordingId] : null,
-    ([id]) => RecordingApi.getSingle(parseInt(id))
-  );
-
-  if (!recordingId) {
-    router.back();
-
-    return (
-      <div className='w-full flex flex-row justify-center items-center p-4'>
-        <span className='loading loading-spinner loading-xl' />
-      </div>
-    );
-  }
-
-  if (!isLoadingRecording && (!recording || !isResponseSuccess(recording))) {
-    router.replace('/404');
-    return;
-  }
-
-  return (
-    <div className='w-full p-4 flex flex-row justify-center'>
-      {isLoadingRecording && (
-        <span className='loading loading-spinner loading-xl' />
-      )}
-      {!isLoadingRecording && recording && isResponseSuccess(recording) && (
-        <GradingForm
-          type='edit'
-          initialValues={recording.data.eggs?.find(
-            (egg) => egg.id === parseInt(gradingId || '0')
-          )}
-        />
-      )}
-    </div>
-  );
-};
-
-export default EditGrading;
diff --git a/src/app/production/recording/grading/detail/page.tsx b/src/app/production/recording/grading/detail/page.tsx
deleted file mode 100644
index 6a5fbcba..00000000
--- a/src/app/production/recording/grading/detail/page.tsx
+++ /dev/null
@@ -1,52 +0,0 @@
-'use client';
-
-import { useRouter, useSearchParams } from 'next/navigation';
-import useSWR from 'swr';
-import GradingForm from '@/components/pages/production/recording/grading/form/GradingForm';
-import { RecordingApi } from '@/services/api/production';
-import { isResponseSuccess } from '@/lib/api-helper';
-
-const DetailGrading = () => {
-  const router = useRouter();
-  const searchParams = useSearchParams();
-
-  const gradingId = searchParams.get('gradingId');
-
-  const { data: grading, isLoading: isLoadingGrading } = useSWR(
-    gradingId ? [gradingId] : null,
-    ([id]) => RecordingApi.getSingle(parseInt(id))
-  );
-
-  if (!gradingId) {
-    router.back();
-
-    return (
-      <div className='w-full flex flex-row justify-center items-center p-4'>
-        <span className='loading loading-spinner loading-xl' />
-      </div>
-    );
-  }
-
-  if (!isLoadingGrading && (!grading || !isResponseSuccess(grading))) {
-    router.replace('/404');
-    return;
-  }
-
-  return (
-    <div className='w-full p-4 flex flex-row justify-center'>
-      {isLoadingGrading && (
-        <span className='loading loading-spinner loading-xl' />
-      )}
-      {!isLoadingGrading && grading && isResponseSuccess(grading) && (
-        <GradingForm
-          type='detail'
-          initialValues={grading.data.eggs?.find(
-            (egg) => egg.id === parseInt(gradingId)
-          )}
-        />
-      )}
-    </div>
-  );
-};
-
-export default DetailGrading;
diff --git a/src/app/production/recording/grading/layout.tsx b/src/app/production/recording/grading/layout.tsx
deleted file mode 100644
index 7220dfa1..00000000
--- a/src/app/production/recording/grading/layout.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import SuspenseHelper from '@/components/helper/SuspenseHelper';
-
-const Layout = ({
-  children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) => {
-  return <SuspenseHelper>{children}</SuspenseHelper>;
-};
-
-export default Layout;
diff --git a/src/components/helper/RequireAuth.tsx b/src/components/helper/RequireAuth.tsx
index 53853b96..65adf48c 100644
--- a/src/components/helper/RequireAuth.tsx
+++ b/src/components/helper/RequireAuth.tsx
@@ -15,7 +15,7 @@ interface RequireAuthProps {
 }
 
 const RequireAuth = ({ children }: RequireAuthProps) => {
-  const { setUser, setIsLoadingUser } = useAuth();
+  const { user, setUser, setIsLoadingUser } = useAuth();
 
   const {
     data: userResponse,
@@ -37,12 +37,25 @@ const RequireAuth = ({ children }: RequireAuthProps) => {
 
   // Explicitly handle 401 redirect from the component level
   useEffect(() => {
-    if (userErrorResponse?.response?.status === 401) {
+    if (
+      isResponseError(userResponse) &&
+      userErrorResponse?.response?.status === 401
+    ) {
+      // Clear cache to prevent stale data from rendering children
+      // mutate('/sso/userinfo', undefined, { revalidate: false }); // Optional: if using global mutate
+      setUser(undefined);
       redirectToSSO();
     }
-  }, [userErrorResponse]);
+  }, [userErrorResponse, setUser, userResponse]);
 
-  if (isLoadingUserResponse && !userResponse && !userErrorResponse) {
+  useEffect(() => {
+    setIsLoadingUser(isLoadingUserResponse);
+  }, [isLoadingUserResponse]);
+
+  if (
+    (isLoadingUserResponse && !userResponse && !userErrorResponse) ||
+    (!userResponse && !userErrorResponse)
+  ) {
     return (
       <div className='w-full flex flex-row justify-center items-center p-4'>
         <span className='loading loading-spinner loading-xl' />
@@ -68,7 +81,7 @@ const RequireAuth = ({ children }: RequireAuthProps) => {
     );
   }
 
-  return <>{isResponseSuccess(userResponse) && children}</>;
+  return <>{isResponseSuccess(userResponse) && user && children}</>;
 };
 
 export default RequireAuth;
diff --git a/src/components/pages/production/recording/RecordingTable.tsx b/src/components/pages/production/recording/RecordingTable.tsx
index 4a413bc4..27b2d5c6 100644
--- a/src/components/pages/production/recording/RecordingTable.tsx
+++ b/src/components/pages/production/recording/RecordingTable.tsx
@@ -35,28 +35,22 @@ const RowOptionsMenu = ({
   deleteClickHandler,
   approveClickHandler,
   rejectClickHandler,
-  isGradingCompleted,
 }: {
   type: 'dropdown' | 'collapse';
   props: CellContext<Recording, unknown>;
   deleteClickHandler: () => void;
   approveClickHandler: () => void;
   rejectClickHandler: () => void;
-  isGradingCompleted: (recording: Recording) => boolean;
 }) => {
-  const isLayingCategory =
-    props.row.original.project_flock_category === 'LAYING';
-
   const isRecordingApproved = (recording: Recording) => {
     return (
       recording.approval?.action === 'APPROVED' &&
-      recording.approval?.step_name === 'Disetujui' &&
-      recording.approval?.step_number === 3
+      recording.approval?.step_number === 2 &&
+      recording.approval?.step_name === 'Disetujui'
     );
   };
 
   const isApproved = isRecordingApproved(props.row.original);
-  const isGradingDone = isGradingCompleted(props.row.original);
 
   return (
     <RowOptionsMenuWrapper type={type}>
@@ -78,7 +72,7 @@ const RowOptionsMenu = ({
         <Icon icon='mdi:pencil-outline' width={16} height={16} />
         Edit
       </Button>
-      {!isApproved && !(isLayingCategory && !isGradingDone) && (
+      {!isApproved && (
         <Button
           onClick={approveClickHandler}
           variant='ghost'
@@ -89,7 +83,7 @@ const RowOptionsMenu = ({
           Approve
         </Button>
       )}
-      {!isApproved && !(isLayingCategory && !isGradingDone) && (
+      {!isApproved && (
         <Button
           onClick={rejectClickHandler}
           variant='ghost'
@@ -386,33 +380,10 @@ const RecordingTable = () => {
     RecordingApi.getAllFetcher
   );
 
-  const isRecordingFullyApproved = useCallback(
-    (recording: Recording): boolean => {
-      return (
-        recording.approval?.action === 'APPROVED' &&
-        recording.approval?.step_name === 'Disetujui' &&
-        Number(recording.approval?.step_number) === 3
-      );
-    },
-    []
-  );
-
-  const isRecordingApproved = useCallback(
-    (recording: Recording) => {
-      return isRecordingFullyApproved(recording);
-    },
-    [isRecordingFullyApproved]
-  );
-
-  const isGradingCompleted = useCallback((recording: Recording): boolean => {
-    if (recording.project_flock_category !== 'LAYING') {
-      return true;
-    }
-
+  const isRecordingApproved = useCallback((recording: Recording): boolean => {
     return (
-      recording.egg_grading_status === 'COMPLETED' ||
-      (recording.approval?.action === 'UPDATED' &&
-        recording.approval?.step_number === 2)
+      recording.approval?.action === 'APPROVED' &&
+      recording.approval?.step_name === 'Disetujui'
     );
   }, []);
 
@@ -506,19 +477,9 @@ const RecordingTable = () => {
     if (!isResponseSuccess(recordings) || !recordings.data) return [];
     return selectedRowIds.filter((id) => {
       const recording = recordings.data.find((r) => r.id === id);
-      if (!recording || isRecordingApproved(recording)) return false;
-
-      if (recording.project_flock_category === 'GROWING') {
-        return true;
-      }
-
-      if (recording.project_flock_category === 'LAYING') {
-        return isGradingCompleted(recording);
-      }
-
-      return false;
+      return recording && !isRecordingApproved(recording);
     });
-  }, [selectedRowIds, recordings, isRecordingApproved, isGradingCompleted]);
+  }, [selectedRowIds, recordings, isRecordingApproved]);
 
   useEffect(() => {
     if (isResponseSuccess(recordings) && recordings.data) {
@@ -530,14 +491,7 @@ const RecordingTable = () => {
             (r) => r.id === parseInt(rowId)
           );
           if (recording && !isRecordingApproved(recording)) {
-            if (recording.project_flock_category === 'GROWING') {
-              newSelection[rowId] = true;
-            } else if (
-              recording.project_flock_category === 'LAYING' &&
-              isGradingCompleted(recording)
-            ) {
-              newSelection[rowId] = true;
-            }
+            newSelection[rowId] = true;
           }
         }
       });
@@ -548,13 +502,7 @@ const RecordingTable = () => {
         setRowSelection(newSelection);
       }
     }
-  }, [
-    recordings,
-    rowSelection,
-    isRecordingApproved,
-    isGradingCompleted,
-    setRowSelection,
-  ]);
+  }, [recordings, rowSelection, isRecordingApproved, setRowSelection]);
 
   return (
     <div className='w-full p-0 sm:p-4'>
@@ -640,40 +588,28 @@ const RecordingTable = () => {
             id: 'select',
             header: ({ table }) => {
               const allRows = table.getRowModel().rows;
-
-              const selectableGrowingRows = allRows.filter((row) => {
+              const selectableRows = allRows.filter((row) => {
                 const recording = row.original;
-                return (
-                  recording.project_flock_category === 'GROWING' &&
-                  !isRecordingApproved(recording)
-                );
+                return !isRecordingApproved(recording);
               });
 
-              const hasNoSelectableGrowing = selectableGrowingRows.length === 0;
+              const hasNoSelectableRows = selectableRows.length === 0;
 
-              const handleSelectAllGrowing = () => {
-                const isAllSelected = selectableGrowingRows.every((row) =>
+              const handleSelectAll = () => {
+                const isAllSelected = selectableRows.every((row) =>
                   row.getIsSelected()
                 );
 
-                allRows.forEach((row) => {
-                  const recording = row.original;
-                  if (
-                    recording.project_flock_category === 'GROWING' &&
-                    !isRecordingApproved(recording)
-                  ) {
-                    row.toggleSelected(!isAllSelected);
-                  } else if (recording.project_flock_category === 'LAYING') {
-                    row.toggleSelected(false);
-                  }
+                selectableRows.forEach((row) => {
+                  row.toggleSelected(!isAllSelected);
                 });
               };
 
-              const isAllGrowingSelected =
-                selectableGrowingRows.length > 0 &&
-                selectableGrowingRows.every((row) => row.getIsSelected());
+              const isAllSelected =
+                selectableRows.length > 0 &&
+                selectableRows.every((row) => row.getIsSelected());
 
-              const isSomeGrowingSelected = selectableGrowingRows.some((row) =>
+              const isSomeSelected = selectableRows.some((row) =>
                 row.getIsSelected()
               );
 
@@ -681,33 +617,20 @@ const RecordingTable = () => {
                 <div className='w-full flex flex-row justify-center'>
                   <CheckboxInput
                     name='allRow'
-                    checked={isAllGrowingSelected}
-                    indeterminate={
-                      isSomeGrowingSelected && !isAllGrowingSelected
-                    }
-                    onChange={handleSelectAllGrowing}
-                    disabled={hasNoSelectableGrowing}
+                    checked={isAllSelected}
+                    indeterminate={isSomeSelected && !isAllSelected}
+                    onChange={handleSelectAll}
+                    disabled={hasNoSelectableRows}
                   />
                 </div>
               );
             },
             cell: ({ row }) => {
-              const isApproved = isRecordingApproved(row.original);
-              const isLayingCategory =
-                row.original.project_flock_category === 'LAYING';
-
-              if (isLayingCategory) {
-                return null;
-              }
-
-              const isDisabled = !row.getCanSelect() || isApproved;
-
               return (
                 <div>
                   <CheckboxInput
                     name='row'
                     checked={row.getIsSelected()}
-                    disabled={isDisabled}
                     indeterminate={row.getIsSomeSelected()}
                     onChange={row.getToggleSelectedHandler()}
                   />
@@ -883,7 +806,6 @@ const RecordingTable = () => {
                         deleteClickHandler={deleteClickHandler}
                         approveClickHandler={approveClickHandler}
                         rejectClickHandler={rejectClickHandler}
-                        isGradingCompleted={isGradingCompleted}
                       />
                     </RowDropdownOptions>
                   )}
@@ -896,7 +818,6 @@ const RecordingTable = () => {
                         deleteClickHandler={deleteClickHandler}
                         approveClickHandler={approveClickHandler}
                         rejectClickHandler={rejectClickHandler}
-                        isGradingCompleted={isGradingCompleted}
                       />
                     </RowCollapseOptions>
                   )}
diff --git a/src/components/pages/production/recording/form/RecordingForm.schema.ts b/src/components/pages/production/recording/form/RecordingForm.schema.ts
index 4d72e053..30013001 100644
--- a/src/components/pages/production/recording/form/RecordingForm.schema.ts
+++ b/src/components/pages/production/recording/form/RecordingForm.schema.ts
@@ -4,7 +4,6 @@ import {
   CreateGrowingRecordingPayload,
   CreateLayingRecordingPayload,
   CreateEggPayload,
-  CreateGradingPayload,
 } from '@/types/api/production/recording';
 
 type RecordingGrowingFormSchemaType = {
@@ -32,14 +31,7 @@ type RecordingLayingFormSchemaType = RecordingGrowingFormSchemaType & {
   eggs: {
     product_warehouse_id: number;
     qty: number | string;
-  }[];
-};
-
-type RecordingGradingFormSchemaType = {
-  eggs_grading: {
-    recording_egg_id: number;
-    grade: string;
-    qty: number | string;
+    weight: number | string;
   }[];
 };
 
@@ -62,6 +54,7 @@ export type DepletionSchema = {
 export type EggSchema = {
   product_warehouse_id: number;
   qty: number | string;
+  weight: number | string;
 };
 
 const BodyWeightObjectSchema: Yup.ObjectSchema<BodyWeightSchema> = Yup.object({
@@ -109,6 +102,10 @@ const EggObjectSchema: Yup.ObjectSchema<EggSchema> = Yup.object({
     .required('Jumlah telur wajib diisi!')
     .min(1, 'Jumlah telur tidak boleh 0!')
     .typeError('Jumlah telur harus berupa angka!'),
+  weight: Yup.number()
+    .required('Berat telur wajib diisi!')
+    .min(1, 'Berat telur minimal 1 gram!')
+    .typeError('Berat telur harus berupa angka!'),
 });
 
 export const RecordingGrowingFormSchema: Yup.ObjectSchema<RecordingGrowingFormSchemaType> =
@@ -190,30 +187,6 @@ export const UpdateRecordingLayingFormSchema = RecordingLayingFormSchema.shape({
     .required('Project Flock Kandang wajib diisi!'),
 });
 
-export const RecordingGradingFormSchema: Yup.ObjectSchema<RecordingGradingFormSchemaType> =
-  Yup.object({
-    eggs_grading: Yup.array()
-      .of(
-        Yup.object({
-          recording_egg_id: Yup.number()
-            .required('Recording Egg ID wajib diisi!')
-            .min(1, 'Recording Egg ID minimal 1!')
-            .typeError('Recording Egg ID harus berupa angka!'),
-          grade: Yup.string()
-            .required('Grade telur wajib diisi!')
-            .typeError('Grade telur harus berupa string!'),
-          qty: Yup.number()
-            .required('Jumlah telur wajib diisi!')
-            .min(1, 'Jumlah telur minimal 1!')
-            .typeError('Jumlah telur harus berupa angka!'),
-        })
-      )
-      .min(1, 'Minimal harus ada 1 data grading telur!')
-      .required('Data grading telur wajib diisi!'),
-  });
-
-export const UpdateRecordingGradingFormSchema = RecordingGradingFormSchema;
-
 export type RecordingGrowingFormValues = Yup.InferType<
   typeof RecordingGrowingFormSchema
 >;
@@ -222,10 +195,6 @@ export type RecordingLayingFormValues = Yup.InferType<
   typeof RecordingLayingFormSchema
 >;
 
-export type RecordingGradingFormValues = Yup.InferType<
-  typeof RecordingGradingFormSchema
->;
-
 type RecordingFormData = Partial<Recording> & {
   body_weights?: CreateGrowingRecordingPayload['body_weights'];
   stocks?: CreateGrowingRecordingPayload['stocks'] | Recording['stocks'];
@@ -295,26 +264,12 @@ export const getRecordingLayingFormInitialValues = (
   eggs: initialValues?.eggs?.map((egg: CreateEggPayload) => ({
     product_warehouse_id: egg.product_warehouse_id,
     qty: egg.qty,
+    weight: egg.weight,
   })) ?? [
     {
       product_warehouse_id: 0,
       qty: '',
-    },
-  ],
-});
-
-export const getRecordingGradingFormInitialValues = (
-  initialValues?: Partial<CreateGradingPayload> & { recording_egg_id?: number }
-): RecordingGradingFormValues => ({
-  eggs_grading: initialValues?.eggs_grading?.map((grading) => ({
-    recording_egg_id: grading.recording_egg_id,
-    grade: grading.grade,
-    qty: grading.qty,
-  })) ?? [
-    {
-      recording_egg_id: initialValues?.recording_egg_id ?? 0,
-      grade: '',
-      qty: '',
+      weight: '',
     },
   ],
 });
diff --git a/src/components/pages/production/recording/form/RecordingForm.tsx b/src/components/pages/production/recording/form/RecordingForm.tsx
index 43ffc98b..ca2ae8ba 100644
--- a/src/components/pages/production/recording/form/RecordingForm.tsx
+++ b/src/components/pages/production/recording/form/RecordingForm.tsx
@@ -16,7 +16,6 @@ import CheckboxInput from '@/components/input/CheckboxInput';
 import ConfirmationModal from '@/components/modal/ConfirmationModal';
 import ConfirmationModalWithNotes from '@/components/modal/ConfirmationModalWithNotes';
 import { useModal } from '@/components/Modal';
-import Tooltip from '@/components/Tooltip';
 
 import {
   ProjectFlockKandangApi,
@@ -98,9 +97,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
   const [recordingFormErrorMessage, setRecordingFormErrorMessage] =
     useState('');
   const [isDeleteLoading, setIsDeleteLoading] = useState(false);
-  const [newRecordingData, setNewRecordingData] = useState<Recording | null>(
-    null
-  );
+  const [, setNewRecordingData] = useState<Recording | null>(null);
   const [nextDayRecording, setNextDayRecording] =
     useState<NextDayRecording | null>(null);
 
@@ -111,18 +108,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
   const isRecordingApproved = useCallback((recording?: Recording) => {
     return (
       recording?.approval?.action === 'APPROVED' &&
-      recording?.approval?.step_name === 'Disetujui' &&
-      recording?.approval?.step_number === 3
-    );
-  }, []);
-
-  const hasGradingData = useCallback((recording?: Recording) => {
-    if (!recording || !recording.eggs) return false;
-    return recording.eggs.some(
-      (egg) =>
-        egg.gradings &&
-        egg.gradings.length > 0 &&
-        egg.gradings.some((grading) => grading.qty > 0)
+      recording?.approval?.step_name === 'Disetujui'
     );
   }, []);
 
@@ -181,6 +167,10 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
         eggs: (values.eggs ?? []).map((egg) => ({
           product_warehouse_id: egg.product_warehouse_id,
           qty: Number(egg.qty) || 0,
+          weight:
+            typeof egg.weight === 'number'
+              ? egg.weight
+              : parseFloat(String(egg.weight)) || 0,
         })),
       };
     },
@@ -203,35 +193,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
     [router]
   );
 
-  const createRecordingHandlerWithRedirect = useCallback(
-    async (
-      payload: CreateGrowingRecordingPayload | CreateLayingRecordingPayload,
-      redirectToGrading: boolean = false
-    ) => {
-      const res = await RecordingApi.create(payload);
-      if (isResponseError(res)) {
-        setRecordingFormErrorMessage(res.message);
-        return null;
-      }
-
-      toast.success(res?.message as string);
-
-      if (res?.status === 'success' && res.data) {
-        setNewRecordingData(res.data);
-        return res.data;
-      }
-
-      if (redirectToGrading) {
-        toast.error(
-          'Gagal mendapatkan ID recording. Silakan coba dari halaman list.'
-        );
-        router.push('/production/recording');
-      }
-      return null;
-    },
-    [router]
-  );
-
   const updateRecordingHandler = useCallback(
     async (
       recordingId: number,
@@ -650,7 +611,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
         const hasPakanFlag = product.product.flags?.includes('PAKAN');
         const hasOvkFlag = product.product.flags?.includes('OVK');
 
-        // Only include products that are in the same location as the selected kandang
         if (hasPakanFlag || hasOvkFlag) {
           options.push({
             value: product.id,
@@ -690,7 +650,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
       depletionProductsData.data.forEach((product) => {
         const productName = product.product.name;
 
-        // Filter for depletion-related products (culling, mati, afkir)
         if (
           productName.toLowerCase().includes('culling') ||
           productName.toLowerCase().includes('mati') ||
@@ -732,7 +691,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
       eggProductsData.data.forEach((product) => {
         const productName = product.product.name;
 
-        // Filter for egg-related products
         if (
           productName.toLowerCase().includes('telur') ||
           productName.toLowerCase().includes('egg') ||
@@ -1019,54 +977,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
     );
   }, [formik.values.stocks, getStockUsageError, type]);
 
-  const hasConsumableEggs = useMemo(() => {
-    if (!isLayingCategory) return false;
-    const layingValues = formik.values as RecordingLayingFormValues;
-    if (!layingValues.eggs || layingValues.eggs.length === 0) return false;
-
-    return layingValues.eggs.some((egg) => {
-      if (!egg.product_warehouse_id || Number(egg.qty) <= 0) return false;
-
-      const product = eggProducts.find(
-        (opt) => opt.value === egg.product_warehouse_id
-      );
-
-      if (!product) return false;
-
-      const productName = product.label.toLowerCase();
-      return (
-        productName.includes('konsumsi') &&
-        productName.includes('baik') &&
-        Number(egg.qty) > 0
-      );
-    });
-  }, [isLayingCategory, formik.values, eggProducts]);
-
-  const hasConsumableEggsInRecording = useCallback((recording?: Recording) => {
-    if (!recording || !recording.eggs || recording.eggs.length === 0)
-      return false;
-
-    return recording.eggs.some((egg) => {
-      if (!egg.product_warehouse || !egg.product_warehouse.product)
-        return false;
-      if (Number(egg.qty) <= 0) return false;
-
-      const productName = egg.product_warehouse.product.name.toLowerCase();
-      return (
-        productName.includes('konsumsi') &&
-        productName.includes('baik') &&
-        Number(egg.qty) > 0
-      );
-    });
-  }, []);
-
-  const hasConsumableEggsInCurrentRecording = useMemo(() => {
-    return (
-      hasConsumableEggsInRecording(initialValues) ||
-      hasConsumableEggsInRecording(newRecordingData || undefined)
-    );
-  }, [initialValues, newRecordingData, hasConsumableEggsInRecording]);
-
   const isRepeaterInputError = (
     arrayName: 'body_weights' | 'stocks' | 'depletions' | 'eggs',
     column: string,
@@ -1148,7 +1058,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
 
           if (hasSameDayRecording) {
             toast.error(
-              `Recording untuk hari ${nextDayRecording.next_day} sudah ada. 
+              `Recording untuk hari ${nextDayRecording.next_day} sudah ada.
               Tidak bisa membuat recording duplikat, mohon perbarui recording yang sudah ada terlebih dahulu.`
             );
             return;
@@ -1278,7 +1188,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
     setIsRejectLoading(false);
   };
 
-  // Body Weights Handlers
   const addBodyWeight = () => {
     const newBodyWeights = [
       ...(formik.values.body_weights || []),
@@ -1397,7 +1306,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
     setSelectedBodyWeights([]);
   };
 
-  // Stocks Handlers
   const addStock = () => {
     const newStocks = [
       ...(formik.values.stocks || []),
@@ -1430,7 +1338,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
     setSelectedStocks([]);
   };
 
-  // Depletions Handlers
   const addDepletion = () => {
     const newDepletions = [
       ...(formik.values.depletions || []),
@@ -1465,7 +1372,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
     setSelectedDepletions([]);
   };
 
-  // Eggs Handlers
   const addEgg = () => {
     const newEggs = [
       ...((formik.values as RecordingLayingFormValues).eggs || []),
@@ -1485,6 +1391,14 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
     [formik]
   );
 
+  const handleEggWeightChangeWrapper = useCallback(
+    (idx: number) => (e: React.ChangeEvent<HTMLInputElement>) => {
+      const value = parseFloat(e.target.value) || 0;
+      formik.setFieldValue(`eggs.${idx}.weight`, value);
+    },
+    [formik]
+  );
+
   const removeEgg = (idx: number) => {
     const updatedEggs = (
       formik.values as RecordingLayingFormValues
@@ -1569,47 +1483,37 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
               Kembali
             </Button>
 
-            {type === 'detail' &&
-              !isRecordingApproved(initialValues) &&
-              (!isLayingCategory || hasGradingData(initialValues)) && (
-                <div className='flex flex-row gap-2'>
-                  <Button
-                    variant='outline'
-                    color='success'
-                    onClick={() => {
-                      setApprovalNotes('');
-                      approveModal.openModal();
-                    }}
-                    isLoading={isApproveLoading}
-                    className='w-full sm:w-fit'
-                  >
-                    <Icon
-                      icon='material-symbols:check'
-                      width={24}
-                      height={24}
-                    />
-                    Approve
-                  </Button>
+            {type === 'detail' && !isRecordingApproved(initialValues) && (
+              <div className='flex flex-row gap-2'>
+                <Button
+                  variant='outline'
+                  color='success'
+                  onClick={() => {
+                    setApprovalNotes('');
+                    approveModal.openModal();
+                  }}
+                  isLoading={isApproveLoading}
+                  className='w-full sm:w-fit'
+                >
+                  <Icon icon='material-symbols:check' width={24} height={24} />
+                  Approve
+                </Button>
 
-                  <Button
-                    variant='outline'
-                    color='error'
-                    onClick={() => {
-                      setApprovalNotes('');
-                      rejectModal.openModal();
-                    }}
-                    isLoading={isRejectLoading}
-                    className='w-full sm:w-fit'
-                  >
-                    <Icon
-                      icon='material-symbols:close'
-                      width={24}
-                      height={24}
-                    />
-                    Reject
-                  </Button>
-                </div>
-              )}
+                <Button
+                  variant='outline'
+                  color='error'
+                  onClick={() => {
+                    setApprovalNotes('');
+                    rejectModal.openModal();
+                  }}
+                  isLoading={isRejectLoading}
+                  className='w-full sm:w-fit'
+                >
+                  <Icon icon='material-symbols:close' width={24} height={24} />
+                  Reject
+                </Button>
+              </div>
+            )}
           </div>
 
           <h1 className='text-2xl font-bold text-center'>
@@ -1916,7 +1820,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                   {formik.values.body_weights?.map((bw, idx) => (
                     <tr key={`body-weight-${idx}`}>
                       {(type as 'add' | 'edit' | 'detail') !== 'detail' && (
-                        <td className='!align-middle'>
+                        <td className='align-middle!'>
                           <CheckboxInput
                             name={`body-weight-${idx}`}
                             checked={selectedBodyWeights.includes(idx)}
@@ -2166,7 +2070,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                   {formik.values.stocks?.map((stock, idx) => (
                     <tr key={`stock-${idx}`}>
                       {(type as 'add' | 'edit' | 'detail') !== 'detail' && (
-                        <td className='!align-middle'>
+                        <td className='align-middle!'>
                           <CheckboxInput
                             name={`stock-${idx}`}
                             checked={selectedStocks.includes(idx)}
@@ -2386,7 +2290,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                   {formik.values.depletions?.map((depletion, idx) => (
                     <tr key={`depletion-${idx}`}>
                       {(type as 'add' | 'edit' | 'detail') !== 'detail' && (
-                        <td className='!align-middle'>
+                        <td className='align-middle!'>
                           <CheckboxInput
                             name={`depletion-${idx}`}
                             checked={selectedDepletions.includes(idx)}
@@ -2587,6 +2491,15 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                           <span className='text-error'>*</span>
                         </span>
                       </th>
+                      <th>
+                        Berat (gram)
+                        <span
+                          className='tooltip tooltip-error tooltip-bottom '
+                          data-tip='required'
+                        >
+                          <span className='text-error'>*</span>
+                        </span>
+                      </th>
                       {(type as 'add' | 'edit' | 'detail') !== 'detail' && (
                         <th>Action</th>
                       )}
@@ -2597,7 +2510,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                       (egg, idx) => (
                         <tr key={`egg-${idx}`}>
                           {(type as 'add' | 'edit' | 'detail') !== 'detail' && (
-                            <td className='!align-middle'>
+                            <td className='align-middle!'>
                               <CheckboxInput
                                 name={`egg-${idx}`}
                                 checked={selectedEggs.includes(idx)}
@@ -2662,32 +2575,55 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                             />
                           </td>
                           <td>
-                            <div className='flex flex-col gap-1'>
-                              <NumberInput
-                                required
-                                name={`eggs.${idx}.qty`}
-                                value={egg.qty ?? ''}
-                                onChange={handleEggQtyChangeWrapper(idx)}
-                                onBlur={formik.handleBlur}
-                                decimalScale={0}
-                                allowNegative={false}
-                                thousandSeparator=','
-                                decimalSeparator='.'
-                                isError={
-                                  isRepeaterInputError('eggs', 'qty', idx)
-                                    .isError
-                                }
-                                errorMessage={
-                                  isRepeaterInputError('eggs', 'qty', idx)
-                                    .errorMessage
-                                }
-                                readOnly={type === 'detail'}
-                                className={{
-                                  wrapper: 'w-full min-w-24',
-                                }}
-                                placeholder='Masukkan jumlah telur'
-                              />
-                            </div>
+                            <NumberInput
+                              required
+                              name={`eggs.${idx}.qty`}
+                              value={egg.qty ?? ''}
+                              onChange={handleEggQtyChangeWrapper(idx)}
+                              onBlur={formik.handleBlur}
+                              decimalScale={0}
+                              allowNegative={false}
+                              thousandSeparator=','
+                              decimalSeparator='.'
+                              isError={
+                                isRepeaterInputError('eggs', 'qty', idx).isError
+                              }
+                              errorMessage={
+                                isRepeaterInputError('eggs', 'qty', idx)
+                                  .errorMessage
+                              }
+                              readOnly={type === 'detail'}
+                              className={{
+                                wrapper: 'w-full min-w-24',
+                              }}
+                              placeholder='Masukkan jumlah telur'
+                            />
+                          </td>
+                          <td>
+                            <NumberInput
+                              required
+                              name={`eggs.${idx}.weight`}
+                              value={egg.weight ?? ''}
+                              onChange={handleEggWeightChangeWrapper(idx)}
+                              onBlur={formik.handleBlur}
+                              decimalScale={0}
+                              allowNegative={false}
+                              thousandSeparator=','
+                              decimalSeparator='.'
+                              isError={
+                                isRepeaterInputError('eggs', 'weight', idx)
+                                  .isError
+                              }
+                              errorMessage={
+                                isRepeaterInputError('eggs', 'weight', idx)
+                                  .errorMessage
+                              }
+                              readOnly={type === 'detail'}
+                              className={{
+                                wrapper: 'w-full min-w-24',
+                              }}
+                              placeholder='Masukkan berat telur (gram)...'
+                            />
                           </td>
                           {(type as 'add' | 'edit' | 'detail') !== 'detail' && (
                             <td>
@@ -2779,46 +2715,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
             </div>
             {/* Right side actions */}
             <div className='flex flex-col sm:flex-row sm:justify-end gap-2 w-full sm:w-auto'>
-              {type === 'detail' && isLayingCategory && (
-                <Tooltip
-                  content={
-                    hasConsumableEggsInCurrentRecording
-                      ? 'Lanjut ke proses grading untuk telur konsumsi baik'
-                      : 'Hanya bisa melanjutkan ke grading jika ada Telur Konsumsi Baik'
-                  }
-                  position='left'
-                  color={
-                    hasConsumableEggsInCurrentRecording ? 'info' : 'warning'
-                  }
-                >
-                  <Button
-                    type='button'
-                    color='primary'
-                    disabled={!hasConsumableEggsInCurrentRecording}
-                    className='w-full sm:w-auto'
-                    onClick={() => {
-                      const recordingId =
-                        newRecordingData?.id || initialValues?.id;
-                      if (recordingId) {
-                        router.push(
-                          `/production/recording/grading/add?recording_id=${recordingId}`
-                        );
-                      } else {
-                        toast.error(
-                          'Recording ID tidak ditemukan. Silakan refresh halaman.'
-                        );
-                      }
-                    }}
-                  >
-                    <Icon icon='material-symbols:egg' width={24} height={24} />
-                    {hasGradingData(initialValues) ||
-                    hasGradingData(newRecordingData || undefined)
-                      ? 'Edit Grading'
-                      : 'Lanjut ke Grading'}
-                  </Button>
-                </Tooltip>
-              )}
-
               {type === 'edit' && (
                 <div className='flex flex-col sm:flex-row gap-2 w-full sm:w-auto'>
                   <Button
@@ -2870,78 +2766,6 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
                   >
                     Submit
                   </Button>
-                  {isLayingCategory && (
-                    <Tooltip
-                      content={
-                        hasConsumableEggs
-                          ? 'Lanjut ke proses grading untuk telur konsumsi baik'
-                          : 'Hanya bisa melanjutkan ke grading jika ada Telur Konsumsi Baik'
-                      }
-                      position='left'
-                      color={hasConsumableEggs ? 'info' : 'warning'}
-                    >
-                      <Button
-                        type='button'
-                        color='info'
-                        className='px-4'
-                        isLoading={formik.isSubmitting}
-                        disabled={
-                          hasExceededStock ||
-                          !formik.isValid ||
-                          formik.isSubmitting ||
-                          !hasConsumableEggs
-                        }
-                        onClick={async () => {
-                          if (!formik.isValid) {
-                            await formik.validateForm();
-                            return;
-                          }
-
-                          setRecordingFormErrorMessage('');
-                          formik.setSubmitting(true);
-
-                          try {
-                            if (isLayingCategory) {
-                              const layingValues =
-                                formik.values as RecordingLayingFormValues;
-                              const layingPayload =
-                                createLayingPayload(layingValues);
-
-                              const recordingData =
-                                await createRecordingHandlerWithRedirect(
-                                  layingPayload as CreateLayingRecordingPayload,
-                                  true
-                                );
-
-                              if (recordingData?.id) {
-                                toast.success(
-                                  'Recording berhasil disimpan! Mengalihkan ke form Grading...'
-                                );
-                                setTimeout(() => {
-                                  router.push(
-                                    `/production/recording/grading/add?recording_id=${recordingData.id}`
-                                  );
-                                }, 1000);
-                              }
-                            }
-                          } catch {
-                            toast.error(
-                              'Gagal membuat recording. Silakan coba lagi.'
-                            );
-                          } finally {
-                            formik.setSubmitting(false);
-                          }
-                        }}
-                      >
-                        <Icon
-                          icon='material-symbols:egg'
-                          width={24}
-                          height={24}
-                        />
-                        Next Step: Grading
-                      </Button>
-                    </Tooltip>
-                  )}
                 </div>
               )}
             </div>
@@ -2979,8 +2803,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
 
           {/* Approve Confirmation Modal */}
           {(type as 'add' | 'edit' | 'detail') === 'detail' &&
-            !isRecordingApproved(initialValues) &&
-            (!isLayingCategory || hasGradingData(initialValues)) && (
+            !isRecordingApproved(initialValues) && (
               <ConfirmationModalWithNotes
                 ref={approveModal.ref}
                 type='success'
@@ -3002,8 +2825,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
 
           {/* Reject Confirmation Modal */}
           {(type as 'add' | 'edit' | 'detail') === 'detail' &&
-            !isRecordingApproved(initialValues) &&
-            (!isLayingCategory || hasGradingData(initialValues)) && (
+            !isRecordingApproved(initialValues) && (
               <ConfirmationModalWithNotes
                 ref={rejectModal.ref}
                 type='error'
diff --git a/src/components/pages/production/recording/grading/form/GradingForm.tsx b/src/components/pages/production/recording/grading/form/GradingForm.tsx
deleted file mode 100644
index 417c6356..00000000
--- a/src/components/pages/production/recording/grading/form/GradingForm.tsx
+++ /dev/null
@@ -1,1050 +0,0 @@
-'use client';
-
-import { useMemo, useState, useEffect, useCallback } from 'react';
-import { useRouter, useSearchParams } from 'next/navigation';
-import { useFormik } from 'formik';
-import { Icon } from '@iconify/react';
-
-import Button from '@/components/Button';
-import NumberInput from '@/components/input/NumberInput';
-import SelectInput, { OptionType } from '@/components/input/SelectInput';
-import CheckboxInput from '@/components/input/CheckboxInput';
-import ConfirmationModal from '@/components/modal/ConfirmationModal';
-import Card from '@/components/Card';
-import Badge from '@/components/Badge';
-
-import {
-  CreateGradingPayload,
-  UpdateGradingPayload,
-  RecordingEgg,
-  GradingEgg,
-  Recording,
-} from '@/types/api/production/recording';
-import { ProjectFlockKandang } from '@/types/api/production/project-flock-kandang';
-import { type BaseApiResponse } from '@/types/api/api-general';
-
-import {
-  RecordingGradingFormSchema,
-  RecordingGradingFormValues,
-  UpdateRecordingGradingFormSchema,
-  getRecordingGradingFormInitialValues,
-} from '@/components/pages/production/recording/form/RecordingForm.schema';
-
-import { cn, formatDate } from '@/lib/helper';
-import toast from 'react-hot-toast';
-import { isResponseError } from '@/lib/api-helper';
-
-import {
-  RecordingApi,
-  ProjectFlockKandangApi,
-} from '@/services/api/production';
-
-import { useModal } from '@/components/Modal';
-import useSWR from 'swr';
-
-// INTERFACES & PROPS
-interface GradingFormProps {
-  type?: 'add' | 'edit' | 'detail';
-  initialValues?: RecordingEgg & {
-    grading_eggs?: GradingEgg[];
-    gradings?: { grade: string; qty: number }[];
-  };
-}
-
-const GradingForm = ({ type = 'add', initialValues }: GradingFormProps) => {
-  // HOOKS & ROUTER
-  const router = useRouter();
-  const searchParams = useSearchParams();
-  const recordingId = searchParams.get('recording_id');
-
-  // STATE MANAGEMENT
-  const [selectedGradingItems, setSelectedGradingItems] = useState<number[]>(
-    []
-  );
-  const [gradingFormErrorMessage, setGradingFormErrorMessage] = useState('');
-  const [isDeleteLoading, setIsDeleteLoading] = useState(false);
-  const deleteModal = useModal();
-
-  // API DATA FETCHING
-  const recordingUrl = useMemo(() => {
-    const recordingIdToUse = recordingId;
-    if (!recordingIdToUse) return null;
-    return `${RecordingApi.basePath}/${recordingIdToUse}`;
-  }, [recordingId]);
-
-  const { data: recordingData } = useSWR(
-    recordingUrl,
-    recordingUrl ? RecordingApi.getAllFetcher : null
-  );
-
-  // DATA PROCESSING
-  const recording =
-    recordingData?.status === 'success'
-      ? (recordingData.data as unknown as Recording)
-      : undefined;
-
-  const projectFlockKandangUrl = useMemo(() => {
-    if (!recording?.project_flock_kandang_id) return null;
-    return `${ProjectFlockKandangApi.basePath}/${recording.project_flock_kandang_id}`;
-  }, [recording?.project_flock_kandang_id]);
-
-  const { data: projectFlockKandangData } = useSWR(
-    projectFlockKandangUrl,
-    projectFlockKandangUrl ? ProjectFlockKandangApi.getAllFetcher : null
-  );
-
-  const projectFlockKandang =
-    projectFlockKandangData?.status === 'success'
-      ? (projectFlockKandangData.data as unknown as ProjectFlockKandang)
-      : undefined;
-
-  const konsumsiBaikEggData = useMemo(() => {
-    if (!recording?.eggs) return null;
-
-    const konsumsiBaikEgg = recording.eggs.find((egg: RecordingEgg) =>
-      egg.product_warehouse?.product?.name
-        ?.toLowerCase()
-        .includes('konsumsi baik')
-    );
-
-    return konsumsiBaikEgg || null;
-  }, [recording]);
-
-  const totalKonsumsiBaikEggs = konsumsiBaikEggData?.qty || 0;
-  const konsumsiBaikEggId = konsumsiBaikEggData?.id;
-
-  const isDataLoading =
-    !recording ||
-    (totalKonsumsiBaikEggs === 0 &&
-      recording?.project_flock_category === 'LAYING');
-
-  // FORM HANDLERS
-  const createGradingHandler = useCallback(
-    async (payload: CreateGradingPayload) => {
-      const res = (await RecordingApi.createGrading(payload)) as
-        | BaseApiResponse<unknown>
-        | undefined;
-
-      if (!res || isResponseError(res)) {
-        setGradingFormErrorMessage(res?.message || 'Failed to add Grading');
-        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.updateGrading(gradingId, payload)) as
-        | BaseApiResponse<unknown>
-        | undefined;
-
-      if (!res || isResponseError(res)) {
-        setGradingFormErrorMessage(res?.message || 'Failed to update Grading');
-        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 (!initialValues?.id) return;
-
-    setIsDeleteLoading(true);
-    try {
-      const res = (await RecordingApi.deleteGrading(initialValues.id)) as
-        | BaseApiResponse<unknown>
-        | undefined;
-
-      if (!res || isResponseError(res)) {
-        setGradingFormErrorMessage(res?.message || 'Failed to delete Grading');
-        return;
-      }
-      deleteModal.closeModal();
-      toast.success(res?.message || 'Successfully delete Grading!');
-      router.push('/production/recording');
-    } catch {
-      setGradingFormErrorMessage('Failed to delete Grading');
-    } finally {
-      setIsDeleteLoading(false);
-    }
-  }, [deleteModal, initialValues?.id, router]);
-
-  // FORMIK SETUP
-  const formikInitialValues = useMemo(() => {
-    let recordingEggId: number | undefined = konsumsiBaikEggId;
-
-    if (!recordingEggId && initialValues?.id) {
-      recordingEggId = initialValues.id;
-    }
-
-    if (!recordingEggId) {
-      recordingEggId = parseInt(recordingId || '0') || 0;
-    }
-
-    let gradingData: {
-      recording_egg_id: number;
-      grade: string;
-      qty: number;
-    }[] = [];
-
-    if (initialValues?.grading_eggs && initialValues.grading_eggs.length > 0) {
-      gradingData = initialValues.grading_eggs.map((grading: GradingEgg) => ({
-        recording_egg_id: recordingEggId,
-        grade: grading.grade,
-        qty: grading.qty,
-      }));
-    } else if (initialValues?.gradings && initialValues.gradings.length > 0) {
-      gradingData = initialValues.gradings.map(
-        (grading: { grade: string; qty: number }) => ({
-          recording_egg_id: recordingEggId,
-          grade: grading.grade,
-          qty: grading.qty,
-        })
-      );
-    }
-
-    return getRecordingGradingFormInitialValues({
-      recording_egg_id: recordingEggId,
-      eggs_grading: gradingData,
-    });
-  }, [initialValues, recordingId, konsumsiBaikEggId]);
-
-  const formik = useFormik<RecordingGradingFormValues>({
-    initialValues: formikInitialValues,
-    enableReinitialize: true,
-    validationSchema: (() => {
-      return type === 'edit'
-        ? UpdateRecordingGradingFormSchema
-        : RecordingGradingFormSchema;
-    })(),
-    validateOnChange: true,
-    validateOnBlur: true,
-    onSubmit: async (values) => {
-      const gradingPayload = {
-        eggs_grading: (values.eggs_grading ?? []).map((grading) => ({
-          recording_egg_id: grading.recording_egg_id,
-          grade: grading.grade,
-          qty: grading.qty || 0,
-        })),
-      };
-
-      switch (type) {
-        case 'add':
-          await createGradingHandler(gradingPayload as CreateGradingPayload);
-          break;
-        case 'edit':
-          await updateGradingHandler(
-            initialValues?.id as number,
-            gradingPayload as UpdateGradingPayload
-          );
-          break;
-      }
-    },
-  });
-
-  const currentGradingTotal = useMemo(() => {
-    return (formik.values.eggs_grading || []).reduce((total, grading) => {
-      return total + (Number(grading.qty) || 0);
-    }, 0);
-  }, [formik.values.eggs_grading]);
-
-  const isGradingExceedsAvailable = currentGradingTotal > totalKonsumsiBaikEggs;
-  const isGradingIncomplete =
-    currentGradingTotal < totalKonsumsiBaikEggs && totalKonsumsiBaikEggs > 0;
-  const hasUserStartedGrading = currentGradingTotal > 0;
-
-  // GRADING HANDLERS
-  const addGrading = () => {
-    let recordingEggId: number | undefined = konsumsiBaikEggId;
-
-    if (!recordingEggId && initialValues?.id) {
-      recordingEggId = initialValues.id;
-    }
-
-    if (!recordingEggId) {
-      recordingEggId = parseInt(recordingId || '0') || 0;
-    }
-
-    const newGrading = [
-      ...(formik.values.eggs_grading || []),
-      {
-        recording_egg_id: recordingEggId,
-        grade: '',
-        qty: '',
-      },
-    ];
-    formik.setFieldValue('eggs_grading', newGrading);
-  };
-
-  const handleGradingGradeChangeWrapper = useCallback(
-    (idx: number) => (selectedOption: OptionType | OptionType[] | null) => {
-      const option = selectedOption as OptionType | null;
-      formik.setFieldValue(`eggs_grading.${idx}.grade`, option?.label || '');
-    },
-    [formik]
-  );
-
-  const handleGradingQtyChangeWrapper = useCallback(
-    (idx: number) => (e: React.ChangeEvent<HTMLInputElement>) => {
-      const value = parseFloat(e.target.value) || 0;
-      formik.setFieldValue(`eggs_grading.${idx}.qty`, value);
-    },
-    [formik]
-  );
-
-  const removeGrading = (idx: number) => {
-    const updatedGrading = formik.values.eggs_grading?.filter(
-      (_, i) => i !== idx
-    );
-    formik.setFieldValue('eggs_grading', updatedGrading);
-  };
-
-  const removeSelectedGrading = () => {
-    const updatedGrading = formik.values.eggs_grading?.filter(
-      (_, idx) => !selectedGradingItems.includes(idx)
-    );
-    formik.setFieldValue('eggs_grading', updatedGrading);
-    setSelectedGradingItems([]);
-  };
-
-  // VALIDATION HELPERS
-  const isRepeaterInputError = (
-    arrayName: 'eggs_grading',
-    column: string,
-    idx: number
-  ) => {
-    const touched = formik.touched as Record<string, unknown>;
-    const errors = formik.errors as Record<string, unknown>;
-
-    if (!touched[arrayName] || !Array.isArray(touched[arrayName])) {
-      return {
-        isError: false,
-        errorMessage: '',
-      };
-    }
-
-    const touchedField = (touched[arrayName] as unknown[])?.[idx] as Record<
-      string,
-      unknown
-    >;
-    const errorField = (errors[arrayName] as unknown[])?.[idx] as Record<
-      string,
-      unknown
-    >;
-
-    return {
-      isError: touchedField && Boolean(errorField?.[column]),
-      errorMessage:
-        touchedField && errorField?.[column]
-          ? (errorField[column] as string)
-          : '',
-    };
-  };
-
-  // EFFECTS
-  useEffect(() => {
-    if (isDataLoading) {
-      toast.dismiss('grading-exceeds');
-      toast.dismiss('grading-incomplete');
-      return;
-    }
-
-    if (isGradingExceedsAvailable && currentGradingTotal > 0) {
-      toast.error(
-        `Total grading (${currentGradingTotal}) melebihi telur yang tersedia (${totalKonsumsiBaikEggs})!`,
-        {
-          id: 'grading-exceeds',
-          duration: 3000,
-        }
-      );
-      toast.dismiss('grading-incomplete');
-    } else if (isGradingIncomplete && hasUserStartedGrading) {
-      toast.error(
-        `Total grading (${currentGradingTotal}) tidak sama dengan total telur konsumsi baik yang tersedia (${totalKonsumsiBaikEggs})! Semua telur harus digrading.`,
-        {
-          id: 'grading-incomplete',
-          duration: 3000,
-        }
-      );
-      toast.dismiss('grading-exceeds');
-    } else {
-      toast.dismiss('grading-exceeds');
-      toast.dismiss('grading-incomplete');
-    }
-  }, [
-    isDataLoading,
-    isGradingExceedsAvailable,
-    isGradingIncomplete,
-    hasUserStartedGrading,
-    currentGradingTotal,
-    totalKonsumsiBaikEggs,
-  ]);
-
-  useEffect(() => {
-    if (
-      konsumsiBaikEggId &&
-      formik.values.eggs_grading &&
-      formik.values.eggs_grading.length === 0
-    ) {
-      formik.setFieldValue('eggs_grading', [
-        { recording_egg_id: konsumsiBaikEggId, grade: '', qty: '' },
-      ]);
-    }
-  }, [konsumsiBaikEggId, formik.values.eggs_grading.length]);
-
-  return (
-    <>
-      <section className='w-full'>
-        <header className='flex flex-col gap-4'>
-          <Button
-            href='/production/recording'
-            variant='link'
-            className='w-fit p-0 text-primary'
-          >
-            <Icon icon='uil:arrow-left' width={24} height={24} />
-            Kembali
-          </Button>
-          <h1 className='text-2xl font-bold text-center'>
-            {type === 'add' && 'Tambah Grading'}
-            {type === 'edit' && 'Edit Grading'}
-            {type === 'detail' && 'Detail Grading'}
-          </h1>
-        </header>
-
-        <form
-          onSubmit={formik.handleSubmit}
-          className='w-full mt-8 flex flex-col gap-6'
-        >
-          {/* Basic Info Card */}
-          <Card
-            title='Informasi Recording'
-            className={{
-              wrapper: 'w-full mb-6 shadow-sm',
-              body: 'p-6',
-            }}
-          >
-            <div className='grid grid-cols-2 md:grid-cols-4 gap-4 mb-6'>
-              {/* Status Approval */}
-              {recording?.approval && (
-                <div>
-                  <span className='text-sm text-gray-600'>Status Approval</span>
-                  <div className='mt-1'>
-                    <Badge
-                      variant='soft'
-                      color={
-                        recording.approval.action === 'APPROVED'
-                          ? 'success'
-                          : recording.approval.action === 'REJECTED'
-                            ? 'error'
-                            : recording.approval.action === 'UPDATED'
-                              ? 'warning'
-                              : 'info'
-                      }
-                      className={{
-                        badge: 'whitespace-nowrap font-semibold text-xs px-2',
-                      }}
-                    >
-                      {(() => {
-                        const actionText = (() => {
-                          switch (recording.approval.action) {
-                            case 'APPROVED':
-                              return 'Disetujui';
-                            case 'REJECTED':
-                              return 'Ditolak';
-                            case 'CREATED':
-                              return 'Dibuat';
-                            case 'UPDATED':
-                              return 'Diperbarui';
-                            default:
-                              return recording.approval.action;
-                          }
-                        })();
-
-                        const stepName = recording.approval.step_name;
-
-                        if (stepName === actionText) {
-                          return stepName;
-                        }
-
-                        return `${stepName} - ${actionText}`;
-                      })()}
-                    </Badge>
-                  </div>
-                </div>
-              )}
-              {/* Recording Info */}
-              <div>
-                <span className='text-sm text-gray-600'>Lokasi</span>
-                <p className='font-semibold'>
-                  {projectFlockKandang?.project_flock?.location?.name || '-'}
-                </p>
-              </div>
-              <div>
-                <span className='text-sm text-gray-600'>Project Flock</span>
-                <p className='font-semibold'>
-                  {projectFlockKandang?.project_flock?.flock_name || '-'}
-                </p>
-              </div>
-              <div>
-                <span className='text-sm text-gray-600'>Kandang</span>
-                <p className='font-semibold'>
-                  {projectFlockKandang?.kandang?.name || '-'}
-                </p>
-              </div>
-              <div>
-                <span className='text-sm text-gray-600'>Tanggal Recording</span>
-                <p className='font-semibold'>
-                  {recording
-                    ? formatDate(recording.record_datetime, 'DD MMMM YYYY')
-                    : '-'}
-                </p>
-              </div>
-              <div>
-                <span className='text-sm text-gray-600'>Hari</span>
-                <p className='font-semibold'>Hari ke-{recording?.day || '-'}</p>
-              </div>
-              <div>
-                <span className='text-sm text-gray-600'>Kategori</span>
-                <p className='font-semibold'>
-                  <Badge
-                    variant='soft'
-                    color={
-                      recording?.project_flock_category === 'LAYING'
-                        ? 'info'
-                        : 'warning'
-                    }
-                    size='sm'
-                  >
-                    {recording?.project_flock_category || '-'}
-                  </Badge>
-                </p>
-              </div>
-              <div>
-                <span className='text-sm text-gray-600'>Periode</span>
-                <p className='font-semibold'>
-                  <Badge
-                    variant='soft'
-                    color='neutral'
-                    size='sm'
-                    className={{
-                      badge: 'whitespace-nowrap font-semibold text-xs px-2',
-                    }}
-                  >
-                    Periode {projectFlockKandang?.project_flock?.period || '-'}
-                  </Badge>
-                </p>
-              </div>
-            </div>
-
-            <div
-              className={
-                type === 'detail'
-                  ? 'space-y-6'
-                  : 'grid grid-cols-1 md:grid-cols-2 gap-6'
-              }
-            >
-              {/* Additional Recording Info */}
-              <div className='bg-blue-50 rounded-lg p-4 border border-blue-200'>
-                <div className='flex items-center justify-between mb-3'>
-                  <div className='bg-blue-100 rounded-full p-2'>
-                    <Icon
-                      icon='material-symbols:info'
-                      width={20}
-                      height={20}
-                      className='text-blue-600'
-                    />
-                  </div>
-                  <span className='text-xs text-blue-600 font-medium uppercase tracking-wide'>
-                    Detail Recording
-                  </span>
-                </div>
-                <div className='space-y-2'>
-                  <div>
-                    <p className='text-xs text-gray-600'>Area</p>
-                    <p className='font-semibold text-blue-900'>
-                      {projectFlockKandang?.project_flock?.area?.name || '-'}
-                    </p>
-                  </div>
-                  <div>
-                    <p className='text-xs text-gray-600'>Status Kandang</p>
-                    <p className='font-semibold text-blue-900'>
-                      {projectFlockKandang?.kandang?.status || '-'}
-                    </p>
-                  </div>
-                </div>
-              </div>
-
-              {/* Total Telur Konsumsi Baik Info */}
-              <div
-                className={`rounded-lg p-4 border-2 ${
-                  isDataLoading
-                    ? 'bg-gray-50 border-gray-200'
-                    : isGradingExceedsAvailable
-                      ? 'bg-red-50 border-red-200'
-                      : isGradingIncomplete && hasUserStartedGrading
-                        ? 'bg-yellow-50 border-yellow-200'
-                        : 'bg-green-50 border-green-200'
-                }`}
-              >
-                <div className='flex items-center justify-between mb-3'>
-                  <div>
-                    <p className='text-sm font-medium text-gray-600 mb-1'>
-                      Total Telur Konsumsi Baik
-                    </p>
-                    <div className='flex items-baseline gap-2'>
-                      <p className='text-2xl font-bold text-gray-900'>
-                        {isDataLoading ? (
-                          <span className='loading loading-spinner loading-sm'></span>
-                        ) : (
-                          totalKonsumsiBaikEggs
-                        )}{' '}
-                        <span className='text-sm text-gray-500 font-medium'>
-                          telur
-                        </span>
-                      </p>
-                    </div>
-                  </div>
-                  <div
-                    className={`rounded-full p-2 ${
-                      isDataLoading
-                        ? 'bg-gray-100'
-                        : isGradingExceedsAvailable
-                          ? 'bg-red-100'
-                          : isGradingIncomplete && hasUserStartedGrading
-                            ? 'bg-yellow-100'
-                            : 'bg-green-100'
-                    }`}
-                  >
-                    <Icon
-                      icon={
-                        isDataLoading
-                          ? 'material-symbols:hourglass-empty'
-                          : isGradingExceedsAvailable
-                            ? 'material-symbols:error'
-                            : isGradingIncomplete && hasUserStartedGrading
-                              ? 'material-symbols:warning'
-                              : 'material-symbols:check-circle'
-                      }
-                      width={20}
-                      height={20}
-                      className={
-                        isDataLoading
-                          ? 'text-gray-500'
-                          : isGradingExceedsAvailable
-                            ? 'text-red-600'
-                            : isGradingIncomplete && hasUserStartedGrading
-                              ? 'text-yellow-600'
-                              : 'text-green-600'
-                      }
-                    />
-                  </div>
-                </div>
-
-                {/* Progress Bar */}
-                <div className='space-y-2'>
-                  <div className='flex items-center justify-between text-sm'>
-                    <span className='text-gray-600'>Total yang digrading:</span>
-                    <span
-                      className={`font-semibold ${
-                        isDataLoading
-                          ? 'text-gray-500'
-                          : isGradingExceedsAvailable
-                            ? 'text-red-600'
-                            : isGradingIncomplete && hasUserStartedGrading
-                              ? 'text-yellow-600'
-                              : 'text-green-600'
-                      }`}
-                    >
-                      {isDataLoading ? (
-                        <span className='loading loading-spinner loading-xs'></span>
-                      ) : (
-                        `${currentGradingTotal} / ${totalKonsumsiBaikEggs}`
-                      )}
-                    </span>
-                  </div>
-                  <div className='w-full bg-gray-200 rounded-full h-2 overflow-hidden'>
-                    <div
-                      className={`h-full transition-all duration-300 ${
-                        isDataLoading
-                          ? 'bg-gray-400'
-                          : isGradingExceedsAvailable
-                            ? 'bg-red-500'
-                            : isGradingIncomplete && hasUserStartedGrading
-                              ? 'bg-yellow-500'
-                              : 'bg-green-500'
-                      }`}
-                      style={{
-                        width: isDataLoading
-                          ? '0%'
-                          : `${Math.min((currentGradingTotal / totalKonsumsiBaikEggs) * 100, 100)}%`,
-                      }}
-                    />
-                  </div>
-                  {!isDataLoading && isGradingExceedsAvailable && (
-                    <div className='flex items-center gap-1 text-xs text-red-600 mt-1'>
-                      <Icon
-                        icon='material-symbols:warning'
-                        width={12}
-                        height={12}
-                      />
-                      <span>Melebihi batas tersedia</span>
-                    </div>
-                  )}
-                  {!isDataLoading &&
-                    isGradingIncomplete &&
-                    hasUserStartedGrading && (
-                      <div className='flex items-center gap-1 text-xs text-yellow-600 mt-1'>
-                        <Icon
-                          icon='material-symbols:info'
-                          width={12}
-                          height={12}
-                        />
-                        <span>
-                          Grading belum lengkap, semua telur harus digrading
-                        </span>
-                      </div>
-                    )}
-                  {isDataLoading && (
-                    <div className='flex items-center gap-1 text-xs text-gray-500 mt-1'>
-                      <Icon
-                        icon='material-symbols:hourglass-empty'
-                        width={12}
-                        height={12}
-                      />
-                      <span>Memuat data telur konsumsi baik...</span>
-                    </div>
-                  )}
-                </div>
-              </div>
-            </div>
-          </Card>
-
-          {/* Grading Table */}
-          <Card
-            title='Grading Telur'
-            className={{
-              wrapper: 'w-full mb-4 shadow',
-              title: 'mb-4',
-            }}
-          >
-            <div className='overflow-x-auto'>
-              <table className='table'>
-                <thead>
-                  <tr>
-                    {type !== 'detail' && (
-                      <th>
-                        <CheckboxInput
-                          name='select-all-grading'
-                          checked={
-                            formik.values.eggs_grading?.length ===
-                              selectedGradingItems.length &&
-                            formik.values.eggs_grading?.length > 0
-                          }
-                          onChange={(
-                            e: React.ChangeEvent<HTMLInputElement>
-                          ) => {
-                            if (e.target.checked) {
-                              setSelectedGradingItems(
-                                formik.values.eggs_grading?.map(
-                                  (_, idx) => idx
-                                ) ?? []
-                              );
-                            } else {
-                              setSelectedGradingItems([]);
-                            }
-                          }}
-                          classNames={{
-                            wrapper: 'flex justify-center',
-                            checkbox: 'checkbox checkbox-sm',
-                          }}
-                        />
-                      </th>
-                    )}
-                    <th>
-                      Grade
-                      <span
-                        className='tooltip tooltip-error tooltip-bottom z-[9999]'
-                        data-tip='required'
-                      >
-                        <span className='text-error'>*</span>
-                      </span>
-                    </th>
-                    <th>
-                      Jumlah
-                      <span
-                        className='tooltip tooltip-error tooltip-bottom z-[9999]'
-                        data-tip='required'
-                      >
-                        <span className='text-error'>*</span>
-                      </span>
-                    </th>
-                    {type !== 'detail' && <th>Action</th>}
-                  </tr>
-                </thead>
-                <tbody>
-                  {formik.values.eggs_grading?.map((grading, idx) => (
-                    <tr key={`grading-${idx}`}>
-                      {type !== 'detail' && (
-                        <td className='!align-middle'>
-                          <CheckboxInput
-                            name={`grading-${idx}`}
-                            checked={selectedGradingItems.includes(idx)}
-                            onChange={(
-                              e: React.ChangeEvent<HTMLInputElement>
-                            ) => {
-                              if (e.target.checked) {
-                                setSelectedGradingItems([
-                                  ...selectedGradingItems,
-                                  idx,
-                                ]);
-                              } else {
-                                setSelectedGradingItems(
-                                  selectedGradingItems.filter((i) => i !== idx)
-                                );
-                              }
-                            }}
-                            classNames={{
-                              wrapper: 'flex justify-center',
-                              checkbox: 'checkbox checkbox-sm',
-                            }}
-                          />
-                        </td>
-                      )}
-                      <td>
-                        <SelectInput
-                          required
-                          value={
-                            grading.grade
-                              ? { value: grading.grade, label: grading.grade }
-                              : null
-                          }
-                          onChange={handleGradingGradeChangeWrapper(idx)}
-                          options={[
-                            { value: 'Grade A', label: 'Grade A' },
-                            { value: 'Grade B', label: 'Grade B' },
-                            { value: 'Grade C', label: 'Grade C' },
-                            { value: 'Grade D', label: 'Grade D' },
-                          ]}
-                          placeholder='Pilih Grade'
-                          isError={
-                            isRepeaterInputError('eggs_grading', 'grade', idx)
-                              .isError
-                          }
-                          errorMessage={
-                            isRepeaterInputError('eggs_grading', 'grade', idx)
-                              .errorMessage
-                          }
-                          isDisabled={type === 'detail'}
-                          className={{
-                            wrapper: 'w-full min-w-32',
-                          }}
-                          isSearchable={false}
-                          isClearable={type !== 'detail'}
-                        />
-                      </td>
-                      <td>
-                        <NumberInput
-                          required
-                          name={`eggs_grading.${idx}.qty`}
-                          value={grading.qty}
-                          onChange={handleGradingQtyChangeWrapper(idx)}
-                          onBlur={formik.handleBlur}
-                          decimalScale={0}
-                          allowNegative={false}
-                          thousandSeparator=','
-                          decimalSeparator='.'
-                          isError={
-                            isRepeaterInputError('eggs_grading', 'qty', idx)
-                              .isError ||
-                            (!isDataLoading &&
-                              (isGradingExceedsAvailable ||
-                                (isGradingIncomplete && hasUserStartedGrading)))
-                          }
-                          errorMessage={
-                            isRepeaterInputError('eggs_grading', 'qty', idx)
-                              .errorMessage ||
-                            (!isDataLoading && isGradingExceedsAvailable
-                              ? `Total grading melebihi telur yang tersedia (${totalKonsumsiBaikEggs})`
-                              : !isDataLoading &&
-                                  isGradingIncomplete &&
-                                  hasUserStartedGrading
-                                ? `Total grading (${currentGradingTotal}) harus sama dengan total telur konsumsi baik (${totalKonsumsiBaikEggs})`
-                                : undefined)
-                          }
-                          readOnly={type === 'detail'}
-                          className={{
-                            wrapper: 'w-full min-w-24',
-                          }}
-                          placeholder='Masukkan jumlah telur'
-                        />
-                      </td>
-                      {type !== 'detail' && (
-                        <td>
-                          <div className='flex items-center'>
-                            <Button
-                              type='button'
-                              color='error'
-                              onClick={() => removeGrading(idx)}
-                            >
-                              <Icon
-                                icon='mdi:trash-can'
-                                width={24}
-                                height={24}
-                              />
-                            </Button>
-                          </div>
-                        </td>
-                      )}
-                    </tr>
-                  ))}
-                </tbody>
-              </table>
-            </div>
-            {type !== 'detail' && (
-              <div className='flex justify-center items-center mt-4 gap-4'>
-                {selectedGradingItems.length > 0 && (
-                  <Button
-                    type='button'
-                    color='error'
-                    onClick={removeSelectedGrading}
-                    disabled={selectedGradingItems.length === 0}
-                    className='w-fit'
-                  >
-                    <Icon icon='mdi:trash-can' width={24} height={24} />
-                    Hapus Terpilih ({selectedGradingItems.length})
-                  </Button>
-                )}
-                <Button
-                  type='button'
-                  color='success'
-                  onClick={addGrading}
-                  className='w-fit'
-                >
-                  <Icon icon='ic:round-plus' width={24} height={24} />
-                  Tambah Grading
-                </Button>
-              </div>
-            )}
-          </Card>
-
-          {/* Action buttons */}
-          <div className='flex flex-row justify-between gap-2 flex-wrap'>
-            {type !== 'add' && (
-              <div className='flex flex-row justify-start gap-2'>
-                {deleteRecordingClickHandler && (
-                  <Button
-                    type='button'
-                    color='error'
-                    onClick={deleteRecordingClickHandler}
-                    className='px-4'
-                  >
-                    <Icon
-                      icon='material-symbols:delete-outline-rounded'
-                      width={24}
-                      height={24}
-                      className='justify-start text-sm'
-                    />
-                    Delete
-                  </Button>
-                )}
-                {type !== 'edit' && initialValues && (
-                  <Button
-                    type='button'
-                    color='warning'
-                    href={`/production/recording/grading/edit/?gradingId=${initialValues.id}`}
-                    className='px-4'
-                  >
-                    <Icon
-                      icon='material-symbols:edit-outline'
-                      width={24}
-                      height={24}
-                      className='justify-start text-sm'
-                    />
-                    Edit
-                  </Button>
-                )}
-              </div>
-            )}
-            {type !== 'detail' && (
-              <div
-                className={cn('flex flex-row justify-end gap-2', {
-                  'w-full': type === 'add',
-                })}
-              >
-                <Button
-                  type='reset'
-                  color='warning'
-                  className='px-4'
-                  onClick={(e) => {
-                    formik.handleReset(e);
-                    formik.validateForm();
-                  }}
-                >
-                  Reset
-                </Button>
-                <Button
-                  type='submit'
-                  color='primary'
-                  className='px-4'
-                  isLoading={formik.isSubmitting}
-                  disabled={
-                    !formik.isValid ||
-                    formik.isSubmitting ||
-                    isDataLoading ||
-                    isGradingExceedsAvailable ||
-                    (isGradingIncomplete && hasUserStartedGrading)
-                  }
-                >
-                  Submit
-                </Button>
-              </div>
-            )}
-          </div>
-          {gradingFormErrorMessage && (
-            <div role='alert' className='alert alert-error'>
-              <Icon
-                icon='material-symbols:error-outline'
-                width={24}
-                height={24}
-              />
-              <span>{gradingFormErrorMessage}</span>
-            </div>
-          )}
-        </form>
-      </section>
-
-      {/* ===== MODALS ===== */}
-      {type !== 'add' && (
-        <>
-          <ConfirmationModal
-            ref={deleteModal.ref}
-            type='error'
-            text='Apakah anda yakin ingin menghapus data Grading ini?'
-            secondaryButton={{
-              text: 'Tidak',
-            }}
-            primaryButton={{
-              text: 'Ya',
-              color: 'error',
-              isLoading: isDeleteLoading,
-              onClick: confirmationModalDeleteClickHandler,
-            }}
-          />
-        </>
-      )}
-    </>
-  );
-};
-
-export default GradingForm;
diff --git a/src/components/pages/purchase/PurchaseTable.tsx b/src/components/pages/purchase/PurchaseTable.tsx
index bf59d5ee..a77e1158 100644
--- a/src/components/pages/purchase/PurchaseTable.tsx
+++ b/src/components/pages/purchase/PurchaseTable.tsx
@@ -16,7 +16,7 @@ import RowDropdownOptions from '@/components/table/RowDropdownOptions';
 import RowCollapseOptions from '@/components/table/RowCollapseOptions';
 import RowOptionsMenuWrapper from '@/components/table/RowOptionsMenuWrapper';
 
-import { cn, formatDate, formatCurrency } from '@/lib/helper';
+import { cn, formatDate } from '@/lib/helper';
 import { isResponseSuccess } from '@/lib/api-helper';
 
 import { useTableFilter } from '@/services/hooks/useTableFilter';
@@ -136,14 +136,6 @@ const PurchaseTable = () => {
           ? formatDate(props.row.original.po_date, 'DD MMM YYYY')
           : '-',
     },
-    {
-      accessorKey: 'due_date',
-      header: 'Jatuh Tempo',
-      cell: (props) =>
-        props.row.original.due_date
-          ? formatDate(props.row.original.due_date, 'DD MMM YYYY')
-          : '-',
-    },
     {
       header: 'Aging',
       cell: (props) => {
@@ -156,11 +148,6 @@ const PurchaseTable = () => {
         return `${diffDays} hari`;
       },
     },
-    {
-      accessorKey: 'grand_total',
-      header: 'Total (Rp.)',
-      cell: (props) => formatCurrency(props.row.original.grand_total),
-    },
     {
       header: 'Aksi',
       cell: (props) => {
diff --git a/src/components/pages/purchase/form/order/PurchaseOrderAcceptApprovalForm.tsx b/src/components/pages/purchase/form/order/PurchaseOrderAcceptApprovalForm.tsx
index 79762da9..15106c5e 100644
--- a/src/components/pages/purchase/form/order/PurchaseOrderAcceptApprovalForm.tsx
+++ b/src/components/pages/purchase/form/order/PurchaseOrderAcceptApprovalForm.tsx
@@ -52,6 +52,8 @@ const PurchaseOrderAcceptApprovalForm = ({
   const [purchaseOrderFormErrorMessage, setPurchaseOrderFormErrorMessage] =
     useState('');
 
+  const isRejected = initialValues?.latest_approval?.action === 'REJECTED';
+
   // ===== UTILITY FUNCTIONS =====
   const isRepeaterInputError = (
     idx: number,
@@ -64,7 +66,6 @@ const PurchaseOrderAcceptApprovalForm = ({
       | 'expedition_vendor_id'
       | 'received_qty'
       | 'transport_per_item'
-      | 'transport_total'
   ): { isError: boolean; errorMessage: string } => {
     const touchedItem = formik.touched.items?.[idx];
     const errorItem = formik.errors.items?.[idx] as
@@ -163,6 +164,7 @@ const PurchaseOrderAcceptApprovalForm = ({
     validateOnBlur: true,
     onSubmit: async (values) => {
       const payload: CreateAcceptApprovalRequestPayload = {
+        action: 'APPROVED',
         notes: values.notes || '',
         items:
           values.items?.map((formItem) => {
@@ -181,10 +183,6 @@ const PurchaseOrderAcceptApprovalForm = ({
                 typeof formItem.transport_per_item === 'string'
                   ? parseFloat(formItem.transport_per_item) || 0
                   : formItem.transport_per_item || 0,
-              transport_total:
-                typeof formItem.transport_total === 'string'
-                  ? parseFloat(formItem.transport_total) || 0
-                  : formItem.transport_total || 0,
             };
           }) || [],
       };
@@ -239,9 +237,8 @@ const PurchaseOrderAcceptApprovalForm = ({
           vehicle_number: item.vehicle_number || '',
           expedition_vendor: null,
           expedition_vendor_id: 0,
-          received_qty: '',
+          received_qty: item.total_qty || '',
           transport_per_item: '',
-          transport_total: '',
         };
       });
       formik.setFieldValue('items', updatedItems);
@@ -301,7 +298,7 @@ const PurchaseOrderAcceptApprovalForm = ({
   // ===== PURCHASE ITEM OPERATIONS =====
   const handlePurchaseItemChange = (
     idx: number,
-    field: 'received_qty' | 'transport_per_item' | 'transport_total',
+    field: 'received_qty' | 'transport_per_item',
     value: string | number
   ) => {
     const numValue = typeof value === 'string' ? parseFloat(value) || 0 : value;
@@ -318,26 +315,6 @@ const PurchaseOrderAcceptApprovalForm = ({
           : parseFloat(
               formik.values.items?.[idx]?.transport_per_item as string
             ) || 0;
-
-      if (receivedQty > 0 && transportPerItem >= 0) {
-        const calculatedTransportTotal = receivedQty * transportPerItem;
-        formik.setFieldValue(
-          `items.${idx}.transport_total`,
-          calculatedTransportTotal
-        );
-      }
-    }
-
-    if (field === 'transport_total') {
-      const receivedQty =
-        parseFloat(formik.values.items?.[idx]?.received_qty as string) || 0;
-      if (receivedQty > 0 && numValue >= 0) {
-        const calculatedTransportPerItem = numValue / receivedQty;
-        formik.setFieldValue(
-          `items.${idx}.transport_per_item`,
-          calculatedTransportPerItem
-        );
-      }
     }
   };
 
@@ -386,10 +363,6 @@ const PurchaseOrderAcceptApprovalForm = ({
                   Transport/Item
                   <span className='text-error'>*</span>
                 </th>
-                <th>
-                  Total Transport
-                  <span className='text-error'>*</span>
-                </th>
               </tr>
             </thead>
             <tbody>
@@ -657,37 +630,6 @@ const PurchaseOrderAcceptApprovalForm = ({
                         }}
                       />
                     </td>
-                    <td>
-                      <NumberInput
-                        required
-                        name={`items.${idx}.transport_total`}
-                        value={formItem?.transport_total || ''}
-                        onChange={(e) =>
-                          handlePurchaseItemChange(
-                            idx,
-                            'transport_total',
-                            e.target.value
-                          )
-                        }
-                        onBlur={formik.handleBlur}
-                        placeholder='Masukkan total transport'
-                        allowNegative={false}
-                        decimalScale={2}
-                        thousandSeparator=','
-                        decimalSeparator='.'
-                        inputPrefix={'Rp'}
-                        isError={
-                          isRepeaterInputError(idx, 'transport_total').isError
-                        }
-                        errorMessage={
-                          isRepeaterInputError(idx, 'transport_total')
-                            .errorMessage
-                        }
-                        className={{
-                          wrapper: 'min-w-40 md:min-w-52 lg:min-w-64',
-                        }}
-                      />
-                    </td>
                   </tr>
                 );
               })}
@@ -732,7 +674,8 @@ const PurchaseOrderAcceptApprovalForm = ({
               disabled={
                 !formik.isValid ||
                 formik.isSubmitting ||
-                hasQuantityExceededErrors
+                hasQuantityExceededErrors ||
+                isRejected
               }
             >
               Submit
diff --git a/src/components/pages/purchase/form/order/PurchaseOrderForm.schema.ts b/src/components/pages/purchase/form/order/PurchaseOrderForm.schema.ts
index 96836bc6..c7da956d 100644
--- a/src/components/pages/purchase/form/order/PurchaseOrderForm.schema.ts
+++ b/src/components/pages/purchase/form/order/PurchaseOrderForm.schema.ts
@@ -23,10 +23,12 @@ type PurchaseRequestStaffApprovalFormSchemaType = {
 };
 
 type PurchaseRequestManagerApprovalFormSchemaType = {
+  action: 'APPROVED' | 'REJECTED';
   notes: string | null;
 };
 
 type PurchaseRequestAcceptApprovalFormSchemaType = {
+  action: 'APPROVED' | 'REJECTED';
   notes: string | null;
   items: {
     purchase_item?: {
@@ -45,7 +47,6 @@ type PurchaseRequestAcceptApprovalFormSchemaType = {
     expedition_vendor_id: number;
     received_qty: number | string;
     transport_per_item: number | string;
-    transport_total: number | string;
   }[];
 };
 
@@ -83,7 +84,6 @@ export type PurchaseAcceptApprovalItemSchema = {
   expedition_vendor_id: number;
   received_qty: number | string;
   transport_per_item: number | string;
-  transport_total: number | string;
 };
 
 export type PurchaseDeleteItemsSchema = {
@@ -152,6 +152,10 @@ const PurchaseStaffApprovalItemObjectSchema: Yup.ObjectSchema<PurchaseStaffAppro
 
 const PurchaseManagerApprovalObjectSchema: Yup.ObjectSchema<PurchaseRequestManagerApprovalFormSchemaType> =
   Yup.object({
+    action: Yup.mixed<'APPROVED' | 'REJECTED'>()
+      .oneOf(['APPROVED', 'REJECTED'], 'Action harus APPROVED atau REJECTED')
+      .required('Action wajib diisi!')
+      .default('APPROVED'),
     notes: Yup.string().nullable().default(null),
   });
 
@@ -230,20 +234,6 @@ const PurchaseAcceptApprovalItemObjectSchema: Yup.ObjectSchema<PurchaseAcceptApp
         }
       )
       .typeError('Biaya transport per item harus berupa angka!'),
-    transport_total: Yup.mixed<string | number>()
-      .required('Total biaya transport wajib diisi!')
-      .test(
-        'is-valid-transport-total',
-        'Total biaya transport harus berupa angka lebih dari atau sama dengan 0!',
-        function (value) {
-          if (value === '' || value === null || value === undefined)
-            return false;
-          const numValue =
-            typeof value === 'string' ? parseFloat(value) : value;
-          return !isNaN(numValue) && numValue >= 0;
-        }
-      )
-      .typeError('Total biaya transport harus berupa angka!'),
   });
 
 export const PurchaseRequestStaffApprovalFormSchema: Yup.ObjectSchema<PurchaseRequestStaffApprovalFormSchemaType> =
@@ -368,6 +358,7 @@ export const PurchaseRequestManagerApprovalFormDefaultValues = (
   purchase?: Purchase
 ): PurchaseRequestManagerApprovalFormSchemaType => {
   return {
+    action: 'APPROVED',
     notes: purchase?.notes ?? null,
   };
 };
@@ -378,6 +369,10 @@ export type PurchaseRequestManagerApprovalFormValues = Yup.InferType<
 
 export const PurchaseRequestAcceptApprovalFormSchema: Yup.ObjectSchema<PurchaseRequestAcceptApprovalFormSchemaType> =
   Yup.object({
+    action: Yup.mixed<'APPROVED' | 'REJECTED'>()
+      .oneOf(['APPROVED', 'REJECTED'], 'Action harus APPROVED atau REJECTED')
+      .required('Action wajib diisi!')
+      .default('APPROVED'),
     notes: Yup.string().nullable().default(null),
     items: Yup.array()
       .of(PurchaseAcceptApprovalItemObjectSchema)
@@ -388,6 +383,7 @@ export const PurchaseRequestAcceptApprovalFormSchema: Yup.ObjectSchema<PurchaseR
 
 export const PurchaseRequestAcceptApprovalFormInitialValues: PurchaseRequestAcceptApprovalFormSchemaType =
   {
+    action: 'APPROVED',
     notes: '',
     items: [
       {
@@ -399,7 +395,6 @@ export const PurchaseRequestAcceptApprovalFormInitialValues: PurchaseRequestAcce
         expedition_vendor_id: 0,
         received_qty: '',
         transport_per_item: '',
-        transport_total: '',
       },
     ],
   };
@@ -408,6 +403,7 @@ export const PurchaseRequestAcceptApprovalFormDefaultValues = (
   purchase?: Purchase
 ): PurchaseRequestAcceptApprovalFormSchemaType => {
   return {
+    action: 'APPROVED',
     notes: purchase?.notes ?? null,
     items: purchase?.items
       ? purchase.items.map((item) => ({
@@ -419,7 +415,6 @@ export const PurchaseRequestAcceptApprovalFormDefaultValues = (
           expedition_vendor_id: 0,
           received_qty: '',
           transport_per_item: '',
-          transport_total: '',
         }))
       : [
           {
@@ -431,7 +426,6 @@ export const PurchaseRequestAcceptApprovalFormDefaultValues = (
             expedition_vendor_id: 0,
             received_qty: '',
             transport_per_item: '',
-            transport_total: '',
           },
         ],
   };
diff --git a/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx b/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx
index 791e2592..1fcd7a94 100644
--- a/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx
+++ b/src/components/pages/purchase/form/order/PurchaseOrderStaffApprovalForm.tsx
@@ -61,7 +61,7 @@ const PurchaseOrderStaffApprovalForm = ({
       return 'add';
     }
 
-    const currentStep = initialValues?.approval?.step_number || 1;
+    const currentStep = initialValues?.latest_approval?.step_number || 1;
 
     switch (currentStep) {
       case 1:
@@ -77,7 +77,9 @@ const PurchaseOrderStaffApprovalForm = ({
         // Step 4+ (Penerimaan Barang dan selesai), tidak boleh edit kalau sudah disetujui
         return 'edit';
     }
-  }, [rawDataApprovals, propType, initialValues?.approval?.step_number]);
+  }, [rawDataApprovals, propType, initialValues?.latest_approval?.step_number]);
+
+  const isRejected = initialValues?.latest_approval?.action === 'REJECTED';
 
   const router = useRouter();
   const searchParams = useSearchParams();
@@ -93,16 +95,16 @@ const PurchaseOrderStaffApprovalForm = ({
 
   // ===== UTILITY FUNCTIONS =====
   const canUpdatePurchaseItems = useMemo(() => {
-    if (!initialValues?.approval) return false;
+    if (!initialValues?.latest_approval) return false;
 
-    const currentStep = initialValues.approval.step_number;
+    const currentStep = initialValues.latest_approval.step_number;
     return currentStep >= 3;
-  }, [initialValues?.approval]);
+  }, [initialValues?.latest_approval]);
 
   const canShowDeleteAddButtons = useMemo(() => {
-    if (!initialValues?.approval) return false;
+    if (!initialValues?.latest_approval) return false;
 
-    const currentStep = initialValues.approval.step_number;
+    const currentStep = initialValues.latest_approval.step_number;
 
     // Step 2 (Staff Purchase) dengan mode 'add' tidak boleh add/delete items
     // User hanya boleh input harga dan total harga untuk items yang sudah ada
@@ -112,7 +114,7 @@ const PurchaseOrderStaffApprovalForm = ({
 
     // Step 3 (Manager Purchase) boleh add/delete items
     return currentStep === 3;
-  }, [initialValues?.approval, type]);
+  }, [initialValues?.latest_approval, type]);
 
   const isRepeaterInputError = (
     idx: number,
@@ -312,7 +314,9 @@ const PurchaseOrderStaffApprovalForm = ({
         const isNewItemForm =
           !formItem.purchase_item_id || formItem.purchase_item_id === 0;
 
-        let cleanPayload: UpdateStaffApprovalRequestPayload['items'][0];
+        let cleanPayload: NonNullable<
+          UpdateStaffApprovalRequestPayload['items']
+        >[0];
 
         if (isNewItemForm) {
           cleanPayload = {
@@ -360,7 +364,9 @@ const PurchaseOrderStaffApprovalForm = ({
           const isNewItemForm =
             !formItem.purchase_item_id || formItem.purchase_item_id === 0;
 
-          let cleanPayload: UpdateStaffApprovalRequestPayload['items'][0];
+          let cleanPayload: NonNullable<
+            UpdateStaffApprovalRequestPayload['items']
+          >[0];
 
           if (isNewItemForm) {
             cleanPayload = {
@@ -719,7 +725,10 @@ const PurchaseOrderStaffApprovalForm = ({
                                           'min-w-52 md:min-w-72 lg:min-w-80',
                                       }}
                                       bottomLabel={
-                                        'Previous: ' + purchaseItem.product.name
+                                        type === 'edit'
+                                          ? 'Previous: ' +
+                                            purchaseItem.product.name
+                                          : undefined
                                       }
                                     />
                                   </td>
@@ -819,7 +828,11 @@ const PurchaseOrderStaffApprovalForm = ({
                                       thousandSeparator=','
                                       decimalSeparator='.'
                                       inputPrefix={'Rp'}
-                                      bottomLabel={`Previous: Rp${formatNumber(initialValues?.items?.find((item) => item.id === purchaseItem.id)?.price || 0, 'id-ID', 2, 2)}`}
+                                      bottomLabel={
+                                        type === 'edit'
+                                          ? `Previous: Rp${formatNumber(initialValues?.items?.find((item) => item.id === purchaseItem.id)?.price || 0, 'id-ID', 2, 2)}`
+                                          : undefined
+                                      }
                                       isError={
                                         isRepeaterInputError(
                                           formItemIndex,
@@ -857,7 +870,11 @@ const PurchaseOrderStaffApprovalForm = ({
                                       thousandSeparator=','
                                       decimalSeparator='.'
                                       inputPrefix={'Rp'}
-                                      bottomLabel={`Previous: Rp${formatNumber(initialValues?.items?.find((item) => item.id === purchaseItem.id)?.total_price || 0, 'id-ID', 2, 2)}`}
+                                      bottomLabel={
+                                        type === 'edit'
+                                          ? `Previous: Rp${formatNumber(initialValues?.items?.find((item) => item.id === purchaseItem.id)?.total_price || 0, 'id-ID', 2, 2)}`
+                                          : undefined
+                                      }
                                       isError={
                                         isRepeaterInputError(
                                           formItemIndex,
@@ -1131,7 +1148,7 @@ const PurchaseOrderStaffApprovalForm = ({
                 color='primary'
                 className='px-4'
                 isLoading={formik.isSubmitting}
-                disabled={!formik.isValid || formik.isSubmitting}
+                disabled={!formik.isValid || formik.isSubmitting || isRejected}
               >
                 Submit
               </Button>
diff --git a/src/components/pages/purchase/form/request/PurchaseRequestForm.schema.ts b/src/components/pages/purchase/form/request/PurchaseRequestForm.schema.ts
index 414371c3..67a694bc 100644
--- a/src/components/pages/purchase/form/request/PurchaseRequestForm.schema.ts
+++ b/src/components/pages/purchase/form/request/PurchaseRequestForm.schema.ts
@@ -78,14 +78,14 @@ export const PurchaseRequestFormSchema: Yup.ObjectSchema<PurchaseRequestFormSche
       value: Yup.number().min(1).required(),
       label: Yup.string().required(),
     }).nullable(),
-    credit_term: Yup.number()
-      .required('Jangka waktu kredit wajib diisi!')
-      .min(0, 'Jangka waktu kredit tidak boleh kurang dari 0!')
-      .typeError('Jangka waktu kredit wajib diisi!'),
     supplier_id: Yup.number()
       .required('Supplier wajib dipilih!')
       .min(1, 'Supplier wajib dipilih!')
       .typeError('Supplier wajib dipilih!'),
+    credit_term: Yup.number()
+      .required('Jangka waktu kredit wajib diisi!')
+      .min(0, 'Jangka waktu kredit tidak boleh kurang dari 0!')
+      .typeError('Jangka waktu kredit wajib diisi!'),
     area: Yup.object({
       value: Yup.number().min(1).required(),
       label: Yup.string().required(),
diff --git a/src/components/pages/purchase/order/PurchaseOrderDetail.tsx b/src/components/pages/purchase/order/PurchaseOrderDetail.tsx
index 2f3bbfb0..35d9e104 100644
--- a/src/components/pages/purchase/order/PurchaseOrderDetail.tsx
+++ b/src/components/pages/purchase/order/PurchaseOrderDetail.tsx
@@ -27,6 +27,7 @@ import PurchaseOrderInvoice from '@/components/pages/purchase/order/PurchaseOrde
 
 import Card from '@/components/Card';
 import {
+  CreateAcceptApprovalRequestPayload,
   CreateManagerApprovalRequestPayload,
   CreateStaffApprovalRequestPayload,
   Purchase,
@@ -88,6 +89,8 @@ const PurchaseOrderDetail = ({
   const staffApprovalModal = useModal();
   const staffRejectionModal = useModal();
   const acceptApprovalModal = useModal();
+  const acceptRejectionModal = useModal();
+  const managerRejectionModal = useModal();
   const editModal = useModal();
   const penerimaanBarangModal = useModal();
   const deleteModal = useModal();
@@ -156,9 +159,9 @@ const PurchaseOrderDetail = ({
   }, [goodsReceiptItems]);
 
   const approvalStep = useMemo(() => {
-    if (!initialValues?.approval) return null;
-    return initialValues.approval.step_number;
-  }, [initialValues?.approval]);
+    if (!initialValues?.latest_approval) return null;
+    return initialValues.latest_approval.step_number;
+  }, [initialValues?.latest_approval]);
 
   const {
     approvals,
@@ -166,7 +169,7 @@ const PurchaseOrderDetail = ({
     rawDataApprovals,
     refresh: refreshApprovals,
   } = useApprovalSteps({
-    latestApproval: initialValues?.approval,
+    latestApproval: initialValues?.latest_approval,
     approvalLines: PURCHASE_ORDER_APPROVAL_LINE,
     moduleName: 'PURCHASES',
     moduleId: initialValues?.id?.toString() ?? '',
@@ -177,19 +180,22 @@ const PurchaseOrderDetail = ({
   });
 
   const showApprovalButton =
-    approvalStep !== null && approvalStep >= 1 && approvalStep <= 3;
+    approvalStep !== null &&
+    approvalStep >= 1 &&
+    approvalStep <= 3 &&
+    initialValues?.latest_approval?.action !== 'REJECTED';
 
   const canDeleteItems = useMemo(() => {
-    if (!initialValues?.approval) return false;
+    if (!initialValues?.latest_approval) return false;
 
-    const currentStep = initialValues.approval.step_number;
+    const currentStep = initialValues.latest_approval.step_number;
 
     const hasReachedStep5 = rawDataApprovals?.some(
       (approval) => approval.step_number === 5
     );
 
     return currentStep === 3 && !hasReachedStep5;
-  }, [initialValues?.approval, rawDataApprovals]);
+  }, [initialValues?.latest_approval, rawDataApprovals]);
 
   const handleApprovalClick = () => {
     if (!approvalStep) return;
@@ -216,24 +222,30 @@ const PurchaseOrderDetail = ({
       case 1:
         staffRejectionModal.openModal();
         break;
+      case 2:
+        managerRejectionModal.openModal();
+        break;
+      case 3:
+        acceptRejectionModal.openModal();
+        break;
       default:
         break;
     }
   };
 
   const canShowPurchaseOrderInvoice = useMemo(() => {
-    if (!initialValues?.approval) return false;
+    if (!initialValues?.latest_approval) return false;
 
-    const currentStep = initialValues.approval.step_number;
+    const currentStep = initialValues.latest_approval.step_number;
     return currentStep >= 3;
-  }, [initialValues?.approval]);
+  }, [initialValues?.latest_approval]);
 
   const canShowPenerimaanBarang = useMemo(() => {
-    if (!initialValues?.approval) return false;
+    if (!initialValues?.latest_approval) return false;
 
-    const currentStep = initialValues.approval.step_number;
+    const currentStep = initialValues.latest_approval.step_number;
     return currentStep === 5;
-  }, [initialValues?.approval]);
+  }, [initialValues?.latest_approval]);
 
   const totalBeforeTax = useMemo(() => {
     return purchaseOrderItems.reduce(
@@ -296,6 +308,33 @@ const PurchaseOrderDetail = ({
     [initialValues?.id, searchParams, refetchData]
   );
 
+  const createAcceptApprovalHandler = useCallback(
+    async (payload: CreateAcceptApprovalRequestPayload) => {
+      const purchaseRequestId = searchParams.get('purchaseId')
+        ? parseInt(searchParams.get('purchaseId')!)
+        : initialValues?.id || 1;
+
+      if (!purchaseRequestId) {
+        toast.error('Purchase Request ID is required');
+        return;
+      }
+
+      const res = await PurchaseApi.acceptApproval.create(
+        purchaseRequestId,
+        payload
+      );
+
+      if (isResponseError(res)) {
+        toast.error(res.message);
+        return;
+      }
+      toast.success(res?.message as string);
+      refreshApprovals();
+      refetchData?.();
+    },
+    [initialValues?.id, searchParams, refreshApprovals, refetchData]
+  );
+
   // ===== MODAL HANDLERS =====
   const handleStaffApprovalModalClose = useCallback(() => {
     refreshApprovals();
@@ -544,11 +583,6 @@ const PurchaseOrderDetail = ({
       accessorKey: 'transport_per_item',
       cell: (props) => formatCurrency(props.getValue() as number),
     },
-    {
-      header: 'Transport Total',
-      accessorKey: 'transport_total',
-      cell: (props) => formatCurrency(props.getValue() as number),
-    },
   ];
 
   const summaryData = [
@@ -647,7 +681,7 @@ const PurchaseOrderDetail = ({
             <div className='space-y-4'>
               <div className='group'>
                 <div className='flex items-start'>
-                  <span className='font-medium text-gray-600 min-w-[140px] flex-shrink-0'>
+                  <span className='font-medium text-gray-600 min-w-[140px] shrink-0'>
                     Area
                   </span>
                   <span className='text-gray-900 ml-3 break-all'>
@@ -657,7 +691,7 @@ const PurchaseOrderDetail = ({
               </div>
               <div className='group'>
                 <div className='flex items-start'>
-                  <span className='font-medium text-gray-600 min-w-[140px] flex-shrink-0'>
+                  <span className='font-medium text-gray-600 min-w-[140px] shrink-0'>
                     Lokasi
                   </span>
                   <span className='text-gray-900 ml-3 break-all'>
@@ -671,7 +705,7 @@ const PurchaseOrderDetail = ({
               </div>
               <div className='group'>
                 <div className='flex items-start'>
-                  <span className='font-medium text-gray-600 min-w-[140px] flex-shrink-0'>
+                  <span className='font-medium text-gray-600 min-w-[140px] shrink-0'>
                     Gudang
                   </span>
                   <span className='text-gray-900 ml-3 break-all'>
@@ -685,7 +719,7 @@ const PurchaseOrderDetail = ({
             <div className='space-y-4'>
               <div className='group'>
                 <div className='flex items-start'>
-                  <span className='font-medium text-gray-600 min-w-[140px] flex-shrink-0'>
+                  <span className='font-medium text-gray-600 min-w-[140px] shrink-0'>
                     Nama Vendor
                   </span>
                   <span className='text-gray-900 font-medium ml-3 break-all'>
@@ -696,7 +730,7 @@ const PurchaseOrderDetail = ({
               </div>
               <div className='group'>
                 <div className='flex items-start'>
-                  <span className='font-medium text-gray-600 min-w-[140px] flex-shrink-0'>
+                  <span className='font-medium text-gray-600 min-w-[140px] shrink-0'>
                     Kategori Vendor
                   </span>
                   <span className='text-gray-900 ml-3 break-all'>
@@ -706,18 +740,7 @@ const PurchaseOrderDetail = ({
               </div>
               <div className='group'>
                 <div className='flex items-start'>
-                  <span className='font-medium text-gray-600 min-w-[140px] flex-shrink-0'>
-                    Tgl. Jatuh Tempo
-                  </span>
-                  <span className='text-gray-900 ml-3 break-all'>
-                    : {formatDate(purchaseData.due_date, 'D MMM YYYY')} (
-                    {purchaseData.credit_term} hari)
-                  </span>
-                </div>
-              </div>
-              <div className='group'>
-                <div className='flex items-start'>
-                  <span className='font-medium text-gray-600 min-w-[140px] flex-shrink-0'>
+                  <span className='font-medium text-gray-600 min-w-[140px] shrink-0'>
                     Nomor
                   </span>
                   <span className='text-gray-900 ml-3 break-all'>
@@ -727,7 +750,7 @@ const PurchaseOrderDetail = ({
               </div>
               <div className='group'>
                 <div className='flex items-start'>
-                  <span className='font-medium text-gray-600 min-w-[140px] flex-shrink-0'>
+                  <span className='font-medium text-gray-600 min-w-[140px] shrink-0'>
                     Nomor PO
                   </span>
                   <div className='ml-3'>
@@ -925,6 +948,7 @@ const PurchaseOrderDetail = ({
           color: 'success',
           onClick: async (notes) => {
             const payload: CreateManagerApprovalRequestPayload = {
+              action: 'APPROVED',
               notes: notes || null,
             };
 
@@ -1028,7 +1052,6 @@ const PurchaseOrderDetail = ({
             const payload: CreateStaffApprovalRequestPayload = {
               action: 'REJECTED',
               notes: notes || null,
-              items: [],
             };
 
             await createStaffApprovalHandler(payload);
@@ -1041,6 +1064,60 @@ const PurchaseOrderDetail = ({
         }}
       />
 
+      {/* Accept Rejection Modal */}
+      <ConfirmationModalWithNotes
+        ref={acceptRejectionModal.ref}
+        type='error'
+        text='Apakah Anda yakin ingin menolak (reject) penerimaan barang ini?'
+        placeholder='(Opsional) Masukkan alasan penolakan...'
+        rows={4}
+        closeOnBackdrop
+        primaryButton={{
+          text: 'Ya, Tolak',
+          color: 'error',
+          onClick: async (notes) => {
+            const payload: CreateAcceptApprovalRequestPayload = {
+              action: 'REJECTED',
+              notes: notes || null,
+            };
+
+            await createAcceptApprovalHandler(payload);
+            await refetchData?.();
+            acceptRejectionModal.closeModal();
+          },
+        }}
+        secondaryButton={{
+          text: 'Batal',
+        }}
+      />
+
+      {/* Manager Rejection Modal */}
+      <ConfirmationModalWithNotes
+        ref={managerRejectionModal.ref}
+        type='error'
+        text='Apakah Anda yakin ingin menolak (reject) approval manajer untuk permintaan pembelian ini?'
+        placeholder='(Opsional) Masukkan alasan penolakan...'
+        rows={4}
+        closeOnBackdrop
+        primaryButton={{
+          text: 'Ya, Tolak',
+          color: 'error',
+          onClick: async (notes) => {
+            const payload: CreateManagerApprovalRequestPayload = {
+              action: 'REJECTED',
+              notes: notes || null,
+            };
+
+            await createManagerApprovalHandler(payload);
+            await refetchData?.();
+            managerRejectionModal.closeModal();
+          },
+        }}
+        secondaryButton={{
+          text: 'Batal',
+        }}
+      />
+
       {/* Delete Confirmation Modal */}
       <ConfirmationModal
         ref={deleteModal.ref}
diff --git a/src/config/approval-line.ts b/src/config/approval-line.ts
index 3af866c6..48b1268b 100644
--- a/src/config/approval-line.ts
+++ b/src/config/approval-line.ts
@@ -51,14 +51,10 @@ export const MARKETING_APPROVAL_LINE: ApprovalLine = [
 export const RECORDING_APPROVAL_LINE: ApprovalLine = [
   {
     step_number: 1,
-    step_name: 'Grading-Telur',
-  },
-  {
-    step_number: 2,
     step_name: 'Pengajuan',
   },
   {
-    step_number: 3,
+    step_number: 2,
     step_name: 'Disetujui',
   },
 ] as const;
@@ -66,14 +62,10 @@ export const RECORDING_APPROVAL_LINE: ApprovalLine = [
 export const GROWING_RECORDING_APPROVAL_LINE: ApprovalLine = [
   {
     step_number: 1,
-    step_name: 'Grading-Telur',
-  },
-  {
-    step_number: 2,
     step_name: 'Pengajuan',
   },
   {
-    step_number: 3,
+    step_number: 2,
     step_name: 'Disetujui',
   },
 ] as const;
@@ -81,14 +73,10 @@ export const GROWING_RECORDING_APPROVAL_LINE: ApprovalLine = [
 export const LAYING_RECORDING_APPROVAL_LINE: ApprovalLine = [
   {
     step_number: 1,
-    step_name: 'Grading-Telur',
-  },
-  {
-    step_number: 2,
     step_name: 'Pengajuan',
   },
   {
-    step_number: 3,
+    step_number: 2,
     step_name: 'Disetujui',
   },
 ] as const;
diff --git a/src/config/constant.ts b/src/config/constant.ts
index 65016462..196afc18 100644
--- a/src/config/constant.ts
+++ b/src/config/constant.ts
@@ -244,14 +244,10 @@ export const APPROVAL_WORKFLOWS = [
     steps: [
       {
         step_number: 1,
-        step_name: 'Grading-Telur',
-      },
-      {
-        step_number: 2,
         step_name: 'Pengajuan',
       },
       {
-        step_number: 3,
+        step_number: 2,
         step_name: 'Disetujui',
       },
     ],
diff --git a/src/lib/auth-helper.ts b/src/lib/auth-helper.ts
index 97d31a9f..bf05b70e 100644
--- a/src/lib/auth-helper.ts
+++ b/src/lib/auth-helper.ts
@@ -10,9 +10,9 @@ export const redirectToSSO = () => {
   const lastRedirect = sessionStorage.getItem('auth_redirect_timestamp');
   const now = Date.now();
 
-  // Loop protection: allow redirect only if last one was > 2 seconds ago
+  // Loop protection: allow redirect only if last one was > 5 seconds ago
   // or if no redirect has happened yet.
-  if (!lastRedirect || now - parseInt(lastRedirect, 10) > 2000) {
+  if (!lastRedirect || now - parseInt(lastRedirect, 10) > 5000) {
     sessionStorage.setItem('auth_redirect_timestamp', now.toString());
     // const ssoLoginUrl = `${process.env.NEXT_PUBLIC_SSO_LOGIN_URL as string}?redirect_url=${window.location.href}`;
 
diff --git a/src/services/api/production.ts b/src/services/api/production.ts
index 110a881c..8e66d57e 100644
--- a/src/services/api/production.ts
+++ b/src/services/api/production.ts
@@ -9,8 +9,6 @@ import {
   CreateRecordingPayload,
   Recording,
   UpdateRecordingPayload,
-  CreateGradingPayload,
-  UpdateGradingPayload,
   NextDayRecording,
 } from '@/types/api/production/recording';
 import { ProjectFlockKandang } from '@/types/api/production/project-flock-kandang';
@@ -64,28 +62,6 @@ export class RecordingService extends BaseApiService<
     });
   }
 
-  async createGrading(
-    payload: CreateGradingPayload
-  ): Promise<BaseApiResponse<unknown> | undefined> {
-    return await this.customRequest<BaseApiResponse<unknown>>('gradings', {
-      method: 'POST',
-      payload,
-    });
-  }
-
-  async updateGrading(
-    gradingId: number,
-    payload: UpdateGradingPayload
-  ): Promise<BaseApiResponse<unknown> | undefined> {
-    return await this.customRequest<BaseApiResponse<unknown>>(
-      `gradings/${gradingId}`,
-      {
-        method: 'PUT',
-        payload,
-      }
-    );
-  }
-
   async deleteGrading(
     gradingId: number
   ): Promise<BaseApiResponse<unknown> | undefined> {
diff --git a/src/types/api/production/recording.d.ts b/src/types/api/production/recording.d.ts
index e7b28f47..9bed7685 100644
--- a/src/types/api/production/recording.d.ts
+++ b/src/types/api/production/recording.d.ts
@@ -9,8 +9,7 @@ export type ProductionMetrics = {
   cum_intake: number;
   fcr_value: number;
   total_chick_qty: number;
-  daily_depletion_rate?: number;
-  cum_depletion?: number;
+  cum_depletion: number;
 };
 
 export type BaseRecording = {
@@ -18,42 +17,33 @@ export type BaseRecording = {
   project_flock_kandang_id: number;
   record_datetime: string;
   day: number;
-  created_by: User;
+  project_flock_category?: 'GROWING' | 'LAYING';
 } & ProductionMetrics;
 
 export type RecordingBW = {
-  id: number;
-  recording_id: number;
   avg_weight: number;
   qty: number;
   total_weight: number;
 };
 
 export type RecordingDepletion = {
-  id: number;
-  recording_id: number;
   product_warehouse_id: number;
   qty: number;
   product_warehouse: ProductWarehouse;
 };
 
 export type RecordingStock = {
-  id: number;
-  recording_id: number;
   product_warehouse_id: number;
   usage_amount?: number;
-  usage_qty: number;
-  qty: number;
   pending_qty: number;
   product_warehouse: ProductWarehouse;
 };
 
 export type RecordingEgg = {
   id: number;
-  recording_id: number;
   product_warehouse_id: number;
   qty: number;
-  created_by: User;
+  weight: number;
   product_warehouse: ProductWarehouse;
   gradings?: {
     grade: string;
@@ -71,19 +61,12 @@ export type GradingEgg = {
 
 export type Recording = BaseMetadata &
   BaseRecording & {
-    project_flock_category?: 'GROWING' | 'LAYING';
     approval?: BaseApproval;
-    egg_grading_status?: string | null;
-    egg_grading_pending_qty?: number | null;
-    egg_grading_completed_qty?: number | null;
+    created_user: User;
     body_weights?: RecordingBW[];
     depletions?: RecordingDepletion[];
     stocks?: RecordingStock[];
     eggs?: RecordingEgg[];
-    recording_bws?: RecordingBW[];
-    recording_depletions?: RecordingDepletion[];
-    recording_stocks?: RecordingStock[];
-    recording_eggs?: RecordingEgg[];
     grading_eggs?: GradingEgg[];
   };
 
@@ -108,27 +91,10 @@ export type CreateGrowingRecordingPayload = {
   }[];
 };
 
-export type CreateGradingPayload = {
-  eggs_grading: {
-    recording_egg_id: number;
-    grade: string;
-    qty: number;
-  }[];
-};
-
-export type UpdateGradingPayload = CreateGradingPayload;
-
-export type CreateGradingRecordingPayload = {
-  eggs_grading: {
-    recording_egg_id: number;
-    grade: string;
-    qty: number;
-  }[];
-};
-
 export type CreateEggPayload = {
   product_warehouse_id: number;
   qty: number;
+  weight: number;
 };
 
 export type CreateLayingRecordingPayload = CreateGrowingRecordingPayload & {
@@ -137,11 +103,9 @@ export type CreateLayingRecordingPayload = CreateGrowingRecordingPayload & {
 
 export type CreateRecordingPayload =
   | CreateGrowingRecordingPayload
-  | CreateLayingRecordingPayload
-  | CreateGradingRecordingPayload;
+  | CreateLayingRecordingPayload;
 
 export type UpdateGrowingRecordingPayload = CreateGrowingRecordingPayload;
 export type UpdateLayingRecordingPayload = CreateLayingRecordingPayload;
-export type UpdateGradingRecordingPayload = CreateGradingRecordingPayload;
 
 export type UpdateRecordingPayload = CreateRecordingPayload;
diff --git a/src/types/api/purchase/purchase.d.ts b/src/types/api/purchase/purchase.d.ts
index 56cbd810..e4de565b 100644
--- a/src/types/api/purchase/purchase.d.ts
+++ b/src/types/api/purchase/purchase.d.ts
@@ -42,7 +42,6 @@ export type PurchaseItem = {
   expedition_vendor_name?: string | null;
   received_qty?: number | null;
   transport_per_item?: number | null;
-  transport_total?: number | null;
 };
 
 export type BasePurchase = {
@@ -52,9 +51,8 @@ export type BasePurchase = {
   po_document_path?: string | null;
   po_date: string;
   supplier: Supplier;
-  credit_term: number;
+  credit_term?: number;
   due_date: string;
-  grand_total: number;
   notes?: string | null;
   deleted_at?: string | null;
   created_by: number;
@@ -62,7 +60,7 @@ export type BasePurchase = {
   location?: Location;
   warehouse?: Warehouse;
   items?: PurchaseItem[];
-  approval?: BaseApproval;
+  latest_approval?: BaseApproval;
 };
 
 export type Purchase = BaseMetadata & BasePurchase;
@@ -71,7 +69,7 @@ export type CreatePurchaseRequestPayload = {
   supplier_id: number;
   credit_term: number;
   notes?: string | null;
-  items: {
+  items?: {
     warehouse_id: number;
     product_id: number;
     qty: number;
@@ -81,7 +79,7 @@ export type CreatePurchaseRequestPayload = {
 export type CreateStaffApprovalRequestPayload = {
   action: 'APPROVED' | 'REJECTED';
   notes?: string | null;
-  items: {
+  items?: {
     purchase_item_id: number;
     qty: number;
     price: number;
@@ -92,7 +90,7 @@ export type CreateStaffApprovalRequestPayload = {
 export type UpdateStaffApprovalRequestPayload = {
   action: 'APPROVED' | 'REJECTED';
   notes?: string | null;
-  items: Array<{
+  items?: Array<{
     purchase_item_id?: number;
     product_id?: number;
     warehouse_id?: number;
@@ -103,12 +101,14 @@ export type UpdateStaffApprovalRequestPayload = {
 };
 
 export type CreateManagerApprovalRequestPayload = {
+  action: 'APPROVED' | 'REJECTED';
   notes?: string | null;
 };
 
 export type CreateAcceptApprovalRequestPayload = {
-  notes?: string;
-  items: {
+  action: 'APPROVED' | 'REJECTED';
+  notes?: string | null;
+  items?: {
     purchase_item_id: number;
     received_date: string;
     travel_number: string;
@@ -117,7 +117,6 @@ export type CreateAcceptApprovalRequestPayload = {
     expedition_vendor_id: number;
     received_qty: number;
     transport_per_item: number;
-    transport_total: number;
   }[];
 };