Grpc layout use new models

src-web/hooks/useDeleteAnyRequest.tsx

@@ -4,7 +4,7 @@ import { InlineCode } from '../components/core/InlineCode';
 import { trackEvent } from '../lib/analytics';
 import { fallbackRequestName } from '../lib/fallbackRequestName';
 import type { HttpRequest } from '../lib/models';
-import { getRequest } from '../lib/store';
+import { getHttpRequest } from '../lib/store';
 import { useConfirm } from './useConfirm';
 import { httpRequestsQueryKey } from './useHttpRequests';
 import { responsesQueryKey } from './useResponses';
@@ -15,7 +15,7 @@ export function useDeleteAnyRequest() {
 
   return useMutation<HttpRequest | null, string, string>({
     mutationFn: async (id) => {
-      const request = await getRequest(id);
+      const request = await getHttpRequest(id);
       const confirmed = await confirm({
         id: 'delete-request',
         title: 'Delete Request',

src-web/hooks/useGrpc.ts

@@ -4,6 +4,7 @@ import type { UnlistenFn } from '@tauri-apps/api/event';
 import { emit, listen } from '@tauri-apps/api/event';
 import { useEffect, useRef, useState } from 'react';
 import { tryFormatJson } from '../lib/formatters';
+import type { GrpcRequest } from '../lib/models';
 import { useKeyValue } from './useKeyValue';
 
 interface ReflectResponseService {
@@ -31,9 +32,9 @@ export function useGrpc(url: string | null, requestId: string | null) {
     unlisten.current?.();
   }, [requestId]);
 
-  const unary = useMutation<string, string, { service: string; method: string; message: string }>({
+  const unary = useMutation<string, string, GrpcRequest>({
     mutationKey: ['grpc_unary', url],
-    mutationFn: async ({ service, method, message }) => {
+    mutationFn: async ({ service, method, message, url }) => {
       if (url === null) throw new Error('No URL provided');
       return (await invoke('cmd_grpc_call_unary', {
         endpoint: url,
@@ -44,13 +45,9 @@ export function useGrpc(url: string | null, requestId: string | null) {
     },
   });
 
-  const serverStreaming = useMutation<
-    void,
-    string,
-    { service: string; method: string; message: string }
-  >({
+  const serverStreaming = useMutation<void, string, GrpcRequest>({
     mutationKey: ['grpc_server_streaming', url],
-    mutationFn: async ({ service, method, message }) => {
+    mutationFn: async ({ service, method, message, url }) => {
       if (url === null) throw new Error('No URL provided');
       await messages.set([
         {
@@ -79,13 +76,9 @@ export function useGrpc(url: string | null, requestId: string | null) {
     },
   });
 
-  const bidiStreaming = useMutation<
-    void,
-    string,
-    { service: string; method: string; message: string }
-  >({
+  const bidiStreaming = useMutation<void, string, GrpcRequest>({
     mutationKey: ['grpc_bidi_streaming', url],
-    mutationFn: async ({ service, method, message }) => {
+    mutationFn: async ({ service, method, message, url }) => {
       if (url === null) throw new Error('No URL provided');
       const id: string = await invoke('cmd_grpc_bidi_streaming', {
         endpoint: url,
@@ -93,7 +86,7 @@ export function useGrpc(url: string | null, requestId: string | null) {
         method,
         message,
       });
-      messages.set([
+      await messages.set([
         { type: 'info', message: `Started connection ${id}`, timestamp: new Date().toISOString() },
       ]);
       setActiveConnectionId(id);

src-web/hooks/useSendAnyRequest.ts

@@ -4,7 +4,7 @@ import { save } from '@tauri-apps/api/dialog';
 import slugify from 'slugify';
 import { trackEvent } from '../lib/analytics';
 import type { HttpResponse } from '../lib/models';
-import { getRequest } from '../lib/store';
+import { getHttpRequest } from '../lib/store';
 import { useActiveCookieJar } from './useActiveCookieJar';
 import { useActiveEnvironmentId } from './useActiveEnvironmentId';
 import { useAlert } from './useAlert';
@@ -15,7 +15,7 @@ export function useSendAnyRequest(options: { download?: boolean } = {}) {
   const { activeCookieJar } = useActiveCookieJar();
   return useMutation<HttpResponse | null, string, string | null>({
     mutationFn: async (id) => {
-      const request = await getRequest(id);
+      const request = await getHttpRequest(id);
       if (request == null) {
         return null;
       }

src-web/hooks/useUpdateAnyGrpcRequest.ts

@@ -0,0 +1,35 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+import { invoke } from '@tauri-apps/api';
+import type { GrpcRequest } from '../lib/models';
+import { getGrpcRequest } from '../lib/store';
+import { grpcRequestsQueryKey } from './useGrpcRequests';
+
+export function useUpdateAnyGrpcRequest() {
+  const queryClient = useQueryClient();
+
+  return useMutation<
+    void,
+    unknown,
+    { id: string; update: Partial<GrpcRequest> | ((r: GrpcRequest) => GrpcRequest) }
+  >({
+    mutationFn: async ({ id, update }) => {
+      const request = await getGrpcRequest(id);
+      if (request === null) {
+        throw new Error("Can't update a null request");
+      }
+
+      const patchedRequest =
+        typeof update === 'function' ? update(request) : { ...request, ...update };
+      await invoke('cmd_update_grpc_request', { request: patchedRequest });
+    },
+    onMutate: async ({ id, update }) => {
+      const request = await getGrpcRequest(id);
+      if (request === null) return;
+      const patchedRequest =
+        typeof update === 'function' ? update(request) : { ...request, ...update };
+      queryClient.setQueryData<GrpcRequest[]>(grpcRequestsQueryKey(request), (requests) =>
+        (requests ?? []).map((r) => (r.id === patchedRequest.id ? patchedRequest : r)),
+      );
+    },
+  });
+}

src-web/hooks/useUpdateAnyHttpRequest.ts

@@ -1,7 +1,7 @@
 import { useMutation, useQueryClient } from '@tanstack/react-query';
 import { invoke } from '@tauri-apps/api';
 import type { HttpRequest } from '../lib/models';
-import { getRequest } from '../lib/store';
+import { getHttpRequest } from '../lib/store';
 import { httpRequestsQueryKey } from './useHttpRequests';
 
 export function useUpdateAnyHttpRequest() {
@@ -13,7 +13,7 @@ export function useUpdateAnyHttpRequest() {
     { id: string; update: Partial<HttpRequest> | ((r: HttpRequest) => HttpRequest) }
   >({
     mutationFn: async ({ id, update }) => {
-      const request = await getRequest(id);
+      const request = await getHttpRequest(id);
       if (request === null) {
         throw new Error("Can't update a null request");
       }
@@ -23,7 +23,7 @@ export function useUpdateAnyHttpRequest() {
       await invoke('cmd_update_http_request', { request: patchedRequest });
     },
     onMutate: async ({ id, update }) => {
-      const request = await getRequest(id);
+      const request = await getHttpRequest(id);
       if (request === null) return;
       const patchedRequest =
         typeof update === 'function' ? update(request) : { ...request, ...update };

src-web/hooks/useUpdateGrpcRequest.ts

@@ -0,0 +1,10 @@
+import { useMutation } from '@tanstack/react-query';
+import type { GrpcRequest } from '../lib/models';
+import { useUpdateAnyGrpcRequest } from './useUpdateAnyGrpcRequest';
+
+export function useUpdateGrpcRequest(id: string | null) {
+  const updateAnyRequest = useUpdateAnyGrpcRequest();
+  return useMutation<void, unknown, Partial<GrpcRequest> | ((r: GrpcRequest) => GrpcRequest)>({
+    mutationFn: async (update) => updateAnyRequest.mutateAsync({ id: id ?? 'n/a', update }),
+  });
+}