Add tooltips for edit/delete buttons

This commit is contained in:
binwiederhier
2026-03-08 18:30:11 -04:00
parent 109271a930
commit bcd07115c2
3 changed files with 38 additions and 23 deletions

View File

@@ -1755,8 +1755,9 @@ and the [ntfy Android app](https://github.com/binwiederhier/ntfy-android/release
## Not released yet ## Not released yet
### ntfy server v2.19.0 (UNRELEASED) ### ntfy server v2.19.x (UNRELEASED)
**Bug fixes + maintenance:** **Bug fixes + maintenance:**
* Throttle notification sound in web app to play at most once every 2 seconds * Web: Throttle notification sound in web app to play at most once every 2 seconds (similar to [#1550](https://github.com/binwiederhier/ntfy/issues/1550), thanks to [@jlaffaye](https://github.com/jlaffaye) for reporting)
* Web: Add hover tooltips to icon buttons in web app account and preferences pages ([#1565](https://github.com/binwiederhier/ntfy/issues/1565), thanks to [@jermanuts](https://github.com/jermanuts) for reporting)

View File

@@ -136,9 +136,11 @@ const ChangePassword = () => {
</Typography> </Typography>
{!account?.provisioned ? ( {!account?.provisioned ? (
<IconButton onClick={handleDialogOpen} aria-label={t("account_basics_password_description")}> <Tooltip title={t("account_basics_password_description")}>
<EditIcon /> <IconButton onClick={handleDialogOpen} aria-label={t("account_basics_password_description")}>
</IconButton> <EditIcon />
</IconButton>
</Tooltip>
) : ( ) : (
<Tooltip title={t("account_basics_cannot_edit_or_delete_provisioned_user")}> <Tooltip title={t("account_basics_cannot_edit_or_delete_provisioned_user")}>
<span> <span>
@@ -899,12 +901,16 @@ const TokensTable = (props) => {
<TableCell align="right" sx={{ whiteSpace: "nowrap" }}> <TableCell align="right" sx={{ whiteSpace: "nowrap" }}>
{token.token !== session.token() && !token.provisioned && ( {token.token !== session.token() && !token.provisioned && (
<> <>
<IconButton onClick={() => handleEditClick(token)} aria-label={t("account_tokens_dialog_title_edit")}> <Tooltip title={t("account_tokens_dialog_title_edit")}>
<EditIcon /> <IconButton onClick={() => handleEditClick(token)} aria-label={t("account_tokens_dialog_title_edit")}>
</IconButton> <EditIcon />
<IconButton onClick={() => handleDeleteClick(token)} aria-label={t("account_tokens_dialog_title_delete")}> </IconButton>
<CloseIcon /> </Tooltip>
</IconButton> <Tooltip title={t("account_tokens_dialog_title_delete")}>
<IconButton onClick={() => handleDeleteClick(token)} aria-label={t("account_tokens_dialog_title_delete")}>
<CloseIcon />
</IconButton>
</Tooltip>
</> </>
)} )}
{token.token === session.token() && ( {token.token === session.token() && (

View File

@@ -385,12 +385,16 @@ const UserTable = (props) => {
<TableCell align="right" sx={{ whiteSpace: "nowrap" }}> <TableCell align="right" sx={{ whiteSpace: "nowrap" }}>
{(!session.exists() || user.baseUrl !== config.base_url) && ( {(!session.exists() || user.baseUrl !== config.base_url) && (
<> <>
<IconButton onClick={() => handleEditClick(user)} aria-label={t("prefs_users_edit_button")}> <Tooltip title={t("prefs_users_edit_button")}>
<EditIcon /> <IconButton onClick={() => handleEditClick(user)} aria-label={t("prefs_users_edit_button")}>
</IconButton> <EditIcon />
<IconButton onClick={() => handleDeleteClick(user)} aria-label={t("prefs_users_delete_button")}> </IconButton>
<CloseIcon /> </Tooltip>
</IconButton> <Tooltip title={t("prefs_users_delete_button")}>
<IconButton onClick={() => handleDeleteClick(user)} aria-label={t("prefs_users_delete_button")}>
<CloseIcon />
</IconButton>
</Tooltip>
</> </>
)} )}
{session.exists() && user.baseUrl === config.base_url && ( {session.exists() && user.baseUrl === config.base_url && (
@@ -738,12 +742,16 @@ const ReservationsTable = (props) => {
/> />
</Tooltip> </Tooltip>
)} )}
<IconButton onClick={() => handleEditClick(reservation)} aria-label={t("prefs_reservations_edit_button")}> <Tooltip title={t("prefs_reservations_edit_button")}>
<EditIcon /> <IconButton onClick={() => handleEditClick(reservation)} aria-label={t("prefs_reservations_edit_button")}>
</IconButton> <EditIcon />
<IconButton onClick={() => handleDeleteClick(reservation)} aria-label={t("prefs_reservations_delete_button")}> </IconButton>
<CloseIcon /> </Tooltip>
</IconButton> <Tooltip title={t("prefs_reservations_delete_button")}>
<IconButton onClick={() => handleDeleteClick(reservation)} aria-label={t("prefs_reservations_delete_button")}>
<CloseIcon />
</IconButton>
</Tooltip>
</TableCell> </TableCell>
</TableRow> </TableRow>
))} ))}