refactor(FE-170): streamline RecordingTable component by removing unused imports and state management for area, location, and kandang

src/components/pages/production/recording/RecordingTable.tsx

@@ -1,8 +1,7 @@
 'use client';
 
-import { useCallback, useState, useMemo, useEffect } from 'react';
+import React, { useCallback, useState, useMemo, useEffect } from 'react';
 import { RefObject } from 'react';
-import { useRouter } from 'next/navigation';
 import useSWR from 'swr';
 import { Icon } from '@iconify/react';
 import { SortingState, CellContext } from '@tanstack/react-table';
@@ -11,7 +10,7 @@ import { useModal } from '@/components/Modal';
 import Modal from '@/components/Modal';
 import Button from '@/components/Button';
 import ConfirmationModal from '@/components/modal/ConfirmationModal';
-import { OptionType, useSelect } from '@/components/input/SelectInput';
+import { OptionType } from '@/components/input/SelectInput';
 import SelectInput from '@/components/input/SelectInput';
 import DebouncedTextInput from '@/components/input/DebouncedTextInput';
 import { ROWS_OPTIONS } from '@/config/constant';
@@ -21,9 +20,6 @@ import RowCollapseOptions from '@/components/table/RowCollapseOptions';
 import RowOptionsMenuWrapper from '@/components/table/RowOptionsMenuWrapper';
 import { type Recording } from '@/types/api/production/recording';
 import { RecordingApi } from '@/services/api/production';
-import { AreaApi } from '@/services/api/master-data';
-import { LocationApi } from '@/services/api/master-data';
-import { KandangApi } from '@/services/api/master-data';
 import { ApprovalApi } from '@/services/api/approval';
 import { isResponseSuccess } from '@/lib/api-helper';
 import { useTableFilter } from '@/services/hooks/useTableFilter';
@@ -31,9 +27,6 @@ import toast from 'react-hot-toast';
 import Badge from '@/components/Badge';
 import CheckboxInput from '@/components/input/CheckboxInput';
 import TextArea from '@/components/input/TextArea';
-import { Area } from '@/types/api/master-data/area';
-import { Location } from '@/types/api/master-data/location';
-import { Kandang } from '@/types/api/master-data/kandang';
 import { BaseApproval, BaseApiResponse } from '@/types/api/api-general';
 import { router } from 'next/client';
 
@@ -386,8 +379,6 @@ const ApprovalHistoryModal = ({
 };
 
 const RecordingTable = () => {
-  const router = useRouter();
-
   const {
     state: tableFilterState,
     updateFilter,
@@ -431,15 +422,6 @@ const RecordingTable = () => {
   const rejectModal = useModal();
   const approvalHistoryModal = useModal();
 
-  // State for selected values
-  const [selectedArea, setSelectedArea] = useState<OptionType | null>(null);
-  const [selectedLocation, setSelectedLocation] = useState<OptionType | null>(
-    null
-  );
-  const [selectedKandang, setSelectedKandang] = useState<OptionType | null>(
-    null
-  );
-
   const {
     data: recordings,
     isLoading,
@@ -449,25 +431,6 @@ const RecordingTable = () => {
     RecordingApi.getAllFetcher
   );
 
-  // Fetch data for dropdowns
-  const {
-    setInputValue: setAreaSelectInputValue,
-    options: areaOptions,
-    isLoadingOptions: isLoadingAreas,
-  } = useSelect<Area>(AreaApi.basePath, 'id', 'name');
-
-  const {
-    setInputValue: setLocationSelectInputValue,
-    options: locationOptions,
-    isLoadingOptions: isLoadingLocations,
-  } = useSelect<Location>(LocationApi.basePath, 'id', 'name');
-
-  const {
-    setInputValue: setKandangSelectInputValue,
-    options: kandangOptions,
-    isLoadingOptions: isLoadingKandang,
-  } = useSelect<Kandang>(KandangApi.basePath, 'id', 'name');
-
   const isRecordingFullyApproved = useCallback(
     (recording: Recording): boolean => {
       return (
@@ -692,81 +655,7 @@ const RecordingTable = () => {
           />
         </div>
 
-        <div className='grid grid-cols-12 justify-end gap-4'>
-          <SelectInput
-            label='Area'
-            placeholder='Pilih Area'
-            options={areaOptions}
-            isLoading={isLoadingAreas}
-            value={selectedArea}
-            onChange={(selected) => {
-              const selectedValue = selected as OptionType | null;
-              setSelectedArea(selectedValue);
-              setSelectedLocation(null);
-              setSelectedKandang(null);
-              updateFilter(
-                'areaFilter',
-                selectedValue ? selectedValue.value.toString() : ''
-              );
-              updateFilter('locationFilter', '');
-              updateFilter('kandangFilter', '');
-              setPage(1);
-            }}
-            onInputChange={setAreaSelectInputValue}
-            isClearable
-            className={{
-              wrapper: 'col-span-12 sm:col-span-3',
-            }}
-          />
-
-          <SelectInput
-            label='Lokasi'
-            placeholder='Pilih Lokasi'
-            options={locationOptions}
-            isLoading={isLoadingLocations}
-            value={selectedLocation}
-            onChange={(selected) => {
-              const selectedValue = selected as OptionType | null;
-              setSelectedLocation(selectedValue);
-              setSelectedKandang(null);
-              updateFilter(
-                'locationFilter',
-                selectedValue ? selectedValue.value.toString() : ''
-              );
-              updateFilter('kandangFilter', '');
-              setPage(1);
-            }}
-            onInputChange={setLocationSelectInputValue}
-            isClearable
-            isDisabled={!selectedArea}
-            className={{
-              wrapper: 'col-span-12 sm:col-span-3',
-            }}
-          />
-
-          <SelectInput
-            label='Kandang'
-            placeholder='Pilih Kandang'
-            options={kandangOptions}
-            isLoading={isLoadingKandang}
-            value={selectedKandang}
-            onChange={(selected) => {
-              const selectedValue = selected as OptionType | null;
-              setSelectedKandang(selectedValue);
-              updateFilter(
-                'kandangFilter',
-                selectedValue ? selectedValue.value.toString() : ''
-              );
-              setPage(1);
-            }}
-            onInputChange={setKandangSelectInputValue}
-            isClearable
-            isDisabled={!selectedLocation}
-            className={{
-              wrapper: 'col-span-12 sm:col-span-2',
-            }}
-          />
-
+        <div className='flex justify-end gap-4'>
           <SelectInput
             label='Baris'
             options={ROWS_OPTIONS}