src/app-core/App.jsx - master - DevDenzo/ERP

src/app-core/App.jsx
84 строки4 KB
Denis Sklyarskij
Инициализирован репозиторий
14 янв 2026, 23:32
14 янв 2026, 23:321df3d47
// Подключаем библиотеку React
import React, {
    useState, // Хук управления состоянием интерфейса
    useEffect // Хук побочных эффектов
} from 'react';

// Подключаем библиотеку обеспечения навигации в браузере
import { BrowserRouter as Router } from "react-router-dom";

// Подключаем минифицированный файл CSS-Bootstrap
// для базовой стилизации компонентов (сетка, кнопки, формы и др.)
import 'bootstrap/dist/css/bootstrap.min.css';

// Подключаем стили набора иконок Bootstrap Icons
// для использования стандартных иконок в интерфейсе
import 'bootstrap-icons/font/bootstrap-icons.css';

// Подключаем кастомный хук для блокировки стандартной прокрутки страницы
// Используется для управления поведением прокрутки на уровне приложения
import { useLockDefaultScroll } from '../hooks/index.js';

// Подключаем провайдер значений компонента смены темы
// Обеспечивает передачу состояния тем и управляющих функций в дочерние компоненты
import { ThemesProvider } from '../providers/ThemesProvider.jsx';

// Подключаем основной компонент макета приложения
// Содержит базовую структуру интерфейса (шапку, контент, подвал и т.д.)
import AppFoundationView from './AppLayout/AppLayout.jsx';

/**
 * Основной корневой компонент приложения (App)
 *
 * Является:
 * - главной точкой входа в приложение;
 * - инициализатором приложения;
 * - управляющим основным потоком рендеринга;
 * - контейнером глобальной логики (смена тем, блокировка прокрутки и др.).
 *
 * @returns {JSX.Element} Отрендеренный интерфейс приложения
 */
const App = () => {
    // Инициализируем состояние загрузки тем
    // Изначально не подключена ни одна из тем (пустой объект)
    const [loadedThemes, setLoadedThemes] = useState({});

    // Эффект: загрузка белой темы при первом монтировании компонента
    // - Импортирует файл темы через динамический import()
    // - Обновляет состояние loadedThemes при успешной загрузке
    // - Логирует ошибку в консоль при сбое загрузки
    useEffect(() => {
        import(`../primary-theme/_included-white-theme.less`).then(() => {
            setLoadedThemes((prev) => ({ ...prev, white: true }));
        }).catch((error) => {
            console.error('Ошибка загрузки темы:', error);
        });
    }, []);

    // Вызываем хук для блокировки стандартной прокрутки приложения
    // Предотвращает прокрутку страницы при определённых условиях (например, при модальных окнах)
    useLockDefaultScroll();

    return (
        <Router>
            <div className='app-container'>
                <ThemesProvider
                    // Состояние загруженных тем (передаётся в провайдер)
                    loadedThemes={loadedThemes}
                    // Сеттер для обновления состояния загруженных тем
                    setLoadedThemes={setLoadedThemes}
                >
                    <AppFoundationView />
                </ThemesProvider>
            </div>
        </Router>
    );
};

/**
 * Экспорт компонента по умолчанию
 *
 * Позволяет импортировать компонент как:
 * import App from './App';
 */
export default App;