+13 -1

src/components/Nav/NavBarAuthed.tsx

··· 1 import { UnderlineIconRouterLink } from "@/components/Animated/UnderlineIconRouterLink"; 0 2 import { SignOutButton } from "@/components/Auth/SignOutButton"; 3 import { DropdownModal } from "@/components/Dropdown/DropdownModal"; 4 import { StrandIcon } from "@/components/Icons/Branding/StrandIcon"; 5 import { Loading } from "@/components/Icons/Loading"; 0 6 import { Avatar } from "@/components/Profile/Avatar"; 7 import { useModalEscapeEffect } from "@/lib/hooks/useModalEscapeEffect"; 8 import { useModalMousedownEffect } from "@/lib/hooks/useModalMousedownEffect"; ··· 37 className="pl-2 text-lg font-semibold" 38 /> 39 </div> 40 - <div className="flex max-h-12 items-center gap-1 mr-3"> 41 <div> 42 {isAvatarLoading ? ( 43 <Loading /> ··· 54 55 const AvatarWithDropdown = ({ uri }: { uri: string | undefined }) => { 56 const [showDropdown, setShowDropdown] = useState(false); 0 57 58 const dropdownRef = useRef<HTMLDivElement>(null); 59 ··· 70 buttonComponent={AvatarButton} 71 className="bg-surface0 mt-3.5 flex w-48 flex-col gap-2 rounded-lg p-2" 72 > 0 0 0 0 0 0 0 0 0 73 <SignOutButton /> 74 </DropdownModal> 75 );

··· 1 import { UnderlineIconRouterLink } from "@/components/Animated/UnderlineIconRouterLink"; 2 + import { UnderlineRouterLink } from "@/components/Animated/UnderlineRouterLink"; 3 import { SignOutButton } from "@/components/Auth/SignOutButton"; 4 import { DropdownModal } from "@/components/Dropdown/DropdownModal"; 5 import { StrandIcon } from "@/components/Icons/Branding/StrandIcon"; 6 import { Loading } from "@/components/Icons/Loading"; 7 + import { LucideCircleUserRound } from "@/components/Icons/LucideCircleUserRound"; 8 import { Avatar } from "@/components/Profile/Avatar"; 9 import { useModalEscapeEffect } from "@/lib/hooks/useModalEscapeEffect"; 10 import { useModalMousedownEffect } from "@/lib/hooks/useModalMousedownEffect"; ··· 39 className="pl-2 text-lg font-semibold" 40 /> 41 </div> 42 + <div className="mr-3 flex max-h-12 items-center gap-1"> 43 <div> 44 {isAvatarLoading ? ( 45 <Loading /> ··· 56 57 const AvatarWithDropdown = ({ uri }: { uri: string | undefined }) => { 58 const [showDropdown, setShowDropdown] = useState(false); 59 + const { handle } = useOAuth(); 60 61 const dropdownRef = useRef<HTMLDivElement>(null); 62 ··· 73 buttonComponent={AvatarButton} 74 className="bg-surface0 mt-3.5 flex w-48 flex-col gap-2 rounded-lg p-2" 75 > 76 + <UnderlineIconRouterLink 77 + to={`/${handle}`} 78 + label="Profile" 79 + icon={LucideCircleUserRound({})} 80 + className="gap-2 pl-2" 81 + labelClassName="text-sm text-text" 82 + underlineClassName="bg-text" 83 + iconClassName="text-text" 84 + /> 85 <SignOutButton /> 86 </DropdownModal> 87 );

+5 -5

src/routes/_layout/$identifier/$repo/index.tsx

··· 1 - import { createFileRoute } from '@tanstack/react-router' 2 3 - export const Route = createFileRoute('/_layout/$identifier/$repo/')({ 4 - component: RouteComponent, 5 - }) 6 7 function RouteComponent() { 8 - return <div>Hello "/_layout/$identifier/$repo/"!</div> 9 }

··· 1 + import { createFileRoute } from "@tanstack/react-router"; 2 3 + export const Route = createFileRoute("/_layout/$identifier/$repo/")({ 4 + component: RouteComponent, 5 + }); 6 7 function RouteComponent() { 8 + return <div>Hello "/_layout/$identifier/$repo/"!</div>; 9 }

+6 -5

src/routes/_layout/$identifier/index.tsx

··· 1 - import { createFileRoute } from '@tanstack/react-router' 2 3 - export const Route = createFileRoute('/_layout/$identifier/')({ 4 - component: RouteComponent, 5 - }) 6 7 function RouteComponent() { 8 - return <div>Hello "/_layout/$identifier/"!</div> 0 9 }

··· 1 + import { createFileRoute } from "@tanstack/react-router"; 2 3 + export const Route = createFileRoute("/_layout/$identifier/")({ 4 + component: RouteComponent, 5 + }); 6 7 function RouteComponent() { 8 + const { identifier } = Route.useParams(); 9 + return <div>{identifier}'s profile</div>; 10 }