diff --git a/src-tauri/src/main.rs b/src-tauri/src/main.rs index 114a5c06..3dcf7492 100644 --- a/src-tauri/src/main.rs +++ b/src-tauri/src/main.rs @@ -405,6 +405,7 @@ async fn create_request( workspace_id: &str, name: &str, sort_priority: f64, + folder_id: Option<&str>, window: Window, db_instance: State<'_, Mutex>>, ) -> Result { @@ -415,6 +416,7 @@ async fn create_request( workspace_id: workspace_id.to_string(), name: name.to_string(), method: "GET".to_string(), + folder_id: folder_id.map(|s| s.to_string()), sort_priority, ..Default::default() }, diff --git a/src-web/components/Sidebar.tsx b/src-web/components/Sidebar.tsx index 9f720a22..ea0faf57 100644 --- a/src-web/components/Sidebar.tsx +++ b/src-web/components/Sidebar.tsx @@ -8,8 +8,10 @@ import { useActiveEnvironmentId } from '../hooks/useActiveEnvironmentId'; import { useActiveRequestId } from '../hooks/useActiveRequestId'; import { useActiveWorkspace } from '../hooks/useActiveWorkspace'; import { useAppRoutes } from '../hooks/useAppRoutes'; +import { useCreateFolder } from '../hooks/useCreateFolder'; import { useCreateRequest } from '../hooks/useCreateRequest'; import { useDeleteAnyRequest } from '../hooks/useDeleteAnyRequest'; +import { useDeleteFolder } from '../hooks/useDeleteFolder'; import { useFolders } from '../hooks/useFolders'; import { useLatestResponse } from '../hooks/useLatestResponse'; import { useListenToTauriEvent } from '../hooks/useListenToTauriEvent'; @@ -20,7 +22,9 @@ import { useUpdateAnyRequest } from '../hooks/useUpdateAnyRequest'; import { useUpdateRequest } from '../hooks/useUpdateRequest'; import type { Folder, HttpRequest, Workspace } from '../lib/models'; import { isResponseLoading } from '../lib/models'; +import { Dropdown } from './core/Dropdown'; import { Icon } from './core/Icon'; +import { IconButton } from './core/IconButton'; import { VStack } from './core/Stacks'; import { StatusTag } from './core/StatusTag'; import { DropMarker } from './DropMarker'; @@ -386,7 +390,17 @@ function SidebarItems({ handleDragStart, }: SidebarItemsProps) { return ( - + 0 && 'border-l border-highlight', + tree.depth === 0 && 'ml-0', + tree.depth >= 1 && 'ml-[1.3em]', + )} + > {tree.children.map((child, i) => ( {hoveredIndex === i && hoveredTree?.item.id === tree.item.id && ( @@ -403,7 +417,6 @@ function SidebarItems({ onDragStart={handleDragStart} useProminentStyles={focused} collapsed={collapsed} - className={classNames(tree.depth > 0 && 'border-l border-highlight ml-5')} > {child.item.model === 'folder' && !collapsed[child.item.id] && @@ -461,6 +474,9 @@ const SidebarItem = forwardRef(function SidebarItem( }: SidebarItemProps, ref: ForwardedRef, ) { + const createRequest = useCreateRequest(); + const createFolder = useCreateFolder(); + const deleteRequest = useDeleteFolder(itemId); const latestResponse = useLatestResponse(itemId); const updateRequest = useUpdateRequest(itemId); const [editing, setEditing] = useState(false); @@ -515,7 +531,37 @@ const SidebarItem = forwardRef(function SidebarItem( return (
  • -
    +
    + {itemModel === 'folder' && ( + createRequest.mutate({ folderId: itemId, sortPriority: -1 }), + }, + { + key: 'createFolder', + label: 'New Folder', + onSelect: () => createFolder.mutate({ folderId: itemId, sortPriority: -1 }), + }, + { type: 'separator' }, + { + key: 'deleteFolder', + label: 'Delete', + variant: 'danger', + onSelect: () => deleteRequest.mutate(), + }, + ]} + > + + + )}