hamedandClaude Opus 4.8
69e591f03e
- Appointment detail (DetailLg/DetailSm) read the real response shape: date/time from slot_start, specialty from doctor.specialties[0].name, phone from address.telephone. - Sidebar Head reads userInfo (cookie) after mount to avoid an SSR/client hydration mismatch on the user's name. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
33 lines
947 B
JavaScript
33 lines
947 B
JavaScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { getParsedUserInfo, imageUrl } from "@/helper";
|
|
import Image from "next/image";
|
|
|
|
function Head() {
|
|
const [userInfo, setUserInfo] = useState(null);
|
|
|
|
useEffect(() => {
|
|
setUserInfo(getParsedUserInfo());
|
|
}, []);
|
|
|
|
return (
|
|
<div className="w-full flex flex-row md:flex-col items-center justify-center md:justify-start gap-[12px] md:gap-[4px]">
|
|
<Image
|
|
className="rounded-full border-[3px] border-solid border-[#F8F8FF] shadow-[0px_1px_25.6px_0px_rgba(85,_89,_205,_0.20)]"
|
|
src={imageUrl(userInfo?.picture?.[0]?.url)}
|
|
alt="profile"
|
|
height={73}
|
|
width={73}
|
|
/>
|
|
<div className="flex flex-col items-start md:items-center justify-center gap-[8px] md:gap-[4px]">
|
|
<p className="text-[#3B3B3B] text-[14px] font-bold">
|
|
{userInfo?.realName}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Head;
|