CodeMirror/ntfy
1
0
Fork 0
mirror of https://github.com/binwiederhier/ntfy.git synced 2024-06-29 11:30:37 +12:00
Code Issues Projects Releases Wiki Activity

More labels, and live regions

Browse source
This commit is contained in:
Philipp Heckel 2022-05-03 15:09:20 -04:00
parent 8a7bc38861
commit 15a45d9eb7
3 changed files with 22 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
web/public/static/langs/en.json
View file

@ -5,8 +5,8 @@
"action_bar_send_test_notification": "Send test notification", "action_bar_send_test_notification": "Send test notification",
"action_bar_clear_notifications": "Clear all notifications", "action_bar_clear_notifications": "Clear all notifications",
"action_bar_unsubscribe": "Unsubscribe", "action_bar_unsubscribe": "Unsubscribe",
"action_bar_toggle_mute": "Toggle mute notifications", "action_bar_toggle_mute": "Mute/unmute notifications",
"action_bar_toggle_action_menu": "Toggle action menu", "action_bar_toggle_action_menu": "Open/close action menu",
"message_bar_type_message": "Type a message here", "message_bar_type_message": "Type a message here",
"message_bar_error_publishing": "Error publishing notification", "message_bar_error_publishing": "Error publishing notification",
"message_bar_show_dialog": "Show publish dialog", "message_bar_show_dialog": "Show publish dialog",
@ -17,6 +17,8 @@
"nav_button_documentation": "Documentation", "nav_button_documentation": "Documentation",
"nav_button_publish_message": "Publish notification", "nav_button_publish_message": "Publish notification",
"nav_button_subscribe": "Subscribe to topic", "nav_button_subscribe": "Subscribe to topic",
"nav_button_muted": "Notifications muted",
"nav_button_connecting": "connecting",
"alert_grant_title": "Notifications are disabled", "alert_grant_title": "Notifications are disabled",
"alert_grant_description": "Grant your browser permission to display desktop notifications.", "alert_grant_description": "Grant your browser permission to display desktop notifications.",
"alert_grant_button": "Grant now", "alert_grant_button": "Grant now",

14
web/src/components/DialogFooter.js
View file

@ -12,11 +12,15 @@ const DialogFooter = (props) => {
paddingLeft: '24px', paddingLeft: '24px',
paddingBottom: '8px', paddingBottom: '8px',
}}> }}>
<DialogContentText component="div" sx={{ <DialogContentText
margin: '0px', component="div"
paddingTop: '12px', aria-live="polite"
paddingBottom: '4px' sx={{
}}> margin: '0px',
paddingTop: '12px',
paddingBottom: '4px'
}}
>
{props.status} {props.status}
</DialogContentText> </DialogContentText>
<DialogActions sx={{paddingRight: 2}}> <DialogActions sx={{paddingRight: 2}}>

14
web/src/components/Navigation.js
View file

@ -33,13 +33,13 @@ const Navigation = (props) => {
return ( return (
<Box <Box
component="nav" component="nav"
role="navigation" role="navigation"
sx={{width: {sm: Navigation.width}, flexShrink: {sm: 0}}} sx={{width: {sm: Navigation.width}, flexShrink: {sm: 0}}}
> >
{/* Mobile drawer; only shown if menu icon clicked (mobile open) and display is small */} {/* Mobile drawer; only shown if menu icon clicked (mobile open) and display is small */}
<Drawer <Drawer
variant="temporary" variant="temporary"
role="menubar" role="menubar"
open={props.mobileDrawerOpen} open={props.mobileDrawerOpen}
onClose={props.onMobileDrawerToggle} onClose={props.onMobileDrawerToggle}
ModalProps={{ keepMounted: true }} // Better open performance on mobile. ModalProps={{ keepMounted: true }} // Better open performance on mobile.
@ -54,7 +54,7 @@ const Navigation = (props) => {
<Drawer <Drawer
open open
variant="permanent" variant="permanent"
role="menubar" role="menubar"
sx={{ sx={{
display: { xs: 'none', sm: 'block' }, display: { xs: 'none', sm: 'block' },
'& .MuiDrawer-paper': { boxSizing: 'border-box', width: navWidth }, '& .MuiDrawer-paper': { boxSizing: 'border-box', width: navWidth },
@ -163,6 +163,7 @@ const SubscriptionList = (props) => {
} }
const SubscriptionItem = (props) => { const SubscriptionItem = (props) => {
const { t } = useTranslation();
const navigate = useNavigate(); const navigate = useNavigate();
const subscription = props.subscription; const subscription = props.subscription;
const iconBadge = (subscription.new <= 99) ? subscription.new : "99+"; const iconBadge = (subscription.new <= 99) ? subscription.new : "99+";
@ -172,16 +173,19 @@ const SubscriptionItem = (props) => {
const label = (subscription.baseUrl === window.location.origin) const label = (subscription.baseUrl === window.location.origin)
? subscription.topic ? subscription.topic
: topicShortUrl(subscription.baseUrl, subscription.topic); : topicShortUrl(subscription.baseUrl, subscription.topic);
const ariaLabel = (subscription.state === ConnectionState.Connecting)
? `${label} (${t("nav_button_connecting")})`
: label;
const handleClick = async () => { const handleClick = async () => {
navigate(routes.forSubscription(subscription)); navigate(routes.forSubscription(subscription));
await subscriptionManager.markNotificationsRead(subscription.id); await subscriptionManager.markNotificationsRead(subscription.id);
}; };
return ( return (
<ListItemButton onClick={handleClick} selected={props.selected}> <ListItemButton onClick={handleClick} selected={props.selected} aria-label={ariaLabel} aria-live="polite">
<ListItemIcon>{icon}</ListItemIcon> <ListItemIcon>{icon}</ListItemIcon>
<ListItemText primary={label}/> <ListItemText primary={label}/>
{subscription.mutedUntil > 0 && {subscription.mutedUntil > 0 &&
<ListItemIcon edge="end"><NotificationsOffOutlined /></ListItemIcon>} <ListItemIcon edge="end" aria-label={t("nav_button_muted")}><NotificationsOffOutlined /></ListItemIcon>}
</ListItemButton> </ListItemButton>
); );
}; };