fix: apps name misalignment in case of no icons (#30356)

RocketChat · Sep 12, 2023 · 1000b9b · 1000b9b
1 parent b58aee7
commit 1000b9b
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 0 deletions.
diff --git a/.changeset/young-trains-glow.md b/.changeset/young-trains-glow.md
@@ -0,0 +1,5 @@
+---
+'@rocket.chat/meteor': minor
+---
+
+Fixed the issue of apps icon uneven alignment in case of missing icons inside message composer toolbar & message toolbar menu.
diff --git a/apps/meteor/client/components/message/toolbox/MessageActionMenu.tsx b/apps/meteor/client/components/message/toolbox/MessageActionMenu.tsx
@@ -101,6 +101,7 @@ const MessageActionMenu = ({ options, onChangeMenuVisibility, ...props }: Messag
 										data-qa-type='message-action'
 										data-qa-id={option.id}
 										role={option.role ? option.role : 'button'}
+										gap={!option.icon && option.type === 'apps'}
 									/>
 								))}
 								{index !== arr.length - 1 && <OptionDivider />}

diff --git a/...client/views/room/composer/messageBox/MessageBoxActionsToolbar/ActionsToolbarDropdown.tsx b/...client/views/room/composer/messageBox/MessageBoxActionsToolbar/ActionsToolbarDropdown.tsx
@@ -93,6 +93,7 @@ const ActionsToolbarDropdown = ({ isRecording, rid, tmid, actions, ...props }: A
 											chat: chatContext,
 										})
 									}
+									gap={!item.icon}
 								>
 									{item.icon && <OptionIcon name={item.icon as ComponentProps<typeof OptionIcon>['name']} />}
 									<OptionContent>{item.name}</OptionContent>