diff --git a/extension/src/components/InlineForm.tsx b/extension/src/components/InlineForm.tsx index 56303b29f..91dafcc87 100644 --- a/extension/src/components/InlineForm.tsx +++ b/extension/src/components/InlineForm.tsx @@ -1,8 +1,10 @@ import type { ComponentPropsWithRef } from 'react' import { Form } from 'react-router' +export type InlineFormContext = Record + type InlineFormProps = ComponentPropsWithRef & { - context?: Record + context?: InlineFormContext intent?: string } diff --git a/extension/src/components/index.ts b/extension/src/components/index.ts index 7547015fe..26f4a8f6a 100644 --- a/extension/src/components/index.ts +++ b/extension/src/components/index.ts @@ -7,6 +7,7 @@ export { ConfirmationModal, useConfirmationModal } from './ConfirmationModal' export { CopyToClipboard } from './CopyToClipboard' export { Divider } from './Divider' export { InlineForm } from './InlineForm' +export type { InlineFormContext } from './InlineForm' export * from './inputs' export * from './logos' export { Modal } from './Modal' diff --git a/extension/src/panel/pages/ClearTransactionsModal.tsx b/extension/src/panel/pages/ClearTransactionsModal.tsx index 46fcad3f2..56d79ffd5 100644 --- a/extension/src/panel/pages/ClearTransactionsModal.tsx +++ b/extension/src/panel/pages/ClearTransactionsModal.tsx @@ -1,8 +1,15 @@ -import { GhostButton, InlineForm, Modal, PrimaryButton } from '@/components' +import { + GhostButton, + InlineForm, + Modal, + PrimaryButton, + type InlineFormContext, +} from '@/components' type ClearTransactionsModalProps = { open: boolean newActiveRouteId: string + additionalContext?: InlineFormContext intent: string onClose: () => void } @@ -11,6 +18,7 @@ export const ClearTransactionsModal = ({ open, newActiveRouteId, intent, + additionalContext, onClose, }: ClearTransactionsModalProps) => { return ( @@ -26,7 +34,7 @@ export const ClearTransactionsModal = ({ Cancel - + Clear transactions diff --git a/extension/src/panel/pages/routes/edit.$routeId/EditRoute.spec.tsx b/extension/src/panel/pages/routes/edit.$routeId/EditRoute.spec.tsx index 16613663e..51c6e47fc 100644 --- a/extension/src/panel/pages/routes/edit.$routeId/EditRoute.spec.tsx +++ b/extension/src/panel/pages/routes/edit.$routeId/EditRoute.spec.tsx @@ -598,6 +598,57 @@ describe('Edit Zodiac route', () => { screen.queryByRole('dialog', { name: 'Clear transactions' }), ).not.toBeInTheDocument() }) + + it('is possible to launch a new route and clear transactions', async () => { + const selectedRoute = createMockRoute({ + id: 'firstRoute', + label: 'First route', + avatar: randomPrefixedAddress(), + }) + + await mockRoutes(selectedRoute, { + id: 'another-route', + avatar: randomPrefixedAddress(), + }) + await saveLastUsedRouteId('another-route') + + await render( + '/routes/edit/firstRoute', + [ + { + path: '/routes/edit/:routeId', + Component: EditRoute, + loader, + action, + }, + ], + { + initialState: [createTransaction()], + inspectRoutes: [ + '/:activeRouteId/clear-transactions/:newActiveRouteId', + ], + }, + ) + + await userEvent.click( + screen.getByRole('button', { name: 'Clear piloted Safe' }), + ) + + await userEvent.type( + screen.getByRole('textbox', { name: 'Piloted Safe' }), + randomAddress(), + ) + + await userEvent.click( + screen.getByRole('button', { name: 'Save & Launch' }), + ) + + await userEvent.click( + screen.getByRole('button', { name: 'Clear transactions' }), + ) + + await expectRouteToBe('/another-route/clear-transactions/firstRoute') + }) }) }) }) diff --git a/extension/src/panel/pages/routes/edit.$routeId/EditRoute.tsx b/extension/src/panel/pages/routes/edit.$routeId/EditRoute.tsx index 363b17271..3144b3c44 100644 --- a/extension/src/panel/pages/routes/edit.$routeId/EditRoute.tsx +++ b/extension/src/panel/pages/routes/edit.$routeId/EditRoute.tsx @@ -167,6 +167,31 @@ export const action = async ({ params, request }: ActionFunctionArgs) => { return redirect(`/${routeId}`) } + + case Intent.clearTransactions: { + const lastUsedRouteId = await getLastUsedRouteId() + + await saveRoute( + fromLegacyConnection({ + id: routeId, + label: getString(data, 'label'), + chainId: getInt(data, 'chainId') as ChainId, + avatarAddress: getString(data, 'avatarAddress'), + moduleAddress: getString(data, 'moduleAddress'), + pilotAddress: getString(data, 'pilotAddress'), + providerType: getInt(data, 'providerType'), + moduleType: getOptionalString( + data, + 'moduleType', + ) as SupportedModuleType, + multisend: getOptionalString(data, 'multisend'), + multisendCallOnly: getOptionalString(data, 'multisendCallOnly'), + roleId: getOptionalString(data, 'roleId'), + }), + ) + + return redirect(`/${lastUsedRouteId}/clear-transactions/${routeId}`) + } } } @@ -442,9 +467,11 @@ export const EditRoute = () => { setConfirmClearTransactions(false)} - onConfirm={() => submit(formRef.current, { method: 'post' })} /> ) diff --git a/extension/src/panel/pages/routes/edit.$routeId/intents.ts b/extension/src/panel/pages/routes/edit.$routeId/intents.ts index 55dcbe788..827a4cd37 100644 --- a/extension/src/panel/pages/routes/edit.$routeId/intents.ts +++ b/extension/src/panel/pages/routes/edit.$routeId/intents.ts @@ -1,4 +1,5 @@ export enum Intent { saveRoute = 'saveRoute', removeRoute = 'removeRoute', + clearTransactions = 'clearTransactions', }