/
pasha.json
/
react_pro_final_project_base
Обзор
Документация
Войти
/
pasha.json
/
react_pro_final_project_base
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
finalTask
src/shared/store/HOCs/WithQuery.tsx
60 строк
1 KB
Pavel Nikolaev
tasks 1-5
19 ноя 2025, 17:07
19 ноя 2025, 17:07
804edd8
Код
Авторство
О чём код?
import { memo } from 'react'; import { Alert, AlertTitle, Box, Button, CircularProgress, Container, } from '@mui/material'; import { FC, ComponentType } from 'react'; import { getMessageFromError } from '../../utils'; import { SerializedError } from '@reduxjs/toolkit'; import { FetchBaseQueryError } from '@reduxjs/toolkit/query'; interface WithQueryProps { isLoading: boolean; isError: boolean; refetch?: () => void; error?: FetchBaseQueryError | SerializedError | undefined; } export const WithQuery = <T extends object>( WrappedComponent: ComponentType<T> ) => { const ReturnedComponent: FC<WithQueryProps & T> = (props) => { const { isError, isLoading, refetch, error, ...propsForWrappedComponent } = props; if (isError) { return ( <Container> <Alert action={<Button onClick={refetch}>Retry</Button>} severity='error'> <AlertTitle> {getMessageFromError( error, 'Неизвестная ошибка при получение данных' )} </AlertTitle> </Alert> </Container> ); } if (isLoading) { return ( <Box sx={{ display: 'flex', justifyContent: 'center' }}> <CircularProgress /> </Box> ); } return <WrappedComponent {...(propsForWrappedComponent as T)} />; }; ReturnedComponent.displayName = `withQuery${WrappedComponent.displayName || WrappedComponent.name || 'Component'}`; return memo(ReturnedComponent); };