feat(recolouring): update app-bar avatar background color (#3455)

Co-authored-by: Ddouglasz <[email protected]>
commercetools · Mar 20, 2024 · a79f068 · a79f068 · github-actions · Mar 20, 2024
1 parent cf7c7bb
commit a79f068
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 0 deletions.
diff --git a/.changeset/early-dots-obey.md b/.changeset/early-dots-obey.md
@@ -0,0 +1,5 @@
+---
+'@commercetools-frontend/application-shell': minor
+---
+
+Update app-bar user settings avatar to display the new recolouring background color
diff --git a/packages/application-shell/src/components/user-settings-menu/user-settings-menu.tsx b/packages/application-shell/src/components/user-settings-menu/user-settings-menu.tsx
@@ -182,6 +182,7 @@ const getUserSettingsMenuItemLinkStyles = () => css`
 const UserSettingsMenuBody = (props: MenuBodyProps) => {
   // Focus on a menu item when it's opened through keyboard
   const menuElementRef = useRef<HTMLAnchorElement>(null);
+  const { themedValue } = useTheme();
   useEffect(() => {
     menuElementRef.current?.focus();
   }, []);
@@ -216,6 +217,7 @@ const UserSettingsMenuBody = (props: MenuBodyProps) => {
               firstName={props.firstName}
               lastName={props.lastName}
               gravatarHash={props.gravatarHash}
+              color={themedValue('accent', 'purple')}
             />
             <div>
               <Text.Subheadline as="h4">