Add prompt() plugin API (#121)

src-web/components/CookieDropdown.tsx

@@ -59,8 +59,8 @@ export function CookieDropdown() {
                         Enter a new name for <InlineCode>{activeCookieJar?.name}</InlineCode>
                       </>
                     ),
-                    name: 'name',
                     label: 'Name',
+                    confirmText: 'Save',
                     placeholder: 'New name',
                     defaultValue: activeCookieJar?.name,
                   });

src-web/components/EnvironmentEditDialog.tsx

@@ -274,8 +274,8 @@ function SidebarButton({
                       Enter a new name for <InlineCode>{environment.name}</InlineCode>
                     </>
                   ),
-                  name: 'name',
                   label: 'Name',
+                  confirmText: 'Save',
                   placeholder: 'New Name',
                   defaultValue: environment.name,
                 });

src-web/components/GlobalHooks.tsx

@@ -1,6 +1,8 @@
 import { useQueryClient } from '@tanstack/react-query';
+import { emit } from '@tauri-apps/api/event';
 import { getCurrentWebviewWindow } from '@tauri-apps/api/webviewWindow';
 import type { AnyModel } from '@yaakapp-internal/models';
+import type { ShowPromptRequest, ShowPromptResponse } from '@yaakapp-internal/plugin';
 import { useSetAtom } from 'jotai';
 import { useEffect } from 'react';
 import { useEnsureActiveCookieJar, useMigrateActiveCookieJarId } from '../hooks/useActiveCookieJar';
@@ -19,6 +21,7 @@ import { keyValueQueryKey } from '../hooks/useKeyValue';
 import { useListenToTauriEvent } from '../hooks/useListenToTauriEvent';
 import { useNotificationToast } from '../hooks/useNotificationToast';
 import { pluginsAtom } from '../hooks/usePlugins';
+import { usePrompt } from '../hooks/usePrompt';
 import { useRecentCookieJars } from '../hooks/useRecentCookieJars';
 import { useRecentEnvironments } from '../hooks/useRecentEnvironments';
 import { useRecentRequests } from '../hooks/useRecentRequests';
@@ -176,6 +179,16 @@ export function GlobalHooks() {
   useHotKey('app.zoom_reset', zoom.zoomReset);
   useListenToTauriEvent('zoom_reset', zoom.zoomReset);
 
+  const prompt = usePrompt();
+  useListenToTauriEvent<{ replyId: string; args: ShowPromptRequest }>(
+    'show_prompt',
+    async (event) => {
+      const value = await prompt(event.payload.args);
+      const result: ShowPromptResponse = { value };
+      await emit(event.payload.replyId, result);
+    },
+  );
+
   const copy = useCopy();
   useListenToTauriEvent('generate_theme_css', () => {
     const themesCss = [

src-web/components/RequestMethodDropdown.tsx

@@ -43,9 +43,9 @@ export const RequestMethodDropdown = memo(function RequestMethodDropdown({
           const newMethod = await prompt({
             id: 'custom-method',
             label: 'Http Method',
-            name: 'httpMethod',
             defaultValue: '',
             title: 'Custom Method',
+            confirmText: 'Save',
             description: 'Enter a custom method name',
             placeholder: 'CUSTOM',
           });

src-web/components/Sidebar.tsx

@@ -762,7 +762,7 @@ function SidebarItem({
                   Enter a new name for <InlineCode>{itemName}</InlineCode>
                 </>
               ),
-              name: 'name',
+              confirmText: 'Save',
               label: 'Name',
               placeholder: 'New Name',
               defaultValue: itemName,

src-web/components/TemplateFunctionDialog.tsx

@@ -93,6 +93,7 @@ export function TemplateFunctionDialog({ templateFunction, hide, initialTokens,
 
   return (
     <VStack className="pb-3" space={4}>
+      <h1 className="font-mono !text-base">{templateFunction.name}(…)</h1>
       <VStack space={2}>
         {templateFunction.args.map((a: TemplateFunctionArg, i: number) => {
           switch (a.type) {

src-web/components/WorkspaceActionsDropdown.tsx

@@ -62,7 +62,6 @@ export const WorkspaceActionsDropdown = memo(function WorkspaceActionsDropdown({
                 Enter a new name for <InlineCode>{activeWorkspace?.name}</InlineCode>
               </>
             ),
-            name: 'name',
             label: 'Name',
             placeholder: 'New Name',
             defaultValue: activeWorkspace?.name,

src-web/components/core/Editor/twig/completion.ts

@@ -13,7 +13,7 @@ export type TwigCompletionOptionNamespace = {
 
 export type TwigCompletionOptionFunction = {
   args: { name: string }[];
-  aliases: string[];
+  aliases?: string[];
   type: 'function';
 };
 
@@ -65,7 +65,7 @@ export function twigCompletion({ options }: TwigCompletionConfig) {
         if (matchSegments.length < optionSegments.length) {
           return [
             {
-              label: optionSegments.slice(0, matchSegments.length).join('.'),
+              label: optionSegments.slice(0, matchSegments.length).join('.') + '…',
               apply: optionSegments.slice(0, matchSegments.length).join('.'),
               type: 'namespace',
             },

src-web/components/core/Input.tsx

@@ -24,7 +24,7 @@ export type InputProps = Omit<
     | 'onKeyDown'
     | 'readOnly'
   > & {
-    name: string;
+    name?: string;
     type?: 'text' | 'password';
     label: string;
     hideLabel?: boolean;
@@ -41,7 +41,7 @@ export type InputProps = Omit<
     rightSlot?: ReactNode;
     size?: 'xs' | 'sm' | 'md' | 'auto';
     className?: string;
-    placeholder: string;
+    placeholder?: string;
     validate?: boolean | ((v: string) => boolean);
     require?: boolean;
     wrapLines?: boolean;

src-web/components/core/PairEditor.tsx

@@ -519,8 +519,7 @@ function PairEditorRow({
                   label: 'Content-Type',
                   placeholder: 'text/plain',
                   defaultValue: pairContainer.pair.contentType ?? '',
-                  name: 'content-type',
-                  confirmLabel: 'Set',
+                  confirmText: 'Set',
                   description: 'Leave blank to auto-detect',
                 });
                 handleChangeValueContentType(v);