+3

src/routes/(app)/(profile)/[actor=didOrHandle]/+layout.svelte

reviewed

··· 6 6 import { formatCompactNumber } from '$lib/utils/intl/number'; 7 7 8 8 import ProfileAside from './components/profile-aside.svelte'; 9 9 + import ProfileMetaTags from './components/profile-meta-tags.svelte'; 9 10 10 11 const { children, data }: LayoutProps = $props(); 11 12 ··· 21 22 <link rel="alternate" href="{base}/{data.profile.did}/rss" type="application/rss+xml" /> 22 23 <link rel="alternate" href="at://{data.profile.did}/app.bsky.actor.profile/self" /> 23 24 </svelte:head> 25 25 + 26 26 + <ProfileMetaTags {profile} /> 24 27 25 28 {#key profile.did} 26 29 <div class="profile-layout">

+30

src/routes/(app)/(profile)/[actor=didOrHandle]/components/profile-meta-tags.svelte

reviewed

··· 1 1 + <script lang="ts"> 2 2 + import type { AppBskyActorDefs } from '@atcute/client/lexicons'; 3 3 + 4 4 + import { PUBLIC_APP_NAME, PUBLIC_APP_URL } from '$env/static/public'; 5 5 + 6 6 + interface Props { 7 7 + profile: AppBskyActorDefs.ProfileViewDetailed; 8 8 + } 9 9 + 10 10 + const { profile }: Props = $props(); 11 11 + </script> 12 12 + 13 13 + <svelte:head> 14 14 + <meta property="og:site_name" content={PUBLIC_APP_NAME} /> 15 15 + <meta property="og:type" content="profile" /> 16 16 + <meta property="twitter:card" content="summary" /> 17 17 + <meta property="og:url" content="{PUBLIC_APP_URL}/{profile.did}" /> 18 18 + <meta property="profile:username" content={profile.handle} /> 19 19 + <meta 20 20 + property="og:title" 21 21 + content={profile.displayName?.trim() 22 22 + ? `${profile.displayName} (@${profile.handle})` 23 23 + : `@${profile.handle}`} 24 24 + /> 25 25 + <meta property="og:description" content={profile.description} /> 26 26 + 27 27 + {#if profile.avatar} 28 28 + <meta property="og:image" content={profile.avatar} /> 29 29 + {/if} 30 30 + </svelte:head>