fix: Using correct icon and color for away + out-of-office PresenceBa…

…dge (#26655) * fix: Using correct icon and color for away + out-of-office PresenceBadge. * Adding change file. --------- Co-authored-by: Humberto Makoto Morimoto Burgos <[email protected]>
microsoft · Feb 4, 2023 · fe583c0 · fe583c0
1 parent a29dcc5
commit fe583c0
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 5 deletions.
diff --git a/change/@fluentui-react-badge-1d02e00e-35d1-4d9a-8f0e-9a522c35bd8d.json b/change/@fluentui-react-badge-1d02e00e-35d1-4d9a-8f0e-9a522c35bd8d.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix: Using correct icon and color for away + out-of-office PresenceBadge.",
+  "packageName": "@fluentui/react-badge",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react-components/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx b/packages/react-components/react-badge/src/components/PresenceBadge/usePresenceBadge.tsx
@@ -20,7 +20,7 @@ const iconMap = (status: PresenceBadgeState['status'], outOfOffice: boolean, siz
     case 'available':
       return outOfOffice ? presenceAvailableRegular[size] : presenceAvailableFilled[size];
     case 'away':
-      return outOfOffice ? presenceOfflineRegular[size] : presenceAwayFilled[size];
+      return outOfOffice ? presenceOofRegular[size] : presenceAwayFilled[size];
     case 'blocked':
       return presenceBlockedRegular[size];
     case 'busy':

diff --git a/packages/react-components/react-badge/src/components/PresenceBadge/usePresenceBadgeStyles.ts b/packages/react-components/react-badge/src/components/PresenceBadge/usePresenceBadgeStyles.ts
@@ -55,9 +55,6 @@ const useStyles = makeStyles({
   outOfOfficeBusy: {
     color: tokens.colorPaletteRedBackground3,
   },
-  outOfOfficeAway: {
-    color: tokens.colorPaletteMarigoldBackground3,
-  },
 
   // Icons are not resizeable, and these sizes are currently missing
   // use `!important` to size the currently available icons to the missing ones
@@ -105,7 +102,7 @@ export const usePresenceBadgeStyles_unstable = (state: PresenceBadgeState): Pres
     state.outOfOffice && styles.outOfOffice,
     state.outOfOffice && state.status === 'available' && styles.outOfOfficeAvailable,
     state.outOfOffice && isBusy && styles.outOfOfficeBusy,
-    state.outOfOffice && state.status === 'away' && styles.outOfOfficeAway,
+    state.outOfOffice && state.status === 'away' && styles.statusOutOfOffice,
     state.outOfOffice && state.status === 'offline' && styles.statusOffline,
     state.outOfOffice && state.status === 'out-of-office' && styles.statusOutOfOffice,
     state.size === 'tiny' && styles.tiny,