Загрузка данных
import { DEFAULT_TABLE_PAGINATION_LIMIT } from '@/shared/consts/constants';
import { DrawerType, DrawerTypes } from '@/shared/model/drawer/drawer.types';
import { SettingsPageTypes } from '@/widgets/Settings/types';
import {
DeviceModel,
SortType,
useGetControllerModelsV2Query,
useGetDeviceModelsV2Query,
useGetPadletModelsQuery,
} from '@shared/api/controller/client';
import { useSetDrawerType } from '@shared/hooks/drawer/useSetDrawerType';
import { ChangeEvent, MouseEvent, useEffect, useState } from 'react';
const updateModal = new Map([
[SettingsPageTypes.device, DrawerTypes.updateDeviceModel],
[SettingsPageTypes.controller, DrawerTypes.updateControllerModel],
[SettingsPageTypes.padlet, DrawerTypes.updatePadletModel],
]);
type Props = {
pageType: SettingsPageTypes;
searchName?: string;
};
const DEFAULT_PAGE = 1;
export const useModelTableState = ({ pageType, searchName }: Props) => {
const setDrawerType = useSetDrawerType();
const [page, setPage] = useState(DEFAULT_PAGE);
const [sortType, setSortType] = useState<SortType>('asc');
const [isDeleteModelOpen, setIsDeleteModelOpen] = useState(false);
const [model, setModel] = useState<DeviceModel | undefined>(undefined);
const [customPageValue, setCustomPageValue] = useState(String(page));
const offset = page > 1 ? (page - 1) * DEFAULT_TABLE_PAGINATION_LIMIT : 0;
const { data: deviceData, isFetching: isDeviceDataFetching } =
useGetDeviceModelsV2Query(
{
sortColumn: 'name',
sortType,
limit: DEFAULT_TABLE_PAGINATION_LIMIT,
offset,
name: searchName,
},
{ skip: pageType !== SettingsPageTypes.device },
);
const { data: controllerData, isFetching: isControllerDataFetching } =
useGetControllerModelsV2Query(
{
sortColumn: 'name',
sortType,
limit: DEFAULT_TABLE_PAGINATION_LIMIT,
offset,
name: searchName,
},
{ skip: pageType !== SettingsPageTypes.controller },
);
const { data: padletData, isFetching: isPadletDataFetching } =
useGetPadletModelsQuery(
{
sortColumn: 'name',
sortType,
limit: DEFAULT_TABLE_PAGINATION_LIMIT,
offset,
name: searchName,
},
{ skip: pageType !== SettingsPageTypes.padlet },
);
const handleSortTypeChange = (e: MouseEvent<HTMLElement>) => {
// @ts-ignore
setSortType(e.target.dataset.value as SortType);
};
const deviceModels = deviceData?.deviceModels || [];
const controllerModels = controllerData?.controllerModels || [];
const padletModels = padletData?.padletModels || [];
const models = new Map([
[SettingsPageTypes.device, deviceModels],
[SettingsPageTypes.controller, controllerModels],
[SettingsPageTypes.padlet, padletModels],
]);
const paginationCount = new Map([
[
SettingsPageTypes.device,
deviceData?.total
? Math.ceil(deviceData.total / DEFAULT_TABLE_PAGINATION_LIMIT)
: 0,
],
[
SettingsPageTypes.controller,
controllerData?.total
? Math.ceil(controllerData.total / DEFAULT_TABLE_PAGINATION_LIMIT)
: 0,
],
[
SettingsPageTypes.padlet,
padletData?.total
? Math.ceil(padletData.total / DEFAULT_TABLE_PAGINATION_LIMIT)
: 0,
],
]);
const isDataFetching = new Map([
[SettingsPageTypes.device, isDeviceDataFetching],
[SettingsPageTypes.controller, isControllerDataFetching],
[SettingsPageTypes.padlet, isPadletDataFetching],
]);
const count = paginationCount.get(pageType) || 0;
const applyCustomPage = () => {
setPage(Number(customPageValue));
};
const onPageChange = (_: ChangeEvent<unknown>, page: number) => {
setPage(page);
};
const handleSwitchBackPage = () => {
if (models?.get(pageType)?.length === 1) {
setPage((prev) => prev - 1);
setCustomPageValue((prev) => String(Number(prev) - 1));
}
};
const handleOpenUpdateModelDrawer = (model: DeviceModel) => {
setModel(model);
setDrawerType(updateModal.get(pageType) as DrawerType);
};
const handleOpenDeleteModal = (model: DeviceModel) => {
setModel(model);
setIsDeleteModelOpen(true);
};
useEffect(() => {
setCustomPageValue(String(page));
}, [page]);
useEffect(() => {
setPage(1);
setCustomPageValue(String(1));
}, [searchName]);
return {
model,
isDeleteModelOpen,
setIsDeleteModelOpen,
setModel,
setPage,
setCustomPageValue,
sortType,
models,
isDataFetching,
handleSwitchBackPage,
handleSortTypeChange,
handleOpenUpdateModelDrawer,
handleOpenDeleteModal,
count,
onPageChange,
page,
customPageValue,
applyCustomPage,
};
};