Bot structure update (medplum#2528)

* Checkpoint

* Updated editor and deploy step

* Fixed lambda deploy/execute flow

* Checkpoint

* Fixed code smell

* VM Context bot working end-to-end

* Tests

* Tests

* Tests

* Tests

* AuditEvent triggers and destinations

* Fixed CORS

* Fixed code editor initial load bug

* Fixed bot editor tests

* Fixed build error

Author: codyebberson

packages/app/src/resource/BotEditor.test.tsx

@@ -1,6 +1,7 @@
 import { MantineProvider } from '@mantine/core';
 import { Notifications } from '@mantine/notifications';
 import { allOk, badRequest } from '@medplum/core';
+import { Bot } from '@medplum/fhirtypes';
 import { MockClient } from '@medplum/mock';
 import { MedplumProvider } from '@medplum/react';
 import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
@@ -12,7 +13,10 @@ let medplum: MockClient;
 
 describe('BotEditor', () => {
   async function setup(url: string): Promise<void> {
-    medplum = new MockClient();
+    if (!medplum) {
+      medplum = new MockClient();
+      jest.spyOn(medplum, 'download').mockImplementation(async () => ({ text: async () => 'test' } as unknown as Blob));
+    }
 
     // Mock bot operations
     medplum.router.router.add('POST', 'Bot/:id/$deploy', async () => [allOk]);
@@ -49,6 +53,7 @@ describe('BotEditor', () => {
   test('Bot editor', async () => {
     await setup('/Bot/123/editor');
     await waitFor(() => screen.getByText('Editor'));
+    await waitFor(() => screen.getByTestId('code-frame'));
     expect(screen.getByText('Editor')).toBeInTheDocument();
 
     await act(async () => {
@@ -197,4 +202,38 @@ describe('BotEditor', () => {
 
     expect(screen.getByText('Error')).toBeInTheDocument();
   });
+
+  test('Legacy bot', async () => {
+    // Bots now use "sourceCode" and "executableCode" instead of "code"
+    // While "code" is deprecated, it is still supported for legacy bots
+
+    // Create a Bot with "code" instead of "sourceCode" and "executableCode"
+    medplum = new MockClient();
+    const legacyBot = await medplum.createResource<Bot>({
+      resourceType: 'Bot',
+      code: 'console.log("foo");',
+    });
+
+    await setup(`/Bot/${legacyBot.id}/editor`);
+    await waitFor(() => screen.getByText('Save'));
+
+    // Mock the code frame
+    (screen.getByTestId<HTMLIFrameElement>('code-frame').contentWindow as Window).postMessage = (
+      _message: any,
+      _targetOrigin: any,
+      transfer?: Transferable[]
+    ) => {
+      (transfer?.[0] as MessagePort).postMessage({ result: 'console.log("foo");' });
+    };
+
+    await act(async () => {
+      fireEvent.click(screen.getByText('Save'));
+    });
+
+    expect(screen.getByText('Saved')).toBeInTheDocument();
+
+    const check = await medplum.readResource('Bot', legacyBot.id as string);
+    expect(check.sourceCode).toBeDefined();
+    expect(check.sourceCode?.url).toBeDefined();
+  });
 });

packages/app/src/resource/BotEditor.tsx

@@ -1,6 +1,6 @@
 import { Button, Grid, Group, Paper } from '@mantine/core';
 import { showNotification } from '@mantine/notifications';
-import { normalizeErrorString } from '@medplum/core';
+import { isUUID, MedplumClient, normalizeErrorString, PatchOperation } from '@medplum/core';
 import { Bot } from '@medplum/fhirtypes';
 import { useMedplum } from '@medplum/react';
 import { IconCloudUpload, IconDeviceFloppy, IconPlayerPlay } from '@tabler/icons-react';
@@ -14,6 +14,7 @@ export function BotEditor(): JSX.Element | null {
   const medplum = useMedplum();
   const { id } = useParams() as { id: string };
   const [bot, setBot] = useState<Bot>();
+  const [defaultCode, setDefaultCode] = useState<string | undefined>(undefined);
   const codeFrameRef = useRef<HTMLIFrameElement>(null);
   const inputFrameRef = useRef<HTMLIFrameElement>(null);
   const outputFrameRef = useRef<HTMLIFrameElement>(null);
@@ -22,7 +23,10 @@ export function BotEditor(): JSX.Element | null {
   useEffect(() => {
     medplum
       .readResource('Bot', id)
-      .then(setBot)
+      .then(async (newBot: Bot) => {
+        setBot(newBot);
+        setDefaultCode(await getBotCode(medplum, newBot));
+      })
       .catch((err) => showNotification({ color: 'red', message: normalizeErrorString(err) }));
   }, [medplum, id]);
 
@@ -46,21 +50,30 @@ export function BotEditor(): JSX.Element | null {
       setLoading(true);
       try {
         const code = await getCode();
-        await medplum.patchResource('Bot', id, [
-          {
+        const sourceCode = await medplum.createAttachment(code, 'index.ts', 'text/typescript');
+        const operations: PatchOperation[] = [];
+        if (bot?.sourceCode) {
+          operations.push({
             op: 'replace',
-            path: '/code',
-            value: code,
-          },
-        ]);
+            path: '/sourceCode',
+            value: sourceCode,
+          });
+        } else {
+          operations.push({
+            op: 'add',
+            path: '/sourceCode',
+            value: sourceCode,
+          });
+        }
+        await medplum.patchResource('Bot', id, operations);
         showNotification({ color: 'green', message: 'Saved' });
       } catch (err) {
         showNotification({ color: 'red', message: normalizeErrorString(err) });
       } finally {
         setLoading(false);
       }
     },
-    [medplum, id, getCode]
+    [medplum, id, bot, getCode]
   );
 
   const deployBot = useCallback(
@@ -103,7 +116,7 @@ export function BotEditor(): JSX.Element | null {
     [medplum, id, getSampleInput]
   );
 
-  if (!bot) {
+  if (!bot || defaultCode === undefined) {
     return null;
   }
 
@@ -116,7 +129,7 @@ export function BotEditor(): JSX.Element | null {
             language="typescript"
             module="commonjs"
             testId="code-frame"
-            defaultValue={bot.code || ''}
+            defaultValue={defaultCode}
             minHeight="528px"
           />
           <Group position="right" spacing="xs">
@@ -161,3 +174,17 @@ export function BotEditor(): JSX.Element | null {
     </Grid>
   );
 }
+
+async function getBotCode(medplum: MedplumClient, bot: Bot): Promise<string> {
+  if (bot.sourceCode?.url) {
+    // Medplum storage service does not allow CORS requests for security reasons.
+    // So instead, we have to use the FHIR Binary API to fetch the source code.
+    // Example: https://storage.staging.medplum.com/binary/272a11dc-5b01-4c05-a14e-5bf53117e1e9/69303e8d-36f2-4417-b09b-60c15f221b09?Expires=...
+    // The Binary ID is the first UUID in the URL.
+    const binaryId = bot.sourceCode.url?.split('/')?.find(isUUID) as string;
+    const blob = await medplum.download(medplum.fhirUrl('Binary', binaryId));
+    return blob.text();
+  }
+
+  return bot.code ?? '';
+}

packages/app/src/resource/CodeEditor.tsx

@@ -1,11 +1,11 @@
-import React from 'react';
+import React, { RefObject } from 'react';
 import { sendCommand } from '../utils';
 
 export interface CodeEditorProps {
   language: 'typescript' | 'json';
   module?: 'commonjs' | 'esnext';
-  defaultValue: string;
-  iframeRef?: React.RefObject<HTMLIFrameElement>;
+  defaultValue?: string;
+  iframeRef: RefObject<HTMLIFrameElement>;
   testId?: string;
   minHeight?: string;
 }
@@ -16,14 +16,17 @@ export function CodeEditor(props: CodeEditorProps): JSX.Element {
   if (props.module) {
     url.searchParams.set('module', props.module);
   }
+
   return (
     <iframe
       frameBorder="0"
       src={url.toString()}
       style={{ width: '100%', height: '100%', minHeight: props.minHeight }}
       ref={props.iframeRef}
       data-testid={props.testId}
-      onLoad={(e) => sendCommand(e.currentTarget as HTMLIFrameElement, { command: 'setValue', value: code })}
+      onLoad={(e) => {
+        sendCommand(e.currentTarget as HTMLIFrameElement, { command: 'setValue', value: code }).catch(console.error);
+      }}
     />
   );
 }

packages/cli/src/aws/update-app.ts

@@ -133,17 +133,17 @@ async function uploadAppToS3(tmpDir: string, bucketName: string): Promise<void>
     ['css/**/*.css.map', 'application/json', true],
     ['img/**/*.png', 'image/png', true],
     ['img/**/*.svg', 'image/svg+xml', true],
-    ['js/**/*.js', 'application/javascript', true],
+    ['js/**/*.js', 'text/javascript', true],
     ['js/**/*.js.map', 'application/json', true],
     ['js/**/*.txt', 'text/plain', true],
     ['favicon.ico', 'image/vnd.microsoft.icon', true],
     ['robots.txt', 'text/plain', true],
-    ['workbox-*.js', 'application/javascript', true],
+    ['workbox-*.js', 'text/javascript', true],
     ['workbox-*.js.map', 'application/json', true],
 
     // Not cached
     ['manifest.webmanifest', 'application/manifest+json', false],
-    ['service-worker.js', 'application/javascript', false],
+    ['service-worker.js', 'text/javascript', false],
     ['service-worker.js.map', 'application/json', false],
     ['index.html', 'text/html', false],
   ];

packages/cli/src/bot.test.ts

@@ -110,8 +110,8 @@ describe('CLI Bots', () => {
     await main(['node', 'index.js', 'bot', 'save', 'hello-world']);
     expect(console.log).toBeCalledWith(expect.stringMatching(/Success/));
     const check = await medplum.readResource('Bot', bot.id as string);
-    expect(check.code).toBeDefined();
-    expect(check.code).not.toEqual('');
+    expect(check.code).toBeUndefined();
+    expect(check.sourceCode).toBeDefined();
   });
 
   test('Deploy bot success', async () => {
@@ -137,8 +137,34 @@ describe('CLI Bots', () => {
     await main(['node', 'index.js', 'bot', 'deploy', 'hello-world']);
     expect(console.log).toBeCalledWith(expect.stringMatching(/Success/));
     const check = await medplum.readResource('Bot', bot.id as string);
-    expect(check.code).toBeDefined();
-    expect(check.code).not.toEqual('');
+    expect(check.code).toBeUndefined();
+    expect(check.sourceCode).toBeDefined();
+  });
+
+  test('Deploy bot without dist success', async () => {
+    // Create the bot
+    const bot = await medplum.createResource<Bot>({ resourceType: 'Bot' });
+    expect(bot.code).toBeUndefined();
+
+    // Setup bot config
+    (fs.existsSync as unknown as jest.Mock).mockReturnValue(true);
+    (fs.readFileSync as unknown as jest.Mock).mockReturnValue(
+      JSON.stringify({
+        bots: [
+          {
+            name: 'hello-world',
+            id: bot.id,
+            source: 'src/hello-world.ts',
+          },
+        ],
+      })
+    );
+
+    await main(['node', 'index.js', 'bot', 'deploy', 'hello-world']);
+    expect(console.log).toBeCalledWith(expect.stringMatching(/Success/));
+    const check = await medplum.readResource('Bot', bot.id as string);
+    expect(check.code).toBeUndefined();
+    expect(check.sourceCode).toBeDefined();
   });
 
   test('Deploy bot for multiple bot with wildcards ', async () => {
@@ -294,8 +320,8 @@ describe('CLI Bots', () => {
     await main(['node', 'index.js', 'save-bot', 'hello-world']);
     expect(console.log).toBeCalledWith(expect.stringMatching(/Success/));
     const check = await medplum.readResource('Bot', bot.id as string);
-    expect(check.code).toBeDefined();
-    expect(check.code).not.toEqual('');
+    expect(check.code).toBeUndefined();
+    expect(check.sourceCode).toBeDefined();
   });
 
   test('Deprecate Deploy bot success', async () => {
@@ -321,8 +347,8 @@ describe('CLI Bots', () => {
     await main(['node', 'index.js', 'deploy-bot', 'hello-world']);
     expect(console.log).toBeCalledWith(expect.stringMatching(/Success/));
     const check = await medplum.readResource('Bot', bot.id as string);
-    expect(check.code).toBeDefined();
-    expect(check.code).not.toEqual('');
+    expect(check.code).toBeUndefined();
+    expect(check.sourceCode).toBeDefined();
   });
 
   test('Deprecate Deploy bot for multiple bot with wildcards ', async () => {

packages/cli/src/utils.test.ts

@@ -1,6 +1,6 @@
 import { Writable } from 'stream';
 import tar from 'tar';
-import { safeTarExtractor } from './utils';
+import { getCodeContentType, safeTarExtractor } from './utils';
 
 jest.mock('tar', () => ({
   x: jest.fn(),
@@ -52,4 +52,17 @@ describe('CLI utils', () => {
       expect((err as Error).message).toEqual('Tar extractor reached max size');
     }
   });
+
+  test('getCodeContentType', () => {
+    expect(getCodeContentType('foo.cjs')).toEqual('text/javascript');
+    expect(getCodeContentType('foo.js')).toEqual('text/javascript');
+    expect(getCodeContentType('foo.mjs')).toEqual('text/javascript');
+
+    expect(getCodeContentType('foo.cts')).toEqual('text/typescript');
+    expect(getCodeContentType('foo.mts')).toEqual('text/typescript');
+    expect(getCodeContentType('foo.ts')).toEqual('text/typescript');
+
+    expect(getCodeContentType('foo.txt')).toEqual('text/plain');
+    expect(getCodeContentType('foo')).toEqual('text/plain');
+  });
 });

packages/cli/src/utils.ts

@@ -1,7 +1,7 @@
 import { MedplumClient } from '@medplum/core';
 import { Bot, Extension, OperationOutcome } from '@medplum/fhirtypes';
 import { existsSync, readFileSync, writeFile } from 'fs';
-import { resolve } from 'path';
+import { basename, extname, resolve } from 'path';
 import internal from 'stream';
 import tar from 'tar';
 
@@ -26,29 +26,30 @@ export function prettyPrint(input: unknown): void {
 }
 
 export async function saveBot(medplum: MedplumClient, botConfig: MedplumBotConfig, bot: Bot): Promise<void> {
-  const code = readFileContents(botConfig.source);
+  const codePath = botConfig.source;
+  const code = readFileContents(codePath);
   if (!code) {
     return;
   }
 
   try {
-    console.log('Update bot code.....');
+    console.log('Saving source code...');
+    const sourceCode = await medplum.createAttachment(code, basename(codePath), getCodeContentType(codePath));
+
+    console.log('Updating bot.....');
     const updateResult = await medplum.updateResource({
       ...bot,
-      code,
+      sourceCode,
     });
-    if (!updateResult) {
-      console.log('Bot not modified');
-    } else {
-      console.log('Success! New bot version: ' + updateResult.meta?.versionId);
-    }
+    console.log('Success! New bot version: ' + updateResult.meta?.versionId);
   } catch (err) {
     console.log('Update error: ', err);
   }
 }
 
 export async function deployBot(medplum: MedplumClient, botConfig: MedplumBotConfig, bot: Bot): Promise<void> {
-  const code = readFileContents(botConfig.dist ?? botConfig.source);
+  const codePath = botConfig.dist ?? botConfig.source;
+  const code = readFileContents(codePath);
   if (!code) {
     return;
   }
@@ -180,3 +181,14 @@ export function getUnsupportedExtension(): Extension {
     ],
   };
 }
+
+export function getCodeContentType(filename: string): string {
+  const ext = extname(filename).toLowerCase();
+  if (['.cjs', '.mjs', '.js'].includes(ext)) {
+    return 'text/javascript';
+  }
+  if (['.cts', '.mts', '.ts'].includes(ext)) {
+    return 'text/typescript';
+  }
+  return 'text/plain';
+}