Merge pull request #2279 from daostack/bugfix/CW-2245-chat-message-menu

Messages action menu issues #2245
daostack · Oct 31, 2023 · 3a612a9 · 3a612a9
2 parents 1905140 + 00ed70f
commit 3a612a9
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 6 deletions.
diff --git a/src/shared/components/Chat/ChatMessage/ChatMessage.module.scss b/src/shared/components/Chat/ChatMessage/ChatMessage.module.scss
@@ -68,6 +68,17 @@
   }
 }
 
+.elementDropdownMenu {
+  direction: ltr;
+}
+
+.menuArrowButton {
+  display: none;
+}
+.menuArrowButtonVisible {
+  display: block;
+}
+
 .messageTextWithReply {
   padding: 0.25rem 0rem 0.5rem;
 }
@@ -220,10 +231,6 @@
   }
 }
 
-.menuArrowButton {
-  display: none;
-}
-
 .highlighted {
   animation: highlighted 10s forwards;
   border: 0.06rem solid $c-pink-active-feed-cards;

diff --git a/src/shared/components/Chat/ChatMessage/ChatMessage.tsx b/src/shared/components/Chat/ChatMessage/ChatMessage.tsx
@@ -448,7 +448,10 @@ export default function ChatMessage({
                   isControlledDropdown={false}
                   isOpen={isMenuOpen}
                   styles={{
-                    menuButton: styles.menuArrowButton,
+                    menu: styles.elementDropdownMenu,
+                    menuButton: classNames(styles.menuArrowButton, {
+                      [styles.menuArrowButtonVisible]: isMenuOpen,
+                    }),
                   }}
                   feedItemId={feedItemId}
                   onDelete={onMessageDelete}

diff --git a/src/shared/components/ElementDropdown/ElementDropdown.tsx b/src/shared/components/ElementDropdown/ElementDropdown.tsx
@@ -340,7 +340,7 @@ const ElementDropdown: FC<ElementDropdownProps> = ({
             menuButton: classNames(styles?.menuButton, {
               "element-dropdown__menu-button--transparent": transparent,
             }),
-            menu: "element-dropdown__menu",
+            menu: classNames("element-dropdown__menu", styles?.menu),
             menuItem: "element-dropdown__menu-item",
           }}
         />