import React, { Suspense, lazy } from 'react';
import { PageSkeleton } from '../shared/ui/Skeleton';
import { ErrorBoundary } from '../shared/ui/ErrorBoundary';
import { RouteGuard } from '../app/guards/RouteGuard';

const EmployeesModule = lazy(() =>
  import('../features/employees/EmployeesModule').then((m) => ({ default: m.EmployeesModule }))
);

export const EmployeesPage: React.FC = () => {
  return (
    <RouteGuard module="employees" moduleName="Сотрудники и смены">
      <ErrorBoundary scope="Модуль Сотрудники">
        <Suspense fallback={<PageSkeleton title="Сотрудники и смены" />}>
          <EmployeesModule />
        </Suspense>
      </ErrorBoundary>
    </RouteGuard>
  );
};

export default EmployeesPage;