Move stuff around

.github/workflows/artifacts.yml

@@ -10,8 +10,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-#        platform: [ ubuntu-latest, macos-latest, windows-latest ]
-        platform: [ macos-latest ]
+        platform: [ ubuntu-latest, macos-latest, windows-latest ]
 
     steps:
       - uses: actions/checkout@v3

src-tauri/tauri.conf.json

@@ -8,7 +8,7 @@
   },
   "package": {
     "productName": "Yaak",
-    "version": "0.0.1"
+    "version": "0.0.2"
   },
   "tauri": {
     "windows": [

src-web/components/App.tsx

@@ -2,12 +2,12 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { listen } from '@tauri-apps/api/event';
 import { MotionConfig } from 'framer-motion';
 import { HelmetProvider } from 'react-helmet-async';
-import { AppRouter } from './components/AppRouter';
-import { requestsQueryKey } from './hooks/useRequests';
-import { responsesQueryKey } from './hooks/useResponses';
-import { DEFAULT_FONT_SIZE } from './lib/constants';
-import type { HttpRequest, HttpResponse } from './lib/models';
-import { convertDates } from './lib/models';
+import { AppRouter } from './AppRouter';
+import { requestsQueryKey } from '../hooks/useRequests';
+import { responsesQueryKey } from '../hooks/useResponses';
+import { DEFAULT_FONT_SIZE } from '../lib/constants';
+import type { HttpRequest, HttpResponse } from '../lib/models';
+import { convertDates } from '../lib/models';
 
 const queryClient = new QueryClient();
 

src-web/components/AppRouter.tsx

@@ -1,8 +1,8 @@
 import { lazy, Suspense } from 'react';
 import { createBrowserRouter, RouterProvider } from 'react-router-dom';
 
-const Workspaces = lazy(() => import('../pages/Workspaces'));
-const Workspace = lazy(() => import('../pages/Workspace'));
+const Workspaces = lazy(() => import('./Workspaces'));
+const Workspace = lazy(() => import('./Workspace'));
 const RouteError = lazy(() => import('./RouteError'));
 
 const router = createBrowserRouter([

src-web/components/Colors.tsx

@@ -1,104 +0,0 @@
-import classnames from 'classnames';
-import { HStack, VStack } from './Stacks';
-
-export function Colors() {
-  return (
-    <HStack>
-      <VStack>
-        <Color className="bg-gray-50" />
-        <Color className="bg-gray-100" />
-        <Color className="bg-gray-200" />
-        <Color className="bg-gray-300" />
-        <Color className="bg-gray-400" />
-        <Color className="bg-gray-500" />
-        <Color className="bg-gray-600" />
-        <Color className="bg-gray-700" />
-        <Color className="bg-gray-800" />
-        <Color className="bg-gray-900" />
-        <Color className="bg-gray-950" />
-      </VStack>
-      <VStack>
-        <Color className="bg-red-50" />
-        <Color className="bg-red-100" />
-        <Color className="bg-red-200" />
-        <Color className="bg-red-300" />
-        <Color className="bg-red-400" />
-        <Color className="bg-red-500" />
-        <Color className="bg-red-600" />
-        <Color className="bg-red-700" />
-        <Color className="bg-red-800" />
-        <Color className="bg-red-900" />
-        <Color className="bg-red-950" />
-      </VStack>
-      <VStack>
-        <Color className="bg-orange-50" />
-        <Color className="bg-orange-100" />
-        <Color className="bg-orange-200" />
-        <Color className="bg-orange-300" />
-        <Color className="bg-orange-400" />
-        <Color className="bg-orange-500" />
-        <Color className="bg-orange-600" />
-        <Color className="bg-orange-700" />
-        <Color className="bg-orange-800" />
-        <Color className="bg-orange-900" />
-        <Color className="bg-orange-950" />
-      </VStack>
-      <VStack>
-        <Color className="bg-yellow-50" />
-        <Color className="bg-yellow-100" />
-        <Color className="bg-yellow-200" />
-        <Color className="bg-yellow-300" />
-        <Color className="bg-yellow-400" />
-        <Color className="bg-yellow-500" />
-        <Color className="bg-yellow-600" />
-        <Color className="bg-yellow-700" />
-        <Color className="bg-yellow-800" />
-        <Color className="bg-yellow-900" />
-        <Color className="bg-yellow-950" />
-      </VStack>
-      <VStack>
-        <Color className="bg-green-50" />
-        <Color className="bg-green-100" />
-        <Color className="bg-green-200" />
-        <Color className="bg-green-300" />
-        <Color className="bg-green-400" />
-        <Color className="bg-green-500" />
-        <Color className="bg-green-600" />
-        <Color className="bg-green-700" />
-        <Color className="bg-green-800" />
-        <Color className="bg-green-900" />
-        <Color className="bg-green-950" />
-      </VStack>
-      <VStack>
-        <Color className="bg-blue-50" />
-        <Color className="bg-blue-100" />
-        <Color className="bg-blue-200" />
-        <Color className="bg-blue-300" />
-        <Color className="bg-blue-400" />
-        <Color className="bg-blue-500" />
-        <Color className="bg-blue-600" />
-        <Color className="bg-blue-700" />
-        <Color className="bg-blue-800" />
-        <Color className="bg-blue-900" />
-        <Color className="bg-blue-950" />
-      </VStack>
-      <VStack>
-        <Color className="bg-violet-50" />
-        <Color className="bg-violet-100" />
-        <Color className="bg-violet-200" />
-        <Color className="bg-violet-300" />
-        <Color className="bg-violet-400" />
-        <Color className="bg-violet-500" />
-        <Color className="bg-violet-600" />
-        <Color className="bg-violet-700" />
-        <Color className="bg-violet-800" />
-        <Color className="bg-violet-900" />
-        <Color className="bg-violet-950" />
-      </VStack>
-    </HStack>
-  );
-}
-
-function Color({ className }: { className: string }) {
-  return <div className={classnames(className, 'w-full h-5')} />;
-}

src-web/components/Grid.tsx

@@ -1,48 +0,0 @@
-import classnames from 'classnames';
-import type { ReactNode } from 'react';
-
-const colsClasses: Record<string | number, string> = {
-  none: 'grid-cols-none',
-  1: 'grid-cols-1',
-  2: 'grid-cols-2',
-  3: 'grid-cols-3',
-  11: 'grid-cols-11',
-};
-
-const rowsClasses = {
-  none: 'grid-rows-none',
-  1: 'grid-rows-1',
-  2: 'grid-rows-2',
-  3: 'grid-rows-3',
-  11: 'grid-rows-11',
-};
-
-const gapClasses = {
-  0: 'gap-0',
-  1: 'gap-1',
-  2: 'gap-2',
-  3: 'gap-3',
-};
-
-interface Props {
-  rows?: keyof typeof rowsClasses;
-  cols?: keyof typeof colsClasses;
-  gap?: keyof typeof gapClasses;
-  className?: string;
-  children?: ReactNode;
-}
-
-export function Grid({ className, cols, gap, children }: Props) {
-  return (
-    <div
-      className={classnames(
-        className,
-        'grid w-full',
-        cols && colsClasses[cols],
-        gap && gapClasses[gap],
-      )}
-    >
-      {children}
-    </div>
-  );
-}

src-web/components/HeaderEditor.tsx

@@ -2,9 +2,9 @@ import classnames from 'classnames';
 import { useEffect, useState } from 'react';
 import { useUpdateRequest } from '../hooks/useUpdateRequest';
 import type { HttpHeader, HttpRequest } from '../lib/models';
-import { IconButton } from './IconButton';
-import { Input } from './Input';
-import { VStack } from './Stacks';
+import { IconButton } from './core/IconButton';
+import { Input } from './core/Input';
+import { VStack } from './core/Stacks';
 
 interface Props {
   request: HttpRequest;

src-web/components/RequestPane.tsx

@@ -2,9 +2,9 @@ import classnames from 'classnames';
 import { useActiveRequest } from '../hooks/useActiveRequest';
 import { useSendRequest } from '../hooks/useSendRequest';
 import { useUpdateRequest } from '../hooks/useUpdateRequest';
-import { Editor } from './Editor';
+import { Editor } from './core/Editor';
 import { HeaderEditor } from './HeaderEditor';
-import { TabContent, Tabs } from './Tabs';
+import { TabContent, Tabs } from './core/Tabs/Tabs';
 import { UrlBar } from './UrlBar';
 
 interface Props {

src-web/components/ResponsePane.tsx

@@ -4,13 +4,13 @@ import { useDeleteResponses } from '../hooks/useDeleteResponses';
 import { useDeleteResponse } from '../hooks/useResponseDelete';
 import { useResponses } from '../hooks/useResponses';
 import { tryFormatJson } from '../lib/formatters';
-import { Dropdown } from './Dropdown';
-import { Editor } from './Editor';
-import { Icon } from './Icon';
-import { IconButton } from './IconButton';
-import { HStack } from './Stacks';
-import { StatusColor } from './StatusColor';
-import { Webview } from './Webview';
+import { Dropdown } from './core/Dropdown';
+import { Editor } from './core/Editor';
+import { Icon } from './core/Icon';
+import { IconButton } from './core/IconButton';
+import { HStack } from './core/Stacks';
+import { StatusColor } from './core/StatusColor';
+import { Webview } from './core/Webview';
 
 interface Props {
   className?: string;

src-web/components/RouteError.tsx

@@ -1,7 +1,7 @@
 import { useRouteError } from 'react-router-dom';
-import { ButtonLink } from './ButtonLink';
-import { Heading } from './Heading';
-import { VStack } from './Stacks';
+import { ButtonLink } from './core/ButtonLink';
+import { Heading } from './core/Heading';
+import { VStack } from './core/Stacks';
 
 export default function RouteError() {
   const error = useRouteError();

src-web/components/Sidebar.tsx

@@ -6,10 +6,10 @@ import { useRequests } from '../hooks/useRequests';
 import { useTheme } from '../hooks/useTheme';
 import { useUpdateRequest } from '../hooks/useUpdateRequest';
 import type { HttpRequest } from '../lib/models';
-import { ButtonLink } from './ButtonLink';
-import { IconButton } from './IconButton';
-import { HStack, VStack } from './Stacks';
-import { WindowDragRegion } from './WindowDragRegion';
+import { ButtonLink } from './core/ButtonLink';
+import { IconButton } from './core/IconButton';
+import { HStack, VStack } from './core/Stacks';
+import { WindowDragRegion } from './core/WindowDragRegion';
 
 interface Props {
   className?: string;

src-web/components/UrlBar.tsx

@@ -1,7 +1,7 @@
-import { Button } from './Button';
-import { DropdownMenuRadio } from './Dropdown';
-import { IconButton } from './IconButton';
-import { Input } from './Input';
+import { Button } from './core/Button';
+import { DropdownMenuRadio } from './core/Dropdown';
+import { IconButton } from './core/IconButton';
+import { Input } from './core/Input';
 
 interface Props {
   sendRequest: () => void;

src-web/components/Workspace.tsx

@@ -1,10 +1,10 @@
 import classnames from 'classnames';
 import { useWindowSize } from 'react-use';
-import { RequestPane } from '../components/RequestPane';
-import { ResponsePane } from '../components/ResponsePane';
-import { Sidebar } from '../components/Sidebar';
-import { HStack } from '../components/Stacks';
-import { WindowDragRegion } from '../components/WindowDragRegion';
+import { RequestPane } from './RequestPane';
+import { ResponsePane } from './ResponsePane';
+import { Sidebar } from './Sidebar';
+import { HStack } from './core/Stacks';
+import { WindowDragRegion } from './core/WindowDragRegion';
 import { useActiveRequest } from '../hooks/useActiveRequest';
 
 export default function Workspace() {

src-web/components/Workspaces.tsx

@@ -1,6 +1,6 @@
-import { ButtonLink } from '../components/ButtonLink';
-import { Heading } from '../components/Heading';
-import { VStack } from '../components/Stacks';
+import { ButtonLink } from './core/ButtonLink';
+import { Heading } from './core/Heading';
+import { VStack } from './core/Stacks';
 import { useWorkspaces } from '../hooks/useWorkspaces';
 
 export default function Workspaces() {

src-web/components/core/Editor/Editor.tsx

@@ -6,7 +6,7 @@ import { EditorView } from 'codemirror';
 import { formatSdl } from 'format-graphql';
 import { useEffect, useRef } from 'react';
 import { useDebounce, useUnmount } from 'react-use';
-import { debounce } from '../../lib/debounce';
+import { debounce } from '../../../lib/debounce';
 import { IconButton } from '../IconButton';
 import './Editor.css';
 import { baseExtensions, getLanguageExtension, multiLineExtensions } from './extensions';

src-web/components/core/Editor/autocomplete.ts

@@ -1,6 +1,6 @@
 import { closeCompletion, startCompletion } from '@codemirror/autocomplete';
 import { EditorView } from 'codemirror';
-import { debounce } from '../../lib/debounce';
+import { debounce } from '../../../lib/debounce';
 
 /*
  * Debounce autocomplete until user stops typing for `millis` milliseconds.

src-web/components/core/IconButton.tsx

@@ -1,5 +1,5 @@
 import classnames from 'classnames';
-import { forwardRef } from "react";
+import { forwardRef } from 'react';
 import type { ButtonProps } from './Button';
 import { Button } from './Button';
 import type { IconProps } from './Icon';

src-web/components/core/Tabs/Tabs.tsx

@@ -2,9 +2,9 @@ import * as T from '@radix-ui/react-tabs';
 import classnames from 'classnames';
 import type { ReactNode } from 'react';
 import { useState } from 'react';
-import { Button } from './Button';
-import { ScrollArea } from './ScrollArea';
-import { HStack } from './Stacks';
+import { Button } from '../Button';
+import { ScrollArea } from '../ScrollArea';
+import { HStack } from '../Stacks';
 
 import './Tabs.css';
 
@@ -27,7 +27,10 @@ export function Tabs({ defaultValue, label, children, tabs, className, tabListCl
     >
       <T.List
         aria-label={label}
-        className={classnames(tabListClassName, 'h-auto flex items-center overflow-x-auto mb-1 pb-1')}
+        className={classnames(
+          tabListClassName,
+          'h-auto flex items-center overflow-x-auto mb-1 pb-1',
+        )}
       >
         {/*<ScrollArea className="w-full pb-2">*/}
         <HStack space={1}>

src-web/main.tsx

@@ -1,5 +1,5 @@
 import ReactDOM from 'react-dom/client';
-import { App } from './App';
+import { App } from './components/App';
 import { setAppearance } from './lib/theme/window';
 import './main.css';