Unsupported OS Dialog
This commit is contained in:
parent
c6e184016b
commit
ac50af52d2
44 changed files with 776 additions and 224 deletions
74
ts/components/UnsupportedOSDialog.tsx
Normal file
74
ts/components/UnsupportedOSDialog.tsx
Normal file
|
@ -0,0 +1,74 @@
|
|||
// Copyright 2023 Signal Messenger, LLC
|
||||
// SPDX-License-Identifier: AGPL-3.0-only
|
||||
|
||||
import React from 'react';
|
||||
import moment from 'moment';
|
||||
import type { FormatXMLElementFn } from 'intl-messageformat';
|
||||
|
||||
import type { LocalizerType } from '../types/Util';
|
||||
import { missingCaseError } from '../util/missingCaseError';
|
||||
import type { WidthBreakpoint } from './_util';
|
||||
import { Intl } from './Intl';
|
||||
|
||||
import { LeftPaneDialog } from './LeftPaneDialog';
|
||||
|
||||
export type PropsType = {
|
||||
containerWidthBreakpoint: WidthBreakpoint;
|
||||
expirationTimestamp: number;
|
||||
i18n: LocalizerType;
|
||||
type: 'warning' | 'error';
|
||||
OS: string;
|
||||
};
|
||||
|
||||
const SUPPORT_URL = 'https://support.signal.org/hc/articles/5109141421850';
|
||||
|
||||
export function UnsupportedOSDialog({
|
||||
containerWidthBreakpoint,
|
||||
expirationTimestamp,
|
||||
i18n,
|
||||
type,
|
||||
OS,
|
||||
}: PropsType): JSX.Element | null {
|
||||
const learnMoreLink: FormatXMLElementFn<JSX.Element | string> = children => (
|
||||
<a key="signal-support" href={SUPPORT_URL} rel="noreferrer" target="_blank">
|
||||
{children}
|
||||
</a>
|
||||
);
|
||||
|
||||
let body: JSX.Element;
|
||||
if (type === 'error') {
|
||||
body = (
|
||||
<Intl
|
||||
id="icu:UnsupportedOSErrorDialog__body"
|
||||
i18n={i18n}
|
||||
components={{
|
||||
OS,
|
||||
learnMoreLink,
|
||||
}}
|
||||
/>
|
||||
);
|
||||
} else if (type === 'warning') {
|
||||
body = (
|
||||
<Intl
|
||||
id="icu:UnsupportedOSWarningDialog__body"
|
||||
i18n={i18n}
|
||||
components={{
|
||||
OS,
|
||||
expirationDate: moment(expirationTimestamp).format('ll'),
|
||||
learnMoreLink,
|
||||
}}
|
||||
/>
|
||||
);
|
||||
} else {
|
||||
throw missingCaseError(type);
|
||||
}
|
||||
|
||||
return (
|
||||
<LeftPaneDialog
|
||||
containerWidthBreakpoint={containerWidthBreakpoint}
|
||||
type={type}
|
||||
>
|
||||
<span>{body}</span>
|
||||
</LeftPaneDialog>
|
||||
);
|
||||
}
|
Loading…
Add table
Add a link
Reference in a new issue