trafficlunar/tomodachi-share
1
0
Fork 0
mirror of https://github.com/trafficlunar/tomodachi-share.git synced 2026-03-29 03:29:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: show profile on client in header

Browse source
This commit is contained in:
trafficlunar 2026-03-28 15:07:19 +00:00
parent fde3480342
commit da08fe24f4
3 changed files with 23 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/app/layout.tsx
View file

@ -11,6 +11,7 @@ import Providers from "./provider";
import Header from "@/components/header"; import Header from "@/components/header";
import Footer from "@/components/footer"; import Footer from "@/components/footer";
import AdminBanner from "@/components/admin/banner"; import AdminBanner from "@/components/admin/banner";
import { SessionProvider } from "next-auth/react";
const lexend = Lexend({ const lexend = Lexend({
subsets: ["latin"], subsets: ["latin"],
@ -91,7 +92,9 @@ export default function RootLayout({
)} )}
<Providers> <Providers>
<Header /> <SessionProvider>
<Header />
</SessionProvider>
<AdminBanner /> <AdminBanner />
<main className="px-4 py-8 max-w-7xl w-full grow flex flex-col">{children}</main> <main className="px-4 py-8 max-w-7xl w-full grow flex flex-col">{children}</main>
<Footer /> <Footer />

11
src/components/header.tsx
View file

@ -1,15 +1,16 @@
"use client";
import Image from "next/image"; import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
import { useSession } from "next-auth/react";
import { auth } from "@/lib/auth";
import SearchBar from "./search-bar"; import SearchBar from "./search-bar";
import RandomLink from "./random-link"; import RandomLink from "./random-link";
import ProfileOverview from "./profile-overview"; import ProfileOverview from "./profile-overview";
import LogoutButton from "./logout-button"; import LogoutButton from "./logout-button";
export default async function Header() { export default function Header() {
const session = await auth(); const session = useSession();
return ( return (
<header className="sticky top-0 z-50 w-full p-4 grid grid-cols-3 gap-2 gap-x-4 items-center bg-amber-50 border-b-4 border-amber-500 shadow-md max-lg:grid-cols-2 max-md:grid-cols-1"> <header className="sticky top-0 z-50 w-full p-4 grid grid-cols-3 gap-2 gap-x-4 items-center bg-amber-50 border-b-4 border-amber-500 shadow-md max-lg:grid-cols-2 max-md:grid-cols-1">
@ -35,7 +36,7 @@ export default async function Header() {
Submit Submit
</Link> </Link>
</li> </li>
{!session?.user ? ( {!session?.data?.user ? (
<li> <li>
<Link href={"/login"} className="pill button h-full"> <Link href={"/login"} className="pill button h-full">
Login Login

19
src/components/profile-overview.tsx
View file

@ -1,21 +1,28 @@
"use client";
import Image from "next/image"; import Image from "next/image";
import { auth } from "@/lib/auth"; import { useSession } from "next-auth/react";
import Link from "next/link"; import Link from "next/link";
export default async function ProfileOverview() { export default function ProfileOverview() {
const session = await auth(); const session = useSession();
return ( return (
<li title="Your profile"> <li title="Your profile">
<Link href={`/profile/${session?.user?.id}`} aria-label="Go to profile" className="pill button gap-2! p-0! h-full max-w-64" data-tooltip="Your Profile"> <Link
href={`/profile/${session?.data?.user?.id}`}
aria-label="Go to profile"
className="pill button gap-2! p-0! h-full max-w-64"
data-tooltip="Your Profile"
>
<Image <Image
src={session?.user?.image ?? "/guest.png"} src={session?.data?.user?.image ?? "/guest.png"}
alt="profile picture" alt="profile picture"
width={40} width={40}
height={40} height={40}
className="rounded-full aspect-square object-cover h-full bg-white outline-2 outline-orange-400" className="rounded-full aspect-square object-cover h-full bg-white outline-2 outline-orange-400"
/> />
<span className="pr-4 overflow-hidden whitespace-nowrap text-ellipsis w-full">{session?.user?.name ?? "unknown"}</span> <span className="pr-4 overflow-hidden whitespace-nowrap text-ellipsis w-full">{session?.data?.user?.name ?? "unknown"}</span>
</Link> </Link>
</li> </li>
); );