diff --git a/src/components/Breadcrumbs.astro b/src/components/Breadcrumbs.astro
new file mode 100644
index 000000000..cd376cfc2
--- /dev/null
+++ b/src/components/Breadcrumbs.astro
@@ -0,0 +1,125 @@
+---
+import Section from "@ui/Section.astro";
+
+export interface Props {
+ linksData: any;
+ currentPath: string;
+ homeLabel?: string;
+ homePath?: string;
+ separator?: string;
+}
+
+const {
+ linksData,
+ currentPath,
+ homeLabel = "Home",
+ homePath = "/",
+ separator = "/"
+} = Astro.props;
+
+interface BreadcrumbItem {
+ name: string;
+ path: string;
+ isActive: boolean;
+}
+
+function normalizePath(path: string): string {
+console.log(path)
+ if (!path) return ""
+ if (path === "/") return "/";
+ return path.replace(/\/+$/, "");
+}
+
+const normalizedCurrentPath = normalizePath(currentPath);
+
+// Recursive function to build breadcrumb trail
+function findBreadcrumbTrail(items: any[], currentPath: string, parentName?: string): BreadcrumbItem[] {
+ for (const item of items) {
+ const itemPath = normalizePath(item.path);
+
+ if (itemPath === currentPath) {
+ const breadcrumb: BreadcrumbItem = {
+ name: item.name,
+ path: item.path,
+ isActive: true
+ };
+
+ if (parentName) {
+ return [
+ { name: parentName, path: '', isActive: false },
+ breadcrumb
+ ];
+ }
+
+ return [breadcrumb];
+ }
+
+ if (item.items) {
+ const subTrail = findBreadcrumbTrail(item.items, currentPath, item.name);
+ if (subTrail.length > 0) {
+ return subTrail;
+ }
+ }
+ }
+
+ return [];
+}
+
+// Build the breadcrumb trail
+const breadcrumbs: BreadcrumbItem[] = [];
+
+breadcrumbs.push({
+ name: homeLabel,
+ path: homePath,
+ isActive: normalizedCurrentPath === normalizePath(homePath)
+});
+
+if (normalizedCurrentPath !== normalizePath(homePath) && linksData?.header) {
+ const trail = findBreadcrumbTrail(linksData.header, normalizedCurrentPath);
+ breadcrumbs.push(...trail);
+}
+
+if (breadcrumbs.length === 1 && normalizedCurrentPath !== normalizePath(homePath)) {
+ const pathSegments = normalizedCurrentPath.split('/').filter(Boolean);
+ const lastSegment = pathSegments[pathSegments.length - 1];
+
+ if (lastSegment) {
+ breadcrumbs.push({
+ name: lastSegment.replace(/-/g, ' ').replace(/\b\w/g, l => l.toUpperCase()),
+ path: currentPath,
+ isActive: true
+ });
+ }
+}
+---
+
+
+{ currentPath !== homePath &&
+
+ }
+
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 7cbf62043..1bac83e47 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -3,17 +3,23 @@ import BaseHead from "@components/BaseHead.astro";
import Header from "@components/Header.astro";
import Footer from "@components/Footer.astro";
import Offline from "@components/Offline.astro";
+import Breadcrumbs from '@components/Breadcrumbs.astro';
+
+import linksData from '@src/data/links.json';
import "@fortawesome/fontawesome-free/css/all.min.css";
import "@styles/tailwind.css";
import "@styles/global.css";
import "@styles/search.css";
+
export interface Props {
title: string;
description: string;
}
+const currentPath = Astro.url.pathname;
+
const { title, description } = Astro.props;
if (!title || !description) {
@@ -37,6 +43,13 @@ const externalDomain = new URL(Astro.site || "").hostname;
+