Environment dropdown and actions

src-web/components/WorkspaceHeader.tsx

@@ -7,9 +7,7 @@ import { RecentRequestsDropdown } from './RecentRequestsDropdown';
 import { RequestActionsDropdown } from './RequestActionsDropdown';
 import { SidebarActions } from './SidebarActions';
 import { WorkspaceActionsDropdown } from './WorkspaceActionsDropdown';
-import { Button } from './core/Button';
-import { useDialog } from './DialogContext';
-import { EnvironmentEditDialog } from './EnvironmentEditDialog';
+import { EnvironmentActionsDropdown } from './EnvironmentActionsDropdown';
 
 interface Props {
   className?: string;
@@ -17,7 +15,6 @@ interface Props {
 
 export const WorkspaceHeader = memo(function WorkspaceHeader({ className }: Props) {
   const activeRequest = useActiveRequest();
-  const dialog = useDialog();
 
   return (
     <HStack
@@ -28,15 +25,7 @@ export const WorkspaceHeader = memo(function WorkspaceHeader({ className }: Prop
       <HStack space={0.5} className="flex-1 pointer-events-none" alignItems="center">
         <SidebarActions />
         <WorkspaceActionsDropdown className="pointer-events-auto" />
-        <Button onClick={() => {
-          dialog.show({
-            title: 'Environments',
-            size: 'full',
-            render: () => <EnvironmentEditDialog />,
-          })
-        }}>
-          Environments
-        </Button>
+        <EnvironmentActionsDropdown className="pointer-events-auto" />
       </HStack>
       <div className="pointer-events-none">
         <RecentRequestsDropdown />