diff --git a/ts/components/CompositionArea.stories.tsx b/ts/components/CompositionArea.stories.tsx index b607e986bd..69bcbb4520 100644 --- a/ts/components/CompositionArea.stories.tsx +++ b/ts/components/CompositionArea.stories.tsx @@ -105,7 +105,7 @@ const useProps = (overrideProps: Partial = {}): Props => ({ ), title: '', // GroupV1 Disabled Actions - onStartGroupMigration: action('onStartGroupMigration'), + showGV2MigrationDialog: action('showGV2MigrationDialog'), // GroupV2 announcementsOnly: boolean( 'announcementsOnly', diff --git a/ts/components/CompositionArea.tsx b/ts/components/CompositionArea.tsx index fefd5a3566..fcc51c67b6 100644 --- a/ts/components/CompositionArea.tsx +++ b/ts/components/CompositionArea.tsx @@ -162,7 +162,7 @@ export type Props = Pick< | 'clearShowPickerHint' > & MessageRequestActionsProps & - Pick & + Pick & Pick & OwnProps; @@ -244,7 +244,7 @@ export function CompositionArea({ title, // GroupV1 Disabled Actions isGroupV1AndDisabled, - onStartGroupMigration, + showGV2MigrationDialog, // GroupV2 announcementsOnly, areWeAdmin, @@ -561,8 +561,9 @@ export function CompositionArea({ if (!left && isGroupV1AndDisabled) { return ( ); } diff --git a/ts/components/GroupV1MigrationDialog.stories.tsx b/ts/components/GroupV1MigrationDialog.stories.tsx index 97f6ba25ed..ed53a17685 100644 --- a/ts/components/GroupV1MigrationDialog.stories.tsx +++ b/ts/components/GroupV1MigrationDialog.stories.tsx @@ -35,6 +35,7 @@ const contact3: ConversationType = getDefaultConversation({ const createProps = (overrideProps: Partial = {}): PropsType => ({ areWeInvited: Boolean(overrideProps.areWeInvited), + conversationId: '123', droppedMembers: overrideProps.droppedMembers || [contact3, contact1], getPreferredBadge: () => undefined, hasMigrated: Boolean(overrideProps.hasMigrated), diff --git a/ts/components/GroupV1MigrationDialog.tsx b/ts/components/GroupV1MigrationDialog.tsx index 41623fb977..c05cf7974f 100644 --- a/ts/components/GroupV1MigrationDialog.tsx +++ b/ts/components/GroupV1MigrationDialog.tsx @@ -8,39 +8,62 @@ import type { PreferredBadgeSelectorType } from '../state/selectors/badges'; import { GroupDialog } from './GroupDialog'; import { sortByTitle } from '../util/sortByTitle'; -type CallbackType = () => unknown; - export type DataPropsType = { + conversationId: string; readonly areWeInvited: boolean; readonly droppedMembers: Array; readonly hasMigrated: boolean; readonly invitedMembers: Array; - readonly migrate: CallbackType; - readonly onClose: CallbackType; -}; - -export type HousekeepingPropsType = { readonly getPreferredBadge: PreferredBadgeSelectorType; readonly i18n: LocalizerType; readonly theme: ThemeType; }; -export type PropsType = DataPropsType & HousekeepingPropsType; +type ActionsPropsType = + | { + initiateMigrationToGroupV2: (conversationId: string) => unknown; + closeGV2MigrationDialog: () => unknown; + } + | { + readonly migrate: () => unknown; + readonly onClose: () => unknown; + }; + +export type PropsType = DataPropsType & ActionsPropsType; export const GroupV1MigrationDialog: React.FunctionComponent = React.memo(function GroupV1MigrationDialogInner(props: PropsType) { const { areWeInvited, + conversationId, droppedMembers, getPreferredBadge, hasMigrated, i18n, invitedMembers, - migrate, - onClose, theme, } = props; + let migrateHandler; + if ('migrate' in props) { + migrateHandler = props.migrate; + } else if ('initiateMigrationToGroupV2' in props) { + migrateHandler = () => props.initiateMigrationToGroupV2(conversationId); + } else { + throw new Error( + 'GroupV1MigrationDialog: No conversationId or migration function' + ); + } + + let closeHandler; + if ('onClose' in props) { + closeHandler = props.onClose; + } else if ('closeGV2MigrationDialog' in props) { + closeHandler = props.closeGV2MigrationDialog; + } else { + throw new Error('GroupV1MigrationDialog: No close function provided'); + } + const title = hasMigrated ? i18n('GroupV1--Migration--info--title') : i18n('GroupV1--Migration--migrate--title'); @@ -60,13 +83,13 @@ export const GroupV1MigrationDialog: React.FunctionComponent = }; if (hasMigrated) { primaryButtonText = i18n('Confirmation--confirm'); - onClickPrimaryButton = onClose; + onClickPrimaryButton = closeHandler; } else { primaryButtonText = i18n('GroupV1--Migration--migrate'); - onClickPrimaryButton = migrate; + onClickPrimaryButton = migrateHandler; secondaryButtonProps = { secondaryButtonText: i18n('cancel'), - onClickSecondaryButton: onClose, + onClickSecondaryButton: closeHandler, }; } @@ -74,7 +97,7 @@ export const GroupV1MigrationDialog: React.FunctionComponent = ({ + conversationId: '123', i18n, - onStartGroupMigration: action('onStartGroupMigration'), + showGV2MigrationDialog: action('showGV2MigrationDialog'), }); export default { diff --git a/ts/components/conversation/GroupV1DisabledActions.tsx b/ts/components/conversation/GroupV1DisabledActions.tsx index 3b09f0c261..9a804bf4ac 100644 --- a/ts/components/conversation/GroupV1DisabledActions.tsx +++ b/ts/components/conversation/GroupV1DisabledActions.tsx @@ -6,13 +6,15 @@ import { Intl } from '../Intl'; import type { LocalizerType } from '../../types/Util'; export type PropsType = { + conversationId: string; i18n: LocalizerType; - onStartGroupMigration: () => unknown; + showGV2MigrationDialog: (id: string) => unknown; }; export function GroupV1DisabledActions({ + conversationId, i18n, - onStartGroupMigration, + showGV2MigrationDialog, }: PropsType): JSX.Element { return (
@@ -37,7 +39,7 @@ export function GroupV1DisabledActions({