diff --git a/app/(app)/not-found.tsx b/app/(app)/not-found.tsx index 063538e..cdf1987 100644 --- a/app/(app)/not-found.tsx +++ b/app/(app)/not-found.tsx @@ -3,27 +3,30 @@ * @description Server component rendering a custom 404 page for missing or invalid routes within the app layout. */ +import { AppHeader } from "@/components/layout/AppHeader"; import { AlertCircle } from "lucide-react"; /** Renders the 404 Not Found fallback view containing an alert icon, message, and navigation link back to the summary page. */ export default function NotFound() { return ( -
-
- {/* Icon Badge */} -
- -
+
+ +
+
+ {/* Icon Badge */} +
+ +
- {/* Text Content */} -
-

- Page not found -

-

- The page you are looking for doesn't exist or has been moved. Please - check the URL or head back to your summary. -

+ {/* Text Content */} +
+

+ Page not found +

+

+ The page you are looking for doesn't exist or has been moved. +

+
diff --git a/components/layout/AppHeader.tsx b/components/layout/AppHeader.tsx index fbf1f50..5e865b1 100644 --- a/components/layout/AppHeader.tsx +++ b/components/layout/AppHeader.tsx @@ -1,6 +1,6 @@ /** * @file components/layout/AppHeader.tsx - * @description Application top header component providing navigation controls, dynamic channel or friend tab titles, optional server settings, member list toggles, and legal views support. + * @description Application top header component providing navigation controls, dynamic channel or friend tab titles, optional server settings, member list toggles, legal views, and 404 support. */ "use client"; @@ -14,6 +14,7 @@ import { Settings, FileText, ShieldCheck, + AlertCircle, } from "lucide-react"; import { ServerSettingsMenu } from "./ServerSettingsMenu"; import { FriendsHeader, TabType } from "@/components/friends/FriendsHeader"; @@ -35,9 +36,10 @@ interface AppHeaderProps { isSettings?: boolean; isLegalImprint?: boolean; isLegalPrivacy?: boolean; + isNotFound?: boolean; } -/** Renders the application header with navigation controls, dynamic titles, tabs, and action buttons. */ +/** Renders the application header with navigation controls, dynamic titles, tabs, action buttons, and 404 support. */ export function AppHeader({ title, showMembersButton = false, @@ -50,6 +52,7 @@ export function AppHeader({ isSettings = false, isLegalImprint = false, isLegalPrivacy = false, + isNotFound = false, }: AppHeaderProps) { const { isNavOpen, toggleNav, toggleMembers } = useSidebarStore(); @@ -62,7 +65,8 @@ export function AppHeader({ !!server || showFriendsTabs || isSettings || - isLegalView; + isLegalView || + isNotFound; return (
+ {/* 404 Not Found Header Title */} + {isNotFound && ( +
+ +

+ Not Found +

+
+ )} + {/* Settings View Header Title */} {isSettings && (
@@ -116,7 +130,7 @@ export function AppHeader({ )} {/* Dynamic Channel Title */} - {!isSettings && !isLegalView && title && ( + {!isSettings && !isLegalView && !isNotFound && title && (

{title}

@@ -126,6 +140,7 @@ export function AppHeader({ {/* Friends Header Component */} {!isSettings && !isLegalView && + !isNotFound && showFriendsTabs && setActiveTab && activeTab && (