Tweak workspace settings and a bunch of small things

src-web/lib/confirm.ts

@@ -6,28 +6,29 @@ import { showDialog } from './dialog';
 type ConfirmArgs = {
   id: string;
 } & Pick<DialogProps, 'title' | 'description'> &
-  Pick<ConfirmProps, 'color' | 'confirmText'>;
+  Pick<ConfirmProps, 'color' | 'confirmText' | 'requireTyping'>;
 
-export async function showConfirm({ id, title, description, color, confirmText }: ConfirmArgs) {
+export async function showConfirm({
+  color,
+  confirmText,
+  requireTyping,
+  ...extraProps
+}: ConfirmArgs) {
   return new Promise((onResult: ConfirmProps['onResult']) => {
     showDialog({
-      id,
-      title,
-      description,
+      ...extraProps,
       hideX: true,
       size: 'sm',
       disableBackdropClose: true, // Prevent accidental dismisses
-      render: ({ hide }) => Confirm({ onHide: hide, color, onResult, confirmText }),
+      render: ({ hide }) => Confirm({ onHide: hide, color, onResult, confirmText, requireTyping }),
     });
   });
 }
 
-export async function showConfirmDelete({ id, title, description }: ConfirmArgs) {
+export async function showConfirmDelete({ confirmText, color, ...extraProps }: ConfirmArgs) {
   return showConfirm({
-    id,
-    title,
-    description,
-    color: 'danger',
-    confirmText: 'Delete',
+    color: color ?? 'danger',
+    confirmText: confirmText ?? 'Delete',
+    ...extraProps,
   });
 }

src-web/lib/deleteModelWithConfirm.tsx

@@ -4,8 +4,11 @@ import { InlineCode } from '../components/core/InlineCode';
 import { showConfirmDelete } from './confirm';
 import { resolvedModelName } from './resolvedModelName';
 
-export async function deleteModelWithConfirm(model: AnyModel | null): Promise<boolean> {
-  if (model == null ) {
+export async function deleteModelWithConfirm(
+  model: AnyModel | null,
+  options: { confirmName?: string } = {},
+): Promise<boolean> {
+  if (model == null) {
     console.warn('Tried to delete null model');
     return false;
   }
@@ -13,6 +16,7 @@ export async function deleteModelWithConfirm(model: AnyModel | null): Promise<bo
   const confirmed = await showConfirmDelete({
     id: 'delete-model-' + model.id,
     title: 'Delete ' + modelTypeLabel(model),
+    requireTyping: options.confirmName,
     description: (
       <>
         Permanently delete <InlineCode>{resolvedModelName(model)}</InlineCode>?

src-web/lib/initGlobalListeners.tsx

@@ -0,0 +1,77 @@
+import { emit } from '@tauri-apps/api/event';
+import { openUrl } from '@tauri-apps/plugin-opener';
+import type { InternalEvent } from '@yaakapp-internal/plugins';
+import type { ShowToastRequest } from '@yaakapp/api';
+import { openSettings } from '../commands/openSettings';
+import { Button } from '../components/core/Button';
+
+// Listen for toasts
+import { listenToTauriEvent } from '../hooks/useListenToTauriEvent';
+import { generateId } from './generateId';
+import { showPrompt } from './prompt';
+import { invokeCmd } from './tauri';
+import { showToast } from './toast';
+
+export function initGlobalListeners() {
+  listenToTauriEvent<ShowToastRequest>('show_toast', (event) => {
+    showToast({ ...event.payload });
+  });
+
+  listenToTauriEvent('settings', () => openSettings.mutate(null));
+
+  // Listen for plugin events
+  listenToTauriEvent<InternalEvent>('plugin_event', async ({ payload: event }) => {
+    if (event.payload.type === 'prompt_text_request') {
+      const value = await showPrompt(event.payload);
+      const result: InternalEvent = {
+        id: generateId(),
+        replyId: event.id,
+        pluginName: event.pluginName,
+        pluginRefId: event.pluginRefId,
+        windowContext: event.windowContext,
+        payload: {
+          type: 'prompt_text_response',
+          value,
+        },
+      };
+      await emit(event.id, result);
+    }
+  });
+
+  listenToTauriEvent<{
+    id: string;
+    timestamp: string;
+    message: string;
+    timeout?: number | null;
+    action?: null | {
+      url: string;
+      label: string;
+    };
+  }>('notification', ({ payload }) => {
+    console.log('Got notification event', payload);
+    const actionUrl = payload.action?.url;
+    const actionLabel = payload.action?.label;
+    showToast({
+      id: payload.id,
+      timeout: payload.timeout ?? undefined,
+      message: payload.message,
+      onClose: () => {
+        invokeCmd('cmd_dismiss_notification', { notificationId: payload.id }).catch(console.error);
+      },
+      action: ({ hide }) =>
+        actionLabel && actionUrl ? (
+          <Button
+            size="xs"
+            color="secondary"
+            className="mr-auto min-w-[5rem]"
+            onClick={() => {
+              hide();
+              return openUrl(actionUrl);
+            }}
+          >
+            {actionLabel}
+          </Button>
+        ) : null,
+    });
+  });
+}

src-web/lib/tauri.ts

@@ -39,8 +39,7 @@ type TauriCmd =
   | 'cmd_send_http_request'
   | 'cmd_show_workspace_key'
   | 'cmd_template_functions'
-  | 'cmd_template_tokens_to_string'
-  | 'cmd_uninstall_plugin';
+  | 'cmd_template_tokens_to_string';
 
 export async function invokeCmd<T>(cmd: TauriCmd, args?: InvokeArgs): Promise<T> {
   // console.log('RUN COMMAND', cmd, args);