/
minimus
/
simple-view
Обзор
Документация
Войти
/
minimus
/
simple-view
Код
Запросы
0
Задачи
Вики
Пакеты
0
Релизы
0
CI/CD
Аналитика
Безопасность
develop
js-src/admin/components/LoadingIndicator/LoadingIndicator.tsx
41 строка
1 KB
minimus
feat: footer, header, loader
28 июл 2026, 12:42
28 июл 2026, 12:42
2d42178
Код
Авторство
О чём код?
import CircularProgress from '@mui/material/CircularProgress'; import React, { FC, useEffect, useEffectEvent, useState } from 'react'; import { useShallow } from 'zustand/react/shallow'; import { useMainStore } from '../../data/stories/main/mainStore'; import { LoaderRoot } from './styled'; const LoadingIndicator: FC = () => { const [progress, setProgress] = useState(0); const { loadState } = useMainStore(useShallow((state) => state)); const updateProgress = useEffectEvent(() => { function tick() { // reset when reaching 100% // eslint-disable-next-line react-x/set-state-in-effect setProgress((oldProgress) => (oldProgress >= 100 ? 0 : oldProgress + 1)); } return setInterval(tick, 20); }); useEffect(() => { const timer = updateProgress(); return () => { clearInterval(timer); }; }, [loadState]); if (loadState === 'loading') { return ( <LoaderRoot> <CircularProgress variant="determinate" value={progress} /> </LoaderRoot> ); } return null; }; export default LoadingIndicator;