fix(clerk-js): Add detructive variant to all destructive Action Card …

…components (#2422)
clerk · Dec 20, 2023 · 07a3cfa · 07a3cfa
1 parent 62936cd
commit 07a3cfa
Show file tree

Hide file tree

Showing 7 changed files with 9 additions and 7 deletions.
diff --git a/.changeset/dirty-swans-joke.md b/.changeset/dirty-swans-joke.md
@@ -0,0 +1,2 @@
+---
+---
diff --git a/packages/clerk-js/src/ui/components/OrganizationProfile/DomainList.tsx b/packages/clerk-js/src/ui/components/OrganizationProfile/DomainList.tsx
@@ -118,7 +118,7 @@ export const DomainList = withGate(
               </ProfileSection.Item>
 
               <Action.Open value='remove'>
-                <Action.Card>
+                <Action.Card variant='destructive'>
                   <RemoveDomainScreen domainId={domain.id} />
                 </Action.Card>
               </Action.Open>

diff --git a/packages/clerk-js/src/ui/components/UserProfile/ConnectedAccountsSection.tsx b/packages/clerk-js/src/ui/components/UserProfile/ConnectedAccountsSection.tsx
@@ -104,7 +104,7 @@ export const ConnectedAccountsSection = () => {
                 </Action.Closed>
 
                 <Action.Open value='remove'>
-                  <Action.Card>
+                  <Action.Card variant='destructive'>
                     <RemoveConnectedAccountScreen accountId={account.id} />
                   </Action.Card>
                 </Action.Open>

diff --git a/packages/clerk-js/src/ui/components/UserProfile/EmailsSection.tsx b/packages/clerk-js/src/ui/components/UserProfile/EmailsSection.tsx
@@ -69,7 +69,7 @@ export const EmailsSection = () => {
               </Action.Closed>
 
               <Action.Open value='remove'>
-                <Action.Card>
+                <Action.Card variant='destructive'>
                   <RemoveEmailScreen emailId={email.id} />
                 </Action.Card>
               </Action.Open>

diff --git a/packages/clerk-js/src/ui/components/UserProfile/MfaSection.tsx b/packages/clerk-js/src/ui/components/UserProfile/MfaSection.tsx
@@ -58,7 +58,7 @@ export const MfaSection = () => {
               </ProfileSection.Item>
 
               <Action.Open value='remove'>
-                <Action.Card>
+                <Action.Card variant='destructive'>
                   <RemoveMfaTOTPScreen />
                 </Action.Card>
               </Action.Open>
@@ -89,7 +89,7 @@ export const MfaSection = () => {
                   </ProfileSection.Item>
 
                   <Action.Open value='remove'>
-                    <Action.Card>
+                    <Action.Card variant='destructive'>
                       <RemoveMfaPhoneCodeScreen phoneId={phone.id} />
                     </Action.Card>
                   </Action.Open>

diff --git a/packages/clerk-js/src/ui/components/UserProfile/PhoneSection.tsx b/packages/clerk-js/src/ui/components/UserProfile/PhoneSection.tsx
@@ -69,7 +69,7 @@ export const PhoneSection = () => {
               </Action.Closed>
 
               <Action.Open value='remove'>
-                <Action.Card>
+                <Action.Card variant='destructive'>
                   <RemovePhoneScreen phoneId={phone.id} />
                 </Action.Card>
               </Action.Open>

diff --git a/packages/clerk-js/src/ui/components/UserProfile/Web3Section.tsx b/packages/clerk-js/src/ui/components/UserProfile/Web3Section.tsx
@@ -71,7 +71,7 @@ export const Web3Section = () => {
                 </Action.Closed>
 
                 <Action.Open value='remove'>
-                  <Action.Card>
+                  <Action.Card variant='destructive'>
                     <RemoveWeb3WalletScreen walletId={wallet.id} />
                   </Action.Card>
                 </Action.Open>