Update routing and add error boundary

This commit is contained in:
2025-02-25 22:50:05 -05:00
parent bc7ffcd5bf
commit 29724da42f
3 changed files with 129 additions and 126 deletions

View File

@@ -1,6 +1,6 @@
import clsx from "clsx";
import { BsList } from "react-icons/bs";
import { Link } from "react-router";
import { Link, Outlet } from "react-router";
import DarkModeToggle from "./DarkModeToggle";
import ProtectedNavLinks from "./ProtectedNavLinks";
import PublicNavLinks from "./PublicNavLinks";
@@ -9,48 +9,51 @@ import raidBuilderIcon from "/raidBuilderIcon.svg";
export default function NavBar(){
return (
<nav
className={clsx(
"border-b-2 z-40",
"bg-gray-700 border-gray-600 dark:bg-zinc-900 dark:border-neutral-850 text-white"
)}
>
<div
className="navContents"
<>
<nav
className={clsx(
"border-b-2 z-40",
"bg-gray-700 border-gray-600 dark:bg-zinc-900 dark:border-neutral-850 text-white"
)}
>
<Link
to="/"
className="flex items-center space-x-3 rtl:space-x-reverse"
<div
className="navContents"
>
<img
src={raidBuilderIcon}
alt="Raid Builder Logo"
width={30}
height={30}
fetchPriority="high"
/>
<span
className="self-center text-2xl font-semibold whitespace-nowrap"
<Link
to="/"
className="flex items-center space-x-3 rtl:space-x-reverse"
>
Raid Builder
</span>
</Link>
<div
className="peer md:hidden text-3xl"
>
<BsList/>
<img
src={raidBuilderIcon}
alt="Raid Builder Logo"
width={30}
height={30}
fetchPriority="high"
/>
<span
className="self-center text-2xl font-semibold whitespace-nowrap"
>
Raid Builder
</span>
</Link>
<div
className="peer md:hidden text-3xl"
>
<BsList/>
</div>
<div
className={clsx(
"relative top-0 left-0 flex flex-row items-center rounded-lg space-x-4",
"bg-gray-700 dark:bg-zinc-900"
)}
>
<PublicNavLinks/>
<ProtectedNavLinks/>
<DarkModeToggle/>
</div>
</div>
<div
className={clsx(
"relative top-0 left-0 flex flex-row items-center rounded-lg space-x-4",
"bg-gray-700 dark:bg-zinc-900"
)}
>
<PublicNavLinks/>
<ProtectedNavLinks/>
<DarkModeToggle/>
</div>
</div>
</nav>
</nav>
<Outlet/>
</>
);
}