diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 841f00b5f72..32fdf2cb53a 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -6332,6 +6332,14 @@ "message": "Custom time", "description": "Text for an option in Conversation Details Disappearing Messages setting when user previously selected custom time" }, + "DisappearingTimeDialog__label--value": { + "message": "Number", + "description": "aria-label for the number select box" + }, + "DisappearingTimeDialog__label--units": { + "message": "Unit of time", + "description": "aria-label for the units of time select box" + }, "DisappearingTimeDialog__title": { "message": "Custom Time", "description": "Title for the custom disappearing message timeout dialog" diff --git a/ts/components/DisappearingTimeDialog.tsx b/ts/components/DisappearingTimeDialog.tsx index 393104b6938..123b16a9e5f 100644 --- a/ts/components/DisappearingTimeDialog.tsx +++ b/ts/components/DisappearingTimeDialog.tsx @@ -1,4 +1,4 @@ -// Copyright 2021 Signal Messenger, LLC +// Copyright 2021-2022 Signal Messenger, LLC // SPDX-License-Identifier: AGPL-3.0-only import React, { useState } from 'react'; @@ -91,12 +91,14 @@ export function DisappearingTimeDialog(props: PropsType): JSX.Element {

{i18n('DisappearingTimeDialog__body')}

{ diff --git a/ts/components/Preferences.tsx b/ts/components/Preferences.tsx index 0b53292509d..bfff5616f63 100644 --- a/ts/components/Preferences.tsx +++ b/ts/components/Preferences.tsx @@ -1,4 +1,4 @@ -// Copyright 2021 Signal Messenger, LLC +// Copyright 2021-2022 Signal Messenger, LLC // SPDX-License-Identifier: AGPL-3.0-only import type { ReactNode } from 'react'; @@ -36,6 +36,7 @@ import { format as formatExpirationTimer, } from '../util/expirationTimer'; import { useEscapeHandling } from '../hooks/useEscapeHandling'; +import { useUniqueId } from '../hooks/useUniqueId'; type CheckboxChangeHandlerType = (value: boolean) => unknown; type SelectChangeHandlerType = (value: T) => unknown; @@ -263,6 +264,9 @@ export const Preferences = ({ whoCanSeeMe, zoomFactor, }: PropsType): JSX.Element => { + const themeSelectId = useUniqueId(); + const zoomSelectId = useUniqueId(); + const [confirmDelete, setConfirmDelete] = useState(false); const [page, setPage] = useState(Page.General); const [showSyncFailed, setShowSyncFailed] = useState(false); @@ -410,9 +414,14 @@ export const Preferences = ({ + {i18n('Preferences--theme')} + + } right={ { + const muteNotificationsSelectId = useUniqueId(); + const mentionsSelectId = useUniqueId(); const muteOptions = useMemo( () => [ ...(isMuted(muteExpiresAt) @@ -79,9 +82,18 @@ export const ConversationNotificationsSettings: FunctionComponent< icon={IconType.mute} /> } - label={i18n('muteNotificationsTitle')} + label={ + + } right={ - } /> {conversationType === 'group' && ( @@ -94,10 +106,15 @@ export const ConversationNotificationsSettings: FunctionComponent< icon={IconType.mention} /> } - label={i18n('ConversationNotificationsSettings__mentions__label')} + label={ + + } info={i18n('ConversationNotificationsSettings__mentions__info')} right={ = ({ + {i18n('GroupLinkManagement--approve-label')} + + } right={ + {i18n('ConversationDetails--group-info-label')} + + } info={i18n('ConversationDetails--group-info-info')} right={