diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index 206c71fd3..43d8ff6f7 100644
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -178,6 +178,7 @@
"messageBody": "Message body",
"unblockToSend": "Unblock this contact to send a message.",
"unblockGroupToSend": "This group is blocked. Unlock it if you would like to send a message.",
+ "timer": "Timer",
"youChangedTheTimer": "You set the disappearing message timer to $time$",
"timerSetOnSync": "Updated disappearing message timer to $time$",
"theyChangedTheTimer": "$name$ set the disappearing message timer to $time$",
diff --git a/ts/components/buttons/PanelButton.tsx b/ts/components/buttons/PanelButton.tsx
index 33585d0c0..284f1e993 100644
--- a/ts/components/buttons/PanelButton.tsx
+++ b/ts/components/buttons/PanelButton.tsx
@@ -21,6 +21,14 @@ export const StyledText = styled.span`
text-align: left;
`;
+export const PanelLabel = styled.p`
+ color: var(--text-secondary-color);
+ width: 100%;
+ margin: 0;
+ padding-left: calc(var(--margins-lg) * 2 + var(--margins-sm));
+ padding-bottom: var(--margins-sm);
+`;
+
const StyledRoundedPanelButtonGroup = styled.div`
overflow: hidden;
background: var(--right-panel-item-background-color);
diff --git a/ts/components/conversation/right-panel/overlay/OverlayDisappearingMessages.tsx b/ts/components/conversation/right-panel/overlay/OverlayDisappearingMessages.tsx
index bb332a28c..7ab9e61e6 100644
--- a/ts/components/conversation/right-panel/overlay/OverlayDisappearingMessages.tsx
+++ b/ts/components/conversation/right-panel/overlay/OverlayDisappearingMessages.tsx
@@ -9,6 +9,7 @@ import { getTimerOptions } from '../../../../state/selectors/timerOptions';
import { Flex } from '../../../basic/Flex';
import { SessionButton } from '../../../basic/SessionButton';
import { PanelButtonGroup } from '../../../buttons';
+import { PanelLabel } from '../../../buttons/PanelButton';
import { PanelRadioButton } from '../../../buttons/PanelRadioButton';
import { SessionIconButton } from '../../../icon';
@@ -91,20 +92,23 @@ const TimeOptions = (props: TimerOptionsProps) => {
const { options, selected, setSelected } = props;
return (
-
- {options.map((option: any) => (
- {
- setSelected(option.value);
- }}
- disableBg={true}
- />
- ))}
-
+ <>
+ {window.i18n('timer')}
+
+ {options.map((option: any) => (
+ {
+ setSelected(option.value);
+ }}
+ disableBg={true}
+ />
+ ))}
+
+ >
);
};
diff --git a/ts/types/LocalizerKeys.ts b/ts/types/LocalizerKeys.ts
index 172f5e292..b256b41a8 100644
--- a/ts/types/LocalizerKeys.ts
+++ b/ts/types/LocalizerKeys.ts
@@ -188,6 +188,7 @@ export type LocalizerKeys =
| 'areYouSureDeleteEntireAccount'
| 'noGivenPassword'
| 'closedGroupInviteOkText'
+ | 'timer'
| 'readReceiptSettingTitle'
| 'copySessionID'
| 'timerOption_0_seconds'