From 0c7a0cc88a50bd3ec29e7d2873bc012e36567b8c Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Wed, 4 Jan 2023 23:56:09 -0800
Subject: [PATCH] Add danger prop for menu items

---
 src/renderer/components/dropdown-menu/index.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/renderer/components/dropdown-menu/index.tsx b/src/renderer/components/dropdown-menu/index.tsx
index e80ecbdf..2ebf675c 100644
--- a/src/renderer/components/dropdown-menu/index.tsx
+++ b/src/renderer/components/dropdown-menu/index.tsx
@@ -12,6 +12,7 @@ import styled from 'styled-components';
 type MenuProps = MantineMenuProps;
 type MenuLabelProps = MantineMenuLabelProps;
 interface MenuItemProps extends MantineMenuItemProps {
+  $danger?: boolean;
   $isActive?: boolean;
   children: React.ReactNode;
 }
@@ -46,7 +47,7 @@ const StyledMenuItem = styled(MantineMenu.Item)<MenuItemProps>`
   }
 
   & .mantine-Menu-itemLabel {
-    color: var(--dropdown-menu-fg);
+    color: ${(props) => (props.$danger ? 'var(--danger-color)' : 'var(--dropdown-menu-fg)')};
     font-weight: 500;
     font-size: 1em;
   }
@@ -90,9 +91,10 @@ const MenuLabel = ({ children, ...props }: MenuLabelProps) => {
   return <StyledMenuLabel {...props}>{children}</StyledMenuLabel>;
 };
 
-const pMenuItem = ({ $isActive, children, ...props }: MenuItemProps) => {
+const pMenuItem = ({ $isActive, $danger, children, ...props }: MenuItemProps) => {
   return (
     <StyledMenuItem
+      $danger={$danger}
       $isActive={$isActive}
       rightSection={$isActive && <RiArrowLeftSFill size={20} />}
       {...props}