// Copyright 2020 Signal Messenger, LLC // SPDX-License-Identifier: AGPL-3.0-only import * as React from 'react'; import { Button, ButtonSize, ButtonVariant } from '../Button'; import { SystemMessage } from './SystemMessage'; import type { LocalizerType, ThemeType } from '../../types/Util'; import type { ConversationType } from '../../state/ducks/conversations'; import type { PreferredBadgeSelectorType } from '../../state/selectors/badges'; import { I18n } from '../I18n'; import { ContactName } from './ContactName'; import { GroupV1MigrationDialog } from '../GroupV1MigrationDialog'; import * as log from '../../logging/log'; export type PropsDataType = { areWeInvited: boolean; conversationId: string; droppedMembers?: Array; invitedMembers?: Array; droppedMemberCount: number; invitedMemberCount: number; }; export type PropsHousekeepingType = { getPreferredBadge: PreferredBadgeSelectorType; i18n: LocalizerType; theme: ThemeType; }; export type PropsType = PropsDataType & PropsHousekeepingType; export function GroupV1Migration(props: PropsType): React.ReactElement { const { areWeInvited, droppedMembers, droppedMemberCount, getPreferredBadge, i18n, invitedMembers, invitedMemberCount, theme, } = props; const [showingDialog, setShowingDialog] = React.useState(false); const showDialog = React.useCallback(() => { setShowingDialog(true); }, [setShowingDialog]); const dismissDialog = React.useCallback(() => { setShowingDialog(false); }, [setShowingDialog]); return ( <>

{i18n('icu:GroupV1--Migration--was-upgraded')}

{' '} {areWeInvited ? ( i18n('icu:GroupV1--Migration--invited--you') ) : ( <> {renderUsers({ members: invitedMembers, count: invitedMemberCount, i18n, kind: 'invited', })} {renderUsers({ members: droppedMembers, count: droppedMemberCount, i18n, kind: 'removed', })} )}

} button={ } /> {showingDialog ? ( log.warn('GroupV1Migration: Modal called migrate()')} onClose={dismissDialog} theme={theme} /> ) : null} ); } function renderUsers({ members, count, i18n, kind, }: { members?: Array; count: number; i18n: LocalizerType; kind: 'invited' | 'removed'; }): React.ReactElement | null { if (count === 0) { return null; } if (members && count === 1) { const contact = ; return (

{kind === 'invited' && ( )} {kind === 'removed' && ( )}

); } return (

{kind === 'invited' && ( )} {kind === 'removed' && ( )}

); }