Show Session Switchover Events
Co-authored-by: Scott Nonnenberg <scott@signal.org>
This commit is contained in:
parent
70cd073a72
commit
dd2493a353
13 changed files with 455 additions and 17 deletions
|
@ -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"
|
||||
/>
|
||||
);
|
||||
}
|
|
@ -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} />} />;
|
||||
}
|
|
@ -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') {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue