diff --git a/apps/gifting-concierge/src/app/(dashboard)/dashboard/orders/[id]/page.tsx b/apps/gifting-concierge/src/app/(dashboard)/dashboard/orders/[id]/page.tsx
index c28d54c..8c46b63 100644
--- a/apps/gifting-concierge/src/app/(dashboard)/dashboard/orders/[id]/page.tsx
+++ b/apps/gifting-concierge/src/app/(dashboard)/dashboard/orders/[id]/page.tsx
@@ -1,4 +1,7 @@
 import { createClient } from "~/supabase/server";
+import { Card, CardContent, CardHeader, CardTitle } from "@theliaison/ui/card";
+import { Avatar } from "@nextui-org/react";
+import { Badge } from "@theliaison/ui/badge";
 
 export default async function Component({
 	params: { id },
@@ -12,7 +15,7 @@ export default async function Component({
 			id,
 			type,
 			status,
-			users(id, full_name, email),
+			users(id, full_name, email, avatar_url),
 			gift_recipients(id, name),
 			gifts_orders_links(id, link, specs),
 			updated_at,
@@ -28,7 +31,49 @@ export default async function Component({
 
 	return (
 		<div>
-			<pre>{JSON.stringify(data, null, 2)}</pre>
+			<Card className="w-4/5 h-96">
+			<CardHeader className="flex items-center">
+				<CardTitle className="text-xl">Order</CardTitle>
+			</CardHeader>
+				<CardContent className="grid grid-cols-8 gap-1 justify-center h-4/5">
+					<div className="col-span-2 ">
+						<div className="flex items-center justify-center space-x-2">
+							<Avatar className="w-44 h-44" src={data.users?.avatar_url ?? ""} showFallback/>
+						</div>
+					</div>
+					<div className="col-span-3 col-start-3">
+						<div className="my-2">
+							<p className="text-base font-bold">Name</p>
+							<p>{data.users?.full_name}</p>
+						</div>
+						<div className="my-2">
+							<p className="text-base font-bold">Type</p>
+							<p>{data.type}</p>
+						</div>
+						<div className="my-2">
+							<p className="text-base font-bold">Link</p>
+							<p>{data.gifts_orders_links?.link}</p>
+						</div>
+						<div className="mt-14">
+							<p className="text-base font-bold">Recipient</p>
+							<p>{data.gift_recipients?.name}</p>
+						</div>
+					</div>
+					<div className="grid col-span-3 col-start-6">
+						<div>
+							<p className="text-base font-bold">Status</p>
+							<Badge className="text-base capitalize" variant="secondary">
+								{data.status.replaceAll("_", " ")}
+							</Badge>
+						</div>
+						<div>
+							<p className="text-base font-bold">Specs</p>
+							<p>{data.gifts_orders_links?.specs}</p>
+						</div>
+					</div>
+				</CardContent>
+			</Card>
+			{/* <pre>{JSON.stringify(data, null, 2)}</pre> */}
 		</div>
 	);
 }
diff --git a/apps/gifting-concierge/src/components/header.tsx b/apps/gifting-concierge/src/components/header.tsx
index dd0ce3d..7cb5bce 100644
--- a/apps/gifting-concierge/src/components/header.tsx
+++ b/apps/gifting-concierge/src/components/header.tsx
@@ -3,8 +3,10 @@ import Image from "next/image";
 import Link from "next/link";
 import { createClient } from "~/supabase/server";
 import { HeaderNavigation } from "./header/navigation";
+//import { usePathname } from "next/navigation";
 
 export function Header({ showModeToggle }: { showModeToggle?: boolean }) {
+
 	return (
 		<div className="sticky top-0 z-50">
 			<header className="flex w-full flex-col gap-3 p-3 md:h-16 md:flex-row md:items-center lg:px-4 bg-black/70 backdrop-blur-3xl supports-[backdrop-filter]:bg-white/30 shadow-sm">