Fix environment activation and setting active cookie jar

src-web/components/CommandPaletteDialog.tsx

@@ -30,6 +30,7 @@ import { useWorkspaces } from '../hooks/useWorkspaces';
 import { showDialog, toggleDialog } from '../lib/dialog';
 import { fallbackRequestName } from '../lib/fallbackRequestName';
 import { router } from '../lib/router';
+import { setWorkspaceSearchParams } from '../lib/setWorkspaceSearchParams';
 import { CookieDialog } from './CookieDialog';
 import { Button } from './core/Button';
 import { Heading } from './core/Heading';
@@ -57,7 +58,7 @@ const MAX_PER_GROUP = 8;
 export function CommandPaletteDialog({ onClose }: { onClose: () => void }) {
   const [command, setCommand] = useDebouncedState<string>('', 150);
   const [selectedItemKey, setSelectedItemKey] = useState<string | null>(null);
-  const [activeEnvironment, setActiveEnvironmentId] = useActiveEnvironment();
+  const activeEnvironment = useActiveEnvironment();
   const httpRequestActions = useHttpRequestActions();
   const workspaces = useWorkspaces();
   const { subEnvironments } = useEnvironments();
@@ -300,7 +301,7 @@ export function CommandPaletteDialog({ onClose }: { onClose: () => void }) {
       environmentGroup.items.push({
         key: `switch-environment-${e.id}`,
         label: e.name,
-        onSelect: () => setActiveEnvironmentId(e.id),
+        onSelect: () => setWorkspaceSearchParams({ environment_id: e.id }),
       });
     }
 
@@ -324,7 +325,6 @@ export function CommandPaletteDialog({ onClose }: { onClose: () => void }) {
     sortedRequests,
     sortedEnvironments,
     activeEnvironment?.id,
-    setActiveEnvironmentId,
     sortedWorkspaces,
   ]);
 

src-web/components/EnvironmentActionsDropdown.tsx

@@ -3,6 +3,7 @@ import { memo, useCallback, useMemo } from 'react';
 import { useActiveEnvironment } from '../hooks/useActiveEnvironment';
 import { useEnvironments } from '../hooks/useEnvironments';
 import { toggleDialog } from '../lib/dialog';
+import { setWorkspaceSearchParams } from '../lib/setWorkspaceSearchParams';
 import type { ButtonProps } from './core/Button';
 import { Button } from './core/Button';
 import type { DropdownItem } from './core/Dropdown';
@@ -19,7 +20,7 @@ export const EnvironmentActionsDropdown = memo(function EnvironmentActionsDropdo
   ...buttonProps
 }: Props) {
   const { subEnvironments, baseEnvironment } = useEnvironments();
-  const [activeEnvironment, setActiveEnvironmentId] = useActiveEnvironment();
+  const activeEnvironment = useActiveEnvironment();
 
   const showEnvironmentDialog = useCallback(() => {
     toggleDialog({
@@ -40,9 +41,9 @@ export const EnvironmentActionsDropdown = memo(function EnvironmentActionsDropdo
           leftSlot: e.id === activeEnvironment?.id ? <Icon icon="check" /> : <Icon icon="empty" />,
           onSelect: async () => {
             if (e.id !== activeEnvironment?.id) {
-              await setActiveEnvironmentId(e.id);
+              setWorkspaceSearchParams({ environment_id: e.id });
             } else {
-              await setActiveEnvironmentId(null);
+              setWorkspaceSearchParams({ environment_id: null });
             }
           },
         }),
@@ -59,7 +60,7 @@ export const EnvironmentActionsDropdown = memo(function EnvironmentActionsDropdo
         onSelect: showEnvironmentDialog,
       },
     ],
-    [activeEnvironment?.id, subEnvironments, setActiveEnvironmentId, showEnvironmentDialog],
+    [activeEnvironment?.id, subEnvironments, showEnvironmentDialog],
   );
 
   const hasBaseVars =

src-web/components/WorkspaceActionsDropdown.tsx

@@ -34,16 +34,11 @@ export const WorkspaceActionsDropdown = memo(function WorkspaceActionsDropdown({
   const workspaceMeta = useWorkspaceMeta();
   const { mutate: deleteSendHistory } = useDeleteSendHistory();
 
-  const orderedWorkspaces = useMemo(
-    () => [...workspaces].sort((a, b) => (a.name.localeCompare(b.name) > 0 ? 1 : -1)),
-    [workspaces],
-  );
-
   const { workspaceItems, extraItems } = useMemo<{
     workspaceItems: RadioDropdownItem[];
     extraItems: DropdownItem[];
   }>(() => {
-    const workspaceItems: RadioDropdownItem[] = orderedWorkspaces.map((w) => ({
+    const workspaceItems: RadioDropdownItem[] = workspaces.map((w) => ({
       key: w.id,
       label: w.name,
       value: w.id,
@@ -100,7 +95,7 @@ export const WorkspaceActionsDropdown = memo(function WorkspaceActionsDropdown({
     ];
 
     return { workspaceItems, extraItems };
-  }, [orderedWorkspaces, deleteSendHistory, createWorkspace, workspaceMeta, workspace?.id]);
+  }, [workspaces, workspaceMeta, deleteSendHistory, createWorkspace, workspace?.id]);
 
   const handleChangeWorkspace = useCallback(async (workspaceId: string | null) => {
     if (workspaceId == null) return;