Rename workspace

src-web/hooks/Confirm.tsx

@@ -3,7 +3,7 @@ import { Button } from '../components/core/Button';
 import { HStack } from '../components/core/Stacks';
 
 export interface ConfirmProps {
-  hide: () => void;
+  onHide: () => void;
   onResult: (result: boolean) => void;
   variant?: 'delete' | 'confirm';
 }
@@ -18,7 +18,7 @@ const confirmButtonTexts: Record<NonNullable<ConfirmProps['variant']>, string> =
   confirm: 'Confirm',
 };
 
-export function Confirm({ hide, onResult, variant = 'confirm' }: ConfirmProps) {
+export function Confirm({ onHide, onResult, variant = 'confirm' }: ConfirmProps) {
   const focusRef = (el: HTMLButtonElement | null) => {
     setTimeout(() => {
       el?.focus();
@@ -27,16 +27,16 @@ export function Confirm({ hide, onResult, variant = 'confirm' }: ConfirmProps) {
 
   const handleHide = () => {
     onResult(false);
-    hide();
+    onHide();
   };
 
   const handleSuccess = () => {
     onResult(true);
-    hide();
+    onHide();
   };
 
   return (
-    <HStack space={2} justifyContent="end">
+    <HStack space={2} justifyContent="end" className="mt-6">
       <Button className="focus" color="gray" onClick={handleHide}>
         Cancel
       </Button>

src-web/hooks/Prompt.tsx

@@ -0,0 +1,48 @@
+import type { FormEvent } from 'react';
+import { useCallback, useState } from 'react';
+import { Button } from '../components/core/Button';
+import type { InputProps } from '../components/core/Input';
+import { Input } from '../components/core/Input';
+import { HStack, VStack } from '../components/core/Stacks';
+
+export interface PromptProps {
+  onHide: () => void;
+  onResult: (value: string) => void;
+  label: InputProps['label'];
+  name: InputProps['name'];
+  defaultValue: InputProps['defaultValue'];
+}
+
+export function Prompt({ onHide, label, name, defaultValue, onResult }: PromptProps) {
+  const [value, setValue] = useState<string>(defaultValue ?? '');
+  const handleSubmit = useCallback(
+    (e: FormEvent<HTMLFormElement>) => {
+      e.preventDefault();
+      onHide();
+      onResult(value);
+    },
+    [onHide, onResult, value],
+  );
+
+  return (
+    <form onSubmit={handleSubmit}>
+      <VStack space={6}>
+        <Input
+          hideLabel
+          label={label}
+          name={name}
+          defaultValue={defaultValue}
+          onChange={setValue}
+        />
+        <HStack space={2} justifyContent="end">
+          <Button className="focus" color="gray" onClick={onHide}>
+            Cancel
+          </Button>
+          <Button type="submit" className="focus" color="primary">
+            Save
+          </Button>
+        </HStack>
+      </VStack>
+    </form>
+  );
+}

src-web/hooks/useConfirm.ts

@@ -20,7 +20,7 @@ export function useConfirm() {
         description,
         hideX: true,
         size: 'sm',
-        render: ({ hide }) => Confirm({ hide, variant, onResult }),
+        render: ({ hide }) => Confirm({ onHide: hide, variant, onResult }),
       });
     });
 }

src-web/hooks/useDeleteRequest.tsx

@@ -19,7 +19,7 @@ export function useDeleteRequest(id: string | null) {
         variant: 'delete',
         description: (
           <>
-            Are you sure you want to delete <InlineCode>{request?.name}</InlineCode>?
+            Permanently delete <InlineCode>{request?.name}</InlineCode>?
           </>
         ),
       });

src-web/hooks/useDeleteWorkspace.tsx

@@ -21,7 +21,7 @@ export function useDeleteWorkspace(workspace: Workspace | null) {
         variant: 'delete',
         description: (
           <>
-            Are you sure you want to delete <InlineCode>{workspace?.name}</InlineCode>?
+            Permanently delete <InlineCode>{workspace?.name}</InlineCode>?
           </>
         ),
       });

src-web/hooks/usePrompt.ts

@@ -0,0 +1,30 @@
+import type { DialogProps } from '../components/core/Dialog';
+import { useDialog } from '../components/DialogContext';
+import type { PromptProps } from './Prompt';
+import { Prompt } from './Prompt';
+
+export function usePrompt() {
+  const dialog = useDialog();
+  return ({
+    title,
+    description,
+    name,
+    label,
+    defaultValue,
+  }: {
+    title: DialogProps['title'];
+    description?: DialogProps['description'];
+    name: PromptProps['name'];
+    label: PromptProps['label'];
+    defaultValue: PromptProps['defaultValue'];
+  }) =>
+    new Promise((onResult: PromptProps['onResult']) => {
+      dialog.show({
+        title,
+        description,
+        hideX: true,
+        size: 'sm',
+        render: ({ hide }) => Prompt({ onHide: hide, onResult, name, label, defaultValue }),
+      });
+    });
+}

src-web/hooks/useUpdateWorkspace.ts

@@ -0,0 +1,29 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { invoke } from '@tauri-apps/api';
+import type { Workspace } from '../lib/models';
+import { getWorkspace } from '../lib/store';
+import { workspacesQueryKey } from './useWorkspaces';
+
+export function useUpdateWorkspace(id: string | null) {
+  const queryClient = useQueryClient();
+  return useMutation<void, unknown, Partial<Workspace> | ((w: Workspace) => Workspace)>({
+    mutationFn: async (v) => {
+      const workspace = await getWorkspace(id);
+      if (workspace == null) {
+        throw new Error("Can't update a null workspace");
+      }
+
+      const newWorkspace = typeof v === 'function' ? v(workspace) : { ...workspace, ...v };
+      await invoke('update_workspace', { workspace: newWorkspace });
+    },
+    onMutate: async (v) => {
+      const workspace = await getWorkspace(id);
+      if (workspace === null) return;
+
+      const newWorkspace = typeof v === 'function' ? v(workspace) : { ...workspace, ...v };
+      queryClient.setQueryData<Workspace[]>(workspacesQueryKey(workspace), (workspaces) =>
+        (workspaces ?? []).map((w) => (w.id === newWorkspace.id ? newWorkspace : w)),
+      );
+    },
+  });
+}