mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Fully migrate to ICU

Browse source
This commit is contained in:
Jamie Kyle 2023-03-29 17:03:25 -07:00 • committed by GitHub
parent d4e7177ba6
commit 5e647c55d1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
274 changed files with 7948 additions and 1944 deletions
Download patch file Download diff file Expand all files Collapse all files

10
ts/background.ts
View file

@ -628,10 +628,10 @@ export async function startApp(): Promise<void> {
showConfirmationDialog({
dialogName: 'deleteOldIndexedDBData',
onTopOfEverything: true,
cancelText: window.i18n('quit'),
cancelText: window.i18n('icu:quit'),
confirmStyle: 'negative',
title: window.i18n('deleteOldIndexedDBData'),
okText: window.i18n('deleteOldData'),
title: window.i18n('icu:deleteOldIndexedDBData'),
okText: window.i18n('icu:deleteOldData'),
reject: () => reject(),
resolve: () => resolve(),
});
@ -915,7 +915,7 @@ export async function startApp(): Promise<void> {
}
setAppLoadingScreenMessage(
window.i18n('optimizingApplication'),
window.i18n('icu:optimizingApplication'),
window.i18n
);
@ -934,7 +934,7 @@ export async function startApp(): Promise<void> {
log.error('SQL failed to initialize', Errors.toLogFormat(err));
}
setAppLoadingScreenMessage(window.i18n('loading'), window.i18n);
setAppLoadingScreenMessage(window.i18n('icu:loading'), window.i18n);
let isMigrationWithIndexComplete = false;
let isIdleTaskProcessing = false;

4
ts/components/About.tsx
View file

@ -51,12 +51,12 @@ export function About({
className="acknowledgments"
href="https://github.com/signalapp/Signal-Desktop/blob/main/ACKNOWLEDGMENTS.md"
>
{i18n('softwareAcknowledgments')}
{i18n('icu:softwareAcknowledgments')}
</a>
</div>
<div>
<a className="privacy" href="https://signal.org/legal">
{i18n('privacyPolicy')}
{i18n('icu:privacyPolicy')}
</a>
</div>
</div>

6
ts/components/AddCaptionModal.tsx
View file

@ -63,18 +63,18 @@ export function AddCaptionModal({
hasFooterDivider={!isScrolledBottom}
moduleClassName="AddCaptionModal"
padded={false}
title={i18n('AddCaptionModal__title')}
title={i18n('icu:AddCaptionModal__title')}
onClose={onClose}
modalFooter={
<Button onClick={handleSubmit}>
{i18n('AddCaptionModal__submit-button')}
{i18n('icu:AddCaptionModal__submit-button')}
</Button>
}
>
<RenderCompositionTextArea
maxLength={1500}
whenToShowRemainingCount={1450}
placeholder={i18n('AddCaptionModal__placeholder')}
placeholder={i18n('icu:AddCaptionModal__placeholder')}
onChange={setMessageText}
scrollerRef={scrollerRef}
draftText={draftText}

17
ts/components/AddGroupMemberErrorDialog.tsx
View file

@ -36,18 +36,23 @@ export function AddGroupMemberErrorDialog(props: PropsType): JSX.Element {
switch (props.mode) {
case AddGroupMemberErrorDialogMode.MaximumGroupSize: {
const { maximumNumberOfContacts } = props;
title = i18n('chooseGroupMembers__maximum-group-size__title');
body = i18n('chooseGroupMembers__maximum-group-size__body', {
title = i18n('icu:chooseGroupMembers__maximum-group-size__title');
body = i18n('icu:chooseGroupMembers__maximum-group-size__body', {
max: maximumNumberOfContacts.toString(),
});
break;
}
case AddGroupMemberErrorDialogMode.RecommendedMaximumGroupSize: {
const { recommendedMaximumNumberOfContacts } = props;
title = i18n('chooseGroupMembers__maximum-recommended-group-size__title');
body = i18n('chooseGroupMembers__maximum-recommended-group-size__body', {
max: recommendedMaximumNumberOfContacts.toString(),
});
title = i18n(
'icu:chooseGroupMembers__maximum-recommended-group-size__title'
);
body = i18n(
'icu:chooseGroupMembers__maximum-recommended-group-size__body',
{
max: recommendedMaximumNumberOfContacts.toString(),
}
);
break;
}
default:

10
ts/components/AddUserToAnotherGroupModal.tsx
View file

@ -171,14 +171,14 @@ export function AddUserToAnotherGroupModal({
hasXButton
i18n={i18n}
onClose={toggleAddUserToAnotherGroupModal}
title={i18n('AddUserToAnotherGroupModal__title')}
title={i18n('icu:AddUserToAnotherGroupModal__title')}
moduleClassName="AddUserToAnotherGroupModal"
padded={false}
>
<div className="AddUserToAnotherGroupModal__main-body">
<SearchInput
i18n={i18n}
placeholder={i18n('contactSearchPlaceholder')}
placeholder={i18n('icu:contactSearchPlaceholder')}
onChange={handleSearchInputChange}
ref={inputRef}
value={searchTerm}
@ -217,12 +217,12 @@ export function AddUserToAnotherGroupModal({
{selectedGroupId && selectedGroup && (
<ConfirmationDialog
dialogName="AddUserToAnotherGroupModal__confirm"
title={i18n('AddUserToAnotherGroupModal__confirm-title')}
title={i18n('icu:AddUserToAnotherGroupModal__confirm-title')}
i18n={i18n}
onClose={() => setSelectedGroupId(undefined)}
actions={[
{
text: i18n('AddUserToAnotherGroupModal__confirm-add'),
text: i18n('icu:AddUserToAnotherGroupModal__confirm-add'),
style: 'affirmative',
action: () => {
showToast(ToastType.AddingUserToGroup, {
@ -240,7 +240,7 @@ export function AddUserToAnotherGroupModal({
},
]}
>
{i18n('AddUserToAnotherGroupModal__confirm-message', {
{i18n('icu:AddUserToAnotherGroupModal__confirm-message', {
contact: contact.title,
group: selectedGroup.title,
})}

2
ts/components/Alert.tsx
View file

@ -28,7 +28,7 @@ export function Alert({
<Modal
i18n={i18n}
modalFooter={
<Button onClick={onClose}>{i18n('Confirmation--confirm')}</Button>
<Button onClick={onClose}>{i18n('icu:Confirmation--confirm')}</Button>
}
modalName="Alert"
onClose={onClose}

6
ts/components/AnnouncementsOnlyGroupBanner.tsx
View file

@ -33,7 +33,7 @@ export function AnnouncementsOnlyGroupBanner({
modalName="AnnouncmentsOnlyGroupBanner"
i18n={i18n}
onClose={() => setIsShowingAdmins(false)}
title={i18n('AnnouncementsOnlyGroupBanner--modal')}
title={i18n('icu:AnnouncementsOnlyGroupBanner--modal')}
>
{groupAdmins.map(admin => (
<ConversationListItem
@ -53,7 +53,7 @@ export function AnnouncementsOnlyGroupBanner({
<div className="AnnouncementsOnlyGroupBanner__banner">
<Intl
i18n={i18n}
id="AnnouncementsOnlyGroupBanner--announcements-only"
id="icu:AnnouncementsOnlyGroupBanner--announcements-only"
components={{
admins: (
<button
@ -61,7 +61,7 @@ export function AnnouncementsOnlyGroupBanner({
type="button"
onClick={() => setIsShowingAdmins(true)}
>
{i18n('AnnouncementsOnlyGroupBanner--admins')}
{i18n('icu:AnnouncementsOnlyGroupBanner--admins')}
</button>
),
}}

4
ts/components/Avatar.tsx
View file

@ -180,7 +180,7 @@ export function Avatar({
}}
/>
{blur === AvatarBlur.BlurPictureWithClickToView && (
<div className="module-Avatar__click-to-view">{i18n('view')}</div>
<div className="module-Avatar__click-to-view">{i18n('icu:view')}</div>
)}
</>
);
@ -283,7 +283,7 @@ export function Avatar({
return (
<div
aria-label={i18n('contactAvatarAlt', {
aria-label={i18n('icu:contactAvatarAlt', {
name: title,
})}
className={classNames(

2
ts/components/AvatarColorPicker.tsx
View file

@ -21,7 +21,7 @@ export function AvatarColorPicker({
return (
<>
<div className="AvatarEditor__avatar-selector-title">
{i18n('AvatarColorPicker--choose')}
{i18n('icu:AvatarColorPicker--choose')}
</div>
<div className="AvatarEditor__avatars">
{AvatarColors.map(color => (

4
ts/components/AvatarEditor.tsx
View file

@ -196,13 +196,13 @@ export function AvatarEditor({
}}
type="button"
>
{i18n('text')}
{i18n('icu:text')}
</button>
</div>
</div>
<hr className="AvatarEditor__divider" />
<div className="AvatarEditor__avatar-selector-title">
{i18n('AvatarEditor--choose')}
{i18n('icu:AvatarEditor--choose')}
</div>
<div className="AvatarEditor__avatars">
{localAvatarData.map(avatarData => (

4
ts/components/AvatarModalButtons.tsx
View file

@ -37,10 +37,10 @@ export function AvatarModalButtons({
}}
variant={ButtonVariant.Secondary}
>
{i18n('cancel')}
{i18n('icu:cancel')}
</Button>
<Button disabled={!hasChanges} onClick={onSave}>
{i18n('save')}
{i18n('icu:save')}
</Button>
{confirmDiscardAction && (
<ConfirmDiscardDialog

6
ts/components/AvatarPopup.tsx
View file

@ -83,7 +83,7 @@ export function AvatarPopup(props: Props): JSX.Element {
)}
/>
<div className="module-avatar-popup__item__text">
{i18n('mainMenuSettings')}
{i18n('icu:mainMenuSettings')}
</div>
</button>
<button
@ -98,7 +98,7 @@ export function AvatarPopup(props: Props): JSX.Element {
)}
/>
<div className="module-avatar-popup__item__text">
{i18n('avatarMenuViewArchive')}
{i18n('icu:avatarMenuViewArchive')}
</div>
</button>
{hasPendingUpdate && (
@ -114,7 +114,7 @@ export function AvatarPopup(props: Props): JSX.Element {
)}
/>
<div className="module-avatar-popup__item__text">
{i18n('avatarMenuUpdateAvailable')}
{i18n('icu:avatarMenuUpdateAvailable')}
</div>
<div className="module-avatar-popup__item--badge" />
</button>

2
ts/components/AvatarPreview.tsx
View file

@ -188,7 +188,7 @@ export function AvatarPreview({
)}
{imageStatus === ImageStatus.HasImage && onClear && (
<button
aria-label={i18n('delete')}
aria-label={i18n('icu:delete')}
className="AvatarPreview__clear"
onClick={onClear}
tabIndex={-1}

2
ts/components/AvatarUploadButton.tsx
View file

@ -73,7 +73,7 @@ export function AvatarUploadButton({
}}
type="button"
>
{i18n('photo')}
{i18n('icu:photo')}
</button>
<input
accept=".gif,.jpg,.jpeg,.png,.webp,image/gif,image/jpeg,image/png,image/webp"

6
ts/components/BadgeDialog.tsx
View file

@ -101,7 +101,7 @@ function BadgeDialogWithBadges({
>
<div className="BadgeDialog__contents">
<button
aria-label={i18n('previous')}
aria-label={i18n('icu:previous')}
className="BadgeDialog__nav BadgeDialog__nav--previous"
disabled={currentBadgeIndex === 0}
onClick={() => navigate(-1)}
@ -127,7 +127,7 @@ function BadgeDialogWithBadges({
onClick={onShowInstructions}
size={ButtonSize.Large}
>
{i18n('BadgeDialog__become-a-sustainer-button')}
{i18n('icu:BadgeDialog__become-a-sustainer-button')}
</Button>
)}
<BadgeCarouselIndex
@ -136,7 +136,7 @@ function BadgeDialogWithBadges({
/>
</div>
<button
aria-label={i18n('next')}
aria-label={i18n('icu:next')}
className="BadgeDialog__nav BadgeDialog__nav--next"
disabled={currentBadgeIndex === badges.length - 1}
onClick={() => navigate(1)}

10
ts/components/BadgeSustainerInstructionsDialog.tsx
View file

@ -19,15 +19,15 @@ export function BadgeSustainerInstructionsDialog({
onClose={onClose}
>
<h1 className="BadgeSustainerInstructionsDialog__header">
{i18n('BadgeSustainerInstructions__header')}
{i18n('icu:BadgeSustainerInstructions__header')}
</h1>
<h2 className="BadgeSustainerInstructionsDialog__subheader">
{i18n('BadgeSustainerInstructions__subheader')}
{i18n('icu:BadgeSustainerInstructions__subheader')}
</h2>
<ol className="BadgeSustainerInstructionsDialog__instructions">
<li>{i18n('BadgeSustainerInstructions__instructions__1')}</li>
<li>{i18n('BadgeSustainerInstructions__instructions__2')}</li>
<li>{i18n('BadgeSustainerInstructions__instructions__3')}</li>
<li>{i18n('icu:BadgeSustainerInstructions__instructions__1')}</li>
<li>{i18n('icu:BadgeSustainerInstructions__instructions__2')}</li>
<li>{i18n('icu:BadgeSustainerInstructions__instructions__3')}</li>
</ol>
</Modal>
);

2
ts/components/BetterAvatarBubble.tsx
View file

@ -48,7 +48,7 @@ export function BetterAvatarBubble({
>
{onDelete && (
<button
aria-label={i18n('delete')}
aria-label={i18n('icu:delete')}
className="BetterAvatarBubble__delete"
onClick={onDelete}
tabIndex={-1}

2
ts/components/CallManager.tsx
View file

@ -362,7 +362,7 @@ function ActiveCallManager({
{activeCall.callMode === CallMode.Group &&
activeCall.conversationsWithSafetyNumberChanges.length ? (
<SafetyNumberChangeDialog
confirmText={i18n('continueCall')}
confirmText={i18n('icu:continueCall')}
contacts={[
{
story: undefined,

6
ts/components/CallNeedPermissionScreen.tsx
View file

@ -34,7 +34,7 @@ export function CallNeedPermissionScreen({
i18n,
close,
}: Props): JSX.Element {
const title = conversation.title || i18n('unknownContact');
const title = conversation.title || i18n('icu:unknownContact');
const autoCloseAtRef = useRef<number>(Date.now() + AUTO_CLOSE_MS);
useEffect(() => {
@ -63,7 +63,7 @@ export function CallNeedPermissionScreen({
<p className="module-call-need-permission-screen__text">
<Intl
i18n={i18n}
id="callNeedPermission"
id="icu:callNeedPermission"
components={{
title: <ContactName title={title} />,
}}
@ -77,7 +77,7 @@ export function CallNeedPermissionScreen({
close();
}}
>
{i18n('close')}
{i18n('icu:close')}
</button>
</div>
);

10
ts/components/CallScreen.tsx
View file

@ -115,12 +115,12 @@ function DirectCallHeaderMessage({
}, [joinedAt]);
if (callState === CallState.Reconnecting) {
return <>{i18n('callReconnecting')}</>;
return <>{i18n('icu:callReconnecting')}</>;
}
if (callState === CallState.Accepted && acceptedDuration) {
return (
<>
{i18n('callDuration', {
{i18n('icu:callDuration', {
duration: renderDuration(acceptedDuration),
})}
</>
@ -318,11 +318,11 @@ export function CallScreen({
if (isRinging) {
headerTitle = undefined;
} else if (currentPresenter) {
headerTitle = i18n('calling__presenting--person-ongoing', {
headerTitle = i18n('icu:calling__presenting--person-ongoing', {
name: currentPresenter.title,
});
} else if (!activeCall.remoteParticipants.length) {
headerTitle = i18n('calling__in-this-call--zero');
headerTitle = i18n('icu:calling__in-this-call--zero');
}
isConnected =
@ -378,7 +378,7 @@ export function CallScreen({
size={AvatarSize.EIGHTY}
/>
<div className="module-calling__camera-is-off">
{i18n('calling__your-video-is-off')}
{i18n('icu:calling__your-video-is-off')}
</div>
</CallBackgroundBlur>
)}

52
ts/components/CallingButton.tsx
View file

@ -52,62 +52,62 @@ export function CallingButton({
let disabled = false;
if (buttonType === CallingButtonType.AUDIO_DISABLED) {
classNameSuffix = 'audio--disabled';
tooltipContent = i18n('calling__button--audio-disabled');
label = i18n('calling__button--audio__label');
tooltipContent = i18n('icu:calling__button--audio-disabled');
label = i18n('icu:calling__button--audio__label');
disabled = true;
} else if (buttonType === CallingButtonType.AUDIO_OFF) {
classNameSuffix = 'audio--off';
tooltipContent = i18n('calling__button--audio-on');
label = i18n('calling__button--audio__label');
tooltipContent = i18n('icu:calling__button--audio-on');
label = i18n('icu:calling__button--audio__label');
} else if (buttonType === CallingButtonType.AUDIO_ON) {
classNameSuffix = 'audio--on';
tooltipContent = i18n('calling__button--audio-off');
label = i18n('calling__button--audio__label');
tooltipContent = i18n('icu:calling__button--audio-off');
label = i18n('icu:calling__button--audio__label');
} else if (buttonType === CallingButtonType.VIDEO_DISABLED) {
classNameSuffix = 'video--disabled';
tooltipContent = i18n('calling__button--video-disabled');
tooltipContent = i18n('icu:calling__button--video-disabled');
disabled = true;
label = i18n('calling__button--video__label');
label = i18n('icu:calling__button--video__label');
} else if (buttonType === CallingButtonType.VIDEO_OFF) {
classNameSuffix = 'video--off';
tooltipContent = i18n('calling__button--video-on');
label = i18n('calling__button--video__label');
tooltipContent = i18n('icu:calling__button--video-on');
label = i18n('icu:calling__button--video__label');
} else if (buttonType === CallingButtonType.VIDEO_ON) {
classNameSuffix = 'video--on';
tooltipContent = i18n('calling__button--video-off');
label = i18n('calling__button--video__label');
tooltipContent = i18n('icu:calling__button--video-off');
label = i18n('icu:calling__button--video__label');
} else if (buttonType === CallingButtonType.HANG_UP) {
classNameSuffix = 'hangup';
tooltipContent = i18n('calling__hangup');
label = i18n('calling__hangup');
tooltipContent = i18n('icu:calling__hangup');
label = i18n('icu:calling__hangup');
} else if (buttonType === CallingButtonType.RING_DISABLED) {
classNameSuffix = 'ring--disabled';
disabled = true;
tooltipContent = i18n(
'calling__button--ring__disabled-because-group-is-too-large'
'icu:calling__button--ring__disabled-because-group-is-too-large'
);
label = i18n('calling__button--ring__label');
label = i18n('icu:calling__button--ring__label');
} else if (buttonType === CallingButtonType.RING_OFF) {
classNameSuffix = 'ring--off';
tooltipContent = i18n('calling__button--ring__on');
label = i18n('calling__button--ring__label');
tooltipContent = i18n('icu:calling__button--ring__on');
label = i18n('icu:calling__button--ring__label');
} else if (buttonType === CallingButtonType.RING_ON) {
classNameSuffix = 'ring--on';
tooltipContent = i18n('calling__button--ring__off');
label = i18n('calling__button--ring__label');
tooltipContent = i18n('icu:calling__button--ring__off');
label = i18n('icu:calling__button--ring__label');
} else if (buttonType === CallingButtonType.PRESENTING_DISABLED) {
classNameSuffix = 'presenting--disabled';
tooltipContent = i18n('calling__button--presenting-disabled');
tooltipContent = i18n('icu:calling__button--presenting-disabled');
disabled = true;
label = i18n('calling__button--presenting__label');
label = i18n('icu:calling__button--presenting__label');
} else if (buttonType === CallingButtonType.PRESENTING_ON) {
classNameSuffix = 'presenting--on';
tooltipContent = i18n('calling__button--presenting-off');
label = i18n('calling__button--presenting__label');
tooltipContent = i18n('icu:calling__button--presenting-off');
label = i18n('icu:calling__button--presenting__label');
} else if (buttonType === CallingButtonType.PRESENTING_OFF) {
classNameSuffix = 'presenting--off';
tooltipContent = i18n('calling__button--presenting-on');
label = i18n('calling__button--presenting__label');
tooltipContent = i18n('icu:calling__button--presenting-on');
label = i18n('icu:calling__button--presenting__label');
}
const className = classNames(

16
ts/components/CallingDeviceSelection.tsx
View file

@ -23,7 +23,7 @@ function localizeDefault(i18n: LocalizerType, deviceLabel: string): string {
return deviceLabel.toLowerCase().startsWith('default')
? deviceLabel.replace(
/default/i,
i18n('callingDeviceSelection__select--default')
i18n('icu:callingDeviceSelection__select--default')
)
: deviceLabel;
}
@ -36,7 +36,7 @@ function renderAudioOptions(
if (!devices.length) {
return (
<option aria-selected>
{i18n('callingDeviceSelection__select--no-device')}
{i18n('icu:callingDeviceSelection__select--no-device')}
</option>
);
}
@ -68,7 +68,7 @@ function renderVideoOptions(
if (!devices.length) {
return (
<option aria-selected>
{i18n('callingDeviceSelection__select--no-device')}
{i18n('icu:callingDeviceSelection__select--no-device')}
</option>
);
}
@ -147,16 +147,16 @@ export function CallingDeviceSelection({
className="module-calling-device-selection__close-button"
onClick={toggleSettings}
tabIndex={0}
aria-label={i18n('close')}
aria-label={i18n('icu:close')}
/>
</div>
<h1 className="module-calling-device-selection__title">
{i18n('callingDeviceSelection__settings')}
{i18n('icu:callingDeviceSelection__settings')}
</h1>
<label htmlFor="video" className="module-calling-device-selection__label">
{i18n('callingDeviceSelection__label--video')}
{i18n('icu:callingDeviceSelection__label--video')}
</label>
<div className="module-calling-device-selection__select">
<select
@ -173,7 +173,7 @@ export function CallingDeviceSelection({
htmlFor="audio-input"
className="module-calling-device-selection__label"
>
{i18n('callingDeviceSelection__label--audio-input')}
{i18n('icu:callingDeviceSelection__label--audio-input')}
</label>
<div className="module-calling-device-selection__select">
<select
@ -194,7 +194,7 @@ export function CallingDeviceSelection({
htmlFor="audio-output"
className="module-calling-device-selection__label"
>
{i18n('callingDeviceSelection__label--audio-output')}
{i18n('icu:callingDeviceSelection__label--audio-output')}
</label>
<div className="module-calling-device-selection__select">
<select

24
ts/components/CallingHeader.tsx
View file

@ -49,13 +49,13 @@ export function CallingHeader({
{isGroupCall && participantCount ? (
<div className="module-calling-tools__button">
<Tooltip
content={i18n('calling__participants', {
content={i18n('icu:calling__participants', {
people: String(participantCount),
})}
theme={Theme.Dark}
>
<button
aria-label={i18n('calling__participants', {
aria-label={i18n('icu:calling__participants', {
people: String(participantCount),
})}
className={classNames(
@ -77,11 +77,11 @@ export function CallingHeader({
) : null}
<div className="module-calling-tools__button">
<Tooltip
content={i18n('callingDeviceSelection__settings')}
content={i18n('icu:callingDeviceSelection__settings')}
theme={Theme.Dark}
>
<button
aria-label={i18n('callingDeviceSelection__settings')}
aria-label={i18n('icu:callingDeviceSelection__settings')}
className="CallingButton__settings"
onClick={toggleSettings}
type="button"
@ -93,16 +93,16 @@ export function CallingHeader({
<Tooltip
content={
isInSpeakerView
? i18n('calling__switch-view--to-grid')
: i18n('calling__switch-view--to-speaker')
? i18n('icu:calling__switch-view--to-grid')
: i18n('icu:calling__switch-view--to-speaker')
}
theme={Theme.Dark}
>
<button
aria-label={
isInSpeakerView
? i18n('calling__switch-view--to-grid')
: i18n('calling__switch-view--to-speaker')
? i18n('icu:calling__switch-view--to-grid')
: i18n('icu:calling__switch-view--to-speaker')
}
className={
isInSpeakerView
@ -117,9 +117,9 @@ export function CallingHeader({
)}
{togglePip && (
<div className="module-calling-tools__button">
<Tooltip content={i18n('calling__pip--on')} theme={Theme.Dark}>
<Tooltip content={i18n('icu:calling__pip--on')} theme={Theme.Dark}>
<button
aria-label={i18n('calling__pip--on')}
aria-label={i18n('icu:calling__pip--on')}
className="CallingButton__pip"
onClick={togglePip}
type="button"
@ -129,9 +129,9 @@ export function CallingHeader({
)}
{onCancel && (
<div className="module-calling-tools__button">
<Tooltip content={i18n('cancel')} theme={Theme.Dark}>
<Tooltip content={i18n('icu:cancel')} theme={Theme.Dark}>
<button
aria-label={i18n('cancel')}
aria-label={i18n('icu:cancel')}
className="CallingButton__cancel"
onClick={onCancel}
type="button"

4
ts/components/CallingLobby.tsx
View file

@ -234,7 +234,7 @@ export function CallingLobby({
onClick={() => setIsMutedToastVisible(false)}
>
{i18n(
'calling__lobby-automatically-muted-because-there-are-a-lot-of-people'
'icu:calling__lobby-automatically-muted-because-there-are-a-lot-of-people'
)}
</CallingToast>
@ -266,7 +266,7 @@ export function CallingLobby({
}`
)}
>
{i18n('calling__your-video-is-off')}
{i18n('icu:calling__your-video-is-off')}
</div>
<div className="module-calling__buttons module-calling__buttons--inline">

8
ts/components/CallingLobbyJoinButton.tsx
View file

@ -46,10 +46,12 @@ export function CallingLobbyJoinButton({
const [height, setHeight] = useState<undefined | number>();
const childrenByVariant: Record<CallingLobbyJoinButtonVariant, ReactChild> = {
[CallingLobbyJoinButtonVariant.CallIsFull]: i18n('calling__call-is-full'),
[CallingLobbyJoinButtonVariant.CallIsFull]: i18n(
'icu:calling__call-is-full'
),
[CallingLobbyJoinButtonVariant.Loading]: <Spinner svgSize="small" />,
[CallingLobbyJoinButtonVariant.Join]: i18n('calling__join'),
[CallingLobbyJoinButtonVariant.Start]: i18n('calling__start'),
[CallingLobbyJoinButtonVariant.Join]: i18n('icu:calling__join'),
[CallingLobbyJoinButtonVariant.Start]: i18n('icu:calling__start'),
};
return (

11
ts/components/CallingParticipantsList.tsx
View file

@ -79,11 +79,12 @@ export const CallingParticipantsList = React.memo(
<div className="module-calling-participants-list">
<div className="module-calling-participants-list__header">
<div className="module-calling-participants-list__title">
{!participants.length && i18n('calling__in-this-call--zero')}
{!participants.length &&
i18n('icu:calling__in-this-call--zero')}
{participants.length === 1 &&
i18n('calling__in-this-call--one')}
i18n('icu:calling__in-this-call--one')}
{participants.length > 1 &&
i18n('calling__in-this-call--many', {
i18n('icu:calling__in-this-call--many', {
people: String(participants.length),
})}
</div>
@ -92,7 +93,7 @@ export const CallingParticipantsList = React.memo(
className="module-calling-participants-list__close"
onClick={onClose}
tabIndex={0}
aria-label={i18n('close')}
aria-label={i18n('icu:close')}
/>
</div>
<ul className="module-calling-participants-list__list">
@ -123,7 +124,7 @@ export const CallingParticipantsList = React.memo(
/>
{ourUuid && participant.uuid === ourUuid ? (
<span className="module-calling-participants-list__name">
{i18n('you')}
{i18n('icu:you')}
</span>
) : (
<>

4
ts/components/CallingPip.tsx
View file

@ -299,13 +299,13 @@ export function CallingPip({
) : null}
<div className="module-calling-pip__actions">
<button
aria-label={i18n('calling__hangup')}
aria-label={i18n('icu:calling__hangup')}
className="module-calling-pip__button--hangup"
onClick={hangUp}
type="button"
/>
<button
aria-label={i18n('calling__pip--off')}
aria-label={i18n('icu:calling__pip--off')}
className="module-calling-pip__button--pip"
onClick={togglePip}
type="button"

34
ts/components/CallingPreCallInfo.tsx
View file

@ -52,9 +52,9 @@ export function CallingPreCallInfo({
}: PropsType): JSX.Element {
let subtitle: string;
if (ringMode === RingMode.IsRinging) {
subtitle = i18n('outgoingCallRinging');
subtitle = i18n('icu:outgoingCallRinging');
} else if (isCallFull) {
subtitle = i18n('calling__call-is-full');
subtitle = i18n('icu:calling__call-is-full');
} else if (peekedParticipants.length) {
// It should be rare to see yourself in this list, but it's possible if (1) you rejoin
// quickly, causing the server to return stale state (2) you have joined on another
@ -63,7 +63,7 @@ export function CallingPreCallInfo({
const participantNames = peekedParticipants.map(participant => {
if (participant.uuid === me.uuid) {
hasYou = true;
return i18n('you');
return i18n('icu:you');
}
return getParticipantName(participant);
});
@ -71,26 +71,26 @@ export function CallingPreCallInfo({
switch (participantNames.length) {
case 1:
subtitle = hasYou
? i18n('calling__pre-call-info--another-device-in-call')
: i18n('calling__pre-call-info--1-person-in-call', {
? i18n('icu:calling__pre-call-info--another-device-in-call')
: i18n('icu:calling__pre-call-info--1-person-in-call', {
first: participantNames[0],
});
break;
case 2:
subtitle = i18n('calling__pre-call-info--2-people-in-call', {
subtitle = i18n('icu:calling__pre-call-info--2-people-in-call', {
first: participantNames[0],
second: participantNames[1],
});
break;
case 3:
subtitle = i18n('calling__pre-call-info--3-people-in-call', {
subtitle = i18n('icu:calling__pre-call-info--3-people-in-call', {
first: participantNames[0],
second: participantNames[1],
third: participantNames[2],
});
break;
default:
subtitle = i18n('calling__pre-call-info--many-people-in-call', {
subtitle = i18n('icu:calling__pre-call-info--many-people-in-call', {
first: participantNames[0],
second: participantNames[1],
others: String(participantNames.length - 2),
@ -116,25 +116,25 @@ export function CallingPreCallInfo({
switch (memberNames.length) {
case 0:
subtitle = i18n('calling__pre-call-info--empty-group');
subtitle = i18n('icu:calling__pre-call-info--empty-group');
break;
case 1: {
subtitle = ring
? i18n('calling__pre-call-info--will-ring-1', {
? i18n('icu:calling__pre-call-info--will-ring-1', {
person: memberNames[0],
})
: i18n('calling__pre-call-info--will-notify-1', {
: i18n('icu:calling__pre-call-info--will-notify-1', {
person: memberNames[0],
});
break;
}
case 2: {
subtitle = ring
? i18n('calling__pre-call-info--will-ring-2', {
? i18n('icu:calling__pre-call-info--will-ring-2', {
first: memberNames[0],
second: memberNames[1],
})
: i18n('calling__pre-call-info--will-notify-2', {
: i18n('icu:calling__pre-call-info--will-notify-2', {
first: memberNames[0],
second: memberNames[1],
});
@ -142,12 +142,12 @@ export function CallingPreCallInfo({
}
case 3: {
subtitle = ring
? i18n('calling__pre-call-info--will-ring-3', {
? i18n('icu:calling__pre-call-info--will-ring-3', {
first: memberNames[0],
second: memberNames[1],
third: memberNames[2],
})
: i18n('calling__pre-call-info--will-notify-3', {
: i18n('icu:calling__pre-call-info--will-notify-3', {
first: memberNames[0],
second: memberNames[1],
third: memberNames[2],
@ -156,12 +156,12 @@ export function CallingPreCallInfo({
}
default: {
subtitle = ring
? i18n('calling__pre-call-info--will-ring-many', {
? i18n('icu:calling__pre-call-info--will-ring-many', {
first: memberNames[0],
second: memberNames[1],
others: String(memberNames.length - 2),
})
: i18n('calling__pre-call-info--will-notify-many', {
: i18n('icu:calling__pre-call-info--will-notify-many', {
first: memberNames[0],
second: memberNames[1],
others: String(memberNames.length - 2),

6
ts/components/CallingScreenSharingController.tsx
View file

@ -21,7 +21,7 @@ export function CallingScreenSharingController({
return (
<div className="module-CallingScreenSharingController">
<div className="module-CallingScreenSharingController__text">
{i18n('calling__presenting--info', {
{i18n('icu:calling__presenting--info', {
window: presentedSourceName,
})}
</div>
@ -31,10 +31,10 @@ export function CallingScreenSharingController({
onClick={onStopSharing}
variant={ButtonVariant.Destructive}
>
{i18n('calling__presenting--stop')}
{i18n('icu:calling__presenting--stop')}
</Button>
<button
aria-label={i18n('close')}
aria-label={i18n('icu:close')}
className="module-CallingScreenSharingController__close"
onClick={onCloseController}
type="button"

10
ts/components/CallingSelectPresentingSourcesModal.tsx
View file

@ -85,13 +85,13 @@ export function CallingSelectPresentingSourcesModal({
const footer = (
<>
<Button onClick={() => setPresenting()} variant={ButtonVariant.Secondary}>
{i18n('cancel')}
{i18n('icu:cancel')}
</Button>
<Button
disabled={!sourceToPresent}
onClick={() => setPresenting(sourceToPresent)}
>
{i18n('calling__SelectPresentingSourcesModal--confirm')}
{i18n('icu:calling__SelectPresentingSourcesModal--confirm')}
</Button>
</>
);
@ -106,11 +106,11 @@ export function CallingSelectPresentingSourcesModal({
setPresenting();
}}
theme={Theme.Dark}
title={i18n('calling__SelectPresentingSourcesModal--title')}
title={i18n('icu:calling__SelectPresentingSourcesModal--title')}
modalFooter={footer}
>
<div className="module-CallingSelectPresentingSourcesModal__title">
{i18n('calling__SelectPresentingSourcesModal--entireScreen')}
{i18n('icu:calling__SelectPresentingSourcesModal--entireScreen')}
</div>
<div className="module-CallingSelectPresentingSourcesModal__sources">
{(sources.true ?? []).map(source => (
@ -123,7 +123,7 @@ export function CallingSelectPresentingSourcesModal({
))}
</div>
<div className="module-CallingSelectPresentingSourcesModal__title">
{i18n('calling__SelectPresentingSourcesModal--window')}
{i18n('icu:calling__SelectPresentingSourcesModal--window')}
</div>
<div className="module-CallingSelectPresentingSourcesModal__sources">
{(sources.false ?? []).map(source => (

6
ts/components/CallingToastManager.tsx
View file

@ -27,7 +27,7 @@ function getReconnectingToast({ activeCall, i18n }: PropsType): ToastType {
activeCall.connectionState === GroupCallConnectionState.Reconnecting
) {
return {
message: i18n('callReconnecting'),
message: i18n('icu:callReconnecting'),
type: 'static',
};
}
@ -72,12 +72,12 @@ function useScreenSharingToast({ activeCall, i18n }: PropsType): ToastType {
if (previousPresenterId === ME) {
setResult({
type: 'dismissable',
message: i18n('calling__presenting--you-stopped'),
message: i18n('icu:calling__presenting--you-stopped'),
});
} else if (previousPresenterTitle) {
setResult({
type: 'dismissable',
message: i18n('calling__presenting--person-stopped', {
message: i18n('icu:calling__presenting--person-stopped', {
name: previousPresenterTitle,
}),
});

14
ts/components/CaptchaDialog.tsx
View file

@ -37,10 +37,10 @@ export function CaptchaDialog(props: Readonly<PropsType>): JSX.Element {
const footer = (
<>
<Button onClick={onCancelClick} variant={ButtonVariant.Secondary}>
{i18n('cancel')}
{i18n('icu:cancel')}
</Button>
<Button onClick={onSkipClick} variant={ButtonVariant.Destructive}>
{i18n('CaptchaDialog--can_close__skip-verification')}
{i18n('icu:CaptchaDialog--can_close__skip-verification')}
</Button>
</>
);
@ -49,13 +49,13 @@ export function CaptchaDialog(props: Readonly<PropsType>): JSX.Element {
modalName="CaptchaDialog"
moduleClassName="module-Modal"
i18n={i18n}
title={i18n('CaptchaDialog--can-close__title')}
title={i18n('icu:CaptchaDialog--can-close__title')}
onClose={() => setIsClosing(false)}
key="skip"
modalFooter={footer}
>
<section>
<p>{i18n('CaptchaDialog--can-close__body')}</p>
<p>{i18n('icu:CaptchaDialog--can-close__body')}</p>
</section>
</Modal>
);
@ -94,15 +94,15 @@ export function CaptchaDialog(props: Readonly<PropsType>): JSX.Element {
modalName="CaptchaDialog.pending"
moduleClassName="module-Modal--important"
i18n={i18n}
title={i18n('CaptchaDialog__title')}
title={i18n('icu:CaptchaDialog__title')}
hasXButton
onClose={() => setIsClosing(true)}
key="primary"
modalFooter={footer}
>
<section>
<p>{i18n('CaptchaDialog__first-paragraph')}</p>
<p>{i18n('CaptchaDialog__second-paragraph')}</p>
<p>{i18n('icu:CaptchaDialog__first-paragraph')}</p>
<p>{i18n('icu:CaptchaDialog__second-paragraph')}</p>
</section>
</Modal>
);

34
ts/components/ChatColorPicker.tsx
View file

@ -130,7 +130,7 @@ export function ChatColorPicker({
{
action: resetDefaultChatColor,
style: 'affirmative',
text: i18n('ChatColorPicker__confirm-reset-default'),
text: i18n('icu:ChatColorPicker__confirm-reset-default'),
},
{
action: () => {
@ -138,16 +138,16 @@ export function ChatColorPicker({
resetAllChatColors();
},
style: 'affirmative',
text: i18n('ChatColorPicker__resetAll'),
text: i18n('icu:ChatColorPicker__resetAll'),
},
]}
i18n={i18n}
onClose={() => {
setConfirmResetWhat(false);
}}
title={i18n('ChatColorPicker__resetDefault')}
title={i18n('icu:ChatColorPicker__resetDefault')}
>
{i18n('ChatColorPicker__confirm-reset-message')}
{i18n('icu:ChatColorPicker__confirm-reset-message')}
</ConfirmationDialog>
) : null}
{confirmResetAll ? (
@ -157,16 +157,16 @@ export function ChatColorPicker({
{
action: resetAllChatColors,
style: 'affirmative',
text: i18n('ChatColorPicker__confirm-reset'),
text: i18n('icu:ChatColorPicker__confirm-reset'),
},
]}
i18n={i18n}
onClose={() => {
setConfirmResetAll(false);
}}
title={i18n('ChatColorPicker__resetAll')}
title={i18n('icu:ChatColorPicker__resetAll')}
>
{i18n('ChatColorPicker__confirm-reset-message')}
{i18n('icu:ChatColorPicker__confirm-reset-message')}
</ConfirmationDialog>
) : null}
<SampleMessageBubbles
@ -227,7 +227,7 @@ export function ChatColorPicker({
);
})}
<div
aria-label={i18n('ChatColorPicker__custom-color--label')}
aria-label={i18n('icu:ChatColorPicker__custom-color--label')}
className="ChatColorPicker__bubble ChatColorPicker__bubble--custom"
onClick={() =>
setCustomColorToEdit({ id: undefined, value: undefined })
@ -246,14 +246,14 @@ export function ChatColorPicker({
<hr />
{conversationId ? (
<PanelRow
label={i18n('ChatColorPicker__reset')}
label={i18n('icu:ChatColorPicker__reset')}
onClick={() => {
colorSelected({ conversationId });
}}
/>
) : null}
<PanelRow
label={i18n('ChatColorPicker__resetAll')}
label={i18n('icu:ChatColorPicker__resetAll')}
onClick={() => {
if (isGlobal) {
setConfirmResetWhat(true);
@ -339,16 +339,16 @@ function CustomColorBubble({
{
action: onDelete,
style: 'negative',
text: i18n('ChatColorPicker__context--delete'),
text: i18n('icu:ChatColorPicker__context--delete'),
},
]}
i18n={i18n}
onClose={() => {
setConfirmDeleteCount(undefined);
}}
title={i18n('ChatColorPicker__delete--title')}
title={i18n('icu:ChatColorPicker__delete--title')}
>
{i18n('ChatColorPicker__delete--message', {
{i18n('icu:ChatColorPicker__delete--message', {
num: String(confirmDeleteCount),
})}
</ConfirmationDialog>
@ -372,7 +372,7 @@ function CustomColorBubble({
onEdit();
}}
>
{i18n('ChatColorPicker__context--edit')}
{i18n('icu:ChatColorPicker__context--edit')}
</MenuItem>
<MenuItem
attributes={{
@ -385,7 +385,7 @@ function CustomColorBubble({
onDupe();
}}
>
{i18n('ChatColorPicker__context--duplicate')}
{i18n('icu:ChatColorPicker__context--duplicate')}
</MenuItem>
<MenuItem
attributes={{
@ -405,7 +405,7 @@ function CustomColorBubble({
}
}}
>
{i18n('ChatColorPicker__context--delete')}
{i18n('icu:ChatColorPicker__context--delete')}
</MenuItem>
</ContextMenu>
</>
@ -442,7 +442,7 @@ function CustomColorEditorWrapper({
moduleClassName="ChatColorPicker__modal"
noMouseClose
onClose={onClose}
title={i18n('CustomColorEditor__title')}
title={i18n('icu:CustomColorEditor__title')}
>
{editor}
</Modal>

2
ts/components/ClearingData.tsx
View file

@ -20,7 +20,7 @@ export function ClearingData({ deleteAllData, i18n }: PropsType): JSX.Element {
<div className="inner">
<div className="step-body">
<span className="banner-icon delete" />
<div className="header">{i18n('deleteAllDataProgress')}</div>
<div className="header">{i18n('icu:deleteAllDataProgress')}</div>
</div>
<div className="progress">
<div className="bar-container">

12
ts/components/CompositionArea.tsx
View file

@ -457,7 +457,7 @@ export function CompositionArea({
type="button"
className="CompositionArea__attach-file"
onClick={launchAttachmentPicker}
aria-label={i18n('CompositionArea--attach-file')}
aria-label={i18n('icu:CompositionArea--attach-file')}
/>
</div>
);
@ -470,7 +470,7 @@ export function CompositionArea({
type="button"
className="CompositionArea__send-button"
onClick={handleForceSend}
aria-label={i18n('sendMessageToContact')}
aria-label={i18n('icu:sendMessageToContact')}
/>
</div>
</>
@ -605,7 +605,7 @@ export function CompositionArea({
>
{isFetchingUUID ? (
<Spinner
ariaLabel={i18n('CompositionArea--sms-only__spinner-label')}
ariaLabel={i18n('icu:CompositionArea--sms-only__spinner-label')}
role="presentation"
moduleClassName="module-image-spinner"
svgSize="small"
@ -613,10 +613,10 @@ export function CompositionArea({
) : (
<>
<h2 className="CompositionArea--sms-only__title">
{i18n('CompositionArea--sms-only__title')}
{i18n('icu:CompositionArea--sms-only__title')}
</h2>
<p className="CompositionArea--sms-only__body">
{i18n('CompositionArea--sms-only__body')}
{i18n('icu:CompositionArea--sms-only__body')}
</p>
</>
)}
@ -728,7 +728,7 @@ export function CompositionArea({
// This prevents the user from tabbing here
tabIndex={-1}
onClick={handleToggleLarge}
aria-label={i18n('CompositionArea--expand')}
aria-label={i18n('icu:CompositionArea--expand')}
/>
</div>
<div

2
ts/components/CompositionInput.tsx
View file

@ -622,7 +622,7 @@ export function CompositionInput(props: Props): React.ReactElement {
},
}}
formats={['emoji', 'mention']}
placeholder={placeholder || i18n('sendMessage')}
placeholder={placeholder || i18n('icu:sendMessage')}
readOnly={disabled}
ref={element => {
if (element) {

10
ts/components/CompositionRecording.tsx
View file

@ -111,16 +111,16 @@ export function CompositionRecording({
i18n={i18n}
onCancel={onCancel}
onClose={noop}
cancelText={i18n('discard')}
cancelText={i18n('icu:discard')}
actions={[
{
text: i18n('sendAnyway'),
text: i18n('icu:sendAnyway'),
style: 'affirmative',
action: onSend,
},
]}
>
{i18n('voiceRecordingInterruptedMax')}
{i18n('icu:voiceRecordingInterruptedMax')}
</ConfirmationDialog>
);
} else if (
@ -132,10 +132,10 @@ export function CompositionRecording({
i18n={i18n}
onCancel={onCancel}
onClose={noop}
cancelText={i18n('ok')}
cancelText={i18n('icu:ok')}
actions={[]}
>
{i18n('voiceNoteError')}
{i18n('icu:voiceNoteError')}
</ConfirmationDialog>
);
}

4
ts/components/CompositionRecordingDraft.tsx
View file

@ -101,8 +101,8 @@ export function CompositionRecordingDraft({
mod={active?.playing ? 'pause' : 'play'}
label={
active?.playing
? i18n('MessageAudio--pause')
: i18n('MessageAudio--play')
? i18n('icu:MessageAudio--pause')
: i18n('icu:MessageAudio--play')
}
onClick={handlePlaybackClick}
/>

4
ts/components/ConfirmDiscardDialog.tsx
View file

@ -22,14 +22,14 @@ export function ConfirmDiscardDialog({
actions={[
{
action: onDiscard,
text: i18n('discard'),
text: i18n('icu:discard'),
style: 'negative',
},
]}
i18n={i18n}
onClose={onClose}
>
{i18n('ConfirmDiscardDialog--discard')}
{i18n('icu:ConfirmDiscardDialog--discard')}
</ConfirmationDialog>
);
}

2
ts/components/ConfirmationDialog.tsx
View file

@ -120,7 +120,7 @@ export const ConfirmationDialog = React.memo(function ConfirmationDialogInner({
(hasActions ? ButtonVariant.Secondary : ButtonVariant.Primary)
}
>
{cancelText || i18n('confirmation-dialog--Cancel')}
{cancelText || i18n('icu:confirmation-dialog--Cancel')}
</Button>
) : null}
{actions.map((action, i) => (

2
ts/components/ContactPill.tsx
View file

@ -42,7 +42,7 @@ export function ContactPill({
unblurredAvatarPath,
onClickRemove,
}: PropsType): JSX.Element {
const removeLabel = i18n('ContactPill--remove');
const removeLabel = i18n('icu:ContactPill--remove');
return (
<div className="module-ContactPill">

2
ts/components/ContextMenu.tsx
View file

@ -289,7 +289,7 @@ export function ContextMenu<T>({
)}
>
<button
aria-label={ariaLabel || i18n('ContextMenu--button')}
aria-label={ariaLabel || i18n('icu:ContextMenu--button')}
className={classNames(
getClassName('__button'),
isMenuShowing ? getClassName('__button--active') : undefined

18
ts/components/ConversationList.stories.tsx
View file

@ -605,22 +605,22 @@ export function Headers(): JSX.Element {
{
type: RowType.Header,
// eslint-disable-next-line @typescript-eslint/no-shadow
getHeaderText: i18n => i18n('conversationsHeader'),
getHeaderText: i18n => i18n('icu:conversationsHeader'),
},
{
type: RowType.Header,
// eslint-disable-next-line @typescript-eslint/no-shadow
getHeaderText: i18n => i18n('messagesHeader'),
getHeaderText: i18n => i18n('icu:messagesHeader'),
},
{
type: RowType.Header,
// eslint-disable-next-line @typescript-eslint/no-shadow
getHeaderText: i18n => i18n('findByUsernameHeader'),
getHeaderText: i18n => i18n('icu:findByUsernameHeader'),
},
{
type: RowType.Header,
// eslint-disable-next-line @typescript-eslint/no-shadow
getHeaderText: i18n => i18n('findByPhoneNumberHeader'),
getHeaderText: i18n => i18n('icu:findByPhoneNumberHeader'),
},
]}
/>
@ -634,7 +634,7 @@ export function FindByPhoneNumber(): JSX.Element {
{
type: RowType.Header,
// eslint-disable-next-line @typescript-eslint/no-shadow
getHeaderText: i18n => i18n('findByPhoneNumberHeader'),
getHeaderText: i18n => i18n('icu:findByPhoneNumberHeader'),
},
{
type: RowType.StartNewConversation,
@ -679,7 +679,7 @@ export function FindByUsername(): JSX.Element {
{
type: RowType.Header,
// eslint-disable-next-line @typescript-eslint/no-shadow
getHeaderText: i18n => i18n('findByUsernameHeader'),
getHeaderText: i18n => i18n('icu:findByUsernameHeader'),
},
{
type: RowType.UsernameSearchResult,
@ -752,7 +752,7 @@ export function KitchenSink(): JSX.Element {
{
type: RowType.Header,
// eslint-disable-next-line @typescript-eslint/no-shadow
getHeaderText: i18n => i18n('contactsHeader'),
getHeaderText: i18n => i18n('icu:contactsHeader'),
},
{
type: RowType.Contact,
@ -761,7 +761,7 @@ export function KitchenSink(): JSX.Element {
{
type: RowType.Header,
// eslint-disable-next-line @typescript-eslint/no-shadow
getHeaderText: i18n => i18n('messagesHeader'),
getHeaderText: i18n => i18n('icu:messagesHeader'),
},
{
type: RowType.Conversation,
@ -774,7 +774,7 @@ export function KitchenSink(): JSX.Element {
{
type: RowType.Header,
// eslint-disable-next-line @typescript-eslint/no-shadow
getHeaderText: i18n => i18n('findByUsernameHeader'),
getHeaderText: i18n => i18n('icu:findByUsernameHeader'),
},
{
type: RowType.UsernameSearchResult,

8
ts/components/ConversationList.tsx
View file

@ -247,14 +247,14 @@ export function ConversationList({
case RowType.ArchiveButton:
result = (
<button
aria-label={i18n('archivedConversations')}
aria-label={i18n('icu:archivedConversations')}
className="module-conversation-list__item--archive-button"
onClick={onClickArchiveButton}
type="button"
>
<div className="module-conversation-list__item--archive-button__icon" />
<span className="module-conversation-list__item--archive-button__text">
{i18n('archivedConversations')}
{i18n('icu:archivedConversations')}
</span>
<span className="module-conversation-list__item--archive-button__archived-count">
{row.archivedConversationsCount}
@ -355,10 +355,10 @@ export function ConversationList({
const { badges, title, unreadCount, lastMessage } = itemProps;
result = (
<div
aria-label={i18n('ConversationList__aria-label', {
aria-label={i18n('icu:ConversationList__aria-label', {
lastMessage:
get(lastMessage, 'text') ||
i18n('ConversationList__last-message-undefined'),
i18n('icu:ConversationList__last-message-undefined'),
title,
unreadCount: String(unreadCount),
})}

8
ts/components/CrashReportDialog.tsx
View file

@ -40,7 +40,7 @@ export function CrashReportDialog(props: Readonly<PropsType>): JSX.Element {
onClick={onEraseClick}
variant={ButtonVariant.Secondary}
>
{i18n('CrashReportDialog__erase')}
{i18n('icu:CrashReportDialog__erase')}
</Button>
<Button
disabled={isPending}
@ -51,7 +51,7 @@ export function CrashReportDialog(props: Readonly<PropsType>): JSX.Element {
{isPending ? (
<Spinner size="22px" svgSize="small" />
) : (
i18n('CrashReportDialog__submit')
i18n('icu:CrashReportDialog__submit')
)}
</Button>
</>
@ -62,12 +62,12 @@ export function CrashReportDialog(props: Readonly<PropsType>): JSX.Element {
modalName="CrashReportDialog"
moduleClassName="module-Modal--important"
i18n={i18n}
title={i18n('CrashReportDialog__title')}
title={i18n('icu:CrashReportDialog__title')}
hasXButton
onClose={eraseCrashReports}
modalFooter={footer}
>
<section>{i18n('CrashReportDialog__body')}</section>
<section>{i18n('icu:CrashReportDialog__body')}</section>
</Modal>
);
}

16
ts/components/CustomColorEditor.tsx
View file

@ -78,11 +78,11 @@ export function CustomColorEditor({
tabs={[
{
id: TabViews.Solid,
label: i18n('CustomColorEditor__solid'),
label: i18n('icu:CustomColorEditor__solid'),
},
{
id: TabViews.Gradient,
label: i18n('CustomColorEditor__gradient'),
label: i18n('icu:CustomColorEditor__gradient'),
},
]}
>
@ -114,7 +114,7 @@ export function CustomColorEditor({
)}
</div>
<div className="CustomColorEditor__slider-container">
{i18n('CustomColorEditor__hue')}
{i18n('icu:CustomColorEditor__hue')}
<Slider
handleStyle={{
backgroundColor: getHSL({
@ -122,7 +122,7 @@ export function CustomColorEditor({
saturation: 100,
}),
}}
label={i18n('CustomColorEditor__hue')}
label={i18n('icu:CustomColorEditor__hue')}
moduleClassName="CustomColorEditor__hue-slider"
onChange={(percentage: number) => {
setColor({
@ -138,7 +138,7 @@ export function CustomColorEditor({
/>
</div>
<div className="CustomColorEditor__slider-container">
{i18n('CustomColorEditor__saturation')}
{i18n('icu:CustomColorEditor__saturation')}
<Slider
containerStyle={getCustomColorStyle({
deg: 180,
@ -150,7 +150,7 @@ export function CustomColorEditor({
color[selectedColorKnob] || ULTRAMARINE_ISH_VALUES
),
}}
label={i18n('CustomColorEditor__saturation')}
label={i18n('icu:CustomColorEditor__saturation')}
moduleClassName="CustomColorEditor__saturation-slider"
onChange={(value: number) => {
setColor({
@ -167,7 +167,7 @@ export function CustomColorEditor({
</div>
<div className="CustomColorEditor__footer">
<Button variant={ButtonVariant.Secondary} onClick={onClose}>
{i18n('cancel')}
{i18n('icu:cancel')}
</Button>
<Button
onClick={() => {
@ -175,7 +175,7 @@ export function CustomColorEditor({
onClose();
}}
>
{i18n('save')}
{i18n('icu:save')}
</Button>
</div>
</>

10
ts/components/CustomizingPreferredReactionsModal.tsx
View file

@ -118,7 +118,7 @@ export function CustomizingPreferredReactionsModal({
}}
variant={ButtonVariant.SecondaryAffirmative}
>
{i18n('reset')}
{i18n('icu:reset')}
</Button>
<Button
disabled={!canSave}
@ -131,7 +131,7 @@ export function CustomizingPreferredReactionsModal({
}
}}
>
{i18n('save')}
{i18n('icu:save')}
</Button>
</>
);
@ -145,7 +145,7 @@ export function CustomizingPreferredReactionsModal({
onClose={() => {
cancelCustomizePreferredReactionsModal();
}}
title={i18n('CustomizingPreferredReactions__title')}
title={i18n('icu:CustomizingPreferredReactions__title')}
modalFooter={footer}
>
<div className="module-CustomizingPreferredReactionsModal__small-emoji-picker-wrapper">
@ -169,8 +169,8 @@ export function CustomizingPreferredReactionsModal({
))}
</ReactionPickerPicker>
{hadSaveError
? i18n('CustomizingPreferredReactions__had-save-error')
: i18n('CustomizingPreferredReactions__subtitle')}
? i18n('icu:CustomizingPreferredReactions__had-save-error')
: i18n('icu:CustomizingPreferredReactions__subtitle')}
</div>
{isSomethingSelected && (
<div

24
ts/components/DebugLogWindow.tsx
View file

@ -54,7 +54,9 @@ export function DebugLogWindow({
const [loadState, setLoadState] = useState<LoadState>(LoadState.NotStarted);
const [logText, setLogText] = useState<string | undefined>();
const [publicLogURL, setPublicLogURL] = useState<string | undefined>();
const [textAreaValue, setTextAreaValue] = useState<string>(i18n('loading'));
const [textAreaValue, setTextAreaValue] = useState<string>(
i18n('icu:loading')
);
const [toastType, setToastType] = useState<ToastType | undefined>();
const theme = useTheme();
@ -82,7 +84,7 @@ export function DebugLogWindow({
const linesToShow = Math.ceil(Math.min(window.innerHeight, 2000) / 5);
const value = fetchedLogText.split(/\n/g, linesToShow).join('\n');
setTextAreaValue(`${value}\n\n\n${i18n('debugLogLogIsIncomplete')}`);
setTextAreaValue(`${value}\n\n\n${i18n('icu:debugLogLogIsIncomplete')}`);
setToastType(undefined);
}
@ -150,10 +152,10 @@ export function DebugLogWindow({
<div className="DebugLogWindow">
<div>
<div className="DebugLogWindow__title">
{i18n('debugLogSuccess')}
{i18n('icu:debugLogSuccess')}
</div>
<p className="DebugLogWindow__subtitle">
{i18n('debugLogSuccessNextSteps')}
{i18n('icu:debugLogSuccessNextSteps')}
</p>
</div>
<div className="DebugLogWindow__container">
@ -169,9 +171,9 @@ export function DebugLogWindow({
onClick={() => openLinkInWebBrowser(supportURL)}
variant={ButtonVariant.Secondary}
>
{i18n('reportIssue')}
{i18n('icu:reportIssue')}
</Button>
<Button onClick={copyLog}>{i18n('debugLogCopy')}</Button>
<Button onClick={copyLog}>{i18n('icu:debugLogCopy')}</Button>
</div>
{toastElement}
</div>
@ -192,9 +194,11 @@ export function DebugLogWindow({
>
<div className="DebugLogWindow">
<div>
<div className="DebugLogWindow__title">{i18n('submitDebugLog')}</div>
<div className="DebugLogWindow__title">
{i18n('icu:submitDebugLog')}
</div>
<p className="DebugLogWindow__subtitle">
{i18n('debugLogExplanation')}
{i18n('icu:debugLogExplanation')}
</p>
</div>
{isLoading ? (
@ -218,10 +222,10 @@ export function DebugLogWindow({
}}
variant={ButtonVariant.Secondary}
>
{i18n('debugLogSave')}
{i18n('icu:debugLogSave')}
</Button>
<Button disabled={!canSubmit} onClick={handleSubmit}>
{i18n('submit')}
{i18n('icu:submit')}
</Button>
</div>
{toastElement}

4
ts/components/DialogExpiredBuild.tsx
View file

@ -25,10 +25,10 @@ export function DialogExpiredBuild({
onClick={() => {
openLinkInWebBrowser('https://signal.org/download/');
}}
clickLabel={i18n('upgrade')}
clickLabel={i18n('icu:upgrade')}
hasAction
>
{i18n('expiredWarning')}{' '}
{i18n('icu:expiredWarning')}{' '}
</LeftPaneDialog>
);
}

10
ts/components/DialogNetworkStatus.tsx
View file

@ -65,8 +65,8 @@ export function DialogNetworkStatus({
containerWidthBreakpoint={containerWidthBreakpoint}
type="warning"
icon={spinner}
title={i18n('connecting')}
subtitle={i18n('connectingHangOn')}
title={i18n('icu:connecting')}
subtitle={i18n('icu:connectingHangOn')}
/>
);
}
@ -76,10 +76,10 @@ export function DialogNetworkStatus({
containerWidthBreakpoint={containerWidthBreakpoint}
type="warning"
icon="network"
title={isOnline ? i18n('disconnected') : i18n('offline')}
subtitle={i18n('checkNetworkConnection')}
title={isOnline ? i18n('icu:disconnected') : i18n('icu:offline')}
subtitle={i18n('icu:checkNetworkConnection')}
hasAction
clickLabel={i18n('connect')}
clickLabel={i18n('icu:connect')}
onClick={reconnect}
/>
);

4
ts/components/DialogRelink.tsx
View file

@ -24,9 +24,9 @@ export function DialogRelink({
containerWidthBreakpoint={containerWidthBreakpoint}
type="warning"
icon="relink"
clickLabel={i18n('unlinkedWarning')}
clickLabel={i18n('icu:unlinkedWarning')}
onClick={relinkDevice}
title={i18n('unlinked')}
title={i18n('icu:unlinked')}
hasAction
/>
);

32
ts/components/DialogUpdate.tsx
View file

@ -45,7 +45,7 @@ export function DialogUpdate({
<LeftPaneDialog
containerWidthBreakpoint={containerWidthBreakpoint}
type="warning"
title={i18n('cannotUpdate')}
title={i18n('icu:cannotUpdate')}
>
<span>
<Intl
@ -57,7 +57,7 @@ export function DialogUpdate({
onClick={startUpdate}
type="button"
>
{i18n('autoUpdateRetry')}
{i18n('icu:autoUpdateRetry')}
</button>
),
url: (
@ -77,12 +77,12 @@ export function DialogUpdate({
rel="noreferrer"
target="_blank"
>
{i18n('autoUpdateContactSupport')}
{i18n('icu:autoUpdateContactSupport')}
</a>
),
}}
i18n={i18n}
id="cannotUpdateDetail"
id="icu:cannotUpdateDetail"
/>
</span>
</LeftPaneDialog>
@ -97,7 +97,7 @@ export function DialogUpdate({
<LeftPaneDialog
containerWidthBreakpoint={containerWidthBreakpoint}
type="warning"
title={i18n('cannotUpdate')}
title={i18n('icu:cannotUpdate')}
>
<span>
<Intl
@ -119,12 +119,12 @@ export function DialogUpdate({
rel="noreferrer"
target="_blank"
>
{i18n('autoUpdateContactSupport')}
{i18n('icu:autoUpdateContactSupport')}
</a>
),
}}
i18n={i18n}
id="cannotUpdateRequireManualDetail"
id="icu:cannotUpdateRequireManualDetail"
/>
</span>
</LeftPaneDialog>
@ -134,11 +134,11 @@ export function DialogUpdate({
if (dialogType === DialogType.MacOS_Read_Only) {
return (
<LeftPaneDialog
closeLabel={i18n('close')}
closeLabel={i18n('icu:close')}
containerWidthBreakpoint={containerWidthBreakpoint}
hasXButton
onClose={dismissDialog}
title={i18n('cannotUpdate')}
title={i18n('icu:cannotUpdate')}
type="warning"
>
<span>
@ -148,7 +148,7 @@ export function DialogUpdate({
folder: <strong key="folder">/Applications</strong>,
}}
i18n={i18n}
id="readOnlyVolume"
id="icu:readOnlyVolume"
/>
</span>
</LeftPaneDialog>
@ -161,7 +161,7 @@ export function DialogUpdate({
}
const versionTitle = version
? i18n('DialogUpdate--version-available', {
? i18n('icu:DialogUpdate--version-available', {
version,
})
: undefined;
@ -188,7 +188,7 @@ export function DialogUpdate({
);
}
let title = i18n('autoUpdateNewVersionTitle');
let title = i18n('icu:autoUpdateNewVersionTitle');
if (
downloadSize &&
@ -198,12 +198,12 @@ export function DialogUpdate({
title += ` (${formatFileSize(downloadSize, { round: 0 })})`;
}
let clickLabel = i18n('autoUpdateNewVersionMessage');
let clickLabel = i18n('icu:autoUpdateNewVersionMessage');
let type: 'warning' | undefined;
if (dialogType === DialogType.DownloadReady) {
clickLabel = i18n('downloadNewVersionMessage');
clickLabel = i18n('icu:downloadNewVersionMessage');
} else if (dialogType === DialogType.FullDownloadReady) {
clickLabel = i18n('downloadFullNewVersionMessage');
clickLabel = i18n('icu:downloadFullNewVersionMessage');
type = 'warning';
} else if (dialogType === DialogType.DownloadedUpdate) {
title = i18n('icu:DialogUpdate__downloaded');
@ -221,7 +221,7 @@ export function DialogUpdate({
clickLabel={clickLabel}
hasXButton
onClose={snoozeUpdate}
closeLabel={i18n('autoUpdateIgnoreButtonLabel')}
closeLabel={i18n('icu:autoUpdateIgnoreButtonLabel')}
/>
);
}

20
ts/components/DisappearingTimeDialog.tsx
View file

@ -80,11 +80,11 @@ export function DisappearingTimeDialog(props: PropsType): JSX.Element {
i18n={i18n}
theme={theme}
onClose={onClose}
title={i18n('DisappearingTimeDialog__title')}
title={i18n('icu:DisappearingTimeDialog__title')}
hasXButton
actions={[
{
text: i18n('DisappearingTimeDialog__set'),
text: i18n('icu:DisappearingTimeDialog__set'),
style: 'affirmative',
action() {
onSubmit(
@ -96,17 +96,17 @@ export function DisappearingTimeDialog(props: PropsType): JSX.Element {
},
]}
>
<p>{i18n('DisappearingTimeDialog__body')}</p>
<p>{i18n('icu:DisappearingTimeDialog__body')}</p>
<section className={`${CSS_MODULE}__time-boxes`}>
<Select
ariaLabel={i18n('DisappearingTimeDialog__label--value')}
ariaLabel={i18n('icu:DisappearingTimeDialog__label--value')}
moduleClassName={`${CSS_MODULE}__time-boxes__value`}
value={unitValue}
onChange={newValue => setUnitValue(parseInt(newValue, 10))}
options={values.map(value => ({ value, text: value.toString() }))}
/>
<Select
ariaLabel={i18n('DisappearingTimeDialog__label--units')}
ariaLabel={i18n('icu:DisappearingTimeDialog__label--units')}
moduleClassName={`${CSS_MODULE}__time-boxes__units`}
value={unit}
onChange={newUnit => {
@ -124,11 +124,11 @@ export function DisappearingTimeDialog(props: PropsType): JSX.Element {
return {
value: unitName,
text: {
seconds: i18n('DisappearingTimeDialog__seconds'),
minutes: i18n('DisappearingTimeDialog__minutes'),
hours: i18n('DisappearingTimeDialog__hours'),
days: i18n('DisappearingTimeDialog__days'),
weeks: i18n('DisappearingTimeDialog__weeks'),
seconds: i18n('icu:DisappearingTimeDialog__seconds'),
minutes: i18n('icu:DisappearingTimeDialog__minutes'),
hours: i18n('icu:DisappearingTimeDialog__hours'),
days: i18n('icu:DisappearingTimeDialog__days'),
weeks: i18n('icu:DisappearingTimeDialog__weeks'),
}[unitName],
};
})}

4
ts/components/DisappearingTimerSelect.tsx
View file

@ -66,8 +66,8 @@ export function DisappearingTimerSelect(props: Props): JSX.Element {
{
value: DurationInSeconds.fromSeconds(-1),
text: isCustomTimeSelected
? i18n('selectedCustomDisappearingTimeOption')
: i18n('customDisappearingTimeOption'),
? i18n('icu:selectedCustomDisappearingTimeOption')
: i18n('icu:customDisappearingTimeOption'),
},
];

34
ts/components/EditUsernameModalBody.tsx
View file

@ -101,23 +101,23 @@ export function EditUsernameModalBody({
return undefined;
}
if (error === UsernameReservationError.NotEnoughCharacters) {
return i18n('ProfileEditor--username--check-character-min', {
return i18n('icu:ProfileEditor--username--check-character-min', {
min: minNickname,
});
}
if (error === UsernameReservationError.TooManyCharacters) {
return i18n('ProfileEditor--username--check-character-max', {
return i18n('icu:ProfileEditor--username--check-character-max', {
max: maxNickname,
});
}
if (error === UsernameReservationError.CheckStartingCharacter) {
return i18n('ProfileEditor--username--check-starting-character');
return i18n('icu:ProfileEditor--username--check-starting-character');
}
if (error === UsernameReservationError.CheckCharacters) {
return i18n('ProfileEditor--username--check-characters');
return i18n('icu:ProfileEditor--username--check-characters');
}
if (error === UsernameReservationError.UsernameNotAvailable) {
return i18n('ProfileEditor--username--unavailable');
return i18n('icu:ProfileEditor--username--unavailable');
}
// Displayed through confirmation modal below
if (
@ -157,7 +157,7 @@ export function EditUsernameModalBody({
setIsLearnMoreVisible(true);
}, []);
let title = i18n('ProfileEditor--username--title');
let title = i18n('icu:ProfileEditor--username--title');
if (nickname && discriminator) {
title = `${nickname}${discriminator}`;
}
@ -165,7 +165,7 @@ export function EditUsernameModalBody({
const learnMoreTitle = (
<>
<i className="EditUsernameModalBody__learn-more__hashtag" />
{i18n('EditUsernameModalBody__learn-more__title')}
{i18n('icu:EditUsernameModalBody__learn-more__title')}
</>
);
@ -184,7 +184,7 @@ export function EditUsernameModalBody({
disabled={isConfirming}
onChange={onChange}
onEnter={onSave}
placeholder={i18n('EditUsernameModalBody__username-placeholder')}
placeholder={i18n('icu:EditUsernameModalBody__username-placeholder')}
value={nickname}
>
{isReserving && <Spinner size="16px" svgSize="small" />}
@ -207,14 +207,14 @@ export function EditUsernameModalBody({
!errorString ? 'EditUsernameModalBody__info--no-error' : undefined
)}
>
{i18n('EditUsernameModalBody__username-helper')}
{i18n('icu:EditUsernameModalBody__username-helper')}
&nbsp;
<button
type="button"
className="EditUsernameModalBody__learn-more-button"
onClick={onLearnMore}
>
{i18n('EditUsernameModalBody__learn-more')}
{i18n('icu:EditUsernameModalBody__learn-more')}
</button>
</div>
@ -224,13 +224,13 @@ export function EditUsernameModalBody({
onClick={onCancel}
variant={ButtonVariant.Secondary}
>
{i18n('cancel')}
{i18n('icu:cancel')}
</Button>
<Button disabled={!canSave} onClick={onSave}>
{isConfirming ? (
<Spinner size="20px" svgSize="small" direction="on-avatar" />
) : (
i18n('save')
i18n('icu:save')
)}
</Button>
</Modal.ButtonFooter>
@ -243,14 +243,14 @@ export function EditUsernameModalBody({
onClose={() => setIsLearnMoreVisible(false)}
title={learnMoreTitle}
>
{i18n('EditUsernameModalBody__learn-more__body')}
{i18n('icu:EditUsernameModalBody__learn-more__body')}
<Modal.ButtonFooter>
<Button
onClick={() => setIsLearnMoreVisible(false)}
variant={ButtonVariant.Secondary}
>
{i18n('ok')}
{i18n('icu:ok')}
</Button>
</Modal.ButtonFooter>
</Modal>
@ -259,19 +259,19 @@ export function EditUsernameModalBody({
{error === UsernameReservationError.General && (
<ConfirmationDialog
dialogName="EditUsernameModalBody.generalError"
cancelText={i18n('ok')}
cancelText={i18n('icu:ok')}
cancelButtonVariant={ButtonVariant.Secondary}
i18n={i18n}
onClose={() => setUsernameReservationError(undefined)}
>
{i18n('ProfileEditor--username--general-error')}
{i18n('icu:ProfileEditor--username--general-error')}
</ConfirmationDialog>
)}
{error === UsernameReservationError.ConflictOrGone && (
<ConfirmationDialog
dialogName="EditUsernameModalBody.conflictOrGone"
cancelText={i18n('ok')}
cancelText={i18n('icu:ok')}
cancelButtonVariant={ButtonVariant.Secondary}
i18n={i18n}
onClose={() => {

6
ts/components/ErrorModal.tsx
View file

@ -26,7 +26,7 @@ export function ErrorModal(props: PropsType): JSX.Element {
const footer = (
<Button onClick={onClose} ref={focusRef} variant={ButtonVariant.Secondary}>
{i18n('Confirmation--confirm')}
{i18n('icu:Confirmation--confirm')}
</Button>
);
@ -35,11 +35,11 @@ export function ErrorModal(props: PropsType): JSX.Element {
modalName="ErrorModal"
i18n={i18n}
onClose={onClose}
title={title || i18n('ErrorModal--title')}
title={title || i18n('icu:ErrorModal--title')}
modalFooter={footer}
>
<div className="module-error-modal__description">
{description || i18n('ErrorModal--description')}
{description || i18n('icu:ErrorModal--description')}
</div>
</Modal>
);

16
ts/components/ForwardMessagesModal.tsx
View file

@ -258,11 +258,11 @@ export function ForwardMessagesModal({
{cannotMessage && (
<ConfirmationDialog
dialogName="ForwardMessageModal.confirm"
cancelText={i18n('Confirmation--confirm')}
cancelText={i18n('icu:Confirmation--confirm')}
i18n={i18n}
onClose={() => setCannotMessage(false)}
>
{i18n('GroupV2--cannot-send')}
{i18n('icu:GroupV2--cannot-send')}
</ConfirmationDialog>
)}
<ModalHost
@ -283,7 +283,7 @@ export function ForwardMessagesModal({
>
{isEditingMessage ? (
<button
aria-label={i18n('back')}
aria-label={i18n('icu:back')}
className="module-ForwardMessageModal__header--back"
onClick={() => setIsEditingMessage(false)}
type="button"
@ -292,7 +292,7 @@ export function ForwardMessagesModal({
</button>
) : (
<button
aria-label={i18n('close')}
aria-label={i18n('icu:close')}
className="module-ForwardMessageModal__header--close"
onClick={close}
type="button"
@ -318,7 +318,7 @@ export function ForwardMessagesModal({
<SearchInput
disabled={candidateConversations.length === 0}
i18n={i18n}
placeholder={i18n('contactSearchPlaceholder')}
placeholder={i18n('icu:contactSearchPlaceholder')}
onChange={event => {
setSearchTerm(event.target.value);
}}
@ -370,7 +370,7 @@ export function ForwardMessagesModal({
</Measure>
) : (
<div className="module-ForwardMessageModal__no-candidate-contacts">
{i18n('noContactsFound')}
{i18n('icu:noContactsFound')}
</div>
)}
</div>
@ -388,14 +388,14 @@ export function ForwardMessagesModal({
<div>
{isEditingMessage || !isLonelyDraftEditable ? (
<Button
aria-label={i18n('ForwardMessageModal--continue')}
aria-label={i18n('icu:ForwardMessageModal--continue')}
className="module-ForwardMessageModal__send-button module-ForwardMessageModal__send-button--forward"
aria-disabled={!canForwardMessages}
onClick={forwardMessages}
/>
) : (
<Button
aria-label={i18n('forwardMessage')}
aria-label={i18n('icu:forwardMessage')}
className="module-ForwardMessageModal__send-button module-ForwardMessageModal__send-button--continue"
disabled={!hasContactsSelected}
onClick={() => setIsEditingMessage(true)}

6
ts/components/GlobalModalContainer.tsx
View file

@ -198,11 +198,11 @@ export function GlobalModalContainer({
if (userNotFoundModalState) {
let content: string;
if (userNotFoundModalState.type === 'phoneNumber') {
content = i18n('startConversation--phone-number-not-found', {
content = i18n('icu:startConversation--phone-number-not-found', {
phoneNumber: userNotFoundModalState.phoneNumber,
});
} else if (userNotFoundModalState.type === 'username') {
content = i18n('startConversation--username-not-found', {
content = i18n('icu:startConversation--username-not-found', {
atUsername: userNotFoundModalState.username,
});
} else {
@ -212,7 +212,7 @@ export function GlobalModalContainer({
return (
<ConfirmationDialog
dialogName="GlobalModalContainer.userNotFound"
cancelText={i18n('ok')}
cancelText={i18n('icu:ok')}
cancelButtonVariant={ButtonVariant.Secondary}
i18n={i18n}
onClose={hideUserNotFoundModal}

4
ts/components/GroupCallOverflowArea.tsx
View file

@ -179,8 +179,8 @@ function OverflowAreaScrollMarker({
onClick={onClick}
aria-label={
placement === 'top'
? i18n('calling__overflow__scroll-up')
: i18n('calling__overflow__scroll-down')
? i18n('icu:calling__overflow__scroll-up')
: i18n('icu:calling__overflow__scroll-down')
}
/>
</div>

8
ts/components/GroupCallRemoteParticipant.tsx
View file

@ -259,7 +259,7 @@ export const GroupCallRemoteParticipant: React.FC<PropsType> = React.memo(
{showBlockInfo && (
<ConfirmationDialog
dialogName="GroupCallRemoteParticipant.blockInfo"
cancelText={i18n('ok')}
cancelText={i18n('icu:ok')}
i18n={i18n}
onClose={() => {
setShowBlockInfo(false);
@ -268,7 +268,7 @@ export const GroupCallRemoteParticipant: React.FC<PropsType> = React.memo(
<div className="module-ongoing-call__group-call-remote-participant__blocked--modal-title">
<Intl
i18n={i18n}
id="calling__you-have-blocked"
id="icu:calling__you-have-blocked"
components={{
name: <ContactName key="name" title={title} />,
}}
@ -276,7 +276,7 @@ export const GroupCallRemoteParticipant: React.FC<PropsType> = React.memo(
</div>
}
>
{i18n('calling__block-info')}
{i18n('icu:calling__block-info')}
</ConfirmationDialog>
)}
@ -344,7 +344,7 @@ export const GroupCallRemoteParticipant: React.FC<PropsType> = React.memo(
setShowBlockInfo(true);
}}
>
{i18n('moreInfo')}
{i18n('icu:moreInfo')}
</button>
</>
) : (

4
ts/components/GroupDescriptionInput.tsx
View file

@ -24,7 +24,9 @@ export const GroupDescriptionInput = forwardRef<HTMLInputElement, PropsType>(
expandable
i18n={i18n}
onChange={onChangeValue}
placeholder={i18n('setGroupMetadata__group-description-placeholder')}
placeholder={i18n(
'icu:setGroupMetadata__group-description-placeholder'
)}
maxLengthCount={480}
maxByteCount={8192}
ref={ref}

2
ts/components/GroupDialog.tsx
View file

@ -57,7 +57,7 @@ export function GroupDialog(props: Readonly<PropsType>): JSX.Element {
<ModalHost modalName="GroupDialog" onClose={onClose}>
<div className="module-GroupDialog">
<button
aria-label={i18n('close')}
aria-label={i18n('icu:close')}
type="button"
className="module-GroupDialog__close-button"
onClick={() => {

2
ts/components/GroupTitleInput.tsx
View file

@ -23,7 +23,7 @@ export const GroupTitleInput = forwardRef<HTMLInputElement, PropsType>(
disabled={disabled}
i18n={i18n}
onChange={onChangeValue}
placeholder={i18n('setGroupMetadata__group-name-placeholder')}
placeholder={i18n('icu:setGroupMetadata__group-name-placeholder')}
maxLengthCount={32}
ref={ref}
value={value}

30
ts/components/GroupV1MigrationDialog.tsx
View file

@ -66,11 +66,11 @@ export const GroupV1MigrationDialog: React.FunctionComponent<PropsType> =
}
const title = hasMigrated
? i18n('GroupV1--Migration--info--title')
: i18n('GroupV1--Migration--migrate--title');
? i18n('icu:GroupV1--Migration--info--title')
: i18n('icu:GroupV1--Migration--migrate--title');
const keepHistory = hasMigrated
? i18n('GroupV1--Migration--info--keep-history')
: i18n('GroupV1--Migration--migrate--keep-history');
? i18n('icu:GroupV1--Migration--info--keep-history')
: i18n('icu:GroupV1--Migration--migrate--keep-history');
let primaryButtonText: string;
let onClickPrimaryButton: () => void;
@ -81,13 +81,13 @@ export const GroupV1MigrationDialog: React.FunctionComponent<PropsType> =
onClickSecondaryButton: () => void;
};
if (hasMigrated) {
primaryButtonText = i18n('Confirmation--confirm');
primaryButtonText = i18n('icu:Confirmation--confirm');
onClickPrimaryButton = closeHandler;
} else {
primaryButtonText = i18n('GroupV1--Migration--migrate');
primaryButtonText = i18n('icu:GroupV1--Migration--migrate');
onClickPrimaryButton = migrateHandler;
secondaryButtonProps = {
secondaryButtonText: i18n('cancel'),
secondaryButtonText: i18n('icu:cancel'),
onClickSecondaryButton: closeHandler,
};
}
@ -102,12 +102,12 @@ export const GroupV1MigrationDialog: React.FunctionComponent<PropsType> =
{...secondaryButtonProps}
>
<GroupDialog.Paragraph>
{i18n('GroupV1--Migration--info--summary')}
{i18n('icu:GroupV1--Migration--info--summary')}
</GroupDialog.Paragraph>
<GroupDialog.Paragraph>{keepHistory}</GroupDialog.Paragraph>
{areWeInvited ? (
<GroupDialog.Paragraph>
{i18n('GroupV1--Migration--info--invited--you')}
{i18n('icu:GroupV1--Migration--info--invited--you')}
</GroupDialog.Paragraph>
) : (
<>
@ -157,20 +157,20 @@ function renderMembers({
case 'invited':
text =
members.length === 1
? i18n('GroupV1--Migration--info--invited--one')
: i18n('GroupV1--Migration--info--invited--many');
? i18n('icu:GroupV1--Migration--info--invited--one')
: i18n('icu:GroupV1--Migration--info--invited--many');
break;
case 'dropped':
if (hasMigrated) {
text =
members.length === 1
? i18n('GroupV1--Migration--info--removed--before--one')
: i18n('GroupV1--Migration--info--removed--before--many');
? i18n('icu:GroupV1--Migration--info--removed--before--one')
: i18n('icu:GroupV1--Migration--info--removed--before--many');
} else {
text =
members.length === 1
? i18n('GroupV1--Migration--info--removed--after--one')
: i18n('GroupV1--Migration--info--removed--after--many');
? i18n('icu:GroupV1--Migration--info--removed--after--one')
: i18n('icu:GroupV1--Migration--info--removed--after--many');
}
break;
default:

18
ts/components/GroupV2JoinDialog.tsx
View file

@ -47,12 +47,12 @@ export const GroupV2JoinDialog = React.memo(function GroupV2JoinDialogInner(
} = props;
const joinString = approvalRequired
? i18n('GroupV2--join--request-to-join-button')
: i18n('GroupV2--join--join-button');
? i18n('icu:GroupV2--join--request-to-join-button')
: i18n('icu:GroupV2--join--join-button');
const memberString =
memberCount === 1
? i18n('GroupV2--join--member-count--single')
: i18n('GroupV2--join--member-count--multiple', {
? i18n('icu:GroupV2--join--member-count--single')
: i18n('icu:GroupV2--join--member-count--multiple', {
count: memberCount.toString(),
});
@ -70,7 +70,7 @@ export const GroupV2JoinDialog = React.memo(function GroupV2JoinDialogInner(
return (
<div className="module-group-v2-join-dialog">
<button
aria-label={i18n('close')}
aria-label={i18n('icu:close')}
type="button"
disabled={isWorking}
className="module-group-v2-join-dialog__close-button"
@ -93,7 +93,7 @@ export const GroupV2JoinDialog = React.memo(function GroupV2JoinDialogInner(
</div>
<div className="module-group-v2-join-dialog__title">{title}</div>
<div className="module-group-v2-join-dialog__metadata">
{i18n('GroupV2--join--group-metadata', {
{i18n('icu:GroupV2--join--group-metadata', {
memberCount: memberString,
})}
</div>
@ -104,11 +104,11 @@ export const GroupV2JoinDialog = React.memo(function GroupV2JoinDialogInner(
)}
{approvalRequired ? (
<div className="module-group-v2-join-dialog__prompt--approval">
{i18n('GroupV2--join--prompt-with-approval')}
{i18n('icu:GroupV2--join--prompt-with-approval')}
</div>
) : (
<div className="module-group-v2-join-dialog__prompt">
{i18n('GroupV2--join--prompt')}
{i18n('icu:GroupV2--join--prompt')}
</div>
)}
<div className="module-group-v2-join-dialog__buttons">
@ -121,7 +121,7 @@ export const GroupV2JoinDialog = React.memo(function GroupV2JoinDialogInner(
onClick={wrappedClose}
variant={ButtonVariant.Secondary}
>
{i18n('cancel')}
{i18n('icu:cancel')}
</Button>
<Button
className="module-group-v2-join-dialog__button"

4
ts/components/InContactsIcon.tsx
View file

@ -19,7 +19,7 @@ export function InContactsIcon(props: PropsType): JSX.Element {
/* eslint-disable jsx-a11y/no-noninteractive-tabindex */
return (
<Tooltip
content={i18n('contactInAddressBook')}
content={i18n('icu:contactInAddressBook')}
popperModifiers={[
{
name: 'preventOverflow',
@ -30,7 +30,7 @@ export function InContactsIcon(props: PropsType): JSX.Element {
]}
>
<span
aria-label={i18n('contactInAddressBook')}
aria-label={i18n('icu:contactInAddressBook')}
className={classNames('module-in-contacts-icon__icon', className)}
role="img"
tabIndex={0}

4
ts/components/Inbox.tsx
View file

@ -202,7 +202,7 @@ export function Inbox({
) * 100;
}
let message = i18n('loading');
let message = i18n('icu:loading');
if (envelopeTimestamp !== undefined) {
const daysBeforeMidnight = Math.ceil(
(midnight - envelopeTimestamp) / DAY
@ -262,7 +262,7 @@ export function Inbox({
<div className="no-conversation-open">
{renderMiniPlayer({ shouldFlow: false })}
<div className="module-splash-screen__logo module-img--128 module-logo-blue" />
<h3>{i18n('welcomeToSignal')}</h3>
<h3>{i18n('icu:welcomeToSignal')}</h3>
<p className="whats-new-placeholder">
<WhatsNewLink
i18n={i18n}

22
ts/components/IncomingCallBar.tsx
View file

@ -101,7 +101,7 @@ function GroupCallMessage({
case 0:
return (
<Intl
id="incomingGroupCall__ringing-you"
id="icu:incomingGroupCall__ringing-you"
i18n={i18n}
components={{ ringer: ringerNode }}
/>
@ -109,7 +109,7 @@ function GroupCallMessage({
case 1:
return (
<Intl
id="incomingGroupCall__ringing-1-other"
id="icu:incomingGroupCall__ringing-1-other"
i18n={i18n}
components={{
ringer: ringerNode,
@ -120,7 +120,7 @@ function GroupCallMessage({
case 2:
return (
<Intl
id="incomingGroupCall__ringing-2-others"
id="icu:incomingGroupCall__ringing-2-others"
i18n={i18n}
components={{
ringer: ringerNode,
@ -132,7 +132,7 @@ function GroupCallMessage({
case 3:
return (
<Intl
id="incomingGroupCall__ringing-3-others"
id="icu:incomingGroupCall__ringing-3-others"
i18n={i18n}
components={{
ringer: ringerNode,
@ -144,7 +144,7 @@ function GroupCallMessage({
default:
return (
<Intl
id="incomingGroupCall__ringing-many"
id="icu:incomingGroupCall__ringing-many"
i18n={i18n}
components={{
ringer: ringerNode,
@ -189,8 +189,8 @@ export function IncomingCallBar(props: PropsType): JSX.Element | null {
({ isVideoCall } = props);
headerNode = <ContactName title={title} />;
messageNode = isVideoCall
? i18n('incomingVideoCall')
: i18n('incomingAudioCall');
? i18n('icu:incomingVideoCall')
: i18n('icu:incomingAudioCall');
break;
case CallMode.Group: {
const { otherMembersRung, ringer } = props;
@ -282,7 +282,7 @@ export function IncomingCallBar(props: PropsType): JSX.Element | null {
classSuffix="decline"
onClick={declineIncomingCall}
tabIndex={0}
tooltipContent={i18n('declineCall')}
tooltipContent={i18n('icu:declineCall')}
/>
{isVideoCall ? (
<>
@ -290,13 +290,13 @@ export function IncomingCallBar(props: PropsType): JSX.Element | null {
classSuffix="accept-video-as-audio"
onClick={acceptAudioCall}
tabIndex={0}
tooltipContent={i18n('acceptCallWithoutVideo')}
tooltipContent={i18n('icu:acceptCallWithoutVideo')}
/>
<CallButton
classSuffix="accept-video"
onClick={acceptVideoCall}
tabIndex={0}
tooltipContent={i18n('acceptCall')}
tooltipContent={i18n('icu:acceptCall')}
/>
</>
) : (
@ -304,7 +304,7 @@ export function IncomingCallBar(props: PropsType): JSX.Element | null {
classSuffix="accept-audio"
onClick={acceptAudioCall}
tabIndex={0}
tooltipContent={i18n('acceptCall')}
tooltipContent={i18n('icu:acceptCall')}
/>
)}
</div>

2
ts/components/Input.tsx
View file

@ -223,7 +223,7 @@ export const Input = forwardRef<
className={getClassName('__clear-icon')}
onClick={() => onChange('')}
type="button"
aria-label={i18n('cancel')}
aria-label={i18n('icu:cancel')}
/>
) : null;

4
ts/components/LeftPaneSearchInput.tsx
View file

@ -87,7 +87,7 @@ export function LeftPaneSearchInput({
inputRef.current?.focus();
};
const label = searchConversation ? i18n('searchIn') : i18n('search');
const label = searchConversation ? i18n('icu:searchIn') : i18n('icu:search');
return (
<SearchInput
@ -149,7 +149,7 @@ export function LeftPaneSearchInput({
unblurredAvatarPath={searchConversation.unblurredAvatarPath}
/>
<button
aria-label={i18n('clearSearch')}
aria-label={i18n('icu:clearSearch')}
className="LeftPaneSearchInput__in-conversation-pill__x-button"
onClick={clearAndFocus}
type="button"

20
ts/components/Lightbox.tsx
View file

@ -504,7 +504,7 @@ export function Lightbox({
type="button"
>
<img
alt={i18n('lightboxImageAlt')}
alt={i18n('icu:lightboxImageAlt')}
className="Lightbox__object"
onContextMenu={(ev: React.MouseEvent<HTMLImageElement>) => {
// These are the only image types supported by Electron's NativeImage
@ -525,7 +525,7 @@ export function Lightbox({
} else {
content = (
<button
aria-label={i18n('lightboxImageAlt')}
aria-label={i18n('icu:lightboxImageAlt')}
className={classNames({
Lightbox__object: true,
Lightbox__unsupported: true,
@ -555,7 +555,7 @@ export function Lightbox({
} else if (isUnsupportedImageType || isUnsupportedVideoType) {
content = (
<button
aria-label={i18n('unsupportedAttachment')}
aria-label={i18n('icu:unsupportedAttachment')}
className={classNames({
Lightbox__object: true,
Lightbox__unsupported: true,
@ -571,7 +571,7 @@ export function Lightbox({
content = (
<button
aria-label={i18n('unsupportedAttachment')}
aria-label={i18n('icu:unsupportedAttachment')}
className="Lightbox__object Lightbox__unsupported Lightbox__unsupported--file"
onClick={onClose}
type="button"
@ -629,7 +629,7 @@ export function Lightbox({
<div className="Lightbox__controls">
{!isViewOnce ? (
<button
aria-label={i18n('forwardMessage')}
aria-label={i18n('icu:forwardMessage')}
className="Lightbox__button Lightbox__button--forward"
onClick={handleForward}
type="button"
@ -637,14 +637,14 @@ export function Lightbox({
) : null}
{!isViewOnce ? (
<button
aria-label={i18n('save')}
aria-label={i18n('icu:save')}
className="Lightbox__button Lightbox__button--save"
onClick={handleSave}
type="button"
/>
) : null}
<button
aria-label={i18n('close')}
aria-label={i18n('icu:close')}
className="Lightbox__button Lightbox__button--close"
onClick={closeLightbox}
type="button"
@ -668,7 +668,7 @@ export function Lightbox({
{hasPrevious && (
<div className="Lightbox__nav-prev">
<button
aria-label={i18n('previous')}
aria-label={i18n('icu:previous')}
className="Lightbox__button Lightbox__button--previous"
onClick={onPrevious}
type="button"
@ -678,7 +678,7 @@ export function Lightbox({
{hasNext && (
<div className="Lightbox__nav-next">
<button
aria-label={i18n('next')}
aria-label={i18n('icu:next')}
className="Lightbox__button Lightbox__button--next"
onClick={onNext}
type="button"
@ -725,7 +725,7 @@ export function Lightbox({
>
{item.thumbnailObjectUrl ? (
<img
alt={i18n('lightboxImageAlt')}
alt={i18n('icu:lightboxImageAlt')}
src={item.thumbnailObjectUrl}
/>
) : (

8
ts/components/MainHeader.tsx
View file

@ -247,10 +247,10 @@ export class MainHeader extends React.Component<PropsType, StateType> {
<div className="module-main-header__icon-container">
{areStoriesEnabled && (
<button
aria-label={i18n('stories')}
aria-label={i18n('icu:stories')}
className="module-main-header__stories-icon"
onClick={toggleStoriesView}
title={i18n('stories')}
title={i18n('icu:stories')}
type="button"
>
{hasFailedStorySends && (
@ -264,10 +264,10 @@ export class MainHeader extends React.Component<PropsType, StateType> {
</button>
)}
<button
aria-label={i18n('newConversation')}
aria-label={i18n('icu:newConversation')}
className="module-main-header__compose-icon"
onClick={startComposing}
title={i18n('newConversation')}
title={i18n('icu:newConversation')}
type="button"
/>
</div>

52
ts/components/MediaEditor.tsx
View file

@ -632,7 +632,7 @@ export function MediaEditor({
<>
<Slider
handleStyle={{ backgroundColor: getHSL(sliderValue) }}
label={i18n('CustomColorEditor__hue')}
label={i18n('icu:CustomColorEditor__hue')}
moduleClassName="HueSlider MediaEditor__tools__tool"
onChange={setSliderValue}
value={sliderValue}
@ -642,19 +642,19 @@ export function MediaEditor({
menuOptions={[
{
icon: 'MediaEditor__icon--text-regular',
label: i18n('MediaEditor__text--regular'),
label: i18n('icu:MediaEditor__text--regular'),
onClick: () => setTextStyle(TextStyle.Regular),
value: TextStyle.Regular,
},
{
icon: 'MediaEditor__icon--text-highlight',
label: i18n('MediaEditor__text--highlight'),
label: i18n('icu:MediaEditor__text--highlight'),
onClick: () => setTextStyle(TextStyle.Highlight),
value: TextStyle.Highlight,
},
{
icon: 'MediaEditor__icon--text-outline',
label: i18n('MediaEditor__text--outline'),
label: i18n('icu:MediaEditor__text--outline'),
onClick: () => setTextStyle(TextStyle.Outline),
value: TextStyle.Outline,
},
@ -682,7 +682,7 @@ export function MediaEditor({
}}
type="button"
>
{i18n('done')}
{i18n('icu:done')}
</button>
</>
);
@ -691,7 +691,7 @@ export function MediaEditor({
<>
<Slider
handleStyle={{ backgroundColor: getHSL(sliderValue) }}
label={i18n('CustomColorEditor__hue')}
label={i18n('icu:CustomColorEditor__hue')}
moduleClassName="HueSlider MediaEditor__tools__tool"
onChange={setSliderValue}
value={sliderValue}
@ -701,13 +701,13 @@ export function MediaEditor({
menuOptions={[
{
icon: 'MediaEditor__icon--draw-pen',
label: i18n('MediaEditor__draw--pen'),
label: i18n('icu:MediaEditor__draw--pen'),
onClick: () => setDrawTool(DrawTool.Pen),
value: DrawTool.Pen,
},
{
icon: 'MediaEditor__icon--draw-highlighter',
label: i18n('MediaEditor__draw--highlighter'),
label: i18n('icu:MediaEditor__draw--highlighter'),
onClick: () => setDrawTool(DrawTool.Highlighter),
value: DrawTool.Highlighter,
},
@ -725,25 +725,25 @@ export function MediaEditor({
menuOptions={[
{
icon: 'MediaEditor__icon--width-thin',
label: i18n('MediaEditor__draw--thin'),
label: i18n('icu:MediaEditor__draw--thin'),
onClick: () => setDrawWidth(DrawWidth.Thin),
value: DrawWidth.Thin,
},
{
icon: 'MediaEditor__icon--width-regular',
label: i18n('MediaEditor__draw--regular'),
label: i18n('icu:MediaEditor__draw--regular'),
onClick: () => setDrawWidth(DrawWidth.Regular),
value: DrawWidth.Regular,
},
{
icon: 'MediaEditor__icon--width-medium',
label: i18n('MediaEditor__draw--medium'),
label: i18n('icu:MediaEditor__draw--medium'),
onClick: () => setDrawWidth(DrawWidth.Medium),
value: DrawWidth.Medium,
},
{
icon: 'MediaEditor__icon--width-heavy',
label: i18n('MediaEditor__draw--heavy'),
label: i18n('icu:MediaEditor__draw--heavy'),
onClick: () => setDrawWidth(DrawWidth.Heavy),
value: DrawWidth.Heavy,
},
@ -766,7 +766,7 @@ export function MediaEditor({
onClick={() => setEditMode(undefined)}
type="button"
>
{i18n('done')}
{i18n('icu:done')}
</button>
</>
);
@ -799,10 +799,10 @@ export function MediaEditor({
}}
type="button"
>
{i18n('MediaEditor__crop--reset')}
{i18n('icu:MediaEditor__crop--reset')}
</button>
<button
aria-label={i18n('MediaEditor__crop--rotate')}
aria-label={i18n('icu:MediaEditor__crop--rotate')}
className="MediaEditor__tools__tool MediaEditor__tools__button MediaEditor__tools__button--rotate"
onClick={() => {
if (!fabricCanvas) {
@ -838,7 +838,7 @@ export function MediaEditor({
type="button"
/>
<button
aria-label={i18n('MediaEditor__crop--flip')}
aria-label={i18n('icu:MediaEditor__crop--flip')}
className="MediaEditor__tools__tool MediaEditor__tools__button MediaEditor__tools__button--flip"
onClick={() => {
if (!fabricCanvas) {
@ -857,7 +857,7 @@ export function MediaEditor({
type="button"
/>
<button
aria-label={i18n('MediaEditor__crop--lock')}
aria-label={i18n('icu:MediaEditor__crop--lock')}
className={classNames(
'MediaEditor__tools__button',
`MediaEditor__tools__button--crop-${
@ -896,7 +896,7 @@ export function MediaEditor({
}}
type="button"
>
{i18n('done')}
{i18n('icu:done')}
</button>
</>
);
@ -955,7 +955,7 @@ export function MediaEditor({
/>
</span>
) : (
i18n('MediaEditor__caption-button')
i18n('icu:MediaEditor__caption-button')
)}
</button>
@ -984,11 +984,11 @@ export function MediaEditor({
theme={Theme.Dark}
variant={ButtonVariant.Secondary}
>
{i18n('discard')}
{i18n('icu:discard')}
</Button>
<div className="MediaEditor__controls">
<button
aria-label={i18n('MediaEditor__control--draw')}
aria-label={i18n('icu:MediaEditor__control--draw')}
className={classNames({
MediaEditor__control: true,
'MediaEditor__control--pen': true,
@ -1002,7 +1002,7 @@ export function MediaEditor({
type="button"
/>
<button
aria-label={i18n('MediaEditor__control--text')}
aria-label={i18n('icu:MediaEditor__control--text')}
className={classNames({
MediaEditor__control: true,
'MediaEditor__control--text': true,
@ -1117,7 +1117,7 @@ export function MediaEditor({
theme={Theme.Dark}
/>
<button
aria-label={i18n('MediaEditor__control--crop')}
aria-label={i18n('icu:MediaEditor__control--crop')}
className={classNames({
MediaEditor__control: true,
'MediaEditor__control--crop': true,
@ -1140,7 +1140,7 @@ export function MediaEditor({
type="button"
/>
<button
aria-label={i18n('MediaEditor__control--undo')}
aria-label={i18n('icu:MediaEditor__control--undo')}
className="MediaEditor__control MediaEditor__control--undo"
disabled={!canUndo}
onClick={() => {
@ -1152,7 +1152,7 @@ export function MediaEditor({
type="button"
/>
<button
aria-label={i18n('MediaEditor__control--redo')}
aria-label={i18n('icu:MediaEditor__control--redo')}
className="MediaEditor__control MediaEditor__control--redo"
disabled={!canRedo}
onClick={() => {
@ -1238,7 +1238,7 @@ export function MediaEditor({
{isSending ? (
<Spinner svgSize="small" />
) : (
doneButtonLabel || i18n('save')
doneButtonLabel || i18n('icu:save')
)}
</Button>
</div>

20
ts/components/MediaQualitySelector.tsx
View file

@ -101,7 +101,7 @@ export function MediaQualitySelector({
<Reference>
{({ ref }) => (
<button
aria-label={i18n('MediaQualitySelector--button')}
aria-label={i18n('icu:MediaQualitySelector--button')}
className={classNames({
MediaQualitySelector__button: true,
'MediaQualitySelector__button--hq': isHighQuality,
@ -125,11 +125,11 @@ export function MediaQualitySelector({
style={style}
>
<div className="MediaQualitySelector__title">
{i18n('MediaQualitySelector--title')}
{i18n('icu:MediaQualitySelector--title')}
</div>
<button
aria-label={i18n(
'MediaQualitySelector--standard-quality-title'
'icu:MediaQualitySelector--standard-quality-title'
)}
className={classNames({
MediaQualitySelector__option: true,
@ -151,18 +151,20 @@ export function MediaQualitySelector({
/>
<div>
<div className="MediaQualitySelector__option--title">
{i18n('MediaQualitySelector--standard-quality-title')}
{i18n(
'icu:MediaQualitySelector--standard-quality-title'
)}
</div>
<div className="MediaQualitySelector__option--description">
{i18n(
'MediaQualitySelector--standard-quality-description'
'icu:MediaQualitySelector--standard-quality-description'
)}
</div>
</div>
</button>
<button
aria-label={i18n(
'MediaQualitySelector--high-quality-title'
'icu:MediaQualitySelector--high-quality-title'
)}
className={classNames({
MediaQualitySelector__option: true,
@ -183,10 +185,12 @@ export function MediaQualitySelector({
/>
<div>
<div className="MediaQualitySelector__option--title">
{i18n('MediaQualitySelector--high-quality-title')}
{i18n('icu:MediaQualitySelector--high-quality-title')}
</div>
<div className="MediaQualitySelector__option--description">
{i18n('MediaQualitySelector--high-quality-description')}
{i18n(
'icu:MediaQualitySelector--high-quality-description'
)}
</div>
</div>
</button>

8
ts/components/MiniPlayer.tsx
View file

@ -67,15 +67,15 @@ export function MiniPlayer({
let mod: 'play' | 'pause' | 'pending';
switch (state) {
case PlayerState.playing:
label = i18n('MessageAudio--pause');
label = i18n('icu:MessageAudio--pause');
mod = 'pause';
break;
case PlayerState.paused:
label = i18n('MessageAudio--play');
label = i18n('icu:MessageAudio--play');
mod = 'play';
break;
case PlayerState.loading:
label = i18n('MessageAudio--pending');
label = i18n('icu:MessageAudio--pending');
mod = 'pending';
break;
default:
@ -121,7 +121,7 @@ export function MiniPlayer({
type="button"
className="MiniPlayer__close-button"
onClick={onClose}
aria-label={i18n('close')}
aria-label={i18n('icu:close')}
/>
</div>
);

4
ts/components/Modal.tsx
View file

@ -200,7 +200,7 @@ export function ModalPage({
>
{onBackButtonClick && (
<button
aria-label={i18n('back')}
aria-label={i18n('icu:back')}
className={getClassName('__back-button')}
onClick={onBackButtonClick}
tabIndex={0}
@ -222,7 +222,7 @@ export function ModalPage({
)}
{hasXButton && (
<button
aria-label={i18n('close')}
aria-label={i18n('icu:close')}
className={getClassName('__close-button')}
onClick={onClose}
tabIndex={0}

34
ts/components/MyStories.tsx
View file

@ -57,7 +57,7 @@ export function MyStories({
dialogName="MyStories.delete"
actions={[
{
text: i18n('delete'),
text: i18n('icu:delete'),
action: () => onDelete(confirmDeleteStory),
style: 'negative',
},
@ -65,18 +65,18 @@ export function MyStories({
i18n={i18n}
onClose={() => setConfirmDeleteStory(undefined)}
>
{i18n('MyStories__delete')}
{i18n('icu:MyStories__delete')}
</ConfirmationDialog>
)}
<div className="Stories__pane__header Stories__pane__header--centered">
<button
aria-label={i18n('back')}
aria-label={i18n('icu:back')}
className="Stories__pane__header--back"
onClick={onBack}
type="button"
/>
<div className="Stories__pane__header--title">
{i18n('MyStories__title')}
{i18n('icu:MyStories__title')}
</div>
</div>
<div className="Stories__pane__list">
@ -109,7 +109,7 @@ export function MyStories({
</div>
{!myStories.length && (
<div className="Stories__pane__list--empty">
{i18n('Stories__list-empty')}
{i18n('icu:Stories__list-empty')}
</div>
)}
</>
@ -151,7 +151,7 @@ function StorySent({
<div className="MyStories__story" key={story.timestamp}>
{renderAlert()}
<button
aria-label={i18n('MyStories__story')}
aria-label={i18n('icu:MyStories__story')}
className="StoryListItem__button MyStories__story-button"
onClick={() => {
if (
@ -174,11 +174,11 @@ function StorySent({
<div className="StoryListItem__previews">
<StoryImage
attachment={story.attachment}
firstName={i18n('you')}
firstName={i18n('icu:you')}
i18n={i18n}
isMe
isThumbnail
label={i18n('MyStories__story')}
label={i18n('icu:MyStories__story')}
moduleClassName="StoryListItem__previews--image"
queueStoryDownload={queueStoryDownload}
storyId={story.messageId}
@ -187,14 +187,14 @@ function StorySent({
</div>
<div className="MyStories__story__details">
{sendStatus === ResolvedSendStatus.Sending &&
i18n('Stories__list--sending')}
i18n('icu:Stories__list--sending')}
{sendStatus === ResolvedSendStatus.Failed && (
<div className="MyStories__story__details__failed">
<div>
{i18n('Stories__list--send_failed')}
{i18n('icu:Stories__list--send_failed')}
{!wasManuallyRetried && (
<div className="MyStories__story__details__failed__button">
{i18n('Stories__list--retry-send')}
{i18n('icu:Stories__list--retry-send')}
</div>
)}
</div>
@ -203,10 +203,10 @@ function StorySent({
{sendStatus === ResolvedSendStatus.PartiallySent && (
<div className="MyStories__story__details__failed">
<div>
{i18n('Stories__list--partially-sent')}
{i18n('icu:Stories__list--partially-sent')}
{!wasManuallyRetried && (
<div className="MyStories__story__details__failed__button">
{i18n('Stories__list--retry-send')}
{i18n('icu:Stories__list--retry-send')}
</div>
)}
</div>
@ -231,7 +231,7 @@ function StorySent({
</button>
{story.attachment && (story.attachment.path || story.attachment.data) && (
<button
aria-label={i18n('MyStories__download')}
aria-label={i18n('icu:MyStories__download')}
className="MyStories__story__download"
onClick={() => {
onSave(story);
@ -244,14 +244,14 @@ function StorySent({
menuOptions={[
{
icon: 'MyStories__icon--forward',
label: i18n('forward'),
label: i18n('icu:forward'),
onClick: () => {
onForward(story.messageId);
},
},
{
icon: 'StoryListItem__icon--info',
label: i18n('StoryListItem__info'),
label: i18n('icu:StoryListItem__info'),
onClick: () => {
viewStory({
storyId: story.messageId,
@ -262,7 +262,7 @@ function StorySent({
},
{
icon: 'MyStories__icon--delete',
label: i18n('delete'),
label: i18n('icu:delete'),
onClick: () => {
setConfirmDeleteStory(story);
},

16
ts/components/MyStoryButton.tsx
View file

@ -85,10 +85,10 @@ export function MyStoryButton({
</div>
<div className="StoryListItem__info">
<div className="StoryListItem__info--title">
{i18n('Stories__mine')}
{i18n('icu:Stories__mine')}
</div>
<div className="StoryListItem__info--timestamp">
{i18n('Stories__add')}
{i18n('icu:Stories__add')}
</div>
</div>
</StoriesAddStoryButton>
@ -153,21 +153,21 @@ export function MyStoryButton({
>
<div className="StoryListItem__info">
<div className="StoryListItem__info--title StoryListItem__chevron">
{i18n('MyStories__list_item')}
{i18n('icu:MyStories__list_item')}
</div>
{reducedSendStatus === ResolvedSendStatus.Sending && (
<span className="StoryListItem__info--sending">
{i18n('Stories__list--sending')}
{i18n('icu:Stories__list--sending')}
</span>
)}
{reducedSendStatus === ResolvedSendStatus.Failed && (
<span className="StoryListItem__info--send_failed">
{i18n('Stories__list--send_failed')}
{i18n('icu:Stories__list--send_failed')}
</span>
)}
{reducedSendStatus === ResolvedSendStatus.PartiallySent && (
<span className="StoryListItem__info--send_failed">
{i18n('Stories__list--partially-sent')}
{i18n('icu:Stories__list--partially-sent')}
</span>
)}
{reducedSendStatus === ResolvedSendStatus.Sent && (
@ -180,7 +180,7 @@ export function MyStoryButton({
)}
</div>
<div
aria-label={i18n('StoryListItem__label')}
aria-label={i18n('icu:StoryListItem__label')}
className={classNames('StoryListItem__previews', {
'StoryListItem__previews--multiple': hasMultiple,
})}
@ -188,7 +188,7 @@ export function MyStoryButton({
{hasMultiple && <div className="StoryListItem__previews--more" />}
<StoryImage
attachment={newestStory.attachment}
firstName={i18n('you')}
firstName={i18n('icu:you')}
i18n={i18n}
isMe
isThumbnail

14
ts/components/NeedsScreenRecordingPermissionsModal.tsx
View file

@ -31,7 +31,7 @@ export function NeedsScreenRecordingPermissionsModal({
ref={focusRef}
variant={ButtonVariant.Secondary}
>
{i18n('calling__presenting--permission-cancel')}
{i18n('icu:calling__presenting--permission-cancel')}
</Button>
<Button
onClick={() => {
@ -40,7 +40,7 @@ export function NeedsScreenRecordingPermissionsModal({
}}
variant={ButtonVariant.Primary}
>
{i18n('calling__presenting--permission-open')}
{i18n('icu:calling__presenting--permission-open')}
</Button>
</>
);
@ -48,16 +48,16 @@ export function NeedsScreenRecordingPermissionsModal({
<Modal
modalName="NeedsScreenRecordingPermissionsModal"
i18n={i18n}
title={i18n('calling__presenting--permission-title')}
title={i18n('icu:calling__presenting--permission-title')}
theme={Theme.Dark}
onClose={toggleScreenRecordingPermissionsDialog}
modalFooter={footer}
>
<p>{i18n('calling__presenting--macos-permission-description')}</p>
<p>{i18n('icu:calling__presenting--macos-permission-description')}</p>
<ol style={{ paddingLeft: 16 }}>
<li>{i18n('calling__presenting--permission-instruction-step1')}</li>
<li>{i18n('calling__presenting--permission-instruction-step2')}</li>
<li>{i18n('calling__presenting--permission-instruction-step3')}</li>
<li>{i18n('icu:calling__presenting--permission-instruction-step1')}</li>
<li>{i18n('icu:calling__presenting--permission-instruction-step2')}</li>
<li>{i18n('icu:calling__presenting--permission-instruction-step3')}</li>
</ol>
</Modal>
);

20
ts/components/NewlyCreatedGroupInvitedContactsDialog.tsx
View file

@ -32,34 +32,38 @@ export function NewlyCreatedGroupInvitedContactsDialog({
if (contacts.length === 1) {
const contact = contacts[0];
title = i18n('NewlyCreatedGroupInvitedContactsDialog--title--one');
title = i18n('icu:NewlyCreatedGroupInvitedContactsDialog--title--one');
body = (
<>
<GroupDialog.Paragraph>
<Intl
i18n={i18n}
id="NewlyCreatedGroupInvitedContactsDialog--body--user-paragraph--one"
id="icu:NewlyCreatedGroupInvitedContactsDialog--body--user-paragraph--one"
components={{ name: <ContactName title={contact.title} /> }}
/>
</GroupDialog.Paragraph>
<GroupDialog.Paragraph>
{i18n('NewlyCreatedGroupInvitedContactsDialog--body--info-paragraph')}
{i18n(
'icu:NewlyCreatedGroupInvitedContactsDialog--body--info-paragraph'
)}
</GroupDialog.Paragraph>
</>
);
} else {
title = i18n('NewlyCreatedGroupInvitedContactsDialog--title--many', {
title = i18n('icu:NewlyCreatedGroupInvitedContactsDialog--title--many', {
count: contacts.length.toString(),
});
body = (
<>
<GroupDialog.Paragraph>
{i18n(
'NewlyCreatedGroupInvitedContactsDialog--body--user-paragraph--many'
'icu:NewlyCreatedGroupInvitedContactsDialog--body--user-paragraph--many'
)}
</GroupDialog.Paragraph>
<GroupDialog.Paragraph>
{i18n('NewlyCreatedGroupInvitedContactsDialog--body--info-paragraph')}
{i18n(
'icu:NewlyCreatedGroupInvitedContactsDialog--body--info-paragraph'
)}
</GroupDialog.Paragraph>
<GroupDialog.Contacts
contacts={contacts}
@ -75,9 +79,9 @@ export function NewlyCreatedGroupInvitedContactsDialog({
<GroupDialog
i18n={i18n}
onClickPrimaryButton={onClose}
primaryButtonText={i18n('Confirmation--confirm')}
primaryButtonText={i18n('icu:Confirmation--confirm')}
secondaryButtonText={i18n(
'NewlyCreatedGroupInvitedContactsDialog--body--learn-more'
'icu:NewlyCreatedGroupInvitedContactsDialog--body--learn-more'
)}
onClickSecondaryButton={() => {
openLinkInWebBrowser(

4
ts/components/PermissionsPopup.tsx
View file

@ -36,14 +36,14 @@ export function PermissionsPopup({
ref={focusRef}
variant={ButtonVariant.Secondary}
>
{i18n('confirmation-dialog--Cancel')}
{i18n('icu:confirmation-dialog--Cancel')}
</Button>
<Button
onClick={onAccept}
ref={focusRef}
variant={ButtonVariant.Primary}
>
{i18n('allowAccess')}
{i18n('icu:allowAccess')}
</Button>
</div>
</div>

8
ts/components/PlaybackRateButton.tsx
View file

@ -65,10 +65,10 @@ export function PlaybackRateButton({
);
const playbackRateLabels: { [key: number]: string } = {
1: i18n('MessageAudio--playbackRate1'),
1.5: i18n('MessageAudio--playbackRate1p5'),
2: i18n('MessageAudio--playbackRate2'),
0.5: i18n('MessageAudio--playbackRatep5'),
1: i18n('icu:MessageAudio--playbackRate1'),
1.5: i18n('icu:MessageAudio--playbackRate1p5'),
2: i18n('icu:MessageAudio--playbackRate2'),
0.5: i18n('icu:MessageAudio--playbackRatep5'),
};
const label = playbackRate

207
ts/components/Preferences.tsx
View file

@ -360,17 +360,20 @@ export function Preferences({
<>
<div className="Preferences__title">
<div className="Preferences__title--header">
{i18n('Preferences__button--general')}
{i18n('icu:Preferences__button--general')}
</div>
</div>
<SettingsRow>
<Control left={i18n('Preferences--device-name')} right={deviceName} />
<Control
left={i18n('icu:Preferences--device-name')}
right={deviceName}
/>
</SettingsRow>
<SettingsRow title={i18n('Preferences--system')}>
<SettingsRow title={i18n('icu:Preferences--system')}>
{isAutoLaunchSupported && (
<Checkbox
checked={hasAutoLaunch}
label={i18n('autoLaunchDescription')}
label={i18n('icu:autoLaunchDescription')}
moduleClassName="Preferences__checkbox"
name="autoLaunch"
onChange={onAutoLaunchChange}
@ -379,7 +382,7 @@ export function Preferences({
{isHideMenuBarSupported && (
<Checkbox
checked={hasHideMenuBar}
label={i18n('hideMenuBar')}
label={i18n('icu:hideMenuBar')}
moduleClassName="Preferences__checkbox"
name="hideMenuBar"
onChange={onHideMenuBarChange}
@ -389,7 +392,7 @@ export function Preferences({
<>
<Checkbox
checked={hasMinimizeToSystemTray}
label={i18n('SystemTraySetting__minimize-to-system-tray')}
label={i18n('icu:SystemTraySetting__minimize-to-system-tray')}
moduleClassName="Preferences__checkbox"
name="system-tray-setting-minimize-to-system-tray"
onChange={onMinimizeToSystemTrayChange}
@ -399,7 +402,7 @@ export function Preferences({
checked={hasMinimizeToAndStartInSystemTray}
disabled={!hasMinimizeToSystemTray}
label={i18n(
'SystemTraySetting__minimize-to-and-start-in-system-tray'
'icu:SystemTraySetting__minimize-to-and-start-in-system-tray'
)}
moduleClassName="Preferences__checkbox"
name="system-tray-setting-minimize-to-and-start-in-system-tray"
@ -409,27 +412,27 @@ export function Preferences({
</>
)}
</SettingsRow>
<SettingsRow title={i18n('permissions')}>
<SettingsRow title={i18n('icu:permissions')}>
<Checkbox
checked={hasMediaPermissions}
label={i18n('mediaPermissionsDescription')}
label={i18n('icu:mediaPermissionsDescription')}
moduleClassName="Preferences__checkbox"
name="mediaPermissions"
onChange={onMediaPermissionsChange}
/>
<Checkbox
checked={hasMediaCameraPermissions}
label={i18n('mediaCameraPermissionsDescription')}
label={i18n('icu:mediaCameraPermissionsDescription')}
moduleClassName="Preferences__checkbox"
name="mediaCameraPermissions"
onChange={onMediaCameraPermissionsChange}
/>
</SettingsRow>
{isAutoDownloadUpdatesSupported && (
<SettingsRow title={i18n('Preferences--updates')}>
<SettingsRow title={i18n('icu:Preferences--updates')}>
<Checkbox
checked={hasAutoDownloadUpdate}
label={i18n('Preferences__download-update')}
label={i18n('icu:Preferences__download-update')}
moduleClassName="Preferences__checkbox"
name="autoDownloadUpdate"
onChange={onAutoDownloadUpdateChange}
@ -455,14 +458,14 @@ export function Preferences({
<>
<div className="Preferences__title">
<div className="Preferences__title--header">
{i18n('Preferences__button--appearance')}
{i18n('icu:Preferences__button--appearance')}
</div>
</div>
<SettingsRow>
<Control
left={
<label htmlFor={themeSelectId}>
{i18n('Preferences--theme')}
{i18n('icu:Preferences--theme')}
</label>
}
right={
@ -471,15 +474,15 @@ export function Preferences({
onChange={onThemeChange}
options={[
{
text: i18n('themeSystem'),
text: i18n('icu:themeSystem'),
value: 'system',
},
{
text: i18n('themeLight'),
text: i18n('icu:themeLight'),
value: 'light',
},
{
text: i18n('themeDark'),
text: i18n('icu:themeDark'),
value: 'dark',
},
]}
@ -488,7 +491,7 @@ export function Preferences({
}
/>
<Control
left={i18n('showChatColorEditor')}
left={i18n('icu:showChatColorEditor')}
onClick={() => {
setPage(Page.ChatColor);
}}
@ -505,7 +508,9 @@ export function Preferences({
/>
<Control
left={
<label htmlFor={zoomSelectId}>{i18n('Preferences--zoom')}</label>
<label htmlFor={zoomSelectId}>
{i18n('icu:Preferences--zoom')}
</label>
}
right={
<Select
@ -523,8 +528,8 @@ export function Preferences({
let spellCheckDirtyText: string | undefined;
if (initialSpellCheckSetting !== hasSpellCheck) {
spellCheckDirtyText = hasSpellCheck
? i18n('spellCheckWillBeEnabled')
: i18n('spellCheckWillBeDisabled');
? i18n('icu:spellCheckWillBeEnabled')
: i18n('icu:spellCheckWillBeDisabled');
}
const lastSyncDate = new Date(lastSyncTime || 0);
@ -533,39 +538,39 @@ export function Preferences({
<>
<div className="Preferences__title">
<div className="Preferences__title--header">
{i18n('Preferences__button--chats')}
{i18n('icu:Preferences__button--chats')}
</div>
</div>
<SettingsRow title={i18n('Preferences__button--chats')}>
<SettingsRow title={i18n('icu:Preferences__button--chats')}>
<Checkbox
checked={hasSpellCheck}
description={spellCheckDirtyText}
label={i18n('spellCheckDescription')}
label={i18n('icu:spellCheckDescription')}
moduleClassName="Preferences__checkbox"
name="spellcheck"
onChange={onSpellCheckChange}
/>
<Checkbox
checked={hasLinkPreviews}
description={i18n('Preferences__link-previews--description')}
description={i18n('icu:Preferences__link-previews--description')}
disabled
label={i18n('Preferences__link-previews--title')}
label={i18n('icu:Preferences__link-previews--title')}
moduleClassName="Preferences__checkbox"
name="linkPreviews"
onChange={noop}
/>
<Control
left={i18n('Preferences__sent-media-quality')}
left={i18n('icu:Preferences__sent-media-quality')}
right={
<Select
onChange={onSentMediaQualityChange}
options={[
{
text: i18n('sentMediaQualityStandard'),
text: i18n('icu:sentMediaQualityStandard'),
value: 'standard',
},
{
text: i18n('sentMediaQualityHigh'),
text: i18n('icu:sentMediaQualityHigh'),
value: 'high',
},
]}
@ -579,17 +584,17 @@ export function Preferences({
<Control
left={
<>
<div>{i18n('sync')}</div>
<div>{i18n('icu:sync')}</div>
<div className="Preferences__description">
{i18n('syncExplanation')}{' '}
{i18n('Preferences--lastSynced', {
{i18n('icu:syncExplanation')}{' '}
{i18n('icu:Preferences--lastSynced', {
date: lastSyncDate.toLocaleDateString(),
time: lastSyncDate.toLocaleTimeString(),
})}
</div>
{showSyncFailed && (
<div className="Preferences__description Preferences__description--error">
{i18n('syncFailed')}
{i18n('icu:syncFailed')}
</div>
)}
</>
@ -612,7 +617,11 @@ export function Preferences({
}}
variant={ButtonVariant.SecondaryAffirmative}
>
{nowSyncing ? <Spinner svgSize="small" /> : i18n('syncNow')}
{nowSyncing ? (
<Spinner svgSize="small" />
) : (
i18n('icu:syncNow')
)}
</Button>
</div>
}
@ -626,34 +635,34 @@ export function Preferences({
<>
<div className="Preferences__title">
<div className="Preferences__title--header">
{i18n('Preferences__button--calls')}
{i18n('icu:Preferences__button--calls')}
</div>
</div>
<SettingsRow title={i18n('calling')}>
<SettingsRow title={i18n('icu:calling')}>
<Checkbox
checked={hasIncomingCallNotifications}
label={i18n('incomingCallNotificationDescription')}
label={i18n('icu:incomingCallNotificationDescription')}
moduleClassName="Preferences__checkbox"
name="incomingCallNotification"
onChange={onIncomingCallNotificationsChange}
/>
<Checkbox
checked={hasCallRingtoneNotification}
label={i18n('callRingtoneNotificationDescription')}
label={i18n('icu:callRingtoneNotificationDescription')}
moduleClassName="Preferences__checkbox"
name="callRingtoneNotification"
onChange={onCallRingtoneNotificationChange}
/>
</SettingsRow>
<SettingsRow title={i18n('Preferences__devices')}>
<SettingsRow title={i18n('icu:Preferences__devices')}>
<Control
left={
<>
<label className="Preferences__select-title" htmlFor="video">
{i18n('callingDeviceSelection__label--video')}
{i18n('icu:callingDeviceSelection__label--video')}
</label>
<Select
ariaLabel={i18n('callingDeviceSelection__label--video')}
ariaLabel={i18n('icu:callingDeviceSelection__label--video')}
disabled={!availableCameras.length}
moduleClassName="Preferences__select"
name="video"
@ -667,7 +676,7 @@ export function Preferences({
: [
{
text: i18n(
'callingDeviceSelection__select--no-device'
'icu:callingDeviceSelection__select--no-device'
),
value: 'undefined',
},
@ -686,10 +695,12 @@ export function Preferences({
className="Preferences__select-title"
htmlFor="audio-input"
>
{i18n('callingDeviceSelection__label--audio-input')}
{i18n('icu:callingDeviceSelection__label--audio-input')}
</label>
<Select
ariaLabel={i18n('callingDeviceSelection__label--audio-input')}
ariaLabel={i18n(
'icu:callingDeviceSelection__label--audio-input'
)}
disabled={!availableMicrophones.length}
moduleClassName="Preferences__select"
name="audio-input"
@ -703,7 +714,7 @@ export function Preferences({
: [
{
text: i18n(
'callingDeviceSelection__select--no-device'
'icu:callingDeviceSelection__select--no-device'
),
value: 'undefined',
},
@ -722,11 +733,11 @@ export function Preferences({
className="Preferences__select-title"
htmlFor="audio-output"
>
{i18n('callingDeviceSelection__label--audio-output')}
{i18n('icu:callingDeviceSelection__label--audio-output')}
</label>
<Select
ariaLabel={i18n(
'callingDeviceSelection__label--audio-output'
'icu:callingDeviceSelection__label--audio-output'
)}
disabled={!availableSpeakers.length}
moduleClassName="Preferences__select"
@ -741,7 +752,7 @@ export function Preferences({
: [
{
text: i18n(
'callingDeviceSelection__select--no-device'
'icu:callingDeviceSelection__select--no-device'
),
value: 'undefined',
},
@ -754,11 +765,11 @@ export function Preferences({
right={<div />}
/>
</SettingsRow>
<SettingsRow title={i18n('Preferences--advanced')}>
<SettingsRow title={i18n('icu:Preferences--advanced')}>
<Checkbox
checked={hasRelayCalls}
description={i18n('alwaysRelayCallsDetail')}
label={i18n('alwaysRelayCallsDescription')}
description={i18n('icu:alwaysRelayCallsDetail')}
label={i18n('icu:alwaysRelayCallsDescription')}
moduleClassName="Preferences__checkbox"
name="relayCalls"
onChange={onRelayCallsChange}
@ -771,20 +782,20 @@ export function Preferences({
<>
<div className="Preferences__title">
<div className="Preferences__title--header">
{i18n('Preferences__button--notifications')}
{i18n('icu:Preferences__button--notifications')}
</div>
</div>
<SettingsRow>
<Checkbox
checked={hasNotifications}
label={i18n('Preferences__enable-notifications')}
label={i18n('icu:Preferences__enable-notifications')}
moduleClassName="Preferences__checkbox"
name="notifications"
onChange={onNotificationsChange}
/>
<Checkbox
checked={hasCallNotifications}
label={i18n('callSystemNotificationDescription')}
label={i18n('icu:callSystemNotificationDescription')}
moduleClassName="Preferences__checkbox"
name="callSystemNotification"
onChange={onCallNotificationsChange}
@ -792,7 +803,7 @@ export function Preferences({
{isNotificationAttentionSupported && (
<Checkbox
checked={hasNotificationAttention}
label={i18n('notificationDrawAttention')}
label={i18n('icu:notificationDrawAttention')}
moduleClassName="Preferences__checkbox"
name="notificationDrawAttention"
onChange={onNotificationAttentionChange}
@ -801,7 +812,7 @@ export function Preferences({
{isAudioNotificationsSupported && (
<Checkbox
checked={hasAudioNotifications}
label={i18n('audioNotificationDescription')}
label={i18n('icu:audioNotificationDescription')}
moduleClassName="Preferences__checkbox"
name="audioNotification"
onChange={onAudioNotificationsChange}
@ -809,7 +820,7 @@ export function Preferences({
)}
<Checkbox
checked={hasCountMutedConversations}
label={i18n('countMutedConversationsDescription')}
label={i18n('icu:countMutedConversationsDescription')}
moduleClassName="Preferences__checkbox"
name="countMutedConversations"
onChange={onCountMutedConversationsChange}
@ -817,23 +828,23 @@ export function Preferences({
</SettingsRow>
<SettingsRow>
<Control
left={i18n('Preferences--notification-content')}
left={i18n('icu:Preferences--notification-content')}
right={
<Select
ariaLabel={i18n('Preferences--notification-content')}
ariaLabel={i18n('icu:Preferences--notification-content')}
disabled={!hasNotifications}
onChange={onNotificationContentChange}
options={[
{
text: i18n('nameAndMessage'),
text: i18n('icu:nameAndMessage'),
value: 'message',
},
{
text: i18n('nameOnly'),
text: i18n('icu:nameOnly'),
value: 'name',
},
{
text: i18n('noNameOrMessage'),
text: i18n('icu:noNameOrMessage'),
value: 'count',
},
]}
@ -852,7 +863,7 @@ export function Preferences({
<>
<div className="Preferences__title">
<div className="Preferences__title--header">
{i18n('Preferences__button--privacy')}
{i18n('icu:Preferences__button--privacy')}
</div>
</div>
{isPhoneNumberSharingSupported ? (
@ -871,23 +882,23 @@ export function Preferences({
) : null}
<SettingsRow>
<Control
left={i18n('Preferences--blocked')}
left={i18n('icu:Preferences--blocked')}
right={
blockedCount === 1
? i18n('Preferences--blocked-count-singular', {
? i18n('icu:Preferences--blocked-count-singular', {
num: String(blockedCount),
})
: i18n('Preferences--blocked-count-plural', {
: i18n('icu:Preferences--blocked-count-plural', {
num: String(blockedCount || 0),
})
}
/>
</SettingsRow>
<SettingsRow title={i18n('Preferences--messaging')}>
<SettingsRow title={i18n('icu:Preferences--messaging')}>
<Checkbox
checked={hasReadReceipts}
disabled
label={i18n('Preferences--read-receipts')}
label={i18n('icu:Preferences--read-receipts')}
moduleClassName="Preferences__checkbox"
name="readReceipts"
onChange={noop}
@ -895,14 +906,14 @@ export function Preferences({
<Checkbox
checked={hasTypingIndicators}
disabled
label={i18n('Preferences--typing-indicators')}
label={i18n('icu:Preferences--typing-indicators')}
moduleClassName="Preferences__checkbox"
name="typingIndicators"
onChange={noop}
/>
<div className="Preferences__padding">
<div className="Preferences__description">
{i18n('Preferences__privacy--description')}
{i18n('icu:Preferences__privacy--description')}
</div>
</div>
</SettingsRow>
@ -919,16 +930,18 @@ export function Preferences({
left={
<>
<div>
{i18n('settings__DisappearingMessages__timer__label')}
{i18n('icu:settings__DisappearingMessages__timer__label')}
</div>
<div className="Preferences__description">
{i18n('settings__DisappearingMessages__footer')}
{i18n('icu:settings__DisappearingMessages__footer')}
</div>
</>
}
right={
<Select
ariaLabel={i18n('settings__DisappearingMessages__timer__label')}
ariaLabel={i18n(
'icu:settings__DisappearingMessages__timer__label'
)}
onChange={value => {
if (
value === String(universalExpireTimer) ||
@ -955,7 +968,7 @@ export function Preferences({
: DurationInSeconds.fromSeconds(-1),
text: isCustomDisappearingMessageValue
? formatExpirationTimer(i18n, universalExpireTimer)
: i18n('selectedCustomDisappearingTimeOption'),
: i18n('icu:selectedCustomDisappearingTimeOption'),
},
])}
value={universalExpireTimer}
@ -964,13 +977,13 @@ export function Preferences({
/>
</SettingsRow>
{shouldShowStoriesSettings && (
<SettingsRow title={i18n('Stories__title')}>
<SettingsRow title={i18n('icu:Stories__title')}>
<Control
left={
<label htmlFor={storiesId}>
<div>{i18n('Stories__settings-toggle--title')}</div>
<div>{i18n('icu:Stories__settings-toggle--title')}</div>
<div className="Preferences__description">
{i18n('Stories__settings-toggle--description')}
{i18n('icu:Stories__settings-toggle--description')}
</div>
</label>
}
@ -980,7 +993,7 @@ export function Preferences({
onClick={() => onHasStoriesDisabledChanged(false)}
variant={ButtonVariant.Secondary}
>
{i18n('Preferences__turn-stories-on')}
{i18n('icu:Preferences__turn-stories-on')}
</Button>
) : (
<Button
@ -988,7 +1001,7 @@ export function Preferences({
onClick={() => setConfirmStoriesOff(true)}
variant={ButtonVariant.SecondaryDestructive}
>
{i18n('Preferences__turn-stories-off')}
{i18n('icu:Preferences__turn-stories-off')}
</Button>
)
}
@ -999,9 +1012,9 @@ export function Preferences({
<Control
left={
<>
<div>{i18n('clearDataHeader')}</div>
<div>{i18n('icu:clearDataHeader')}</div>
<div className="Preferences__description">
{i18n('clearDataExplanation')}
{i18n('icu:clearDataExplanation')}
</div>
</>
}
@ -1011,7 +1024,7 @@ export function Preferences({
onClick={() => setConfirmDelete(true)}
variant={ButtonVariant.SecondaryDestructive}
>
{i18n('clearDataButton')}
{i18n('icu:clearDataButton')}
</Button>
</div>
}
@ -1024,16 +1037,16 @@ export function Preferences({
{
action: doDeleteAllData,
style: 'negative',
text: i18n('clearDataButton'),
text: i18n('icu:clearDataButton'),
},
]}
i18n={i18n}
onClose={() => {
setConfirmDelete(false);
}}
title={i18n('deleteAllDataHeader')}
title={i18n('icu:deleteAllDataHeader')}
>
{i18n('deleteAllDataBody')}
{i18n('icu:deleteAllDataBody')}
</ConfirmationDialog>
) : null}
{confirmStoriesOff ? (
@ -1043,7 +1056,7 @@ export function Preferences({
{
action: () => onHasStoriesDisabledChanged(true),
style: 'negative',
text: i18n('Preferences__turn-stories-off--action'),
text: i18n('icu:Preferences__turn-stories-off--action'),
},
]}
i18n={i18n}
@ -1051,7 +1064,7 @@ export function Preferences({
setConfirmStoriesOff(false);
}}
>
{i18n('Preferences__turn-stories-off--body')}
{i18n('icu:Preferences__turn-stories-off--body')}
</ConfirmationDialog>
) : null}
</>
@ -1061,13 +1074,13 @@ export function Preferences({
<>
<div className="Preferences__title">
<button
aria-label={i18n('goBack')}
aria-label={i18n('icu:goBack')}
className="Preferences__back-icon"
onClick={() => setPage(Page.Appearance)}
type="button"
/>
<div className="Preferences__title--header">
{i18n('ChatColorPicker__menu-title')}
{i18n('icu:ChatColorPicker__menu-title')}
</div>
</div>
<ChatColorPicker
@ -1094,7 +1107,7 @@ export function Preferences({
<>
<div className="Preferences__title">
<button
aria-label={i18n('goBack')}
aria-label={i18n('icu:goBack')}
className="Preferences__back-icon"
onClick={() => setPage(Page.Privacy)}
type="button"
@ -1191,7 +1204,7 @@ export function Preferences({
})}
onClick={() => setPage(Page.General)}
>
{i18n('Preferences__button--general')}
{i18n('icu:Preferences__button--general')}
</button>
<button
type="button"
@ -1203,7 +1216,7 @@ export function Preferences({
})}
onClick={() => setPage(Page.Appearance)}
>
{i18n('Preferences__button--appearance')}
{i18n('icu:Preferences__button--appearance')}
</button>
<button
type="button"
@ -1214,7 +1227,7 @@ export function Preferences({
})}
onClick={() => setPage(Page.Chats)}
>
{i18n('Preferences__button--chats')}
{i18n('icu:Preferences__button--chats')}
</button>
<button
type="button"
@ -1225,7 +1238,7 @@ export function Preferences({
})}
onClick={() => setPage(Page.Calls)}
>
{i18n('Preferences__button--calls')}
{i18n('icu:Preferences__button--calls')}
</button>
<button
type="button"
@ -1236,7 +1249,7 @@ export function Preferences({
})}
onClick={() => setPage(Page.Notifications)}
>
{i18n('Preferences__button--notifications')}
{i18n('icu:Preferences__button--notifications')}
</button>
<button
type="button"
@ -1248,7 +1261,7 @@ export function Preferences({
})}
onClick={() => setPage(Page.Privacy)}
>
{i18n('Preferences__button--privacy')}
{i18n('icu:Preferences__button--privacy')}
</button>
</div>
<div className="Preferences__settings-pane">{settings}</div>
@ -1352,7 +1365,7 @@ function localizeDefault(i18n: LocalizerType, deviceLabel: string): string {
return deviceLabel.toLowerCase().startsWith('default')
? deviceLabel.replace(
/default/i,
i18n('callingDeviceSelection__select--default')
i18n('icu:callingDeviceSelection__select--default')
)
: deviceLabel;
}

46
ts/components/ProfileEditor.tsx
View file

@ -99,23 +99,23 @@ type DefaultBio = {
function getDefaultBios(i18n: LocalizerType): Array<DefaultBio> {
return [
{
i18nLabel: i18n('Bio--speak-freely'),
i18nLabel: i18n('icu:Bio--speak-freely'),
shortName: 'wave',
},
{
i18nLabel: i18n('Bio--encrypted'),
i18nLabel: i18n('icu:Bio--encrypted'),
shortName: 'zipper_mouth_face',
},
{
i18nLabel: i18n('Bio--free-to-chat'),
i18nLabel: i18n('icu:Bio--free-to-chat'),
shortName: '+1',
},
{
i18nLabel: i18n('Bio--coffee-lover'),
i18nLabel: i18n('icu:Bio--coffee-lover'),
shortName: 'coffee',
},
{
i18nLabel: i18n('Bio--taking-break'),
i18nLabel: i18n('icu:Bio--taking-break'),
shortName: 'mobile_phone_off',
},
];
@ -301,7 +301,7 @@ export function ProfileEditor({
firstName: String(newFirstName),
}));
}}
placeholder={i18n('ProfileEditor--first-name')}
placeholder={i18n('icu:ProfileEditor--first-name')}
ref={focusInputRef}
value={stagedProfile.firstName}
/>
@ -316,7 +316,7 @@ export function ProfileEditor({
familyName: newFamilyName,
}));
}}
placeholder={i18n('ProfileEditor--last-name')}
placeholder={i18n('icu:ProfileEditor--last-name')}
value={stagedProfile.familyName}
/>
<Modal.ButtonFooter>
@ -342,7 +342,7 @@ export function ProfileEditor({
}}
variant={ButtonVariant.Secondary}
>
{i18n('cancel')}
{i18n('icu:cancel')}
</Button>
<Button
disabled={shouldDisableSave}
@ -362,7 +362,7 @@ export function ProfileEditor({
handleBack();
}}
>
{i18n('save')}
{i18n('icu:save')}
</Button>
</Modal.ButtonFooter>
</>
@ -414,7 +414,7 @@ export function ProfileEditor({
}
}}
ref={focusInputRef}
placeholder={i18n('ProfileEditor--about-placeholder')}
placeholder={i18n('icu:ProfileEditor--about-placeholder')}
value={stagedProfile.aboutText}
whenToShowRemainingCount={40}
/>
@ -463,7 +463,7 @@ export function ProfileEditor({
}}
variant={ButtonVariant.Secondary}
>
{i18n('cancel')}
{i18n('icu:cancel')}
</Button>
<Button
disabled={shouldDisableSave}
@ -480,7 +480,7 @@ export function ProfileEditor({
handleBack();
}}
>
{i18n('save')}
{i18n('icu:save')}
</Button>
</Modal.ButtonFooter>
</>
@ -507,7 +507,7 @@ export function ProfileEditor({
if (usernameEditState === UsernameEditState.Deleting) {
actions = (
<ConversationDetailsIcon
ariaLabel={i18n('ProfileEditor--username--deleting-username')}
ariaLabel={i18n('icu:ProfileEditor--username--deleting-username')}
icon={IconType.spinner}
disabled
fakeButton
@ -518,7 +518,7 @@ export function ProfileEditor({
{
group: 'copy',
icon: 'ProfileEditor__username-menu__copy-icon',
label: i18n('ProfileEditor--username--copy'),
label: i18n('icu:ProfileEditor--username--copy'),
onClick: () => {
assertDev(
username !== undefined,
@ -531,7 +531,7 @@ export function ProfileEditor({
{
group: 'copy',
icon: 'ProfileEditor__username-menu__copy-link-icon',
label: i18n('ProfileEditor--username--copy-link'),
label: i18n('icu:ProfileEditor--username--copy-link'),
onClick: () => {
assertDev(
username !== undefined,
@ -548,7 +548,7 @@ export function ProfileEditor({
group: 'delete',
icon: 'ProfileEditor__username-menu__trash-icon',
label: i18n('ProfileEditor--username--delete'),
label: i18n('icu:ProfileEditor--username--delete'),
onClick: () => {
setUsernameEditState(UsernameEditState.ConfirmingDelete);
},
@ -562,7 +562,7 @@ export function ProfileEditor({
menuOptions={menuOptions}
popperOptions={{ placement: 'bottom', strategy: 'absolute' }}
moduleClassName="ProfileEditor__username-menu"
ariaLabel={i18n('ProfileEditor--username--context-menu')}
ariaLabel={i18n('icu:ProfileEditor--username--context-menu')}
/>
);
}
@ -574,7 +574,7 @@ export function ProfileEditor({
icon={
<i className="ProfileEditor__icon--container ProfileEditor__icon ProfileEditor__icon--username" />
}
label={username || i18n('ProfileEditor--username')}
label={username || i18n('icu:ProfileEditor--username')}
info={username && generateUsernameLink(username, { short: true })}
onClick={() => {
openUsernameReservationModal();
@ -631,7 +631,9 @@ export function ProfileEditor({
)
}
label={
<Emojify text={fullBio.aboutText || i18n('ProfileEditor--about')} />
<Emojify
text={fullBio.aboutText || i18n('icu:ProfileEditor--about')}
/>
}
onClick={() => {
setEditState(EditState.Bio);
@ -649,7 +651,7 @@ export function ProfileEditor({
target="_blank"
rel="noreferrer"
>
{i18n('ProfileEditor--learnMore')}
{i18n('icu:ProfileEditor--learnMore')}
</a>
),
}}
@ -670,13 +672,13 @@ export function ProfileEditor({
onClose={() => setUsernameEditState(UsernameEditState.Editing)}
actions={[
{
text: i18n('ProfileEditor--username--confirm-delete-button'),
text: i18n('icu:ProfileEditor--username--confirm-delete-button'),
style: 'negative',
action: () => deleteUsername(),
},
]}
>
{i18n('ProfileEditor--username--confirm-delete-body')}
{i18n('icu:ProfileEditor--username--confirm-delete-body')}
</ConfirmationDialog>
)}

14
ts/components/ProfileEditorModal.tsx
View file

@ -33,12 +33,12 @@ export function ProfileEditorModal({
...restProps
}: PropsType): JSX.Element {
const MODAL_TITLES_BY_EDIT_STATE: Record<EditState, string | undefined> = {
[EditState.BetterAvatar]: i18n('ProfileEditorModal--avatar'),
[EditState.Bio]: i18n('ProfileEditorModal--about'),
[EditState.None]: i18n('ProfileEditorModal--profile'),
[EditState.ProfileName]: i18n('ProfileEditorModal--name'),
[EditState.BetterAvatar]: i18n('icu:ProfileEditorModal--avatar'),
[EditState.Bio]: i18n('icu:ProfileEditorModal--about'),
[EditState.None]: i18n('icu:ProfileEditorModal--profile'),
[EditState.ProfileName]: i18n('icu:ProfileEditorModal--name'),
[EditState.UsernameOnboarding]: undefined,
[EditState.Username]: i18n('ProfileEditorModal--username'),
[EditState.Username]: i18n('icu:ProfileEditorModal--username'),
};
const [modalTitle, setModalTitle] = useState(
@ -49,11 +49,11 @@ export function ProfileEditorModal({
return (
<ConfirmationDialog
dialogName="ProfileEditorModal.error"
cancelText={i18n('Confirmation--confirm')}
cancelText={i18n('icu:Confirmation--confirm')}
i18n={i18n}
onClose={toggleProfileEditorHasError}
>
{i18n('ProfileEditorModal--error')}
{i18n('icu:ProfileEditorModal--error')}
</ConfirmationDialog>
);
}

2
ts/components/ProgressDialog.tsx
View file

@ -18,7 +18,7 @@ export const ProgressDialog = React.memo(function ProgressDialogInner({
<div className="module-progress-dialog__spinner">
<Spinner svgSize="normal" size="39px" direction="on-progress-dialog" />
</div>
<div className="module-progress-dialog__text">{i18n('updating')}</div>
<div className="module-progress-dialog__text">{i18n('icu:updating')}</div>
</div>
);
});

4
ts/components/ReactionPickerPicker.tsx
View file

@ -61,7 +61,7 @@ export function ReactionPickerPickerMoreButton({
}>): JSX.Element {
return (
<button
aria-label={i18n('Reactions--more')}
aria-label={i18n('icu:Reactions--more')}
className="module-ReactionPickerPicker__button module-ReactionPickerPicker__button--more"
onClick={event => {
event.stopPropagation();
@ -75,7 +75,7 @@ export function ReactionPickerPickerMoreButton({
}
}}
tabIndex={0}
title={i18n('Reactions--more')}
title={i18n('icu:Reactions--more')}
type="button"
>
<div className="module-ReactionPickerPicker__button--more__dot" />

40
ts/components/SafetyNumberChangeDialog.tsx
View file

@ -150,11 +150,11 @@ export function SafetyNumberChangeDialog({
) {
let text: string;
if (dialogState === DialogState.ExplicitReviewStep) {
text = i18n('safetyNumberChangeDialog_done');
text = i18n('icu:safetyNumberChangeDialog_done');
} else if (allVerified || totalCount === 0) {
text = confirmText || i18n('safetyNumberChangeDialog_send');
text = confirmText || i18n('icu:safetyNumberChangeDialog_send');
} else {
text = confirmText || i18n('sendAnyway');
text = confirmText || i18n('icu:sendAnyway');
}
return (
@ -183,10 +183,10 @@ export function SafetyNumberChangeDialog({
>
<div className="module-SafetyNumberChangeDialog__shield-icon" />
<div className="module-SafetyNumberChangeDialog__title">
{i18n('safetyNumberChanges')}
{i18n('icu:safetyNumberChanges')}
</div>
<div className="module-SafetyNumberChangeDialog__message">
{i18n('safetyNumberChangeDialog__message')}
{i18n('icu:safetyNumberChangeDialog__message')}
</div>
{contacts.map((section: StoryContacts) => (
<ContactSection
@ -205,9 +205,9 @@ export function SafetyNumberChangeDialog({
let text: string;
if (dialogState === DialogState.ExplicitReviewNeeded) {
text = confirmText || i18n('sendAnyway');
text = confirmText || i18n('icu:sendAnyway');
} else if (dialogState === DialogState.ExplicitReviewComplete) {
text = confirmText || i18n('safetyNumberChangeDialog_send');
text = confirmText || i18n('icu:safetyNumberChangeDialog_send');
} else {
throw missingCaseError(dialogState);
}
@ -223,7 +223,7 @@ export function SafetyNumberChangeDialog({
if (dialogState === DialogState.ExplicitReviewNeeded) {
actions.unshift({
action: () => setDialogState(DialogState.ExplicitReviewStep),
text: i18n('safetyNumberChangeDialog__review'),
text: i18n('icu:safetyNumberChangeDialog__review'),
});
}
@ -242,7 +242,7 @@ export function SafetyNumberChangeDialog({
>
<div className="module-SafetyNumberChangeDialog__shield-icon" />
<div className="module-SafetyNumberChangeDialog__title">
{i18n('safetyNumberChanges')}
{i18n('icu:safetyNumberChanges')}
</div>
<div
className={classNames(
@ -256,7 +256,7 @@ export function SafetyNumberChangeDialog({
? i18n('icu:safetyNumberChangeDialog__many-contacts', {
count: totalCount,
})
: i18n('safetyNumberChangeDialog__post-review')}
: i18n('icu:safetyNumberChangeDialog__post-review')}
</div>
</ConfirmationDialog>
);
@ -310,7 +310,9 @@ function ContactSection({
const { distributionId } = section.story;
const uuids = section.contacts.map(contact => contact.uuid).filter(isNotNil);
const sectionName =
distributionId === MY_STORY_ID ? i18n('Stories__mine') : section.story.name;
distributionId === MY_STORY_ID
? i18n('icu:Stories__mine')
: section.story.name;
return (
<div className="module-SafetyNumberChangeDialog__section">
@ -320,7 +322,7 @@ function ContactSection({
</div>
{distributionId && removeFromStory && uuids.length > 1 && (
<SectionButtonWithMenu
ariaLabel={i18n('safetyNumberChangeDialog__actions-story', {
ariaLabel={i18n('icu:safetyNumberChangeDialog__actions-story', {
story: sectionName,
})}
i18n={i18n}
@ -381,7 +383,7 @@ function SectionButtonWithMenu({
menuOptions={[
{
icon: 'module-SafetyNumberChangeDialog__menu-icon--delete',
label: i18n('safetyNumberChangeDialog__remove-all'),
label: i18n('icu:safetyNumberChangeDialog__remove-all'),
onClick: () => setIsConfirming(true),
},
]}
@ -398,7 +400,7 @@ function SectionButtonWithMenu({
removeFromStory();
setIsConfirming(false);
},
text: i18n('safetyNumberChangeDialog__remove-all'),
text: i18n('icu:safetyNumberChangeDialog__remove-all'),
style: 'affirmative',
},
]}
@ -483,7 +485,7 @@ function ContactRow({
)}
{contact.isVerified && (
<span className="module-SafetyNumberChangeDialog__rtl-span">
{i18n('verified')}
{i18n('icu:verified')}
</span>
)}
</div>
@ -491,7 +493,7 @@ function ContactRow({
</div>
{distributionId && removeFromStory && uuid ? (
<RowButtonWithMenu
ariaLabel={i18n('safetyNumberChangeDialog__actions-contact', {
ariaLabel={i18n('icu:safetyNumberChangeDialog__actions-contact', {
contact: contact.title,
})}
i18n={i18n}
@ -508,7 +510,7 @@ function ContactRow({
tabIndex={0}
type="button"
>
{i18n('view')}
{i18n('icu:view')}
</button>
)}
</li>
@ -535,12 +537,12 @@ function RowButtonWithMenu({
menuOptions={[
{
icon: 'module-SafetyNumberChangeDialog__menu-icon--verify',
label: i18n('safetyNumberChangeDialog__verify-number'),
label: i18n('icu:safetyNumberChangeDialog__verify-number'),
onClick: verifyContact,
},
{
icon: 'module-SafetyNumberChangeDialog__menu-icon--delete',
label: i18n('safetyNumberChangeDialog__remove'),
label: i18n('icu:safetyNumberChangeDialog__remove'),
onClick: removeFromStory,
},
]}

2
ts/components/SafetyNumberModal.tsx
View file

@ -22,7 +22,7 @@ export function SafetyNumberModal({
i18n={i18n}
moduleClassName="module-SafetyNumberViewer__modal"
onClose={toggleSafetyNumberModal}
title={i18n('SafetyNumberModal__title')}
title={i18n('icu:SafetyNumberModal__title')}
>
<SafetyNumberViewer
i18n={i18n}

14
ts/components/SafetyNumberViewer.tsx
View file

@ -41,14 +41,14 @@ export function SafetyNumberViewer({
if (!contact.phoneNumber) {
return (
<div className="module-SafetyNumberViewer">
<div>{i18n('cannotGenerateSafetyNumber')}</div>
<div>{i18n('icu:cannotGenerateSafetyNumber')}</div>
<div className="module-SafetyNumberViewer__buttons">
<Button
className="module-SafetyNumberViewer__button"
onClick={() => onClose?.()}
variant={ButtonVariant.Primary}
>
{i18n('ok')}
{i18n('icu:ok')}
</Button>
</div>
</div>
@ -73,7 +73,7 @@ export function SafetyNumberViewer({
<div className="module-SafetyNumberViewer__number">
{safetyNumber || getPlaceholder()}
</div>
<Intl i18n={i18n} id="verifyHelp" components={{ name: boldName }} />
<Intl i18n={i18n} id="icu:verifyHelp" components={{ name: boldName }} />
<div className="module-SafetyNumberViewer__verification-status">
{isVerified ? (
<span className="module-SafetyNumberViewer__icon--verified" />
@ -81,11 +81,15 @@ export function SafetyNumberViewer({
<span className="module-SafetyNumberViewer__icon--shield" />
)}
{isVerified ? (
<Intl i18n={i18n} id="isVerified" components={{ name: boldName }} />
<Intl
i18n={i18n}
id="icu:isVerified"
components={{ name: boldName }}
/>
) : (
<Intl
i18n={i18n}
id="isNotVerified"
id="icu:isNotVerified"
components={{ name: boldName }}
/>
)}

6
ts/components/SampleMessageBubbles.tsx
View file

@ -79,7 +79,7 @@ export function SampleMessageBubbles({
color={color}
direction={includeAnotherBubble ? 'outgoing' : 'incoming'}
i18n={i18n}
text={i18n('ChatColorPicker__sampleBubble1')}
text={i18n('icu:ChatColorPicker__sampleBubble1')}
timestampDeltaFromNow={A_FEW_DAYS_AGO}
status="read"
style={firstBubbleStyle}
@ -92,7 +92,7 @@ export function SampleMessageBubbles({
<SampleMessage
direction="incoming"
i18n={i18n}
text={i18n('ChatColorPicker__sampleBubble2')}
text={i18n('icu:ChatColorPicker__sampleBubble2')}
timestampDeltaFromNow={A_FEW_DAYS_AGO / 2}
status="read"
/>
@ -104,7 +104,7 @@ export function SampleMessageBubbles({
color={color}
direction="outgoing"
i18n={i18n}
text={i18n('ChatColorPicker__sampleBubble3')}
text={i18n('icu:ChatColorPicker__sampleBubble3')}
timestampDeltaFromNow={0}
status="delivered"
style={backgroundStyle}

4
ts/components/SearchInput.tsx
View file

@ -53,7 +53,7 @@ export const SearchInput = forwardRef<HTMLInputElement, PropTypes>(
{hasSearchIcon && <i className={getClassName('__icon')} />}
{children}
<input
aria-label={label || i18n('search')}
aria-label={label || i18n('icu:search')}
className={classNames(
getClassName('__input'),
value && getClassName('__input--with-text'),
@ -85,7 +85,7 @@ export const SearchInput = forwardRef<HTMLInputElement, PropTypes>(
/>
{value && onClear && (
<button
aria-label={i18n('cancel')}
aria-label={i18n('icu:cancel')}
className={getClassName('__cancel')}
onClick={onClear}
tabIndex={-1}

62
ts/components/SendStoryModal.tsx
View file

@ -247,7 +247,7 @@ export function SendStoryModal({
() => ({
allowsReplies: true,
id: MY_STORY_ID,
name: i18n('Stories__mine'),
name: i18n('icu:Stories__mine'),
isBlockList: ogMyStories?.isBlockList ?? true,
members: ogMyStories?.members || [],
}),
@ -299,7 +299,7 @@ export function SendStoryModal({
onClick={() => setPage(Page.SendStory)}
variant={ButtonVariant.Secondary}
>
{i18n('cancel')}
{i18n('icu:cancel')}
</Button>
<Button
onClick={() => {
@ -322,7 +322,7 @@ export function SendStoryModal({
}}
variant={ButtonVariant.Primary}
>
{i18n('save')}
{i18n('icu:save')}
</Button>
</div>
</>
@ -331,7 +331,7 @@ export function SendStoryModal({
modal = handleClose => (
<ModalPage
modalName="SendStoryModal__my-stories-privacy"
title={i18n('SendStoryModal__my-stories-privacy')}
title={i18n('icu:SendStoryModal__my-stories-privacy')}
modalFooter={footer}
onClose={handleClose}
{...modalCommonProps}
@ -489,7 +489,7 @@ export function SendStoryModal({
<div className="SendStoryModal__selected-lists">{selectedNames}</div>
{selectedNames.length > 0 && (
<button
aria-label={i18n('ok')}
aria-label={i18n('icu:ok')}
className="SendStoryModal__ok"
disabled={!chosenGroupIds.size}
onClick={async () => {
@ -507,7 +507,7 @@ export function SendStoryModal({
modal = handleClose => (
<ModalPage
modalName="SendStoryModal__choose-groups"
title={i18n('SendStoryModal__choose-groups')}
title={i18n('icu:SendStoryModal__choose-groups')}
moduleClassName="SendStoryModal"
modalFooter={footer}
onClose={handleClose}
@ -516,7 +516,7 @@ export function SendStoryModal({
<SearchInput
disabled={groupConversations.length === 0}
i18n={i18n}
placeholder={i18n('contactSearchPlaceholder')}
placeholder={i18n('icu:contactSearchPlaceholder')}
moduleClassName="StoriesSettingsModal__search"
onChange={event => {
setSearchTerm(event.target.value);
@ -585,7 +585,7 @@ export function SendStoryModal({
))
) : (
<div className="module-ForwardMessageModal__no-candidate-contacts">
{i18n('noGroupsFound')}
{i18n('icu:noGroupsFound')}
</div>
)}
</ModalPage>
@ -596,7 +596,7 @@ export function SendStoryModal({
<div className="SendStoryModal__selected-lists">{selectedNames}</div>
{selectedNames.length > 0 && (
<button
aria-label={i18n('SendStoryModal__send')}
aria-label={i18n('icu:SendStoryModal__send')}
className="SendStoryModal__send"
disabled={!selectedListIds.size && !selectedGroupIds.size}
onClick={() => {
@ -672,19 +672,19 @@ export function SendStoryModal({
list.id === MY_STORY_ID
? [
{
label: i18n('StoriesSettings__context-menu'),
label: i18n('icu:StoriesSettings__context-menu'),
icon: 'SendStoryModal__icon--delete',
onClick: () => setListIdToEdit(list.id),
},
]
: [
{
label: i18n('StoriesSettings__context-menu'),
label: i18n('icu:StoriesSettings__context-menu'),
icon: 'SendStoryModal__icon--settings',
onClick: () => setListIdToEdit(list.id),
},
{
label: i18n('SendStoryModal__delete-story'),
label: i18n('icu:SendStoryModal__delete-story'),
icon: 'SendStoryModal__icon--delete',
onClick: () => setConfirmDeleteList(list),
},
@ -731,13 +731,13 @@ export function SendStoryModal({
<div className="SendStoryModal__distribution-list__description">
{hasFirstStoryPostExperience && list.id === MY_STORY_ID ? (
i18n('SendStoryModal__choose-who-can-view')
i18n('icu:SendStoryModal__choose-who-can-view')
) : (
<>
<span className="SendStoryModal__rtl-span">
{list.id === MY_STORY_ID
? getI18nForMyStory(list, i18n)
: i18n('SendStoryModal__custom-story')}
: i18n('icu:SendStoryModal__custom-story')}
</span>
<span className="SendStoryModal__rtl-span">
&nbsp;&middot;&nbsp;
@ -801,7 +801,7 @@ export function SendStoryModal({
i18n={i18n}
menuOptions={[
{
label: i18n('SendStoryModal__delete-story'),
label: i18n('icu:SendStoryModal__delete-story'),
icon: 'SendStoryModal__icon--delete',
onClick: () => setConfirmRemoveGroupId(group.id),
},
@ -839,7 +839,7 @@ export function SendStoryModal({
<div className="SendStoryModal__distribution-list__description">
<span className="SendStoryModal__rtl-span">
{i18n('SendStoryModal__group-story')}
{i18n('icu:SendStoryModal__group-story')}
</span>
<span className="SendStoryModal__rtl-span">
&nbsp;&middot;&nbsp;
@ -862,7 +862,7 @@ export function SendStoryModal({
modal = handleClose => (
<ModalPage
modalName="SendStoryModal__title"
title={i18n('SendStoryModal__title')}
title={i18n('icu:SendStoryModal__title')}
moduleClassName="SendStoryModal"
modalFooter={footer}
onClose={handleClose}
@ -874,7 +874,7 @@ export function SendStoryModal({
>
<StoryImage
i18n={i18n}
firstName={i18n('you')}
firstName={i18n('icu:you')}
queueStoryDownload={noop}
storyId="story-id"
label="label"
@ -884,20 +884,22 @@ export function SendStoryModal({
/>
</div>
<div className="SendStoryModal__top-bar">
{i18n('stories')}
{i18n('icu:stories')}
<ContextMenu
aria-label={i18n('SendStoryModal__new')}
aria-label={i18n('icu:SendStoryModal__new')}
i18n={i18n}
menuOptions={[
{
label: i18n('SendStoryModal__new-custom--title'),
description: i18n('SendStoryModal__new-custom--description'),
label: i18n('icu:SendStoryModal__new-custom--title'),
description: i18n(
'icu:SendStoryModal__new-custom--description'
),
icon: 'SendStoryModal__icon--custom',
onClick: () => setPage(Page.ChooseViewers),
},
{
label: i18n('SendStoryModal__new-group--title'),
description: i18n('SendStoryModal__new-group--description'),
label: i18n('icu:SendStoryModal__new-group--title'),
description: i18n('icu:SendStoryModal__new-group--description'),
icon: 'SendStoryModal__icon--group',
onClick: () => setPage(Page.ChooseGroups),
},
@ -919,7 +921,7 @@ export function SendStoryModal({
onClick={openMenu}
onKeyDown={onKeyDown}
>
{i18n('SendStoryModal__new')}
{i18n('icu:SendStoryModal__new')}
</Button>
{menuNode}
</div>
@ -949,7 +951,7 @@ export function SendStoryModal({
)}
{hasAnnouncementsOnlyAlert && (
<Alert
body={i18n('SendStoryModal__announcements-only')}
body={i18n('icu:SendStoryModal__announcements-only')}
i18n={i18n}
onClose={() => setHasAnnouncementsOnlyAlert(false)}
theme={Theme.Dark}
@ -965,7 +967,7 @@ export function SendStoryModal({
setConfirmRemoveGroupId(undefined);
},
style: 'negative',
text: i18n('delete'),
text: i18n('icu:delete'),
},
]}
i18n={i18n}
@ -974,7 +976,7 @@ export function SendStoryModal({
}}
theme={Theme.Dark}
>
{i18n('SendStoryModal__confirm-remove-group')}
{i18n('icu:SendStoryModal__confirm-remove-group')}
</ConfirmationDialog>
)}
{confirmDeleteList && (
@ -987,7 +989,7 @@ export function SendStoryModal({
setConfirmDeleteList(undefined);
},
style: 'negative',
text: i18n('delete'),
text: i18n('icu:delete'),
},
]}
i18n={i18n}
@ -996,7 +998,7 @@ export function SendStoryModal({
}}
theme={Theme.Dark}
>
{i18n('StoriesSettings__delete-list--confirm', {
{i18n('icu:StoriesSettings__delete-list--confirm', {
name: confirmDeleteList.name,
})}
</ConfirmationDialog>

12
ts/components/SharedGroupNames.tsx
View file

@ -32,7 +32,7 @@ export function SharedGroupNames({
return (
<Intl
i18n={i18n}
id="member-of-more-than-3-groups--multiple-more"
id="icu:member-of-more-than-3-groups--multiple-more"
components={{
group1: firstThreeGroups[0],
group2: firstThreeGroups[1],
@ -46,7 +46,7 @@ export function SharedGroupNames({
return (
<Intl
i18n={i18n}
id="member-of-more-than-3-groups--one-more"
id="icu:member-of-more-than-3-groups--one-more"
components={{
group1: firstThreeGroups[0],
group2: firstThreeGroups[1],
@ -59,7 +59,7 @@ export function SharedGroupNames({
return (
<Intl
i18n={i18n}
id="member-of-3-groups"
id="icu:member-of-3-groups"
components={{
group1: firstThreeGroups[0],
group2: firstThreeGroups[1],
@ -72,7 +72,7 @@ export function SharedGroupNames({
return (
<Intl
i18n={i18n}
id="member-of-2-groups"
id="icu:member-of-2-groups"
components={{
group1: firstThreeGroups[0],
group2: firstThreeGroups[1],
@ -84,7 +84,7 @@ export function SharedGroupNames({
return (
<Intl
i18n={i18n}
id="member-of-1-group"
id="icu:member-of-1-group"
components={{
group: firstThreeGroups[0],
}}
@ -92,5 +92,5 @@ export function SharedGroupNames({
);
}
return <>{i18n('no-groups-in-common')}</>;
return <>{i18n('icu:no-groups-in-common')}</>;
}

114
ts/components/ShortcutGuide.tsx
View file

@ -53,12 +53,12 @@ function getNavigationShortcuts(i18n: LocalizerType): Array<ShortcutType> {
return [
{
id: 'Keyboard--navigate-by-section',
description: i18n('Keyboard--navigate-by-section'),
description: i18n('icu:Keyboard--navigate-by-section'),
keys: [['commandOrCtrl', 'T']],
},
{
id: 'Keyboard--previous-conversation',
description: i18n('Keyboard--previous-conversation'),
description: i18n('icu:Keyboard--previous-conversation'),
keys: [
['optionOrAlt', '↑'],
['ctrl', 'shift', 'tab'],
@ -66,7 +66,7 @@ function getNavigationShortcuts(i18n: LocalizerType): Array<ShortcutType> {
},
{
id: 'Keyboard--next-conversation',
description: i18n('Keyboard--next-conversation'),
description: i18n('icu:Keyboard--next-conversation'),
keys: [
['optionOrAlt', '↓'],
['ctrl', 'tab'],
@ -74,92 +74,92 @@ function getNavigationShortcuts(i18n: LocalizerType): Array<ShortcutType> {
},
{
id: 'Keyboard--previous-unread-conversation',
description: i18n('Keyboard--previous-unread-conversation'),
description: i18n('icu:Keyboard--previous-unread-conversation'),
keys: [['optionOrAlt', 'shift', '↑']],
},
{
id: 'Keyboard--next-unread-conversation',
description: i18n('Keyboard--next-unread-conversation'),
description: i18n('icu:Keyboard--next-unread-conversation'),
keys: [['optionOrAlt', 'shift', '↓']],
},
{
id: 'Keyboard--conversation-by-index',
description: i18n('Keyboard--conversation-by-index'),
description: i18n('icu:Keyboard--conversation-by-index'),
keys: [['commandOrCtrl', '1 to 9']],
},
{
id: 'Keyboard--preferences',
description: i18n('Keyboard--preferences'),
description: i18n('icu:Keyboard--preferences'),
keys: [['commandOrCtrl', ',']],
},
{
id: 'Keyboard--open-conversation-menu',
description: i18n('Keyboard--open-conversation-menu'),
description: i18n('icu:Keyboard--open-conversation-menu'),
keys: [['commandOrCtrl', 'shift', 'L']],
},
{
id: 'Keyboard--new-conversation',
description: i18n('Keyboard--new-conversation'),
description: i18n('icu:Keyboard--new-conversation'),
keys: [['commandOrCtrl', 'N']],
},
{
id: 'Keyboard--search',
description: i18n('Keyboard--search'),
description: i18n('icu:Keyboard--search'),
keys: [['commandOrCtrl', 'F']],
},
{
id: 'Keyboard--search-in-conversation',
description: i18n('Keyboard--search-in-conversation'),
description: i18n('icu:Keyboard--search-in-conversation'),
keys: [['commandOrCtrl', 'shift', 'F']],
},
{
id: 'Keyboard--focus-composer',
description: i18n('Keyboard--focus-composer'),
description: i18n('icu:Keyboard--focus-composer'),
keys: [['commandOrCtrl', 'shift', 'T']],
},
{
id: 'Keyboard--open-all-media-view',
description: i18n('Keyboard--open-all-media-view'),
description: i18n('icu:Keyboard--open-all-media-view'),
keys: [['commandOrCtrl', 'shift', 'M']],
},
{
id: 'Keyboard--open-emoji-chooser',
description: i18n('Keyboard--open-emoji-chooser'),
description: i18n('icu:Keyboard--open-emoji-chooser'),
keys: [['commandOrCtrl', 'shift', 'J']],
},
{
id: 'Keyboard--open-sticker-chooser',
description: i18n('Keyboard--open-sticker-chooser'),
description: i18n('icu:Keyboard--open-sticker-chooser'),
keys: [['commandOrCtrl', 'shift', 'S']],
},
{
id: 'Keyboard--begin-recording-voice-note',
description: i18n('Keyboard--begin-recording-voice-note'),
description: i18n('icu:Keyboard--begin-recording-voice-note'),
keys: [['commandOrCtrl', 'shift', 'V']],
},
{
id: 'Keyboard--archive-conversation',
description: i18n('Keyboard--archive-conversation'),
description: i18n('icu:Keyboard--archive-conversation'),
keys: [['commandOrCtrl', 'shift', 'A']],
},
{
id: 'Keyboard--unarchive-conversation',
description: i18n('Keyboard--unarchive-conversation'),
description: i18n('icu:Keyboard--unarchive-conversation'),
keys: [['commandOrCtrl', 'shift', 'U']],
},
{
id: 'Keyboard--scroll-to-top',
description: i18n('Keyboard--scroll-to-top'),
description: i18n('icu:Keyboard--scroll-to-top'),
keys: [['commandOrCtrl', '↑']],
},
{
id: 'Keyboard--scroll-to-bottom',
description: i18n('Keyboard--scroll-to-bottom'),
description: i18n('icu:Keyboard--scroll-to-bottom'),
keys: [['commandOrCtrl', '↓']],
},
{
id: 'Keyboard--close-curent-conversation',
description: i18n('Keyboard--close-curent-conversation'),
description: i18n('icu:Keyboard--close-curent-conversation'),
keys: [['commandOrCtrl', 'shift', 'C']],
},
];
@ -169,32 +169,32 @@ function getMessageShortcuts(i18n: LocalizerType): Array<ShortcutType> {
return [
{
id: 'Keyboard--default-message-action',
description: i18n('Keyboard--default-message-action'),
description: i18n('icu:Keyboard--default-message-action'),
keys: [['enter']],
},
{
id: 'Keyboard--view-details-for-selected-message',
description: i18n('Keyboard--view-details-for-selected-message'),
description: i18n('icu:Keyboard--view-details-for-selected-message'),
keys: [['commandOrCtrl', 'D']],
},
{
id: 'Keyboard--toggle-reply',
description: i18n('Keyboard--toggle-reply'),
description: i18n('icu:Keyboard--toggle-reply'),
keys: [['commandOrCtrl', 'shift', 'R']],
},
{
id: 'Keyboard--toggle-reaction-picker',
description: i18n('Keyboard--toggle-reaction-picker'),
description: i18n('icu:Keyboard--toggle-reaction-picker'),
keys: [['commandOrCtrl', 'shift', 'E']],
},
{
id: 'Keyboard--save-attachment',
description: i18n('Keyboard--save-attachment'),
description: i18n('icu:Keyboard--save-attachment'),
keys: [['commandOrCtrl', 'S']],
},
{
id: 'Keyboard--delete-message',
description: i18n('Keyboard--delete-message'),
id: 'Keyboard--delete-messages',
description: i18n('icu:Keyboard--delete-messages'),
keys: [['commandOrCtrl', 'shift', 'D']],
},
];
@ -204,32 +204,32 @@ function getComposerShortcuts(i18n: LocalizerType): Array<ShortcutType> {
return [
{
id: 'Keyboard--add-newline',
description: i18n('Keyboard--add-newline'),
description: i18n('icu:Keyboard--add-newline'),
keys: [['shift', 'enter']],
},
{
id: 'Keyboard--expand-composer',
description: i18n('Keyboard--expand-composer'),
description: i18n('icu:Keyboard--expand-composer'),
keys: [['commandOrCtrl', 'shift', 'X']],
},
{
id: 'Keyboard--send-in-expanded-composer',
description: i18n('Keyboard--send-in-expanded-composer'),
description: i18n('icu:Keyboard--send-in-expanded-composer'),
keys: [['commandOrCtrl', 'enter']],
},
{
id: 'Keyboard--attach-file',
description: i18n('Keyboard--attach-file'),
description: i18n('icu:Keyboard--attach-file'),
keys: [['commandOrCtrl', 'U']],
},
{
id: 'Keyboard--remove-draft-link-preview',
description: i18n('Keyboard--remove-draft-link-preview'),
description: i18n('icu:Keyboard--remove-draft-link-preview'),
keys: [['commandOrCtrl', 'P']],
},
{
id: 'Keyboard--remove-draft-attachments',
description: i18n('Keyboard--remove-draft-attachments'),
description: i18n('icu:Keyboard--remove-draft-attachments'),
keys: [['commandOrCtrl', 'shift', 'P']],
},
];
@ -239,12 +239,12 @@ function getCallingShortcuts(i18n: LocalizerType): Array<ShortcutType> {
return [
{
id: 'Keyboard--toggle-audio',
description: i18n('Keyboard--toggle-audio'),
description: i18n('icu:Keyboard--toggle-audio'),
keys: [['shift', 'M']],
},
{
id: 'Keyboard--toggle-video',
description: i18n('Keyboard--toggle-video'),
description: i18n('icu:Keyboard--toggle-video'),
keys: [['shift', 'V']],
},
{
@ -259,22 +259,22 @@ function getCallingShortcuts(i18n: LocalizerType): Array<ShortcutType> {
},
{
id: 'Keyboard--decline-call',
description: i18n('Keyboard--decline-call'),
description: i18n('icu:Keyboard--decline-call'),
keys: [['ctrlOrAlt', 'shift', 'D']],
},
{
id: 'Keyboard--start-audio-call',
description: i18n('Keyboard--start-audio-call'),
description: i18n('icu:Keyboard--start-audio-call'),
keys: [['ctrlOrAlt', 'shift', 'C']],
},
{
id: 'Keyboard--start-video-call',
description: i18n('Keyboard--start-video-call'),
description: i18n('icu:Keyboard--start-video-call'),
keys: [['ctrlOrAlt', 'shift', 'Y']],
},
{
id: 'Keyboard--hang-up',
description: i18n('Keyboard--hang-up'),
description: i18n('icu:Keyboard--hang-up'),
keys: [['ctrlOrAlt', 'shift', 'E']],
},
];
@ -291,13 +291,13 @@ export function ShortcutGuide(props: Props): JSX.Element {
<div className="module-shortcut-guide">
<div className="module-shortcut-guide__header">
<div className="module-shortcut-guide__header-text">
{i18n('Keyboard--header')}
{i18n('icu:Keyboard--header')}
</div>
<button
aria-label={i18n('close-popup')}
aria-label={i18n('icu:close-popup')}
className="module-shortcut-guide__header-close"
onClick={close}
title={i18n('close-popup')}
title={i18n('icu:close-popup')}
type="button"
/>
</div>
@ -309,7 +309,7 @@ export function ShortcutGuide(props: Props): JSX.Element {
<div className="module-shortcut-guide__section-container">
<div className="module-shortcut-guide__section">
<div className="module-shortcut-guide__section-header">
{i18n('Keyboard--navigation-header')}
{i18n('icu:Keyboard--navigation-header')}
</div>
<div className="module-shortcut-guide__section-list">
{getNavigationShortcuts(i18n).map((shortcut, index) => {
@ -326,7 +326,7 @@ export function ShortcutGuide(props: Props): JSX.Element {
</div>
<div className="module-shortcut-guide__section">
<div className="module-shortcut-guide__section-header">
{i18n('Keyboard--messages-header')}
{i18n('icu:Keyboard--messages-header')}
</div>
<div className="module-shortcut-guide__section-list">
{getMessageShortcuts(i18n).map((shortcut, index) =>
@ -336,7 +336,7 @@ export function ShortcutGuide(props: Props): JSX.Element {
</div>
<div className="module-shortcut-guide__section">
<div className="module-shortcut-guide__section-header">
{i18n('Keyboard--composer-header')}
{i18n('icu:Keyboard--composer-header')}
</div>
<div className="module-shortcut-guide__section-list">
{getComposerShortcuts(i18n).map((shortcut, index) =>
@ -346,7 +346,7 @@ export function ShortcutGuide(props: Props): JSX.Element {
</div>
<div className="module-shortcut-guide__section">
<div className="module-shortcut-guide__section-header">
{i18n('Keyboard--calling-header')}
{i18n('icu:Keyboard--calling-header')}
</div>
<div className="module-shortcut-guide__section-list">
{getCallingShortcuts(i18n).map((shortcut, index) =>
@ -385,43 +385,43 @@ function renderShortcut(
label = '⌘';
}
if (key === 'commandOrCtrl' && !isMacOS) {
label = i18n('Keyboard--Key--ctrl');
label = i18n('icu:Keyboard--Key--ctrl');
isSquare = false;
}
if (key === 'ctrlOrAlt' && isMacOS) {
label = i18n('Keyboard--Key--ctrl');
label = i18n('icu:Keyboard--Key--ctrl');
isSquare = false;
}
if (key === 'ctrlOrAlt' && !isMacOS) {
label = i18n('Keyboard--Key--alt');
label = i18n('icu:Keyboard--Key--alt');
isSquare = false;
}
if (key === 'optionOrAlt' && isMacOS) {
label = i18n('Keyboard--Key--option');
label = i18n('icu:Keyboard--Key--option');
isSquare = false;
}
if (key === 'optionOrAlt' && !isMacOS) {
label = i18n('Keyboard--Key--alt');
label = i18n('icu:Keyboard--Key--alt');
isSquare = false;
}
if (key === 'ctrl') {
label = i18n('Keyboard--Key--ctrl');
label = i18n('icu:Keyboard--Key--ctrl');
isSquare = false;
}
if (key === 'shift') {
label = i18n('Keyboard--Key--shift');
label = i18n('icu:Keyboard--Key--shift');
isSquare = false;
}
if (key === 'enter') {
label = i18n('Keyboard--Key--enter');
label = i18n('icu:Keyboard--Key--enter');
isSquare = false;
}
if (key === 'tab') {
label = i18n('Keyboard--Key--tab');
label = i18n('icu:Keyboard--Key--tab');
isSquare = false;
}
if (key === '1 to 9') {
label = i18n('Keyboard--Key--one-to-nine-range');
label = i18n('icu:Keyboard--Key--one-to-nine-range');
isSquare = false;
}

14
ts/components/SignalConnectionsModal.tsx
View file

@ -31,27 +31,27 @@ export function SignalConnectionsModal({
<Intl
components={{
connections: (
<strong>{i18n('SignalConnectionsModal__title')}</strong>
<strong>{i18n('icu:SignalConnectionsModal__title')}</strong>
),
}}
i18n={i18n}
id="SignalConnectionsModal__header"
id="icu:SignalConnectionsModal__header"
/>
</div>
<ul className="SignalConnectionsModal__list">
<li>{i18n('SignalConnectionsModal__bullet--1')}</li>
<li>{i18n('SignalConnectionsModal__bullet--2')}</li>
<li>{i18n('SignalConnectionsModal__bullet--3')}</li>
<li>{i18n('icu:SignalConnectionsModal__bullet--1')}</li>
<li>{i18n('icu:SignalConnectionsModal__bullet--2')}</li>
<li>{i18n('icu:SignalConnectionsModal__bullet--3')}</li>
</ul>
<div className="SignalConnectionsModal__description">
{i18n('SignalConnectionsModal__footer')}
{i18n('icu:SignalConnectionsModal__footer')}
</div>
<div className="SignalConnectionsModal__button">
<Button onClick={onClose} variant={ButtonVariant.Primary}>
{i18n('Confirmation--confirm')}
{i18n('icu:Confirmation--confirm')}
</Button>
</div>
</div>

2
ts/components/Stories.tsx
View file

@ -153,7 +153,7 @@ export function Stories({
</div>
<div className="Stories__placeholder">
<div className="Stories__placeholder__stories" />
{i18n('Stories__placeholder--text')}
{i18n('icu:Stories__placeholder--text')}
</div>
</div>
);

8
ts/components/StoriesAddStoryButton.tsx
View file

@ -88,16 +88,16 @@ export function StoriesAddStoryButton({
return (
<>
<ContextMenu
ariaLabel={i18n('Stories__add')}
ariaLabel={i18n('icu:Stories__add')}
i18n={i18n}
onMenuShowingChanged={onContextMenuShowingChanged}
menuOptions={[
{
label: i18n('Stories__add-story--media'),
label: i18n('icu:Stories__add-story--media'),
onClick: onAddMedia,
},
{
label: i18n('Stories__add-story--text'),
label: i18n('icu:Stories__add-story--text'),
onClick: () => onAddStory(),
},
]}
@ -120,7 +120,7 @@ export function StoriesAddStoryButton({
setError(undefined);
},
style: 'affirmative',
text: i18n('Confirmation--confirm'),
text: i18n('icu:Confirmation--confirm'),
},
]}
i18n={i18n}

12
ts/components/StoriesPane.tsx
View file

@ -114,14 +114,14 @@ export function StoriesPane({
<div className="Stories__pane__header">
<button
ref={focusRef}
aria-label={i18n('back')}
aria-label={i18n('icu:back')}
className="Stories__pane__header--back"
onClick={toggleStoriesView}
tabIndex={0}
type="button"
/>
<div className="Stories__pane__header--title">
{i18n('Stories__title')}
{i18n('icu:Stories__title')}
</div>
<StoriesAddStoryButton
i18n={i18n}
@ -134,7 +134,7 @@ export function StoriesPane({
i18n={i18n}
menuOptions={[
{
label: i18n('StoriesSettings__context-menu'),
label: i18n('icu:StoriesSettings__context-menu'),
onClick: () => onStoriesSettings(),
},
]}
@ -152,7 +152,7 @@ export function StoriesPane({
onChange={event => {
setSearchTerm(event.target.value);
}}
placeholder={i18n('search')}
placeholder={i18n('icu:search')}
value={searchTerm}
/>
<div className="Stories__pane__list">
@ -196,7 +196,7 @@ export function StoriesPane({
onClick={() => setIsShowingHiddenStories(!isShowingHiddenStories)}
type="button"
>
{i18n('Stories__hidden-stories')}
{i18n('icu:Stories__hidden-stories')}
</button>
{isShowingHiddenStories &&
hiddenStories.map(story => (
@ -222,7 +222,7 @@ export function StoriesPane({
)}
{!stories.length && (
<div className="Stories__pane__list--empty">
{i18n('Stories__list-empty')}
{i18n('icu:Stories__list-empty')}
</div>
)}
</div>

80
ts/components/StoriesSettingsModal.tsx
View file

@ -120,14 +120,14 @@ export function getI18nForMyStory(
i18n: LocalizerType
): string {
if (list.members.length === 0) {
return i18n('StoriesSettings__mine__all--label');
return i18n('icu:StoriesSettings__mine__all--label');
}
if (!list.isBlockList) {
return i18n('SendStoryModal__only-share-with');
return i18n('icu:SendStoryModal__only-share-with');
}
return i18n('StoriesSettings__mine__all--label');
return i18n('icu:StoriesSettings__mine__all--label');
}
type DistributionListItemProps = {
@ -390,7 +390,7 @@ export function StoriesSettingsModal({
modalName="StoriesSettingsModal__list"
i18n={i18n}
onClose={onClose}
title={i18n('StoriesSettings__title')}
title={i18n('icu:StoriesSettings__title')}
{...modalCommonProps}
>
<p className="StoriesSettingsModal__description">
@ -413,7 +413,7 @@ export function StoriesSettingsModal({
<span className="StoriesSettingsModal__list__left">
<span className="StoriesSettingsModal__list__avatar--new" />
<span className="StoriesSettingsModal__list__title">
{i18n('StoriesSettings__new-list')}
{i18n('icu:StoriesSettings__new-list')}
</span>
</span>
</button>
@ -447,8 +447,8 @@ export function StoriesSettingsModal({
<Checkbox
disabled
checked={storyViewReceiptsEnabled}
description={i18n('StoriesSettings__view-receipts--description')}
label={i18n('StoriesSettings__view-receipts--label')}
description={i18n('icu:StoriesSettings__view-receipts--description')}
label={i18n('icu:StoriesSettings__view-receipts--label')}
moduleClassName="StoriesSettingsModal__checkbox"
name="view-receipts"
onChange={noop}
@ -456,7 +456,7 @@ export function StoriesSettingsModal({
<div className="StoriesSettingsModal__stories-off-container">
<p className="StoriesSettingsModal__stories-off-text">
{i18n('Stories__settings-toggle--description')}
{i18n('icu:Stories__settings-toggle--description')}
</p>
<Button
className="Preferences__stories-off"
@ -467,7 +467,7 @@ export function StoriesSettingsModal({
onClose();
}}
>
{i18n('Stories__settings-toggle--button')}
{i18n('icu:Stories__settings-toggle--button')}
</Button>
</div>
</ModalPage>
@ -498,7 +498,7 @@ export function StoriesSettingsModal({
setListToEditId(undefined);
},
style: 'negative',
text: i18n('delete'),
text: i18n('icu:delete'),
},
]}
i18n={i18n}
@ -507,7 +507,7 @@ export function StoriesSettingsModal({
}}
theme={Theme.Dark}
>
{i18n('StoriesSettings__delete-list--confirm', {
{i18n('icu:StoriesSettings__delete-list--confirm', {
name: confirmDeleteList.name,
})}
</ConfirmationDialog>
@ -523,7 +523,7 @@ export function StoriesSettingsModal({
setGroupToViewId(null);
},
style: 'negative',
text: i18n('delete'),
text: i18n('icu:delete'),
},
]}
i18n={i18n}
@ -621,7 +621,7 @@ export function DistributionListSettingsModal({
)}
<div className="StoriesSettingsModal__title">
{i18n('StoriesSettings__who-can-see')}
{i18n('icu:StoriesSettings__who-can-see')}
</div>
{isMyStory && (
@ -657,7 +657,7 @@ export function DistributionListSettingsModal({
<span className="StoriesSettingsModal__list__left">
<span className="StoriesSettingsModal__list__avatar--new" />
<span className="StoriesSettingsModal__list__title">
{i18n('StoriesSettings__add-viewer')}
{i18n('icu:StoriesSettings__add-viewer')}
</span>
</span>
</button>
@ -687,7 +687,7 @@ export function DistributionListSettingsModal({
</span>
<button
aria-label={i18n('StoriesSettings__remove--title', {
aria-label={i18n('icu:StoriesSettings__remove--title', {
title: member.title,
})}
className="StoriesSettingsModal__list__delete"
@ -709,13 +709,15 @@ export function DistributionListSettingsModal({
<hr className="StoriesSettingsModal__divider" />
<div className="StoriesSettingsModal__title">
{i18n('StoriesSettings__replies-reactions--title')}
{i18n('icu:StoriesSettings__replies-reactions--title')}
</div>
<Checkbox
checked={listToEdit.allowsReplies}
description={i18n('StoriesSettings__replies-reactions--description')}
label={i18n('StoriesSettings__replies-reactions--label')}
description={i18n(
'icu:StoriesSettings__replies-reactions--description'
)}
label={i18n('icu:StoriesSettings__replies-reactions--label')}
moduleClassName="StoriesSettingsModal__checkbox"
name="replies-reactions"
onChange={value => onRepliesNReactionsChanged(listToEdit.id, value)}
@ -730,7 +732,7 @@ export function DistributionListSettingsModal({
onClick={() => setConfirmDeleteList(listToEdit)}
type="button"
>
{i18n('StoriesSettings__delete-list')}
{i18n('icu:StoriesSettings__delete-list')}
</button>
</>
)}
@ -745,7 +747,7 @@ export function DistributionListSettingsModal({
confirmRemoveMember.uuid,
]),
style: 'negative',
text: i18n('StoriesSettings__remove--action'),
text: i18n('icu:StoriesSettings__remove--action'),
},
]}
i18n={i18n}
@ -753,11 +755,11 @@ export function DistributionListSettingsModal({
setConfirmRemoveMember(undefined);
}}
theme={Theme.Dark}
title={i18n('StoriesSettings__remove--title', {
title={i18n('icu:StoriesSettings__remove--title', {
title: confirmRemoveMember.title,
})}
>
{i18n('StoriesSettings__remove--body')}
{i18n('icu:StoriesSettings__remove--body')}
</ConfirmationDialog>
)}
</ModalPage>
@ -820,7 +822,7 @@ export function EditMyStoryPrivacy({
onClick={toggleSignalConnectionsModal}
type="button"
>
{i18n('StoriesSettings__mine__disclaimer--learn-more')}
{i18n('icu:StoriesSettings__mine__disclaimer--learn-more')}
</button>
);
const disclaimerElement = (
@ -829,13 +831,13 @@ export function EditMyStoryPrivacy({
<Intl
components={{ learnMore }}
i18n={i18n}
id="StoriesSettings__mine__disclaimer"
id="icu:StoriesSettings__mine__disclaimer"
/>
) : (
<Intl
components={{ learnMore }}
i18n={i18n}
id="SendStoryModal__privacy-disclaimer"
id="icu:SendStoryModal__privacy-disclaimer"
/>
)}
</div>
@ -848,7 +850,7 @@ export function EditMyStoryPrivacy({
<Checkbox
checked={myStories.isBlockList && !myStories.members.length}
isRadio
label={i18n('StoriesSettings__mine__all--label')}
label={i18n('icu:StoriesSettings__mine__all--label')}
moduleClassName="StoriesSettingsModal__checkbox"
name="share"
onChange={() => {
@ -877,7 +879,7 @@ export function EditMyStoryPrivacy({
<Checkbox
checked={myStories.isBlockList && myStories.members.length > 0}
isRadio
label={i18n('StoriesSettings__mine__exclude--label')}
label={i18n('icu:StoriesSettings__mine__exclude--label')}
moduleClassName="StoriesSettingsModal__checkbox"
name="share"
onChange={noop}
@ -910,7 +912,7 @@ export function EditMyStoryPrivacy({
<Checkbox
checked={!myStories.isBlockList && myStories.members.length > 0}
isRadio
label={i18n('StoriesSettings__mine__only--label')}
label={i18n('icu:StoriesSettings__mine__only--label')}
moduleClassName="StoriesSettingsModal__checkbox"
name="share"
onChange={noop}
@ -1040,14 +1042,14 @@ export function EditDistributionListModal({
}}
variant={ButtonVariant.Primary}
>
{i18n('done')}
{i18n('icu:done')}
</Button>
);
return (
<ModalPage
modalName="StoriesSettings__name-story"
title={i18n('StoriesSettings__name-story')}
title={i18n('icu:StoriesSettings__name-story')}
modalFooter={footer}
i18n={i18n}
onBackButtonClick={onBackButtonClick}
@ -1057,17 +1059,17 @@ export function EditDistributionListModal({
<Input
i18n={i18n}
onChange={setStoryName}
placeholder={i18n('StoriesSettings__name-placeholder')}
placeholder={i18n('icu:StoriesSettings__name-placeholder')}
moduleClassName="StoriesSettingsModal__input"
value={storyName}
/>
<div className="StoriesSettingsModal__visibility">
{i18n('SendStoryModal__new-custom--name-visibility')}
{i18n('icu:SendStoryModal__new-custom--name-visibility')}
</div>
<div className="StoriesSettingsModal__title">
{i18n('StoriesSettings__who-can-see')}
{i18n('icu:StoriesSettings__who-can-see')}
</div>
{selectedContacts.map(contact => (
@ -1125,7 +1127,7 @@ export function EditDistributionListModal({
}}
variant={ButtonVariant.Primary}
>
{page === Page.AddViewer ? i18n('done') : i18n('next2')}
{page === Page.AddViewer ? i18n('icu:done') : i18n('icu:next2')}
</Button>
);
} else if (page === Page.HideStoryFrom) {
@ -1137,7 +1139,7 @@ export function EditDistributionListModal({
}}
variant={ButtonVariant.Primary}
>
{i18n('update')}
{i18n('icu:update')}
</Button>
);
}
@ -1151,8 +1153,8 @@ export function EditDistributionListModal({
onClose={onClose}
title={
page === Page.HideStoryFrom
? i18n('StoriesSettings__hide-story')
: i18n('StoriesSettings__choose-viewers')
? i18n('icu:StoriesSettings__hide-story')
: i18n('icu:StoriesSettings__choose-viewers')
}
padded={page !== Page.ChooseViewers && page !== Page.AddViewer}
{...modalCommonProps}
@ -1160,7 +1162,7 @@ export function EditDistributionListModal({
<SearchInput
disabled={candidateConversations.length === 0}
i18n={i18n}
placeholder={i18n('contactSearchPlaceholder')}
placeholder={i18n('icu:contactSearchPlaceholder')}
moduleClassName="StoriesSettingsModal__search"
onChange={event => {
setSearchTerm(event.target.value);
@ -1224,7 +1226,7 @@ export function EditDistributionListModal({
</Measure>
) : (
<div className="module-ForwardMessageModal__no-candidate-contacts">
{i18n('noContactsFound')}
{i18n('icu:noContactsFound')}
</div>
)}
</ModalPage>

Some files were not shown because too many files have changed in this diff Show more