Deno plugins (#42)

Switch from BoaJS to Deno core

src-web/hooks/useAlert.ts

@@ -7,12 +7,22 @@ import { Alert } from './Alert';
 export function useAlert() {
   const dialog = useDialog();
   return useCallback(
-    ({ id, title, body }: { id: string; title: DialogProps['title']; body: AlertProps['body'] }) =>
+    ({
+      id,
+      title,
+      body,
+      size = 'sm',
+    }: {
+      id: string;
+      title: DialogProps['title'];
+      body: AlertProps['body'];
+      size?: DialogProps['size'];
+    }) =>
       dialog.show({
         id,
         title,
         hideX: true,
-        size: 'sm',
+        size,
         render: ({ hide }) => Alert({ onHide: hide, body }),
       }),
     // eslint-disable-next-line react-hooks/exhaustive-deps

src-web/hooks/useImportData.tsx

@@ -2,6 +2,7 @@ import { useMutation } from '@tanstack/react-query';
 import { invoke } from '@tauri-apps/api/core';
 import { open } from '@tauri-apps/plugin-dialog';
 import { Button } from '../components/core/Button';
+import { FormattedError } from '../components/core/FormattedError';
 import { VStack } from '../components/core/Stacks';
 import { useDialog } from '../components/DialogContext';
 import type { Environment, Folder, GrpcRequest, HttpRequest, Workspace } from '../lib/models';
@@ -77,7 +78,12 @@ export function useImportData() {
 
   return useMutation({
     onError: (err: string) => {
-      alert({ id: 'import-failed', title: 'Import Failed', body: err });
+      alert({
+        id: 'import-failed',
+        title: 'Import Failed',
+        size: 'md',
+        body: <FormattedError>{err}</FormattedError>,
+      });
     },
     mutationFn: async () => {
       return new Promise<void>((resolve, reject) => {