Update dialog

src-web/components/Sidebar.tsx

@@ -9,6 +9,7 @@ import { useUpdateAnyRequest } from '../hooks/useUpdateAnyRequest';
 import { useUpdateRequest } from '../hooks/useUpdateRequest';
 import type { HttpRequest } from '../lib/models';
 import { Button } from './core/Button';
+import { Dialog } from './core/Dialog';
 import { IconButton } from './core/IconButton';
 import { HStack, VStack } from './core/Stacks';
 import { DropMarker } from './DropMarker';
@@ -32,6 +33,7 @@ export const Sidebar = memo(function Sidebar({ className }: Props) {
     [unorderedRequests],
   );
 
+  const [open, setOpen] = useState<boolean>(false);
   return (
     <div className="relative h-full">
       <div
@@ -46,6 +48,10 @@ export const Sidebar = memo(function Sidebar({ className }: Props) {
           <SidebarItems activeRequestId={activeRequest?.id} requests={requests} />
         </VStack>
         <HStack className="mx-1 pb-1" alignItems="center" justifyContent="end">
+          <Dialog open={open} onOpenChange={setOpen} title={'Cool Thing'}>
+            Hello?
+          </Dialog>
+          <IconButton title="" icon="magicWand" onClick={() => setOpen(true)} />
           <ToggleThemeButton />
         </HStack>
       </div>