fix: delete message action UI and resend icon (#2597)

GetStream · Jul 19, 2024 · 6cd283b · 6cd283b
1 parent a7387a2
commit 6cd283b
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 9 deletions.
diff --git a/package/src/components/Message/hooks/useMessageActions.tsx b/package/src/components/Message/hooks/useMessageActions.tsx
@@ -18,7 +18,7 @@ import {
   MessageFlag,
   Mute,
   Pin,
-  SendUp,
+  Resend,
   ThreadReply,
   Unpin,
   UserDelete,
@@ -95,7 +95,7 @@ export const useMessageActions = <
   }) => {
   const {
     theme: {
-      colors: { accent_blue, accent_red, grey },
+      colors: { accent_red, grey },
     },
   } = useTheme();
   const {
@@ -179,7 +179,7 @@ export const useMessageActions = <
       handleDeleteMessage();
     },
     actionType: 'deleteMessage',
-    icon: <Delete fill={accent_red} size={32} />,
+    icon: <Delete fill={accent_red} size={24} />,
     title: t('Delete Message'),
     titleStyle: { color: accent_red },
   };
@@ -206,7 +206,7 @@ export const useMessageActions = <
       handleTogglePinMessage();
     },
     actionType: 'pinMessage',
-    icon: <Pin height={23} pathFill={grey} width={24} />,
+    icon: <Pin pathFill={grey} size={24} />,
     title: t('Pin to Conversation'),
   };
 
@@ -289,7 +289,7 @@ export const useMessageActions = <
       await handleResendMessage();
     },
     actionType: 'retry',
-    icon: <SendUp fill={accent_blue} size={32} />,
+    icon: <Resend pathFill={grey} />,
     title: t('Resend'),
   };
 

diff --git a/package/src/icons/Pin.tsx b/package/src/icons/Pin.tsx
@@ -2,11 +2,15 @@ import React from 'react';
 
 import { IconProps, RootPath, RootSvg } from './utils/base';
 
-export const Pin = (props: IconProps) => (
+type Props = IconProps & {
+  size: number;
+};
+
+export const Pin = (props: Props) => (
   <RootSvg
-    height={props.height}
-    viewBox={`0 0 ${props.height} ${props.width}`}
-    width={props.width}
+    height={props.size}
+    viewBox={`0 0 ${props.size} ${props.size}`}
+    width={props.size}
     {...props}
   >
     <RootPath

diff --git a/package/src/icons/Resend.tsx b/package/src/icons/Resend.tsx
@@ -0,0 +1,12 @@
+import React from 'react';
+
+import { IconProps, RootPath, RootSvg } from './utils/base';
+
+export const Resend = (props: IconProps) => (
+  <RootSvg {...props}>
+    <RootPath
+      d='M10 8.5V4.5L3 11.5L10 18.5V14.4C15 14.4 18.5 16 21 19.5C20 14.5 17 9.5 10 8.5Z'
+      {...props}
+    />
+  </RootSvg>
+);
diff --git a/package/src/icons/index.ts b/package/src/icons/index.ts
@@ -61,6 +61,7 @@ export * from './PPT';
 export * from './PPTX';
 export * from './RAR';
 export * from './Refresh';
+export * from './Resend';
 export * from './RTF';
 export * from './Search';
 export * from './SendCheck';