Add visually hidden DialogTitle to the CommandDialog (#742)

* Add visually hidden DialogTitle to the CommandDialog

Added a visually hidden DialogTitle to the CommandDialog component in Command.tsx  to maintain accessibility while keeping the clean UI of the command palette.

* add visually hidden component as explicit dependency

packages/web/src/components/UI/Command.tsx

@@ -1,4 +1,5 @@
-import { Dialog, DialogContent } from "@components/UI/Dialog.tsx";
+import { Dialog, DialogContent, DialogTitle } from "@components/UI/Dialog.tsx";
+import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
 import { cn } from "@core/utils/cn.ts";
 import type { DialogProps } from "@radix-ui/react-dialog";
 import { Command as CommandPrimitive } from "cmdk";
@@ -24,6 +25,9 @@ const CommandDialog = ({ children, ...props }: DialogProps) => {
   return (
     <Dialog {...props}>
       <DialogContent className="overflow-hidden p-0 shadow-2xl [&_[dialog-overlay]]:bg-red-100">
+        <VisuallyHidden asChild>
+          <DialogTitle>Command Menu</DialogTitle>
+        </VisuallyHidden>
         <Command className="[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-slate-500 [&_[cmdk-group]]:px-2 [&_[cmdk-group]_+[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5">
           {children}
         </Command>