chore: prettier format

This commit is contained in:
ValdiANS
2026-04-27 10:49:07 +07:00
parent 6cf8e463c6
commit f9d2a875e2
11 changed files with 280 additions and 148 deletions
@@ -265,7 +265,11 @@ const FinanceTable = () => {
updateFilter('endDate', values.end_date);
// Save display names for restoration on modal reopen
const toNames = (val: OptionType | OptionType[] | null) =>
val ? (Array.isArray(val) ? val : [val]).map((o) => String(o.label)).join(',') : '';
val
? (Array.isArray(val) ? val : [val])
.map((o) => String(o.label))
.join(',')
: '';
updateFilter('bankNames', toNames(selectedBank));
updateFilter('customerNames', toNames(selectedCustomerId));
updateFilter('supplierNames', toNames(selectedSupplierId));
@@ -516,8 +520,9 @@ const FinanceTable = () => {
// Restore sort by
const restoredSortBy =
sortByOptions.find((opt) => String(opt.value) === tableFilterState.sortBy) ||
null;
sortByOptions.find(
(opt) => String(opt.value) === tableFilterState.sortBy
) || null;
setSelectedSortBy(restoredSortBy);
// Restore formik values
@@ -153,8 +153,14 @@ const InventoryAdjustmentTable = () => {
updateFilter('productFilter', values.product_id || '');
updateFilter('warehouseFilter', values.warehouse_id || '');
updateFilter('transactionTypeFilter', values.transaction_type || '');
updateFilter('productName', productIdValue?.label ? String(productIdValue.label) : '');
updateFilter('warehouseName', warehouseIdValue?.label ? String(warehouseIdValue.label) : '');
updateFilter(
'productName',
productIdValue?.label ? String(productIdValue.label) : ''
);
updateFilter(
'warehouseName',
warehouseIdValue?.label ? String(warehouseIdValue.label) : ''
);
filterModal.closeModal();
setSubmitting(false);
},
@@ -216,7 +222,10 @@ const InventoryAdjustmentTable = () => {
val: OptionType | OptionType[] | null
) => {
const warehouse = val as OptionType | null;
formik.setFieldValue('warehouse_id', warehouse?.value ? String(warehouse.value) : null);
formik.setFieldValue(
'warehouse_id',
warehouse?.value ? String(warehouse.value) : null
);
};
const handleFilterTransactionTypeChange = useCallback(
@@ -236,7 +245,10 @@ const InventoryAdjustmentTable = () => {
);
if (found) return found;
if (tableFilterState.productName) {
return { value: formik.values.product_id, label: tableFilterState.productName };
return {
value: formik.values.product_id,
label: tableFilterState.productName,
};
}
return null;
}, [formik.values.product_id, productOptions, tableFilterState.productName]);
@@ -248,10 +260,17 @@ const InventoryAdjustmentTable = () => {
);
if (found) return found;
if (tableFilterState.warehouseName) {
return { value: formik.values.warehouse_id, label: tableFilterState.warehouseName };
return {
value: formik.values.warehouse_id,
label: tableFilterState.warehouseName,
};
}
return null;
}, [formik.values.warehouse_id, warehouseOptions, tableFilterState.warehouseName]);
}, [
formik.values.warehouse_id,
warehouseOptions,
tableFilterState.warehouseName,
]);
const transactionTypeValue = useMemo(() => {
if (!formik.values.transaction_type) return null;
@@ -149,8 +149,14 @@ const MovementTable = () => {
onSubmit: (values, { setSubmitting }) => {
updateFilter('productFilter', values.product_id || '');
updateFilter('warehouseFilter', values.warehouse_id || '');
updateFilter('productName', productIdValue?.label ? String(productIdValue.label) : '');
updateFilter('warehouseName', warehouseIdValue?.label ? String(warehouseIdValue.label) : '');
updateFilter(
'productName',
productIdValue?.label ? String(productIdValue.label) : ''
);
updateFilter(
'warehouseName',
warehouseIdValue?.label ? String(warehouseIdValue.label) : ''
);
filterModal.closeModal();
setSubmitting(false);
},
@@ -216,7 +222,10 @@ const MovementTable = () => {
);
if (found) return found;
if (tableFilterState.productName) {
return { value: formik.values.product_id, label: tableFilterState.productName };
return {
value: formik.values.product_id,
label: tableFilterState.productName,
};
}
return null;
}, [formik.values.product_id, productOptions, tableFilterState.productName]);
@@ -228,10 +237,17 @@ const MovementTable = () => {
);
if (found) return found;
if (tableFilterState.warehouseName) {
return { value: formik.values.warehouse_id, label: tableFilterState.warehouseName };
return {
value: formik.values.warehouse_id,
label: tableFilterState.warehouseName,
};
}
return null;
}, [formik.values.warehouse_id, warehouseOptions, tableFilterState.warehouseName]);
}, [
formik.values.warehouse_id,
warehouseOptions,
tableFilterState.warehouseName,
]);
// ===== HANDLE FILTER MODAL OPEN =====
const handleFilterModalOpen = () => {
@@ -403,7 +419,13 @@ const MovementTable = () => {
<ButtonFilter
values={tableFilterState}
excludeFields={['page', 'pageSize', 'search', 'productName', 'warehouseName']}
excludeFields={[
'page',
'pageSize',
'search',
'productName',
'warehouseName',
]}
onClick={handleFilterModalOpen}
className='px-3 py-2.5'
/>
@@ -113,7 +113,10 @@ const InventoryProductTable = () => {
validationSchema: object().shape({ category_id: string().nullable() }),
onSubmit: (values, { setSubmitting }) => {
updateFilter('categoryFilter', values.category_id || '');
updateFilter('categoryName', categoryIdValue?.label ? String(categoryIdValue.label) : '');
updateFilter(
'categoryName',
categoryIdValue?.label ? String(categoryIdValue.label) : ''
);
filterModal.closeModal();
setSubmitting(false);
},
@@ -145,10 +148,17 @@ const InventoryProductTable = () => {
);
if (found) return found;
if (tableFilterState.categoryName) {
return { value: formik.values.category_id, label: tableFilterState.categoryName };
return {
value: formik.values.category_id,
label: tableFilterState.categoryName,
};
}
return null;
}, [formik.values.category_id, categoryOptions, tableFilterState.categoryName]);
}, [
formik.values.category_id,
categoryOptions,
tableFilterState.categoryName,
]);
// ===== HANDLE FILTER MODAL OPEN =====
const handleFilterModalOpen = () => {
@@ -156,9 +166,14 @@ const InventoryProductTable = () => {
filterModal.openModal();
};
const handleFilterCategoryChange = (val: OptionType | OptionType[] | null) => {
const handleFilterCategoryChange = (
val: OptionType | OptionType[] | null
) => {
const category = val as OptionType | null;
formik.setFieldValue('category_id', category?.value ? String(category.value) : null);
formik.setFieldValue(
'category_id',
category?.value ? String(category.value) : null
);
};
const [sorting, setSorting] = useState<SortingState>([]);
@@ -254,102 +269,106 @@ const InventoryProductTable = () => {
return (
<>
<div className='w-full'>
{/* Header Section */}
<div className='w-full p-3 flex flex-row justify-between gap-3 flex-wrap border-b border-base-content/10'>
{/* Action Buttons */}
<div className='w-fit flex flex-row gap-3 flex-wrap'>
<RequirePermission permissions='lti.inventory.product_stock.create'>
<Button
href='/inventory/product/add'
color='primary'
className='px-3 py-2.5 w-fit text-sm text-base-100 rounded-lg shadow-sm'
>
<Icon icon='heroicons:plus' width={20} height={20} />
Add Product
</Button>
</RequirePermission>
</div>
{/* Search and Filter */}
<div className='flex flex-1 flex-row justify-start sm:justify-end items-center gap-3 flex-wrap'>
<DebouncedTextInput
name='search'
placeholder='Search'
value={tableFilterState.search ?? ''}
onChange={searchChangeHandler}
startAdornment={
<Icon icon='heroicons:magnifying-glass' width={20} height={20} />
}
className={{
wrapper: 'w-full min-w-24 max-w-3xs',
inputWrapper: 'rounded-xl! shadow-button-soft',
input:
'placeholder:font-semibold placeholder:text-base-content/50',
}}
/>
<ButtonFilter
values={tableFilterState}
excludeFields={['page', 'pageSize', 'search', 'categoryName']}
onClick={handleFilterModalOpen}
className='px-3 py-2.5'
/>
</div>
</div>
{/* Table Section */}
<div className='flex flex-col mb-4'>
{isLoading ? (
<div className='w-full flex flex-row justify-center items-center p-4'>
<span className='loading loading-spinner loading-xl' />
<div className='w-full'>
{/* Header Section */}
<div className='w-full p-3 flex flex-row justify-between gap-3 flex-wrap border-b border-base-content/10'>
{/* Action Buttons */}
<div className='w-fit flex flex-row gap-3 flex-wrap'>
<RequirePermission permissions='lti.inventory.product_stock.create'>
<Button
href='/inventory/product/add'
color='primary'
className='px-3 py-2.5 w-fit text-sm text-base-100 rounded-lg shadow-sm'
>
<Icon icon='heroicons:plus' width={20} height={20} />
Add Product
</Button>
</RequirePermission>
</div>
) : !isResponseSuccess(inventoryProducts) ||
inventoryProducts.data?.length === 0 ? (
<div className='p-3'>
<InventoryProductTableSkeleton
columns={columns}
icon={
{/* Search and Filter */}
<div className='flex flex-1 flex-row justify-start sm:justify-end items-center gap-3 flex-wrap'>
<DebouncedTextInput
name='search'
placeholder='Search'
value={tableFilterState.search ?? ''}
onChange={searchChangeHandler}
startAdornment={
<Icon
icon='heroicons:document-text'
className='text-white'
icon='heroicons:magnifying-glass'
width={20}
height={20}
/>
}
className={{
wrapper: 'w-full min-w-24 max-w-3xs',
inputWrapper: 'rounded-xl! shadow-button-soft',
input:
'placeholder:font-semibold placeholder:text-base-content/50',
}}
/>
<ButtonFilter
values={tableFilterState}
excludeFields={['page', 'pageSize', 'search', 'categoryName']}
onClick={handleFilterModalOpen}
className='px-3 py-2.5'
/>
</div>
) : (
<Table<InventoryProduct>
data={
isResponseSuccess(inventoryProducts)
? inventoryProducts?.data
: []
}
columns={columns}
pageSize={tableFilterState.pageSize}
page={
isResponseSuccess(inventoryProducts)
? inventoryProducts?.meta?.page
: 0
}
totalItems={
isResponseSuccess(inventoryProducts)
? inventoryProducts?.meta?.total_results
: 0
}
onPageChange={setPage}
onPageSizeChange={setPageSize}
isLoading={isLoading}
sorting={sorting}
setSorting={setSorting}
className={{
containerClassName: cn('p-3 mb-0'),
headerColumnClassName: 'text-nowrap',
}}
/>
)}
</div>
{/* Table Section */}
<div className='flex flex-col mb-4'>
{isLoading ? (
<div className='w-full flex flex-row justify-center items-center p-4'>
<span className='loading loading-spinner loading-xl' />
</div>
) : !isResponseSuccess(inventoryProducts) ||
inventoryProducts.data?.length === 0 ? (
<div className='p-3'>
<InventoryProductTableSkeleton
columns={columns}
icon={
<Icon
icon='heroicons:document-text'
className='text-white'
width={20}
height={20}
/>
}
/>
</div>
) : (
<Table<InventoryProduct>
data={
isResponseSuccess(inventoryProducts)
? inventoryProducts?.data
: []
}
columns={columns}
pageSize={tableFilterState.pageSize}
page={
isResponseSuccess(inventoryProducts)
? inventoryProducts?.meta?.page
: 0
}
totalItems={
isResponseSuccess(inventoryProducts)
? inventoryProducts?.meta?.total_results
: 0
}
onPageChange={setPage}
onPageSizeChange={setPageSize}
isLoading={isLoading}
sorting={sorting}
setSorting={setSorting}
className={{
containerClassName: cn('p-3 mb-0'),
headerColumnClassName: 'text-nowrap',
}}
/>
)}
</div>
</div>
</div>
{/* Filter Modal */}
<Modal
@@ -262,9 +262,18 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
updateFilter('kandang_id', values.kandang_id || '');
updateFilter('category', values.category || '');
updateFilter('period', values.period || '');
updateFilter('area_name', areaValue?.label ? String(areaValue.label) : '');
updateFilter('location_name', locationValue?.label ? String(locationValue.label) : '');
updateFilter('kandang_name', kandangValue?.label ? String(kandangValue.label) : '');
updateFilter(
'area_name',
areaValue?.label ? String(areaValue.label) : ''
);
updateFilter(
'location_name',
locationValue?.label ? String(locationValue.label) : ''
);
updateFilter(
'kandang_name',
kandangValue?.label ? String(kandangValue.label) : ''
);
filterModal.closeModal();
setSubmitting(false);
},
@@ -329,10 +338,15 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
// ===== FILTER HELPERS =====
const areaValue = useMemo(() => {
if (!formik.values.area_id) return null;
const found = areaOptions.find((opt) => String(opt.value) === formik.values.area_id);
const found = areaOptions.find(
(opt) => String(opt.value) === formik.values.area_id
);
if (found) return found;
if (tableFilterState.area_name) {
return { value: formik.values.area_id, label: tableFilterState.area_name };
return {
value: formik.values.area_id,
label: tableFilterState.area_name,
};
}
return null;
}, [formik.values.area_id, areaOptions, tableFilterState.area_name]);
@@ -344,10 +358,17 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
);
if (found) return found;
if (tableFilterState.location_name) {
return { value: formik.values.location_id, label: tableFilterState.location_name };
return {
value: formik.values.location_id,
label: tableFilterState.location_name,
};
}
return null;
}, [formik.values.location_id, locationOptions, tableFilterState.location_name]);
}, [
formik.values.location_id,
locationOptions,
tableFilterState.location_name,
]);
const kandangValue = useMemo(() => {
if (!formik.values.kandang_id) return null;
@@ -356,7 +377,10 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
);
if (found) return found;
if (tableFilterState.kandang_name) {
return { value: formik.values.kandang_id, label: tableFilterState.kandang_name };
return {
value: formik.values.kandang_id,
label: tableFilterState.kandang_name,
};
}
return null;
}, [formik.values.kandang_id, kandangOptions, tableFilterState.kandang_name]);
@@ -446,7 +470,7 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
};
const searchChangeHandler: ChangeEventHandler<HTMLInputElement> = (e) => {
updateFilter('search', e.target.value);
updateFilter('search', e.target.value, true);
};
const confirmApprovalHandler = async (
@@ -984,7 +1008,14 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
<ButtonFilter
values={tableFilterState}
excludeFields={['page', 'pageSize', 'search', 'area_name', 'location_name', 'kandang_name']}
excludeFields={[
'page',
'pageSize',
'search',
'area_name',
'location_name',
'kandang_name',
]}
onClick={handleFilterModalOpen}
className='px-3 py-2.5'
/>
@@ -496,11 +496,23 @@ const TransferToLayingsTable = () => {
updateFilter('startDate', values.startDate || '');
updateFilter('endDate', values.endDate || '');
updateFilter('flockSource', flockSourceOpts.map((o) => String(o.value)).join(','));
updateFilter('flockDestination', flockDestOpts.map((o) => String(o.value)).join(','));
updateFilter(
'flockSource',
flockSourceOpts.map((o) => String(o.value)).join(',')
);
updateFilter(
'flockDestination',
flockDestOpts.map((o) => String(o.value)).join(',')
);
updateFilter('status', statusOpts.map((o) => String(o.value)).join(','));
updateFilter('flockSourceNames', flockSourceOpts.map((o) => String(o.label)).join(','));
updateFilter('flockDestinationNames', flockDestOpts.map((o) => String(o.label)).join(','));
updateFilter(
'flockSourceNames',
flockSourceOpts.map((o) => String(o.label)).join(',')
);
updateFilter(
'flockDestinationNames',
flockDestOpts.map((o) => String(o.label)).join(',')
);
};
const filterResetHandler = () => {
@@ -127,23 +127,37 @@ const ReportExpenseTab = ({ tabId }: ReportExpenseTabProps) => {
handleFilterModalOpenRef.current = () => {
const restoredLocation = filterParams.location_id
? locationOptions.find((opt) => String(opt.value) === filterParams.location_id) ||
{ value: filterParams.location_id, label: filterParams.location_id }
? locationOptions.find(
(opt) => String(opt.value) === filterParams.location_id
) || {
value: filterParams.location_id,
label: filterParams.location_id,
}
: null;
const restoredSupplier = filterParams.supplier_id
? supplierOptions.find((opt) => String(opt.value) === filterParams.supplier_id) ||
{ value: filterParams.supplier_id, label: filterParams.supplier_id }
? supplierOptions.find(
(opt) => String(opt.value) === filterParams.supplier_id
) || {
value: filterParams.supplier_id,
label: filterParams.supplier_id,
}
: null;
const restoredKandang = filterParams.kandang_id
? projectFlockKandangOptions.find((opt) => String(opt.value) === filterParams.kandang_id) ||
{ value: filterParams.kandang_id, label: filterParams.kandang_id }
? projectFlockKandangOptions.find(
(opt) => String(opt.value) === filterParams.kandang_id
) || { value: filterParams.kandang_id, label: filterParams.kandang_id }
: null;
const restoredNonstock = filterParams.nonstock_id
? nonstockOptions.find((opt) => String(opt.value) === filterParams.nonstock_id) ||
{ value: filterParams.nonstock_id, label: filterParams.nonstock_id }
? nonstockOptions.find(
(opt) => String(opt.value) === filterParams.nonstock_id
) || {
value: filterParams.nonstock_id,
label: filterParams.nonstock_id,
}
: null;
const restoredCategory = filterParams.category
? categoryOptions.find((opt) => opt.value === filterParams.category) || null
? categoryOptions.find((opt) => opt.value === filterParams.category) ||
null
: null;
formik.setValues({
@@ -742,9 +742,7 @@ const CustomerPaymentTab = ({ tabId }: CustomerPaymentTabProps) => {
}
onNextPage={() =>
setCurrentPage((curr) =>
meta.total_pages && curr < meta.total_pages
? curr + 1
: curr
meta.total_pages && curr < meta.total_pages ? curr + 1 : curr
)
}
onPageChange={(pageNumber) => setCurrentPage(pageNumber)}
@@ -149,7 +149,8 @@ const DebtSupplierTab = ({ tabId }: DebtSupplierTabProps) => {
handleFilterModalOpenRef.current = () => {
const restoredFilterBy =
dataTypeOptions.find((opt) => opt.value === filterParams.filter_by) || null;
dataTypeOptions.find((opt) => opt.value === filterParams.filter_by) ||
null;
const supplierIdList = filterParams.supplier_ids
? filterParams.supplier_ids.split(',')
@@ -673,9 +674,7 @@ const DebtSupplierTab = ({ tabId }: DebtSupplierTabProps) => {
}
onNextPage={() =>
setCurrentPage((curr) =>
meta.total_pages && curr < meta.total_pages
? curr + 1
: curr
meta.total_pages && curr < meta.total_pages ? curr + 1 : curr
)
}
onPageChange={(pageNumber) => setCurrentPage(pageNumber)}
@@ -264,20 +264,33 @@ const ProductionResultContent = ({ tabId }: ProductionResultTabProps) => {
handleFilterModalOpenRef.current = () => {
const restoredAreaId = filterParams.area_id
? areaOptions.find((opt) => String(opt.value) === filterParams.area_id) ||
{ value: filterParams.area_id, label: filterParams.area_id }
? areaOptions.find(
(opt) => String(opt.value) === filterParams.area_id
) || { value: filterParams.area_id, label: filterParams.area_id }
: null;
const restoredLocationId = filterParams.location_id
? locationOptions.find((opt) => String(opt.value) === filterParams.location_id) ||
{ value: filterParams.location_id, label: filterParams.location_id }
? locationOptions.find(
(opt) => String(opt.value) === filterParams.location_id
) || {
value: filterParams.location_id,
label: filterParams.location_id,
}
: null;
const restoredProjectFlockId = filterParams.project_flock_id
? projectFlockOptions.find((opt) => String(opt.value) === filterParams.project_flock_id) ||
{ value: filterParams.project_flock_id, label: filterParams.project_flock_id }
? projectFlockOptions.find(
(opt) => String(opt.value) === filterParams.project_flock_id
) || {
value: filterParams.project_flock_id,
label: filterParams.project_flock_id,
}
: null;
const restoredKandangId = filterParams.project_flock_kandang_id
? projectFlockKandangOptions.find((opt) => String(opt.value) === filterParams.project_flock_kandang_id) ||
{ value: filterParams.project_flock_kandang_id, label: filterParams.project_flock_kandang_id }
? projectFlockKandangOptions.find(
(opt) => String(opt.value) === filterParams.project_flock_kandang_id
) || {
value: filterParams.project_flock_kandang_id,
label: filterParams.project_flock_kandang_id,
}
: null;
formik.setValues({
@@ -880,9 +880,9 @@ export function DailyChecklistContent() {
setChecklistStatus('SUBMITTED');
const shareToWhatsApp = () => {
const kandangName = kandangOptions.find(
(k) => String(k.value) === kandangId
)?.label || kandangId;
const kandangName =
kandangOptions.find((k) => String(k.value) === kandangId)?.label ||
kandangId;
const statusMsg = getStatusMessage();
const category = selectedCategory || '';
const message = encodeURIComponent(