From 1e7760f514cfd7e28cef6ff6da4ee5f2d59b6c65 Mon Sep 17 00:00:00 2001
From: Danny White <3104761+dnywh@users.noreply.github.com>
Date: Mon, 4 May 2026 17:12:47 +1000
Subject: [PATCH] match auth email paygate dropdown pattern

---
 ...stomEmailTemplateRestrictionAdmonition.tsx | 28 +++++++++++++------
 1 file changed, 20 insertions(+), 8 deletions(-)

diff --git a/apps/studio/components/interfaces/Auth/EmailTemplates/CustomEmailTemplateRestrictionAdmonition.tsx b/apps/studio/components/interfaces/Auth/EmailTemplates/CustomEmailTemplateRestrictionAdmonition.tsx
index db0fcd25185..6663584c73a 100644
--- a/apps/studio/components/interfaces/Auth/EmailTemplates/CustomEmailTemplateRestrictionAdmonition.tsx
+++ b/apps/studio/components/interfaces/Auth/EmailTemplates/CustomEmailTemplateRestrictionAdmonition.tsx
@@ -26,29 +26,41 @@ export const CustomEmailTemplateRestrictionAdmonition = ({
       type="default"
       layout="responsive"
       title="Set up Custom SMTP to edit templates"
-      description="Default templates are read-only while this project uses Supabase's built-in email service. Set up Custom SMTP, or sign up to Pro, to edit them."
+      description="Default templates are read-only while this project uses Supabase’s built-in email service. Set up Custom SMTP or sign up to Pro to edit templates."
       actions={
-        <div className="flex flex-col items-start gap-1">
-          <Button asChild type="default">
+        <div className="flex w-full @lg:w-auto">
+          <Button asChild type="default" className="flex-1 rounded-r-none px-3 @lg:flex-none">
             <Link href={`/project/${projectRef ?? '_'}/auth/smtp`}>Set up SMTP</Link>
           </Button>
           <DropdownMenu>
             <DropdownMenuTrigger asChild>
-              <Button type="text" size="tiny" iconRight={<ChevronDown size={14} />}>
-                Other options
-              </Button>
+              <Button
+                type="default"
+                className="shrink-0 rounded-l-none px-[4px] py-[5px] -ml-px"
+                icon={<ChevronDown />}
+              />
             </DropdownMenuTrigger>
             <DropdownMenuContent align="end" className="w-52">
               <DropdownMenuItem asChild>
                 <Link
                   href={`/org/${organizationSlug}/billing?panel=subscriptionPlan&source=authEmailTemplates`}
                 >
-                  Upgrade to Pro
+                  <div className="space-y-0.5">
+                    <p className="block text-foreground">Upgrade to Pro</p>
+                    <p className="block text-foreground-light">
+                      Edit templates while using Supabase email.
+                    </p>
+                  </div>
                 </Link>
               </DropdownMenuItem>
               <DropdownMenuItem asChild>
                 <Link href={`/project/${projectRef ?? '_'}/auth/hooks`}>
-                  Configure send-email hook
+                  <div className="space-y-0.5">
+                    <p className="block text-foreground">Configure send-email hook</p>
+                    <p className="block text-foreground-light">
+                      Send auth emails through your own workflow.
+                    </p>
+                  </div>
                 </Link>
               </DropdownMenuItem>
             </DropdownMenuContent>