diff --git a/CHANGELOG.md b/CHANGELOG.md index 1a81bda8397..ec39d2623ac 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,8 @@ ## Unreleased (develop) +- fixed: Notification center cards no longer shrink their text to fit. Long titles and messages now truncate with an ellipsis so every card renders at the same size. + ## 4.50.0 (2026-07-21) - added: Changelly swap provider diff --git a/eslint.config.mjs b/eslint.config.mjs index 988cc271d09..e9c9aa43d0c 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -231,7 +231,6 @@ export default [ 'src/components/modals/WalletListSortModal.tsx', 'src/components/modals/WcSmartContractModal.tsx', - 'src/components/navigation/AlertDropdown.tsx', 'src/components/navigation/BackButton.tsx', 'src/components/navigation/CurrencySettingsTitle.tsx', 'src/components/navigation/EdgeHeader.tsx', @@ -245,7 +244,7 @@ export default [ 'src/components/navigation/ParamHeaderTitle.tsx', 'src/components/navigation/SideMenuButton.tsx', 'src/components/navigation/TransactionDetailsTitle.tsx', - 'src/components/notification/NotificationCenterCard.tsx', + 'src/components/progress-indicators/AccountSyncBar.tsx', 'src/components/progress-indicators/FullScreenLoader.tsx', diff --git a/src/components/navigation/AlertDropdown.tsx b/src/components/navigation/AlertDropdown.tsx index b6418f54227..1cf0078b9fd 100644 --- a/src/components/navigation/AlertDropdown.tsx +++ b/src/components/navigation/AlertDropdown.tsx @@ -36,7 +36,7 @@ interface Props { onPress?: () => void | Promise } -export function AlertDropdown(props: Props) { +export const AlertDropdown: React.FC = props => { const { bridge, error, @@ -95,7 +95,7 @@ export function AlertDropdown(props: Props) { {message} - + void | Promise } -export const NotificationCenterRow = (props: Props) => { +export const NotificationCenterRow: React.FC = props => { const theme = useTheme() const styles = getStyles(theme) @@ -71,7 +71,7 @@ interface NotificationCenterCardProps { onClose?: () => void | Promise } -const NotificationCenterCard = (props: NotificationCenterCardProps) => { +const NotificationCenterCard: React.FC = props => { const theme = useTheme() const styles = getStyles(theme) @@ -98,15 +98,24 @@ const NotificationCenterCard = (props: NotificationCenterCardProps) => { - + {/* Font scaling is disabled so every card renders at the same text + size. Long titles and messages wrap up to their line limit and + then truncate with an ellipsis instead of shrinking. */} + {title} - {toLocaleTime(date)} + + {toLocaleTime(date)} + {message} @@ -114,11 +123,7 @@ const NotificationCenterCard = (props: NotificationCenterCardProps) => { {onClose == null ? null : ( - + )}