feat: update client select button style

src/components/ClientSelect/index.tsx

@@ -159,15 +159,17 @@ export default function ClientSelect({
     </div>
   )
 
+  const trigger = (
+    <Button variant="outline" {...props}>
+      <ExternalLink /> {t('Open in another client')}
+    </Button>
+  )
+
   if (isSmallScreen) {
     return (
       <div onClick={(e) => e.stopPropagation()}>
         <Drawer open={open} onOpenChange={setOpen}>
-          <DrawerTrigger asChild>
+          <DrawerTrigger asChild>{trigger}</DrawerTrigger>
-            <Button {...props}>
-              <ExternalLink /> {t('Open in another client')}
-            </Button>
-          </DrawerTrigger>
           <DrawerOverlay
             onClick={(e) => {
               e.stopPropagation()
@@ -183,11 +185,7 @@ export default function ClientSelect({
   return (
     <div onClick={(e) => e.stopPropagation()}>
       <Dialog open={open} onOpenChange={setOpen}>
-        <DialogTrigger asChild>
+        <DialogTrigger asChild>{trigger}</DialogTrigger>
-          <Button {...props}>
-            <ExternalLink /> {t('Open in another client')}
-          </Button>
-        </DialogTrigger>
         <DialogContent className="px-8" onOpenAutoFocus={(e) => e.preventDefault()}>
           {content}
         </DialogContent>

src/components/Embedded/EmbeddedNote.tsx

@@ -52,7 +52,7 @@ function EmbeddedNoteNotFound({ noteId, className }: { noteId: string; className
     <div className={cn('text-left p-2 sm:p-3 border rounded-lg', className)}>
       <div className="flex flex-col items-center text-muted-foreground font-medium gap-2">
         <div>{t('Sorry! The note cannot be found 😔')}</div>
-        <ClientSelect variant="secondary" className="w-full mt-2" originalNoteId={noteId} />
+        <ClientSelect className="w-full mt-2" originalNoteId={noteId} />
       </div>
     </div>
   )

src/components/Note/CommunityDefinition.tsx

@@ -36,7 +36,7 @@ export default function CommunityDefinition({
           {communityDescriptionComponent}
         </div>
       </div>
-      <ClientSelect variant="secondary" className="w-full mt-2" event={event} />
+      <ClientSelect className="w-full mt-2" event={event} />
     </div>
   )
 }

src/components/Note/GroupMetadata.tsx

@@ -38,12 +38,7 @@ export default function GroupMetadata({
           {groupAboutComponent}
         </div>
       </div>
-      <ClientSelect
+      <ClientSelect className="w-full mt-2" event={event} originalNoteId={originalNoteId} />
-        variant="secondary"
-        className="w-full mt-2"
-        event={event}
-        originalNoteId={originalNoteId}
-      />
     </div>
   )
 }

src/components/Note/LiveEvent.tsx

@@ -51,7 +51,7 @@ export default function LiveEvent({ event, className }: { event: Event; classNam
           {liveStatusComponent}
           {summaryComponent}
           {tagsComponent}
-          <ClientSelect variant="secondary" className="w-full mt-2" event={event} />
+          <ClientSelect className="w-full mt-2" event={event} />
         </div>
       </div>
     )
@@ -74,7 +74,7 @@ export default function LiveEvent({ event, className }: { event: Event; classNam
           {tagsComponent}
         </div>
       </div>
-      <ClientSelect variant="secondary" className="w-full mt-2" event={event} />
+      <ClientSelect className="w-full mt-2" event={event} />
     </div>
   )
 }

src/components/Note/LongFormArticle.tsx

@@ -46,7 +46,7 @@ export default function LongFormArticle({
           {titleComponent}
           {summaryComponent}
           {tagsComponent}
-          <ClientSelect variant="secondary" className="w-full mt-2" event={event} />
+          <ClientSelect className="w-full mt-2" event={event} />
         </div>
       </div>
     )
@@ -68,7 +68,7 @@ export default function LongFormArticle({
           {tagsComponent}
         </div>
       </div>
-      <ClientSelect variant="secondary" className="w-full mt-2" event={event} />
+      <ClientSelect className="w-full mt-2" event={event} />
     </div>
   )
 }

src/components/Note/UnknownNote.tsx

@@ -14,7 +14,7 @@ export function UnknownNote({ event, className }: { event: Event; className?: st
       )}
     >
       <div>{t('Cannot handle event of kind k', { k: event.kind })}</div>
-      <ClientSelect event={event} variant="secondary" />
+      <ClientSelect event={event} />
     </div>
   )
 }