Show Session Switchover Events

Co-authored-by: Scott Nonnenberg <scott@signal.org>
This commit is contained in:
Fedor Indutny 2023-10-23 19:40:42 +02:00 committed by GitHub
parent 70cd073a72
commit dd2493a353
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
13 changed files with 455 additions and 17 deletions

View file

@ -0,0 +1,34 @@
// Copyright 2023 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
import * as React from 'react';
import type { Meta } from '@storybook/react';
import { setupI18n } from '../../util/setupI18n';
import enMessages from '../../../_locales/en/messages.json';
import type { PropsType } from './PhoneNumberDiscoveryNotification';
import { PhoneNumberDiscoveryNotification } from './PhoneNumberDiscoveryNotification';
const i18n = setupI18n('en', enMessages);
export default {
title: 'Components/Conversation/PhoneNumberDiscoveryNotification',
} satisfies Meta<PropsType>;
const createProps = (overrideProps: Partial<PropsType> = {}): PropsType => ({
i18n,
conversationTitle: overrideProps.conversationTitle || 'John Fire',
phoneNumber: '(555) 333-1111',
});
export function WithoutSharedGroup(): JSX.Element {
return <PhoneNumberDiscoveryNotification {...createProps()} />;
}
export function WithSharedGroup(): JSX.Element {
return (
<PhoneNumberDiscoveryNotification
{...createProps()}
sharedGroup="Fun Times"
/>
);
}

View file

@ -0,0 +1,34 @@
// Copyright 2023 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
import React from 'react';
import type { LocalizerType } from '../../types/Util';
import { SystemMessage } from './SystemMessage';
import { Emojify } from './Emojify';
import { getStringForPhoneNumberDiscovery } from '../../util/getStringForPhoneNumberDiscovery';
export type PropsDataType = {
conversationTitle: string;
phoneNumber: string;
sharedGroup?: string;
};
export type PropsType = PropsDataType & {
i18n: LocalizerType;
};
// Also known as a Session Switchover Event (SSE)
export function PhoneNumberDiscoveryNotification(
props: PropsType
): JSX.Element {
const { conversationTitle, i18n, sharedGroup, phoneNumber } = props;
const message = getStringForPhoneNumberDiscovery({
conversationTitle,
i18n,
phoneNumber,
sharedGroup,
});
return <SystemMessage icon="info" contents={<Emojify text={message} />} />;
}

View file

@ -50,6 +50,8 @@ import type { PropsType as PaymentEventNotificationPropsType } from './PaymentEv
import { PaymentEventNotification } from './PaymentEventNotification';
import type { PropsDataType as ConversationMergeNotificationPropsType } from './ConversationMergeNotification';
import { ConversationMergeNotification } from './ConversationMergeNotification';
import type { PropsDataType as PhoneNumberDiscoveryNotificationPropsType } from './PhoneNumberDiscoveryNotification';
import { PhoneNumberDiscoveryNotification } from './PhoneNumberDiscoveryNotification';
import { SystemMessage } from './SystemMessage';
import type { FullJSXType } from '../Intl';
import { TimelineMessage } from './TimelineMessage';
@ -122,6 +124,10 @@ type ConversationMergeNotificationType = {
type: 'conversationMerge';
data: ConversationMergeNotificationPropsType;
};
type PhoneNumberDiscoveryNotificationType = {
type: 'phoneNumberDiscovery';
data: PhoneNumberDiscoveryNotificationPropsType;
};
type PaymentEventType = {
type: 'paymentEvent';
data: Omit<PaymentEventNotificationPropsType, 'i18n'>;
@ -137,6 +143,7 @@ export type TimelineItemType = (
| GroupV1MigrationType
| GroupV2ChangeType
| MessageType
| PhoneNumberDiscoveryNotificationType
| ProfileChangeNotificationType
| ResetSessionNotificationType
| SafetyNumberNotificationType
@ -330,6 +337,14 @@ export const TimelineItem = memo(function TimelineItem({
i18n={i18n}
/>
);
} else if (item.type === 'phoneNumberDiscovery') {
notification = (
<PhoneNumberDiscoveryNotification
{...reducedProps}
{...item.data}
i18n={i18n}
/>
);
} else if (item.type === 'resetSessionNotification') {
notification = <ResetSessionNotification {...reducedProps} i18n={i18n} />;
} else if (item.type === 'profileChange') {