diff --git a/change/@fluentui-react-badge-1d02e00e-35d1-4d9a-8f0e-9a522c35bd8d.json b/change/@fluentui-react-badge-1d02e00e-35d1-4d9a-8f0e-9a522c35bd8d.json new file mode 100644 index 0000000000000..c314e55c06cd7 --- /dev/null +++ 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": "makotom@microsoft.com", + "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 index efabf4169966f..119093d4ecfaa 100644 --- 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 index 991184c868b70..ec765f58d846f 100644 --- 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,