diff --git a/apps/client/@/shadcn/block/GlobalShortcut.tsx b/apps/client/@/shadcn/block/GlobalShortcut.tsx new file mode 100644 index 000000000..10814980c --- /dev/null +++ b/apps/client/@/shadcn/block/GlobalShortcut.tsx @@ -0,0 +1,64 @@ +import * as React from "react"; +import { + Calculator, + Calendar, + CreditCard, + Settings, + Smile, + User, +} from "lucide-react"; + +import { + CommandDialog, + CommandEmpty, + CommandGroup, + CommandInput, + CommandItem, + CommandList, + CommandSeparator, + CommandShortcut, +} from "@/shadcn/ui/command"; + +export default function GlobalShortcut() { + const [open, setOpen] = React.useState(false); + + React.useEffect(() => { + const down = (e: KeyboardEvent) => { + if (e.key === "k" && (e.metaKey || e.ctrlKey)) { + e.preventDefault(); + setOpen((open) => !open); + } + }; + + document.addEventListener("keydown", down); + return () => document.removeEventListener("keydown", down); + }, []); + + return ( + <> + + + + No results found. + + + + + All Tickets + + + + Open Tickets + + + + Closed Tickets + + + + + + + + ); +} diff --git a/apps/client/@/shadcn/ui/command.tsx b/apps/client/@/shadcn/ui/command.tsx index aa70cd879..407f3661e 100644 --- a/apps/client/@/shadcn/ui/command.tsx +++ b/apps/client/@/shadcn/ui/command.tsx @@ -1,10 +1,10 @@ -import * as React from "react" -import { type DialogProps } from "@radix-ui/react-dialog" -import { Command as CommandPrimitive } from "cmdk" -import { Search } from "lucide-react" +import * as React from "react"; +import { type DialogProps } from "@radix-ui/react-dialog"; +import { Command as CommandPrimitive } from "cmdk"; +import { Search } from "lucide-react"; -import { cn } from "@/shadcn/lib/utils" -import { Dialog, DialogContent } from "@/shadcn/ui/dialog" +import { cn } from "@/shadcn/lib/utils"; +import { Dialog, DialogContent } from "@/shadcn/ui/dialog"; const Command = React.forwardRef< React.ElementRef, @@ -18,22 +18,22 @@ const Command = React.forwardRef< )} {...props} /> -)) -Command.displayName = CommandPrimitive.displayName +)); +Command.displayName = CommandPrimitive.displayName; interface CommandDialogProps extends DialogProps {} const CommandDialog = ({ children, ...props }: CommandDialogProps) => { return ( - - + + {children} - ) -} + ); +}; const CommandInput = React.forwardRef< React.ElementRef, @@ -44,15 +44,15 @@ const CommandInput = React.forwardRef< -)) +)); -CommandInput.displayName = CommandPrimitive.Input.displayName +CommandInput.displayName = CommandPrimitive.Input.displayName; const CommandList = React.forwardRef< React.ElementRef, @@ -63,9 +63,9 @@ const CommandList = React.forwardRef< className={cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className)} {...props} /> -)) +)); -CommandList.displayName = CommandPrimitive.List.displayName +CommandList.displayName = CommandPrimitive.List.displayName; const CommandEmpty = React.forwardRef< React.ElementRef, @@ -76,9 +76,9 @@ const CommandEmpty = React.forwardRef< className="py-6 text-center text-sm" {...props} /> -)) +)); -CommandEmpty.displayName = CommandPrimitive.Empty.displayName +CommandEmpty.displayName = CommandPrimitive.Empty.displayName; const CommandGroup = React.forwardRef< React.ElementRef, @@ -92,9 +92,9 @@ const CommandGroup = React.forwardRef< )} {...props} /> -)) +)); -CommandGroup.displayName = CommandPrimitive.Group.displayName +CommandGroup.displayName = CommandPrimitive.Group.displayName; const CommandSeparator = React.forwardRef< React.ElementRef, @@ -105,8 +105,8 @@ const CommandSeparator = React.forwardRef< className={cn("-mx-1 h-px bg-border", className)} {...props} /> -)) -CommandSeparator.displayName = CommandPrimitive.Separator.displayName +)); +CommandSeparator.displayName = CommandPrimitive.Separator.displayName; const CommandItem = React.forwardRef< React.ElementRef, @@ -120,9 +120,9 @@ const CommandItem = React.forwardRef< )} {...props} /> -)) +)); -CommandItem.displayName = CommandPrimitive.Item.displayName +CommandItem.displayName = CommandPrimitive.Item.displayName; const CommandShortcut = ({ className, @@ -136,9 +136,9 @@ const CommandShortcut = ({ )} {...props} /> - ) -} -CommandShortcut.displayName = "CommandShortcut" + ); +}; +CommandShortcut.displayName = "CommandShortcut"; export { Command, @@ -150,4 +150,4 @@ export { CommandItem, CommandShortcut, CommandSeparator, -} +}; diff --git a/apps/client/@/shadcn/ui/dialog.tsx b/apps/client/@/shadcn/ui/dialog.tsx index b824718d2..5b3bc3893 100644 --- a/apps/client/@/shadcn/ui/dialog.tsx +++ b/apps/client/@/shadcn/ui/dialog.tsx @@ -36,14 +36,14 @@ const DialogContent = React.forwardRef< {children} - + Close diff --git a/apps/client/layouts/newLayout.tsx b/apps/client/layouts/newLayout.tsx index 3bfb9ee41..adaf6d120 100644 --- a/apps/client/layouts/newLayout.tsx +++ b/apps/client/layouts/newLayout.tsx @@ -896,12 +896,12 @@ export default function NewLayout({ children }: any) { {user.isAdmin && ( - Version 0.4.8 + Version 0.4.9 )} - + {/* */}
diff --git a/apps/client/pages/_app.tsx b/apps/client/pages/_app.tsx index 693cde326..1cef4902d 100644 --- a/apps/client/pages/_app.tsx +++ b/apps/client/pages/_app.tsx @@ -1,8 +1,8 @@ //@ts-nocheck import "@radix-ui/themes/styles.css"; +import "../styles/globals.css"; import { ThemeProvider } from "next-themes"; -import "../styles/globals.css"; import { DocumentCheckIcon, @@ -25,6 +25,7 @@ import NewLayout from "../layouts/newLayout"; import NoteBookLayout from "../layouts/notebook"; import PortalLayout from "../layouts/portalLayout"; import Settings from "../layouts/settings"; +import GlobalShortcut from '@/shadcn/block/GlobalShortcut' const queryClient = new QueryClient(); @@ -215,6 +216,7 @@ function MyApp({ Component, pageProps: { session, ...pageProps } }: any) { +