fix: handle rejected wallet approvals (#2278)

Signed-off-by: Fayi Femi-Balogun <fayimora.femibalogun@digitalasset.com>

Author: fayi-da

examples/portfolio/src/lib/submit.ts

@@ -15,13 +15,19 @@ export const submitViaProvider = async (
         throw new Error('Dapp provider is not available')
     }
 
-    await provider.request({
-        method: 'prepareExecuteAndWait',
-        params: {
-            commands: [command],
-            commandId: v4(),
-            actAs: [actAs],
-            disclosedContracts,
-        },
-    })
+    try {
+        await provider.request({
+            method: 'prepareExecuteAndWait',
+            params: {
+                commands: [command],
+                commandId: v4(),
+                actAs: [actAs],
+                disclosedContracts,
+            },
+        })
+    } catch (cause) {
+        throw cause instanceof Error
+            ? cause
+            : new Error('The transaction was not completed. You can try again.')
+    }
 }

examples/portfolio/tests/transfers.spec.ts

@@ -58,6 +58,48 @@ const setupTransferTest = async (page: Page): Promise<TransferTestContext> => {
 }
 
 test.describe('dashboard transfer flow', () => {
+    test('rejected approval returns the transfer form to a recoverable state', async ({
+        page: dappPage,
+    }) => {
+        const { wg, bob } = await setupTransferTest(dappPage)
+
+        await tap(dappPage, wg, '200')
+        await openTransferDialog(dappPage)
+
+        const dialog = dappPage.getByRole('dialog')
+        await dialog
+            .getByRole('textbox', { name: 'Recipient Address' })
+            .fill(bob)
+        await dialog.getByRole('combobox', { name: 'Select asset' }).click()
+        await dappPage.getByRole('option', { name: /AMT/ }).click()
+        await dialog.getByRole('spinbutton', { name: 'Amount' }).fill('25')
+        await dialog
+            .getByRole('textbox', { name: 'Description' })
+            .fill(`rejected approval test ${Date.now()}`)
+
+        const submitButton = dialog.getByRole('button', {
+            name: 'Make Transfer',
+        })
+        await wg.rejectTransaction(() => submitButton.click())
+
+        await expect(dialog.getByRole('alert')).toContainText(
+            'Transfer failed: The transaction was not completed. You can try again.',
+            { timeout: 15000 }
+        )
+        await expect(
+            dialog.getByRole('heading', { name: 'Transfer Summary' })
+        ).not.toBeVisible()
+        await expect(
+            dialog.getByRole('button', { name: 'Close transfer dialog' })
+        ).toBeEnabled()
+        await expect(submitButton).toBeEnabled()
+
+        await wg.approveTransaction(() => submitButton.click())
+        await expect(
+            dialog.getByRole('heading', { name: 'Transfer Summary' })
+        ).toBeVisible({ timeout: 15000 })
+    })
+
     test('two step transfer - accept', async ({ page: dappPage }) => {
         const { wg, alice, bob } = await setupTransferTest(dappPage)
 

wallet-gateway/remote/src/user-api/controller.test.ts

@@ -769,10 +769,14 @@ describe('userController', () => {
             expect(result.transactions[0]?.id).toBe('tx-1')
         })
 
-        it('deletes a pending transaction', async () => {
+        it('deletes a pending transaction and emits a failed event', async () => {
             const store = await createStore(logger, auth)
             await store.setTransaction(transaction)
             const removeSpy = vi.spyOn(store, 'removeTransaction')
+            const emitSpy = vi.spyOn(
+                notificationService.getNotifier(session.id),
+                'emit'
+            )
             const controller = createController(
                 store,
                 notificationService,
@@ -783,6 +787,14 @@ describe('userController', () => {
             await controller.deleteTransaction({ transactionId: 'tx-1' })
 
             expect(removeSpy).toHaveBeenCalledWith('tx-1')
+            expect(emitSpy).toHaveBeenCalledOnce()
+            expect(emitSpy).toHaveBeenCalledWith('txChanged', {
+                status: 'failed',
+                commandId: transaction.commandId,
+            })
+            expect(removeSpy.mock.invocationCallOrder[0]).toBeLessThan(
+                emitSpy.mock.invocationCallOrder[0]!
+            )
         })
 
         it('rejects delete when the transaction is not pending', async () => {

wallet-gateway/remote/src/user-api/controller.ts

@@ -67,7 +67,10 @@ import { logDynamically, networkStatus } from '../utils.js'
 import { v4 } from 'uuid'
 import { TransactionService } from '../ledger/transaction-service.js'
 import { StatusEvent } from '../dapp-api/rpc-gen/typings.js'
-import type { MessageSignatureEvent } from '../dapp-api/rpc-gen/typings.js'
+import type {
+    MessageSignatureEvent,
+    TxChangedFailedEvent,
+} from '../dapp-api/rpc-gen/typings.js'
 import { rpcErrors } from '@canton-network/core-rpc-errors'
 import crypto from 'crypto'
 import { assertTokenClaimsMatchNetwork } from './token-network-matching.js'
@@ -1116,7 +1119,18 @@ export const userController = (
                     `Cannot delete transaction with status '${transaction.status}'. Only pending transactions can be deleted.`
                 )
             }
+            const session = await store.getSession(
+                assertConnected(authContext).accessToken
+            )
+            if (!session) {
+                throw new Error('No active session found')
+            }
+
             await store.removeTransaction(transaction.id)
+            notificationService.getNotifier(session.id).emit('txChanged', {
+                status: 'failed',
+                commandId: transaction.commandId,
+            } satisfies TxChangedFailedEvent)
             return null
         },
         generateApiKey: async (