diff --git a/src/components/dashboard/dashboard-header.tsx b/src/components/dashboard/dashboard-header.tsx
index 7c77098..4f8cf89 100644
--- a/src/components/dashboard/dashboard-header.tsx
+++ b/src/components/dashboard/dashboard-header.tsx
@@ -12,6 +12,19 @@ import {
BreadcrumbPage,
BreadcrumbSeparator,
} from "@/components/ui/breadcrumb";
+import { Organization } from "@/app/types/org/organization";
+import { useOrganizationContext } from "@/app/provider/organization-provider";
+import { OrganizationState } from "@/app/store/organization-store";
+import { usePathname } from "next/navigation";
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import { ChevronDownIcon } from "@heroicons/react/24/outline";
+import UserMenuLinks from "@/components/dashboard/sidebar/user-menu/user-menu-links";
+import OrganizationLogo from "@/components/org/organization-logo";
+import UserAvatar from "@/components/user/user-avatar";
/**
* The props for this header.
@@ -21,11 +34,6 @@ type DashboardHeaderProps = {
* The title of this header.
*/
title: string;
-
- /**
- * The breadcrumb of this header.
- */
- breadcrumb: ReactElement;
};
/**
@@ -35,13 +43,15 @@ type DashboardHeaderProps = {
* @param props the header props
* @return the header jsx
*/
-const DashboardHeader = ({
- title,
- breadcrumb,
-}: DashboardHeaderProps): ReactElement => {
+const DashboardHeader = ({ title }: DashboardHeaderProps): ReactElement => {
+ const path: string = usePathname();
+
const user: User | undefined = useUserContext(
(state: UserState) => state.user
);
+ const selectedOrganization: Organization | undefined =
+ useOrganizationContext((state: OrganizationState) => state.selected);
+
return (
{title}
@@ -54,7 +64,13 @@ const DashboardHeader = ({
- {breadcrumb}
+ {path.startsWith("/dashboard/org") ? (
+
+ ) : (
+
+ )}
{title}
@@ -64,4 +80,31 @@ const DashboardHeader = ({
);
};
+
+const UserBreadcrumb = ({ user }: { user: User }): ReactElement => (
+
+
+
+
+ @{user?.username}
+
+
+
+
+
+
+
+);
+
+const OrganizationBreadcrumb = ({
+ organization,
+}: {
+ organization: Organization;
+}): ReactElement => (
+
+
+ {organization.name}
+
+);
+
export default DashboardHeader;
diff --git a/src/components/dashboard/user/user-settings-header.tsx b/src/components/dashboard/user/user-settings-header.tsx
deleted file mode 100644
index bae084c..0000000
--- a/src/components/dashboard/user/user-settings-header.tsx
+++ /dev/null
@@ -1,64 +0,0 @@
-import { ReactElement } from "react";
-import { User } from "@/app/types/user/user";
-import { useUserContext } from "@/app/provider/user-provider";
-import { UserState } from "@/app/store/user-store";
-import {
- Breadcrumb,
- BreadcrumbItem,
- BreadcrumbLink,
- BreadcrumbList,
- BreadcrumbPage,
- BreadcrumbSeparator,
-} from "@/components/ui/breadcrumb";
-import {
- DropdownMenu,
- DropdownMenuContent,
- DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
-import { ChevronDownIcon } from "@heroicons/react/24/outline";
-import UserMenuLinks from "@/components/dashboard/sidebar/user-menu/user-menu-links";
-
-/**
- * The header to display
- * on user settings pages.
- *
- * @param title the title of this header
- * @return the header jsx
- */
-const UserSettingsHeader = ({ title }: { title: string }): ReactElement => {
- const user: User | undefined = useUserContext(
- (state: UserState) => state.user
- );
- return (
-
-
{title}
-
-
-
-
-
- Dashboard
-
-
-
-
-
-
- @{user?.username}
-
-
-
-
-
-
-
-
-
- {title}
-
-
-
-
- );
-};
-export default UserSettingsHeader;