refactor(FE-84-87) refactor checkbox using reuseable component checkboxinput

src/app/production/chickin/add/page.tsx

@@ -15,7 +15,7 @@ import { Kandang } from '@/types/api/master-data/kandang';
 import { ProjectFlockKandang } from '@/types/api/production/project-flock-kandang';
 import { Icon } from '@iconify/react';
 import { useRouter, useSearchParams } from 'next/navigation';
-import { use, useEffect, useState } from 'react';
+import { useState } from 'react';
 
 import useSWR from 'swr';
 
@@ -34,9 +34,8 @@ const AddChickin = () => {
   const [selectedKandang, setSelectedKandang] = useState<Kandang | undefined>(
     undefined
   );
-  const [projectFlockKandang, setProjectFlockKandang] = useState<
-    BaseApiResponse<ProjectFlockKandang>
-  >();
+  const [projectFlockKandang, setProjectFlockKandang] =
+    useState<BaseApiResponse<ProjectFlockKandang>>();
   const [isLoadingProjectFlockKandang, setIsLoadingProjectFlockKandang] =
     useState(false);
   const [searchProjectFlock, setSearchProjectFlock] = useState('');
@@ -87,7 +86,7 @@ const AddChickin = () => {
   }
 
   // Handle Function
-  const handleChickinClick = async (kandang: Kandang) =>  {
+  const handleChickinClick = async (kandang: Kandang) => {
     setIsLoadingProjectFlockKandang(true);
     setSelectedKandang(kandang);
     const ProjectFlockKandangRes = await ProjectFlockApi.customRequest<
@@ -100,9 +99,7 @@ const AddChickin = () => {
         kandang_id: kandang.id,
       },
     });
-    if (
-      isResponseSuccess(ProjectFlockKandangRes)
-    ) {
+    if (isResponseSuccess(ProjectFlockKandangRes)) {
       setProjectFlockKandang(ProjectFlockKandangRes);
       setIsLoadingProjectFlockKandang(false);
       if (
@@ -110,7 +107,7 @@ const AddChickin = () => {
         ProjectFlockKandangRes.data.available_quantity > 0
       ) {
         chickinModal.openModal();
-      }else{
+      } else {
         alertModal.openModal();
       }
     }

src/app/production/chickin/detail/page.tsx

@@ -13,7 +13,6 @@ const DetailChickin = () => {
   const {
     data: chickin,
     isLoading,
-    mutate: refreshChickin,
   } = useSWR(
     chickinId,
     (id: number) => ChickinApi.getSingle(id)

src/app/production/project-flock/detail/page.tsx

@@ -1,46 +1,51 @@
-'use client'
+'use client';
 
-
-import ProjectFlockForm from "@/components/pages/production/project-flock/form/ProjectFlockForm";
-import { isResponseError, isResponseSuccess } from "@/lib/api-helper";
-import { ProjectFlockApi } from "@/services/api/production";
-import { useRouter, useSearchParams } from "next/navigation";
-import useSWR from "swr";
+import ProjectFlockForm from '@/components/pages/production/project-flock/form/ProjectFlockForm';
+import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
+import { ProjectFlockApi } from '@/services/api/production';
+import { useRouter, useSearchParams } from 'next/navigation';
+import useSWR from 'swr';
 
 const ProjectFlockDetail = () => {
   const router = useRouter();
   const searchParams = useSearchParams();
 
-  const projectFlockId = searchParams.get("projectFlockId");
+  const projectFlockId = searchParams.get('projectFlockId');
 
-  const { data: projectFlock, isLoading: isLoadingProjectFlock } = useSWR(
-    projectFlockId,
-    (id: number) => ProjectFlockApi.getSingle(id)
-  );
+  const {
+    data: projectFlock,
+    isLoading: isLoadingProjectFlock,
+    mutate: refreshProjectFlock,
+  } = useSWR(projectFlockId, (id: number) => ProjectFlockApi.getSingle(id));
 
-  if(!projectFlockId){
+  if (!projectFlockId) {
     router.back();
 
     return (
-      <div className="w-full flex flex-row justify-center items-center p-4">
-        <span className="loading loading-spinner loading-xl" />
+      <div className='w-full flex flex-row justify-center items-center p-4'>
+        <span className='loading loading-spinner loading-xl' />
       </div>
     );
   }
 
-  if(!isLoadingProjectFlock && (!projectFlock || isResponseError(projectFlock))){
-    router.replace("/404");
+  if (
+    !isLoadingProjectFlock &&
+    (!projectFlock || isResponseError(projectFlock))
+  ) {
+    router.replace('/404');
     return;
   }
 
   return (
-    <div className="w-full p-4 flex flex-row justify-center">
-      {isLoadingProjectFlock && <span className="loading loading-spinner loading-xl" />}
+    <div className='w-full p-4 flex flex-row justify-center'>
+      {isLoadingProjectFlock && (
+        <span className='loading loading-spinner loading-xl' />
+      )}
       {!isLoadingProjectFlock && isResponseSuccess(projectFlock) && (
-        <ProjectFlockForm formType="detail" initialValues={projectFlock.data} />
+        <ProjectFlockForm formType='detail' initialValues={projectFlock.data} refreshProjectFlocks={refreshProjectFlock} />
       )}
     </div>
-  )
-}
+  );
+};
 
-export default ProjectFlockDetail;
+export default ProjectFlockDetail;

src/app/production/project-flock/page.tsx

@@ -1,4 +1,3 @@
-import ProjectFlockForm from "@/components/pages/production/project-flock/form/ProjectFlockForm"
 import ProjectFlockTable from "@/components/pages/production/project-flock/ProjectFlockTable";
 
 const ProjectFlock = () => {