Add more info to settings

plugins/filter-jsonpath/vite.config.js

@@ -8,6 +8,6 @@ export default defineConfig({
       fileName: 'index',
       formats: ['es'],
     },
-    outDir: resolve(__dirname, '../../src-tauri/plugins/build/filter-jsonpath'),
+    outDir: resolve(__dirname, '../../src-tauri/plugins/filter-jsonpath'),
   },
 });

plugins/filter-xpath/vite.config.js

@@ -8,6 +8,6 @@ export default defineConfig({
       fileName: 'index',
       formats: ['es'],
     },
-    outDir: resolve(__dirname, '../../src-tauri/plugins/build/filter-xpath'),
+    outDir: resolve(__dirname, '../../src-tauri/plugins/filter-xpath'),
   },
 });

plugins/importer-insomnia/vite.config.js

@@ -8,6 +8,6 @@ export default defineConfig({
       fileName: 'index',
       formats: ['es'],
     },
-    outDir: resolve(__dirname, '../../src-tauri/plugins/build/importer-insomnia'),
+    outDir: resolve(__dirname, '../../src-tauri/plugins/importer-insomnia'),
   },
 });

plugins/importer-postman/vite.config.js

@@ -8,6 +8,6 @@ export default defineConfig({
       fileName: 'index',
       formats: ['es'],
     },
-    outDir: resolve(__dirname, '../../src-tauri/plugins/build/importer-postman'),
+    outDir: resolve(__dirname, '../../src-tauri/plugins/importer-postman'),
   },
 });

plugins/importer-yaak/vite.config.js

@@ -8,6 +8,6 @@ export default defineConfig({
       fileName: 'index',
       formats: ['es'],
     },
-    outDir: resolve(__dirname, '../../src-tauri/plugins/build/importer-yaak'),
+    outDir: resolve(__dirname, '../../src-tauri/plugins/importer-yaak'),
   },
 });

src-tauri/Cargo.toml

@@ -36,6 +36,7 @@ serde_json = { version = "1.0.111", features = ["raw_value"] }
 sqlx = { version = "0.7.3", features = ["sqlite", "runtime-tokio-rustls", "json", "chrono", "time"] }
 tauri = { version = "1.5.2", features = [
     "config-toml",
+    "path-all",
     "devtools",
     "dialog-open",
     "dialog-save",

src-tauri/tauri.conf.json

@@ -47,6 +47,9 @@
         "all": false,
         "open": true,
         "save": true
+      },
+      "path": {
+        "all": true
       }
     },
     "bundle": {

src-web/components/SettingsDialog.tsx

@@ -1,4 +1,5 @@
 import { useActiveWorkspace } from '../hooks/useActiveWorkspace';
+import { useAppInfo } from '../hooks/useAppInfo';
 import { useSettings } from '../hooks/useSettings';
 import { useUpdateSettings } from '../hooks/useUpdateSettings';
 import { useUpdateWorkspace } from '../hooks/useUpdateWorkspace';
@@ -14,6 +15,7 @@ export const SettingsDialog = () => {
   const updateWorkspace = useUpdateWorkspace(workspace?.id ?? null);
   const settings = useSettings();
   const updateSettings = useUpdateSettings();
+  const appInfo = useAppInfo();
 
   if (settings == null || workspace == null) {
     return null;
@@ -25,7 +27,6 @@ export const SettingsDialog = () => {
         name="appearance"
         label="Appearance"
         labelPosition="left"
-        labelClassName="w-1/3"
         size="sm"
         value={settings.appearance}
         onChange={(appearance) => updateSettings.mutateAsync({ ...settings, appearance })}
@@ -49,7 +50,6 @@ export const SettingsDialog = () => {
         name="updateChannel"
         label="Update Channel"
         labelPosition="left"
-        labelClassName="w-1/3"
         size="sm"
         value={settings.updateChannel}
         onChange={(updateChannel) => updateSettings.mutateAsync({ ...settings, updateChannel })}
@@ -80,8 +80,6 @@ export const SettingsDialog = () => {
           label="Request Timeout (ms)"
           placeholder="0"
           labelPosition="left"
-          labelClassName="w-1/3"
-          containerClassName="col-span-2"
           defaultValue={`${workspace.settingRequestTimeout}`}
           validate={(value) => parseInt(value) >= 0}
           onChange={(v) => updateWorkspace.mutateAsync({ settingRequestTimeout: parseInt(v) || 0 })}
@@ -103,6 +101,28 @@ export const SettingsDialog = () => {
           }
         />
       </VStack>
+
+      <Separator className="my-4" />
+
+      <Heading size={2}>App Info</Heading>
+      <table className="text-sm w-full">
+        <tbody>
+          <tr>
+            <td className="h-xs pr-3">Version</td>
+            <td className="h-xs text-xs font-mono select-all cursor-text">
+              {appInfo.data?.version}
+            </td>
+          </tr>
+          {appInfo.data && (
+            <tr>
+              <td className="h-xs pr-3 whitespace-nowrap">Data Directory</td>
+              <td className="h-xs text-xs font-mono select-all cursor-text break-all min-w-0">
+                {appInfo.data.appDataDir}
+              </td>
+            </tr>
+          )}
+        </tbody>
+      </table>
     </VStack>
   );
 };

src-web/components/SettingsDropdown.tsx

@@ -1,7 +1,7 @@
 import { invoke, shell } from '@tauri-apps/api';
 import { useRef, useState } from 'react';
 import { useAlert } from '../hooks/useAlert';
-import { useAppVersion } from '../hooks/useAppVersion';
+import { useAppInfo } from '../hooks/useAppInfo';
 import { useExportData } from '../hooks/useExportData';
 import { useImportData } from '../hooks/useImportData';
 import { useListenToTauriEvent } from '../hooks/useListenToTauriEvent';
@@ -18,7 +18,7 @@ import { SettingsDialog } from './SettingsDialog';
 export function SettingsDropdown() {
   const importData = useImportData();
   const exportData = useExportData();
-  const appVersion = useAppVersion();
+  const appInfo = useAppInfo();
   const dropdownRef = useRef<DropdownRef>(null);
   const dialog = useDialog();
   const alert = useAlert();
@@ -96,7 +96,7 @@ export function SettingsDropdown() {
           leftSlot: <Icon icon="folderOutput" />,
           onSelect: () => exportData.mutate(),
         },
-        { type: 'separator', label: `Yaak v${appVersion.data}` },
+        { type: 'separator', label: `Yaak v${appInfo.data?.version}` },
         {
           key: 'update-check',
           label: 'Check for Updates',
@@ -126,7 +126,7 @@ export function SettingsDropdown() {
           variant: showChangelog ? 'notify' : 'default',
           leftSlot: <Icon icon="cake" />,
           rightSlot: <Icon icon="externalLink" />,
-          onSelect: () => shell.open(`https://yaak.app/changelog/${appVersion.data}`),
+          onSelect: () => shell.open(`https://yaak.app/changelog/${appInfo.data?.version}`),
         },
       ]}
     >

src-web/components/core/Dialog.tsx

@@ -2,7 +2,7 @@ import classNames from 'classnames';
 import { motion } from 'framer-motion';
 import type { ReactNode } from 'react';
 import { useMemo } from 'react';
-import { useKeyPressEvent } from 'react-use';
+import { useHotKey } from '../../hooks/useHotKey';
 import { Overlay } from '../Overlay';
 import { Heading } from './Heading';
 import { IconButton } from './IconButton';
@@ -34,10 +34,7 @@ export function Dialog({
     [description],
   );
 
-  useKeyPressEvent('Escape', (e) => {
+  useHotKey('popup.close', onClose);
-    e.preventDefault();
-    onClose();
-  });
 
   return (
     <Overlay open={open} onClose={onClose} portalName="dialog">

src-web/components/core/Dropdown.tsx

@@ -237,7 +237,7 @@ const Menu = forwardRef<Omit<DropdownRef, 'open' | 'isOpen' | 'toggle'>, MenuPro
     [handleClose],
   );
 
-  useHotKey('dropdown.close', handleClose);
+  useHotKey('popup.close', handleClose);
 
   const handlePrev = useCallback(() => {
     setSelectedIndex((currIndex) => {

src-web/hooks/useAppInfo.ts

@@ -0,0 +1,10 @@
+import { useQuery } from '@tanstack/react-query';
+import * as app from '@tauri-apps/api/app';
+import * as path from '@tauri-apps/api/path';
+
+export function useAppInfo() {
+  return useQuery(['appInfo'], async () => {
+    const [version, appDataDir] = await Promise.all([app.getVersion(), path.appDataDir()]);
+    return { version, appDataDir };
+  });
+}

src-web/hooks/useAppVersion.ts

@@ -1,6 +0,0 @@
-import { useQuery } from '@tanstack/react-query';
-import { getVersion } from '@tauri-apps/api/app';
-
-export function useAppVersion() {
-  return useQuery<string>(['appVersion'], getVersion);
-}

src-web/hooks/useHotKey.ts

@@ -5,7 +5,7 @@ import { debounce } from '../lib/debounce';
 import { useOsInfo } from './useOsInfo';
 
 export type HotkeyAction =
-  | 'dropdown.close'
+  | 'popup.close'
   | 'environmentEditor.toggle'
   | 'hotkeys.showHelp'
   | 'grpc_request.send'
@@ -20,7 +20,7 @@ export type HotkeyAction =
   | 'urlBar.focus';
 
 const hotkeys: Record<HotkeyAction, string[]> = {
-  'dropdown.close': ['Escape'],
+  'popup.close': ['Escape'],
   'environmentEditor.toggle': ['CmdCtrl+Shift+e'],
   'grpc_request.send': ['CmdCtrl+Enter', 'CmdCtrl+r'],
   'hotkeys.showHelp': ['CmdCtrl+Shift+/'],
@@ -36,7 +36,7 @@ const hotkeys: Record<HotkeyAction, string[]> = {
 };
 
 const hotkeyLabels: Record<HotkeyAction, string> = {
-  'dropdown.close': 'Close Dropdown',
+  'popup.close': 'Close Dropdown',
   'environmentEditor.toggle': 'Edit Environments',
   'grpc_request.send': 'Send Message',
   'hotkeys.showHelp': 'Show Keyboard Shortcuts',