From 812b17a221eab8cb5fb600e4587bf7104482dd57 Mon Sep 17 00:00:00 2001
From: Carlos Valente <carlosvalente@pm.me>
Date: Sun, 26 Oct 2025 14:15:35 +0100
Subject: [PATCH] refactor: create destructive menu type

---
 .../components/dropdown-menu/DropdownMenu.module.scss     | 8 +++++++-
 .../src/common/components/dropdown-menu/DropdownMenu.tsx  | 4 ++--
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/apps/client/src/common/components/dropdown-menu/DropdownMenu.module.scss b/apps/client/src/common/components/dropdown-menu/DropdownMenu.module.scss
index fa477c337..ce57bb3da 100644
--- a/apps/client/src/common/components/dropdown-menu/DropdownMenu.module.scss
+++ b/apps/client/src/common/components/dropdown-menu/DropdownMenu.module.scss
@@ -27,7 +27,6 @@
   }
 }
 
-
 .item {
   outline: 0;
   cursor: default;
@@ -61,6 +60,13 @@
     border-radius: 3px;
     background-color: $gray-1000;
   }
+
+  &[data-type='destructive'] {
+    color: $red-500;
+    svg {
+      color: $red-500;
+    }
+  }
 }
 
 .separator {
diff --git a/apps/client/src/common/components/dropdown-menu/DropdownMenu.tsx b/apps/client/src/common/components/dropdown-menu/DropdownMenu.tsx
index 9181871fd..2c97fb107 100644
--- a/apps/client/src/common/components/dropdown-menu/DropdownMenu.tsx
+++ b/apps/client/src/common/components/dropdown-menu/DropdownMenu.tsx
@@ -6,7 +6,7 @@ import style from './DropdownMenu.module.scss';
 
 type DropdownMenuItemDivider = { type: 'divider' };
 type DropdownMenuItem = {
-  type: 'item';
+  type: 'item' | 'destructive';
   label: string;
   icon?: IconType;
   disabled?: boolean;
@@ -31,7 +31,7 @@ export function DropdownMenu({ items, children, ...triggerProps }: PropsWithChil
                 return <BaseMenu.Separator key={index} className={style.separator} />;
               }
               return (
-                <BaseMenu.Item key={index} className={style.item} onClick={item.onClick} disabled={item.disabled}>
+                <BaseMenu.Item key={index} className={style.item} onClick={item.onClick} disabled={item.disabled} data-type={item.type}>
                   {item.icon && <item.icon />}
                   {item.label}
                 </BaseMenu.Item>