Request body is now an object

src-web/components/App.tsx

@@ -1,4 +1,5 @@
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import { MotionConfig } from 'framer-motion';
 import { Suspense } from 'react';
 import { DndProvider } from 'react-dnd';
@@ -23,10 +24,10 @@ export function App() {
       <MotionConfig transition={{ duration: 0.1 }}>
         <HelmetProvider>
           <DndProvider backend={HTML5Backend}>
-              <Suspense>
-                <AppRouter />
-                {/*<ReactQueryDevtools initialIsOpen={false} />*/}
-              </Suspense>
+            <Suspense>
+              <AppRouter />
+              <ReactQueryDevtools initialIsOpen={false} />
+            </Suspense>
           </DndProvider>
         </HelmetProvider>
       </MotionConfig>

src-web/components/RequestPane.tsx

@@ -133,8 +133,8 @@ export const RequestPane = memo(function RequestPane({ style, fullHeight, classN
     [activeRequest, updateRequest],
   );
 
-  const handleBodyChange = useCallback(
-    (body: string) => updateRequest.mutate({ body }),
+  const handleBodyTextChange = useCallback(
+    (text: string) => updateRequest.mutate({ body: { text } }),
     [updateRequest],
   );
   const handleHeadersChange = useCallback(
@@ -211,9 +211,9 @@ export const RequestPane = memo(function RequestPane({ style, fullHeight, classN
                   placeholder="..."
                   className="!bg-gray-50"
                   heightMode={fullHeight ? 'full' : 'auto'}
-                  defaultValue={activeRequest.body ?? ''}
+                  defaultValue={`${activeRequest?.body?.text}` ?? ''}
                   contentType="application/json"
-                  onChange={handleBodyChange}
+                  onChange={handleBodyTextChange}
                   format={(v) => tryFormatJson(v)}
                 />
               ) : activeRequest.bodyType === BODY_TYPE_XML ? (
@@ -224,17 +224,17 @@ export const RequestPane = memo(function RequestPane({ style, fullHeight, classN
                   placeholder="..."
                   className="!bg-gray-50"
                   heightMode={fullHeight ? 'full' : 'auto'}
-                  defaultValue={activeRequest.body ?? ''}
+                  defaultValue={`${activeRequest?.body?.text}` ?? ''}
                   contentType="text/xml"
-                  onChange={handleBodyChange}
+                  onChange={handleBodyTextChange}
                 />
               ) : activeRequest.bodyType === BODY_TYPE_GRAPHQL ? (
                 <GraphQLEditor
                   forceUpdateKey={forceUpdateKey}
                   baseRequest={activeRequest}
                   className="!bg-gray-50"
-                  defaultValue={activeRequest?.body ?? ''}
-                  onChange={handleBodyChange}
+                  defaultValue={`${activeRequest?.body?.text}` ?? ''}
+                  onChange={handleBodyTextChange}
                 />
               ) : (
                 <EmptyStateText>No Body</EmptyStateText>

src-web/components/WorkspaceActionsDropdown.tsx

@@ -2,7 +2,6 @@ import { invoke } from '@tauri-apps/api';
 import classNames from 'classnames';
 import { memo, useMemo } from 'react';
 import { useActiveWorkspace } from '../hooks/useActiveWorkspace';
-import { useAlert } from '../hooks/useAlert';
 import { useAppRoutes } from '../hooks/useAppRoutes';
 import { useCreateWorkspace } from '../hooks/useCreateWorkspace';
 import { useDeleteWorkspace } from '../hooks/useDeleteWorkspace';
@@ -39,7 +38,6 @@ export const WorkspaceActionsDropdown = memo(function WorkspaceActionsDropdown({
   const { appearance, toggleAppearance } = useTheme();
   const dialog = useDialog();
   const prompt = usePrompt();
-  const alert = useAlert();
   const routes = useAppRoutes();
 
   const items: DropdownItem[] = useMemo(() => {

src-web/components/responseViewers/TextViewer.tsx

@@ -1,4 +1,3 @@
-import { w } from '@tauri-apps/api/clipboard-79413165';
 import { useResponseBodyText } from '../../hooks/useResponseBodyText';
 import { useResponseContentType } from '../../hooks/useResponseContentType';
 import { tryFormatJson } from '../../lib/formatters';