fix(kernel-ui): make Revoke button refresh object registry (#558)

Corrects an issue with the object registry's Revoke button, where
although the underlying kernel state was properly updated, the registry
was not updated upon successful revocation and the UI did not reflect
the change until reload.

Author: grypez

packages/extension/test/e2e/object-registry.test.ts

@@ -73,8 +73,12 @@ test.describe('Object Registry', () => {
     let response = await sendMessage(popupPage, target, method, params);
     await expect(response).toContainText(/body(.+):(.+)hello(.+)from(.+)Bob/u);
 
-    response = await revokeObject(popupPage, owner, target);
-    await expect(response).toContainText(`Revoked object ${target}`);
+    const { button, output } = await revokeObject(popupPage, owner, target);
+    await expect(output).toContainText(`Revoked object ${target}`);
+
+    // After revoking, the revoke button should be disabled and show "Revoked"
+    await expect(button).toBeDisabled();
+    await expect(button).toHaveText('Revoked');
 
     // After revoking, the previously successful message should fail
     response = await sendMessage(popupPage, target, method, params);

packages/extension/test/e2e/object-registry.ts

@@ -1,4 +1,4 @@
-import type { Page, Expect } from 'playwright/test';
+import type { Page, Expect, Locator } from 'playwright/test';
 
 export const openObjectRegistryTab = async (
   page: Page,
@@ -27,10 +27,11 @@ export const revokeObject = async (
   page: Page,
   owner: string,
   target: string,
-) => {
+): Promise<{ button: Locator; output: Locator }> => {
   await page
     .locator(`.accordion-header:has(.accordion-title:text("${owner}"))`)
     .click();
-  await page.locator(`[data-testid="revoke-button-${target}"]`).click();
-  return page.locator('[data-testid="message-output"]');
+  const button = page.locator(`[data-testid="revoke-button-${target}"]`);
+  await button.click();
+  return { button, output: page.locator('[data-testid="message-output"]') };
 };

packages/kernel-ui/src/hooks/useRegistry.ts

@@ -17,21 +17,6 @@ export function useRegistry(): {
   const { callKernelMethod, logMessage, setObjectRegistry } = usePanelContext();
   const { executeQuery } = useDatabase();
 
-  // Revoke an object
-  const revoke = useCallback(
-    (kref: KRef) => {
-      callKernelMethod({ method: 'revoke', params: { kref } })
-        .then(() => logMessage(`Revoked object ${kref}`, 'success'))
-        .catch((error) =>
-          logMessage(
-            `Failed to revoke object ${kref}: ${error.message}`,
-            'error',
-          ),
-        );
-    },
-    [callKernelMethod, logMessage],
-  );
-
   // Fetch the kv db and parse it into an object registry
   const fetchObjectRegistry = useCallback((): void => {
     executeQuery('SELECT key, value FROM kv')
@@ -49,6 +34,22 @@ export function useRegistry(): {
       );
   }, [executeQuery, logMessage, setObjectRegistry]);
 
+  // Revoke an object
+  const revoke = useCallback(
+    (kref: KRef) => {
+      callKernelMethod({ method: 'revoke', params: { kref } })
+        .then(() => fetchObjectRegistry())
+        .then(() => logMessage(`Revoked object ${kref}`, 'success'))
+        .catch((error) =>
+          logMessage(
+            `Failed to revoke object ${kref}: ${error.message}`,
+            'error',
+          ),
+        );
+    },
+    [callKernelMethod, logMessage],
+  );
+
   return {
     fetchObjectRegistry,
     revoke,

vitest.config.ts

@@ -116,10 +116,10 @@ export default defineConfig({
           lines: 97.98,
         },
         'packages/kernel-ui/**': {
-          statements: 94.97,
-          functions: 95.2,
+          statements: 94.98,
+          functions: 95.23,
           branches: 86.03,
-          lines: 95.08,
+          lines: 95.09,
         },
         'packages/kernel-utils/**': {
           statements: 100,