wip: browse user

src/shared/composer/modal.tsx

@@ -28,7 +28,7 @@ export function ComposerModal() {
       <Dialog.Trigger asChild>
         <button
           type="button"
-          className="flex h-9 items-center gap-2 rounded-full border-t border-white/10 bg-white/20 px-4 text-sm font-semibold leading-none text-white/80 hover:bg-fuchsia-500 hover:text-white"
+          className="flex h-9 items-center gap-2 rounded-full border-t border-white/10 bg-white/20 px-4 text-sm font-semibold text-white/80 hover:bg-fuchsia-500 hover:text-white"
         >
           New
           <ComposeIcon className="h-4 w-4 text-white" />

src/shared/navigation.tsx

@@ -50,7 +50,7 @@ export function Navigation() {
             Home
           </NavLink>
           <NavLink
-            to="/browse"
+            to="/browse/"
             preventScrollReset={true}
             className={({ isActive }) =>
               twMerge(

src/shared/user.tsx

@@ -20,7 +20,15 @@ export const User = memo(function User({
 }: {
   pubkey: string;
   time?: number;
-  variant?: 'default' | 'simple' | 'mention' | 'repost' | 'chat' | 'large' | 'thread';
+  variant?:
+    | 'default'
+    | 'simple'
+    | 'mention'
+    | 'repost'
+    | 'chat'
+    | 'large'
+    | 'thread'
+    | 'avatar';
   embedProfile?: string;
 }) {
   const { status, user } = useProfile(pubkey, embedProfile);
@@ -125,6 +133,16 @@ export const User = memo(function User({
     );
   }
 
+  if (variant === 'avatar') {
+    return (
+      <Image
+        src={user?.picture || user?.image}
+        alt={pubkey}
+        className="h-12 w-12 shrink-0 rounded-lg object-cover"
+      />
+    );
+  }
+
   if (variant === 'repost') {
     return (
       <>

src/shared/widgets/local/thread.tsx

@@ -44,7 +44,7 @@ export function LocalThreadWidget({ params }: { params: Widget }) {
   return (
     <WidgetWrapper>
       <TitleBar id={params.id} title={params.title} />
-      <div className="h-full">
+      <div className="scrollbar-hide h-full overflow-y-auto">
         {status === 'loading' ? (
           <div className="px-3 py-1.5">
             <div className="rounded-xl bg-white/10 px-3 py-3 backdrop-blur-xl">