diff --git a/src/components/pages/uniformity/form/UniformityResultForm.tsx b/src/components/pages/uniformity/form/UniformityResultForm.tsx
new file mode 100644
index 00000000..bda0ca09
--- /dev/null
+++ b/src/components/pages/uniformity/form/UniformityResultForm.tsx
@@ -0,0 +1,178 @@
+'use client';
+
+import React, { useMemo } from 'react';
+import { Icon } from '@iconify/react';
+import { ColumnDef } from '@tanstack/react-table';
+import Button from '@/components/Button';
+import Tooltip from '@/components/Tooltip';
+import DrawerHeader from '@/components/helper/drawer/DrawerHeader';
+import { useUiStore } from '@/stores/ui/ui.store';
+import RequirePermission from '@/components/helper/RequirePermission';
+import Table from '@/components/Table';
+import { useRouter } from 'next/navigation';
+import toast from 'react-hot-toast';
+import { UniformityApi } from '@/services/api/uniformity';
+import { isResponseError } from '@/lib/api-helper';
+
+type BodyWeightData = {
+ id: string;
+ number: number;
+ weight: number;
+};
+
+const UniformityResultForm = () => {
+ const router = useRouter();
+ const setExpandedDrawerOpen = useUiStore((s) => s.setExpandedDrawerOpen);
+ const setIsNextStep = useUiStore((s) => s.setIsNextStep);
+ const setUniformityStep = useUiStore((s) => s.setUniformityStep);
+ const verifyUniformityResult = useUiStore((s) => s.verifyUniformityResult);
+ const setVerifyUniformityResult = useUiStore(
+ (s) => s.setVerifyUniformityResult
+ );
+ const uniformityFormData = useUiStore((s) => s.uniformityFormData);
+
+ const [isSubmitting, setIsSubmitting] = React.useState(false);
+
+ const handleClose = () => {
+ setExpandedDrawerOpen(false);
+ setIsNextStep(false);
+ setUniformityStep('preview');
+ setVerifyUniformityResult(null);
+ };
+
+ const handleBack = () => {
+ setUniformityStep('preview');
+ };
+
+ const handleSubmit = async () => {
+ if (!uniformityFormData || !uniformityFormData.files) {
+ toast.error('Form data is missing. Please try again.');
+ return;
+ }
+
+ setIsSubmitting(true);
+
+ try {
+ const payload = {
+ date: uniformityFormData.date,
+ project_flock_kandang_id: uniformityFormData.project_flock_kandang_id,
+ files: uniformityFormData.files,
+ };
+
+ const res = await UniformityApi.createUniformity(payload);
+
+ if (isResponseError(res)) {
+ toast.error(res.message);
+ return;
+ }
+
+ toast.success('Uniformity created successfully!');
+
+ setExpandedDrawerOpen(false);
+ setIsNextStep(false);
+ setUniformityStep('preview');
+ setVerifyUniformityResult(null);
+ router.push('/uniformity');
+ } finally {
+ setIsSubmitting(false);
+ }
+ };
+
+ const tableData = useMemo(() => {
+ if (!verifyUniformityResult) return [];
+
+ return verifyUniformityResult.body_weights.map((weight, index) => ({
+ id: `weight-${index}`,
+ number: index + 1,
+ weight: weight,
+ }));
+ }, [verifyUniformityResult]);
+
+ const columns: ColumnDef
[] = useMemo(
+ () => [
+ {
+ accessorKey: 'number',
+ header: 'No',
+ cell: (props) => props.row.original.number,
+ },
+ {
+ accessorKey: 'weight',
+ header: 'Weight (g)',
+ cell: (props) => (
+ {props.row.original.weight}
+ ),
+ },
+ ],
+ []
+ );
+
+ return (
+
+ {/* Header */}
+
+
+
+
+
+
+ {/* Form Section */}
+
+
+ {verifyUniformityResult ? (
+
+
+
+ data={tableData}
+ columns={columns}
+ pageSize={15}
+ className={{ containerClassName: 'mb-5' }}
+ />
+
+
+ {/* Action Buttons */}
+
+
+
+
+
+
No data available
+
Upload a file to verify uniformity
+