mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 13:32:00 +00:00
fix: implement lazy loading for select input
This commit is contained in:
@@ -88,21 +88,33 @@ const DailyMarketingTab = ({ tabId }: DailyMarketingTabProps) => {
|
|||||||
const filterModal = useModal();
|
const filterModal = useModal();
|
||||||
|
|
||||||
// ===== OPTIONS =====
|
// ===== OPTIONS =====
|
||||||
const { options: areaOptions, isLoadingOptions: isLoadingAreas } = useSelect(
|
const {
|
||||||
AreaApi.basePath,
|
options: areaOptions,
|
||||||
'id',
|
isLoadingOptions: isLoadingAreas,
|
||||||
'name',
|
setInputValue: setAreaInputValue,
|
||||||
'search'
|
loadMore: loadMoreArea,
|
||||||
);
|
} = useSelect(AreaApi.basePath, 'id', 'name', 'search');
|
||||||
|
|
||||||
const { options: locationOptions, isLoadingOptions: isLoadingLocations } =
|
const {
|
||||||
useSelect(LocationApi.basePath, 'id', 'name', 'search');
|
options: locationOptions,
|
||||||
|
isLoadingOptions: isLoadingLocations,
|
||||||
|
setInputValue: setLocationInputValue,
|
||||||
|
loadMore: loadMoreLocation,
|
||||||
|
} = useSelect(LocationApi.basePath, 'id', 'name', 'search');
|
||||||
|
|
||||||
const { options: warehouseOptions, isLoadingOptions: isLoadingWarehouses } =
|
const {
|
||||||
useSelect(WarehouseApi.basePath, 'id', 'name', 'search');
|
options: warehouseOptions,
|
||||||
|
isLoadingOptions: isLoadingWarehouses,
|
||||||
|
setInputValue: setWarehouseInputValue,
|
||||||
|
loadMore: loadMoreWarehouse,
|
||||||
|
} = useSelect(WarehouseApi.basePath, 'id', 'name', 'search');
|
||||||
|
|
||||||
const { options: customerOptions, isLoadingOptions: isLoadingCustomers } =
|
const {
|
||||||
useSelect(CustomerApi.basePath, 'id', 'name', 'search');
|
options: customerOptions,
|
||||||
|
isLoadingOptions: isLoadingCustomers,
|
||||||
|
setInputValue: setCustomerInputValue,
|
||||||
|
loadMore: loadMoreCustomer,
|
||||||
|
} = useSelect(CustomerApi.basePath, 'id', 'name', 'search');
|
||||||
|
|
||||||
// ===== FORMIK SETUP =====
|
// ===== FORMIK SETUP =====
|
||||||
const formik = useFormik<DailyMarketingReportFilterType>({
|
const formik = useFormik<DailyMarketingReportFilterType>({
|
||||||
@@ -837,6 +849,8 @@ const DailyMarketingTab = ({ tabId }: DailyMarketingTabProps) => {
|
|||||||
}}
|
}}
|
||||||
isClearable
|
isClearable
|
||||||
className={{ wrapper: 'w-full' }}
|
className={{ wrapper: 'w-full' }}
|
||||||
|
onInputChange={setAreaInputValue}
|
||||||
|
onMenuScrollToBottom={loadMoreArea}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* Location Filter */}
|
{/* Location Filter */}
|
||||||
@@ -854,6 +868,8 @@ const DailyMarketingTab = ({ tabId }: DailyMarketingTabProps) => {
|
|||||||
}}
|
}}
|
||||||
isClearable
|
isClearable
|
||||||
className={{ wrapper: 'w-full' }}
|
className={{ wrapper: 'w-full' }}
|
||||||
|
onInputChange={setLocationInputValue}
|
||||||
|
onMenuScrollToBottom={loadMoreLocation}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* Warehouse Filter */}
|
{/* Warehouse Filter */}
|
||||||
@@ -871,6 +887,8 @@ const DailyMarketingTab = ({ tabId }: DailyMarketingTabProps) => {
|
|||||||
}}
|
}}
|
||||||
isClearable
|
isClearable
|
||||||
className={{ wrapper: 'w-full' }}
|
className={{ wrapper: 'w-full' }}
|
||||||
|
onInputChange={setWarehouseInputValue}
|
||||||
|
onMenuScrollToBottom={loadMoreWarehouse}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* Customer Filter */}
|
{/* Customer Filter */}
|
||||||
@@ -888,6 +906,8 @@ const DailyMarketingTab = ({ tabId }: DailyMarketingTabProps) => {
|
|||||||
}}
|
}}
|
||||||
isClearable
|
isClearable
|
||||||
className={{ wrapper: 'w-full' }}
|
className={{ wrapper: 'w-full' }}
|
||||||
|
onInputChange={setCustomerInputValue}
|
||||||
|
onMenuScrollToBottom={loadMoreCustomer}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{/* Filter By Date Type */}
|
{/* Filter By Date Type */}
|
||||||
|
|||||||
Reference in New Issue
Block a user