···11/// routes will be rendered under the outlet inside this component
12#[component]
13pub fn Navbar() -> Element {
0014 rsx! {
15 document::Link { rel: "stylesheet", href: THEME_DEFAULTS_CSS }
16 document::Link { rel: "stylesheet", href: NAVBAR_CSS }
1718 div {
19 id: "navbar",
20- Link {
21- to: Route::Home {},
22- "Home"
00000000000000000000000000000000000023 }
24-25 }
2627 // The `Outlet` component is used to render the next component inside the layout. In this case, it will render either
···11/// routes will be rendered under the outlet inside this component
12#[component]
13pub fn Navbar() -> Element {
14+ let route = use_route::<Route>();
15+16 rsx! {
17 document::Link { rel: "stylesheet", href: THEME_DEFAULTS_CSS }
18 document::Link { rel: "stylesheet", href: NAVBAR_CSS }
1920 div {
21 id: "navbar",
22+ nav { class: "breadcrumbs",
23+ Link {
24+ to: Route::Home {},
25+ class: "breadcrumb",
26+ "Home"
27+ }
28+29+ // Show repository breadcrumb if we're on a repository page
30+ match route {
31+ Route::RepositoryIndex { ident } => rsx! {
32+ span { class: "breadcrumb-separator", " > " }
33+ span { class: "breadcrumb breadcrumb-current", "@{ident}" }
34+ },
35+ Route::NotebookIndex { ident, book_title } => rsx! {
36+ span { class: "breadcrumb-separator", " > " }
37+ Link {
38+ to: Route::RepositoryIndex { ident: ident.clone() },
39+ class: "breadcrumb",
40+ "@{ident}"
41+ }
42+ span { class: "breadcrumb-separator", " > " }
43+ span { class: "breadcrumb breadcrumb-current", "{book_title}" }
44+ },
45+ Route::Entry { ident, book_title, .. } => rsx! {
46+ span { class: "breadcrumb-separator", " > " }
47+ Link {
48+ to: Route::RepositoryIndex { ident: ident.clone() },
49+ class: "breadcrumb",
50+ "@{ident}"
51+ }
52+ span { class: "breadcrumb-separator", " > " }
53+ Link {
54+ to: Route::NotebookIndex { ident: ident.clone(), book_title: book_title.clone() },
55+ class: "breadcrumb",
56+ "{book_title}"
57+ }
58+ },
59+ _ => rsx! {}
60+ }
61 }
062 }
6364 // The `Outlet` component is used to render the next component inside the layout. In this case, it will render either