Добавлены хлебные крошки для навигации в компонентах и страницах, включая CourseList, LessonList, UserPage и Attendance. Обновлены локализации для новых элементов навигации. Реализован контекст для управления состоянием хлебных крошек через BreadcrumbsProvider и useBreadcrumbs. Обновлен компонент AppHeader для отображения хлебных крошек в зависимости от текущей страницы.

src/dashboard.tsx

@@ -12,7 +12,7 @@ import {
   UserPage,
   AttendancePage,
 } from './pages'
-import { ErrorBoundary, AppHeader } from './components'
+import { ErrorBoundary, AppHeader, BreadcrumbsProvider, useBreadcrumbs } from './components'
 import { keycloak } from './__data__/kc'
 
 const MENU_SCRIPT_URL = 'https://admin.bro-js.ru/remote-assets/lib/serviceMenu/serviceMenu.js'
@@ -62,6 +62,12 @@ const Wrapper = ({ children }: { children: React.ReactElement }) => (
   </Suspense>
 )
 
+// Компонент, который соединяет хлебные крошки с AppHeader
+const HeaderWithBreadcrumbs = ({ serviceMenuContainerRef }: { serviceMenuContainerRef: React.RefObject<HTMLDivElement> }) => {
+  const { breadcrumbs } = useBreadcrumbs();
+  return <AppHeader serviceMenuContainerRef={serviceMenuContainerRef} breadcrumbs={breadcrumbs} />;
+};
+
 interface DashboardProps {
   store: any; // Используем any, поскольку точный тип store не указан
 }
@@ -111,49 +117,51 @@ export const Dashboard = ({ store }: DashboardProps) => {
   
   return (
     <Provider store={store}>
-      <AppHeader serviceMenuContainerRef={serviceMenuContainerRef} />
-      <Routes>
-        <Route
-          path={getNavigationValue('journal.main')}
-          element={
-            <Wrapper>
-              <CourseListPage />
-            </Wrapper>
-          }
-        />
-        <Route
-          path={`${getNavigationValue('journal.main')}/lessons-list/:courseId`}
-          element={
-            <Wrapper>
-              <LessonListPage />
-            </Wrapper>
-          }
-        />
-        <Route
-          path={`${getNavigationValue('journal.main')}/u/:lessonId/:accessId`}
-          element={
-            <Wrapper>
-              <UserPage />
-            </Wrapper>
-          }
-        />
-        <Route
-          path={`${getNavigationValue('journal.main')}/lesson/:courseId/:lessonId`}
-          element={
-            <Wrapper>
-              <LessonDetailsPage />
-            </Wrapper>
-          }
-        />
-        <Route
-          path={`${getNavigationValue('journal.main')}${getNavigationValue('link.journal.attendance')}`}
-          element={
-            <Wrapper>
-              <AttendancePage />
-            </Wrapper>
-          }
-        />
-      </Routes>
+      <BreadcrumbsProvider>
+        <HeaderWithBreadcrumbs serviceMenuContainerRef={serviceMenuContainerRef} />
+        <Routes>
+          <Route
+            path={getNavigationValue('journal.main')}
+            element={
+              <Wrapper>
+                <CourseListPage />
+              </Wrapper>
+            }
+          />
+          <Route
+            path={`${getNavigationValue('journal.main')}/lessons-list/:courseId`}
+            element={
+              <Wrapper>
+                <LessonListPage />
+              </Wrapper>
+            }
+          />
+          <Route
+            path={`${getNavigationValue('journal.main')}/u/:lessonId/:accessId`}
+            element={
+              <Wrapper>
+                <UserPage />
+              </Wrapper>
+            }
+          />
+          <Route
+            path={`${getNavigationValue('journal.main')}/lesson/:courseId/:lessonId`}
+            element={
+              <Wrapper>
+                <LessonDetailsPage />
+              </Wrapper>
+            }
+          />
+          <Route
+            path={`${getNavigationValue('journal.main')}${getNavigationValue('link.journal.attendance')}`}
+            element={
+              <Wrapper>
+                <AttendancePage />
+              </Wrapper>
+            }
+          />
+        </Routes>
+      </BreadcrumbsProvider>
     </Provider>
   )
 }