mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-23 14:55:44 +00:00
Merge branch 'hotfix/finance' into 'development'
[HOTFIX/FE] Fixing Form Component State See merge request mbugroup/lti-web-client!238
This commit is contained in:
@@ -1,4 +1,10 @@
|
|||||||
import { ChangeEventHandler, useMemo, useState } from 'react';
|
import {
|
||||||
|
ChangeEventHandler,
|
||||||
|
useEffect,
|
||||||
|
useMemo,
|
||||||
|
useRef,
|
||||||
|
useState,
|
||||||
|
} from 'react';
|
||||||
import { CellContext } from '@tanstack/react-table';
|
import { CellContext } from '@tanstack/react-table';
|
||||||
import { useSearchParams } from 'next/navigation';
|
import { useSearchParams } from 'next/navigation';
|
||||||
import useSWR from 'swr';
|
import useSWR from 'swr';
|
||||||
@@ -33,6 +39,7 @@ import RequirePermission from '@/components/helper/RequirePermission';
|
|||||||
import { Icon } from '@iconify/react';
|
import { Icon } from '@iconify/react';
|
||||||
import RowDropdownOptions from '@/components/table/RowDropdownOptions';
|
import RowDropdownOptions from '@/components/table/RowDropdownOptions';
|
||||||
import RowCollapseOptions from '@/components/table/RowCollapseOptions';
|
import RowCollapseOptions from '@/components/table/RowCollapseOptions';
|
||||||
|
import { useUiStore } from '@/stores/ui/ui.store';
|
||||||
|
|
||||||
const RowOptionsMenu = ({
|
const RowOptionsMenu = ({
|
||||||
type = 'dropdown',
|
type = 'dropdown',
|
||||||
@@ -133,6 +140,9 @@ const RowOptionsMenu = ({
|
|||||||
};
|
};
|
||||||
|
|
||||||
const FinanceTable = () => {
|
const FinanceTable = () => {
|
||||||
|
const { searchValue, setSearchValue, resetSearchValue } = useUiStore();
|
||||||
|
const previousPathRef = useRef<string | null>(null);
|
||||||
|
|
||||||
const {
|
const {
|
||||||
state: tableFilterState,
|
state: tableFilterState,
|
||||||
updateFilter,
|
updateFilter,
|
||||||
@@ -141,7 +151,7 @@ const FinanceTable = () => {
|
|||||||
toQueryString: getTableFilterQueryString,
|
toQueryString: getTableFilterQueryString,
|
||||||
} = useTableFilter({
|
} = useTableFilter({
|
||||||
initial: {
|
initial: {
|
||||||
search: '',
|
search: searchValue,
|
||||||
transactionType: '',
|
transactionType: '',
|
||||||
bankId: '',
|
bankId: '',
|
||||||
customerId: '',
|
customerId: '',
|
||||||
@@ -167,7 +177,7 @@ const FinanceTable = () => {
|
|||||||
const [searchParams, setSearchParams] = useSearchParams();
|
const [searchParams, setSearchParams] = useSearchParams();
|
||||||
const deleteModal = useModal();
|
const deleteModal = useModal();
|
||||||
const [pendingFilters, setPendingFilters] = useState({
|
const [pendingFilters, setPendingFilters] = useState({
|
||||||
search: '',
|
search: searchValue,
|
||||||
transactionType: '',
|
transactionType: '',
|
||||||
bankId: '',
|
bankId: '',
|
||||||
customerId: '',
|
customerId: '',
|
||||||
@@ -296,6 +306,7 @@ const FinanceTable = () => {
|
|||||||
};
|
};
|
||||||
const submitFilterHandler = () => {
|
const submitFilterHandler = () => {
|
||||||
updateFilter('search', pendingFilters.search);
|
updateFilter('search', pendingFilters.search);
|
||||||
|
setSearchValue(pendingFilters.search);
|
||||||
updateFilter('transactionType', pendingFilters.transactionType);
|
updateFilter('transactionType', pendingFilters.transactionType);
|
||||||
updateFilter('bankId', pendingFilters.bankId);
|
updateFilter('bankId', pendingFilters.bankId);
|
||||||
updateFilter('customerId', pendingFilters.customerId);
|
updateFilter('customerId', pendingFilters.customerId);
|
||||||
@@ -324,6 +335,7 @@ const FinanceTable = () => {
|
|||||||
setPendingFilters(emptyFilters);
|
setPendingFilters(emptyFilters);
|
||||||
|
|
||||||
updateFilter('search', '');
|
updateFilter('search', '');
|
||||||
|
resetSearchValue();
|
||||||
updateFilter('transactionType', '');
|
updateFilter('transactionType', '');
|
||||||
updateFilter('bankId', '');
|
updateFilter('bankId', '');
|
||||||
updateFilter('customerId', '');
|
updateFilter('customerId', '');
|
||||||
@@ -447,6 +459,26 @@ const FinanceTable = () => {
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
// Store current path on mount
|
||||||
|
previousPathRef.current = window.location.pathname;
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
const currentPath = window.location.pathname;
|
||||||
|
|
||||||
|
// if both paths are within /finance module
|
||||||
|
const isCurrentPathFinance = currentPath.includes('/finance');
|
||||||
|
const isPreviousPathFinance =
|
||||||
|
previousPathRef.current?.includes('/finance');
|
||||||
|
|
||||||
|
// reset if we outside finance module entirely
|
||||||
|
if (isPreviousPathFinance && !isCurrentPathFinance) {
|
||||||
|
resetSearchValue();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}, [resetSearchValue]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<section className='size-full p-6 flex flex-col gap-6'>
|
<section className='size-full p-6 flex flex-col gap-6'>
|
||||||
<div className='flex justify-end gap-2'>
|
<div className='flex justify-end gap-2'>
|
||||||
|
|||||||
@@ -251,7 +251,11 @@ const FormFinanceAdd = ({
|
|||||||
}
|
}
|
||||||
required
|
required
|
||||||
isClearable
|
isClearable
|
||||||
isDisabled={!formik.values.party_type_option?.value}
|
isDisabled={
|
||||||
|
!formik.values.party_type_option?.value ||
|
||||||
|
(type === 'edit' &&
|
||||||
|
formik.values.party_type_option.value == 'SUPPLIER')
|
||||||
|
}
|
||||||
/>
|
/>
|
||||||
<DateInput
|
<DateInput
|
||||||
label='Tanggal'
|
label='Tanggal'
|
||||||
@@ -423,7 +427,7 @@ const FormFinanceAdd = ({
|
|||||||
<Button
|
<Button
|
||||||
type='submit'
|
type='submit'
|
||||||
className='w-min-24'
|
className='w-min-24'
|
||||||
disabled={formik.isSubmitting || !formik.isValid}
|
disabled={formik.isSubmitting}
|
||||||
>
|
>
|
||||||
Submit
|
Submit
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@@ -396,7 +396,7 @@ const FormFinanceAddInitialBalance = ({
|
|||||||
<Button
|
<Button
|
||||||
type='submit'
|
type='submit'
|
||||||
className='w-min-24'
|
className='w-min-24'
|
||||||
disabled={formik.isSubmitting || !formik.isValid}
|
disabled={formik.isSubmitting}
|
||||||
>
|
>
|
||||||
Submit
|
Submit
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@@ -257,7 +257,7 @@ const FormFinanceInjection = ({
|
|||||||
<Button
|
<Button
|
||||||
type='submit'
|
type='submit'
|
||||||
className='w-min-24'
|
className='w-min-24'
|
||||||
disabled={formik.isSubmitting || !formik.isValid}
|
disabled={formik.isSubmitting}
|
||||||
>
|
>
|
||||||
Submit
|
Submit
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
Reference in New Issue
Block a user