mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 13:32:00 +00:00
refactor(FE-170): streamline RecordingTable component by removing unused imports and state management for area, location, and kandang
This commit is contained in:
@@ -1,8 +1,7 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { useCallback, useState, useMemo, useEffect } from 'react';
|
import React, { useCallback, useState, useMemo, useEffect } from 'react';
|
||||||
import { RefObject } from 'react';
|
import { RefObject } from 'react';
|
||||||
import { useRouter } from 'next/navigation';
|
|
||||||
import useSWR from 'swr';
|
import useSWR from 'swr';
|
||||||
import { Icon } from '@iconify/react';
|
import { Icon } from '@iconify/react';
|
||||||
import { SortingState, CellContext } from '@tanstack/react-table';
|
import { SortingState, CellContext } from '@tanstack/react-table';
|
||||||
@@ -11,7 +10,7 @@ import { useModal } from '@/components/Modal';
|
|||||||
import Modal from '@/components/Modal';
|
import Modal from '@/components/Modal';
|
||||||
import Button from '@/components/Button';
|
import Button from '@/components/Button';
|
||||||
import ConfirmationModal from '@/components/modal/ConfirmationModal';
|
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 SelectInput from '@/components/input/SelectInput';
|
||||||
import DebouncedTextInput from '@/components/input/DebouncedTextInput';
|
import DebouncedTextInput from '@/components/input/DebouncedTextInput';
|
||||||
import { ROWS_OPTIONS } from '@/config/constant';
|
import { ROWS_OPTIONS } from '@/config/constant';
|
||||||
@@ -21,9 +20,6 @@ import RowCollapseOptions from '@/components/table/RowCollapseOptions';
|
|||||||
import RowOptionsMenuWrapper from '@/components/table/RowOptionsMenuWrapper';
|
import RowOptionsMenuWrapper from '@/components/table/RowOptionsMenuWrapper';
|
||||||
import { type Recording } from '@/types/api/production/recording';
|
import { type Recording } from '@/types/api/production/recording';
|
||||||
import { RecordingApi } from '@/services/api/production';
|
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 { ApprovalApi } from '@/services/api/approval';
|
||||||
import { isResponseSuccess } from '@/lib/api-helper';
|
import { isResponseSuccess } from '@/lib/api-helper';
|
||||||
import { useTableFilter } from '@/services/hooks/useTableFilter';
|
import { useTableFilter } from '@/services/hooks/useTableFilter';
|
||||||
@@ -31,9 +27,6 @@ import toast from 'react-hot-toast';
|
|||||||
import Badge from '@/components/Badge';
|
import Badge from '@/components/Badge';
|
||||||
import CheckboxInput from '@/components/input/CheckboxInput';
|
import CheckboxInput from '@/components/input/CheckboxInput';
|
||||||
import TextArea from '@/components/input/TextArea';
|
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 { BaseApproval, BaseApiResponse } from '@/types/api/api-general';
|
||||||
import { router } from 'next/client';
|
import { router } from 'next/client';
|
||||||
|
|
||||||
@@ -386,8 +379,6 @@ const ApprovalHistoryModal = ({
|
|||||||
};
|
};
|
||||||
|
|
||||||
const RecordingTable = () => {
|
const RecordingTable = () => {
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
const {
|
const {
|
||||||
state: tableFilterState,
|
state: tableFilterState,
|
||||||
updateFilter,
|
updateFilter,
|
||||||
@@ -431,15 +422,6 @@ const RecordingTable = () => {
|
|||||||
const rejectModal = useModal();
|
const rejectModal = useModal();
|
||||||
const approvalHistoryModal = 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 {
|
const {
|
||||||
data: recordings,
|
data: recordings,
|
||||||
isLoading,
|
isLoading,
|
||||||
@@ -449,25 +431,6 @@ const RecordingTable = () => {
|
|||||||
RecordingApi.getAllFetcher
|
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(
|
const isRecordingFullyApproved = useCallback(
|
||||||
(recording: Recording): boolean => {
|
(recording: Recording): boolean => {
|
||||||
return (
|
return (
|
||||||
@@ -692,81 +655,7 @@ const RecordingTable = () => {
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className='grid grid-cols-12 justify-end gap-4'>
|
<div className='flex 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',
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<SelectInput
|
<SelectInput
|
||||||
label='Baris'
|
label='Baris'
|
||||||
options={ROWS_OPTIONS}
|
options={ROWS_OPTIONS}
|
||||||
|
|||||||
Reference in New Issue
Block a user