gitscope
/
← marzneshin / dashboard/src/features/search-command/command-box.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/features/search-command/command-box.tsx · v0.3.1
Source
1 3d1a4b1 Mrdn 2y ago import {
2 9ddfbc8 Mardin 2y ago UsersIcon,
3 9ddfbc8 Mardin 2y ago ServerIcon,
4 9ddfbc8 Mardin 2y ago BoxIcon,
5 9ddfbc8 Mardin 2y ago ServerCogIcon,
6 9ddfbc8 Mardin 2y ago SettingsIcon,
7 3d1a4b1 Mrdn 2y ago } from "lucide-react";
8 3d1a4b1 Mrdn 2y ago import { useState, useEffect } from "react";
9 3d1a4b1 Mrdn 2y ago import { useTranslation } from "react-i18next";
10 3d1a4b1 Mrdn 2y ago import {
11 9ddfbc8 Mardin 2y ago CommandDialog,
12 9ddfbc8 Mardin 2y ago CommandEmpty,
13 9ddfbc8 Mardin 2y ago CommandGroup,
14 9ddfbc8 Mardin 2y ago CommandInput,
15 9ddfbc8 Mardin 2y ago CommandItem,
16 9ddfbc8 Mardin 2y ago CommandList,
17 9ddfbc8 Mardin 2y ago CommandSeparator,
18 3d1a4b1 Mrdn 2y ago } from "@marzneshin/components";
19 3d1a4b1 Mrdn 2y ago import { useNavigate } from "@tanstack/react-router";
20 3d1a4b1 Mrdn 2y ago import { SearchBox } from "./search-box";
21 9ddfbc8 Mardin 2y ago import { useAuth } from "@marzneshin/features/auth";
22 3d1a4b1 Mrdn 2y ago
23 3d1a4b1 Mrdn 2y ago export function CommandBox() {
24 9ddfbc8 Mardin 2y ago const [open, setOpen] = useState(false);
25 9ddfbc8 Mardin 2y ago const { t } = useTranslation();
26 9ddfbc8 Mardin 2y ago const navigate = useNavigate();
27 3d1a4b1 Mrdn 2y ago
28 9ddfbc8 Mardin 2y ago useEffect(() => {
29 9ddfbc8 Mardin 2y ago const down = (e: KeyboardEvent) => {
30 9ddfbc8 Mardin 2y ago if (e.key === "k" && (e.metaKey || e.ctrlKey)) {
31 9ddfbc8 Mardin 2y ago e.preventDefault();
32 9ddfbc8 Mardin 2y ago setOpen((open) => !open);
33 9ddfbc8 Mardin 2y ago }
34 9ddfbc8 Mardin 2y ago };
35 9ddfbc8 Mardin 2y ago document.addEventListener("keydown", down);
36 9ddfbc8 Mardin 2y ago return () => document.removeEventListener("keydown", down);
37 9ddfbc8 Mardin 2y ago }, []);
38 3d1a4b1 Mrdn 2y ago
39 9ddfbc8 Mardin 2y ago const { isSudo } = useAuth();
40 9ddfbc8 Mardin 2y ago
41 9ddfbc8 Mardin 2y ago return (
42 9ddfbc8 Mardin 2y ago <>
43 9ddfbc8 Mardin 2y ago <SearchBox onClick={() => setOpen(true)} />
44 9ddfbc8 Mardin 2y ago <CommandDialog open={open} onOpenChange={setOpen}>
45 9ddfbc8 Mardin 2y ago <CommandInput
46 9ddfbc8 Mardin 2y ago placeholder="Type a command or search..."
47 9ddfbc8 Mardin 2y ago className="focus:ring-0 ring-0 m-1 border-none"
48 9ddfbc8 Mardin 2y ago />
49 9ddfbc8 Mardin 2y ago <CommandList>
50 9ddfbc8 Mardin 2y ago <CommandEmpty>No results found.</CommandEmpty>
51 9ddfbc8 Mardin 2y ago <CommandGroup heading="Pages">
52 9ddfbc8 Mardin 2y ago <CommandItem
53 9ddfbc8 Mardin 2y ago onSelect={() => {
54 9ddfbc8 Mardin 2y ago navigate({ to: "/users" });
55 9ddfbc8 Mardin 2y ago setOpen(false);
56 9ddfbc8 Mardin 2y ago }}
57 9ddfbc8 Mardin 2y ago >
58 9ddfbc8 Mardin 2y ago <UsersIcon className="mr-2 size-4" />
59 9ddfbc8 Mardin 2y ago <span>{t("users")}</span>
60 9ddfbc8 Mardin 2y ago </CommandItem>
61 9ddfbc8 Mardin 2y ago {isSudo() && (
62 9ddfbc8 Mardin 2y ago <>
63 9ddfbc8 Mardin 2y ago <CommandItem
64 9ddfbc8 Mardin 2y ago onSelect={() => {
65 9ddfbc8 Mardin 2y ago navigate({ to: "/services" });
66 9ddfbc8 Mardin 2y ago setOpen(false);
67 9ddfbc8 Mardin 2y ago }}
68 9ddfbc8 Mardin 2y ago >
69 9ddfbc8 Mardin 2y ago <ServerIcon className="mr-2 size-4" />
70 9ddfbc8 Mardin 2y ago <span>{t("services")}</span>
71 9ddfbc8 Mardin 2y ago </CommandItem>
72 9ddfbc8 Mardin 2y ago <CommandItem
73 9ddfbc8 Mardin 2y ago onSelect={() => {
74 9ddfbc8 Mardin 2y ago navigate({ to: "/nodes" });
75 9ddfbc8 Mardin 2y ago setOpen(false);
76 9ddfbc8 Mardin 2y ago }}
77 9ddfbc8 Mardin 2y ago >
78 9ddfbc8 Mardin 2y ago <BoxIcon className="mr-2 h-4 w-4" />
79 9ddfbc8 Mardin 2y ago <span>{t("nodes")}</span>
80 9ddfbc8 Mardin 2y ago </CommandItem>
81 9ddfbc8 Mardin 2y ago <CommandItem
82 9ddfbc8 Mardin 2y ago onSelect={() => {
83 9ddfbc8 Mardin 2y ago navigate({ to: "/hosts" });
84 9ddfbc8 Mardin 2y ago setOpen(false);
85 9ddfbc8 Mardin 2y ago }}
86 9ddfbc8 Mardin 2y ago >
87 9ddfbc8 Mardin 2y ago <ServerCogIcon className="mr-2 h-4 w-4" />
88 9ddfbc8 Mardin 2y ago <span>{t("hosts")}</span>
89 9ddfbc8 Mardin 2y ago </CommandItem>
90 9ddfbc8 Mardin 2y ago </>
91 9ddfbc8 Mardin 2y ago )}
92 9ddfbc8 Mardin 2y ago </CommandGroup>
93 9ddfbc8 Mardin 2y ago {isSudo() && (
94 9ddfbc8 Mardin 2y ago <>
95 9ddfbc8 Mardin 2y ago <CommandSeparator />
96 9ddfbc8 Mardin 2y ago <CommandGroup heading="Settings">
97 9ddfbc8 Mardin 2y ago <CommandItem
98 9ddfbc8 Mardin 2y ago onSelect={() => {
99 9ddfbc8 Mardin 2y ago navigate({ to: "/settings" });
100 9ddfbc8 Mardin 2y ago setOpen(false);
101 9ddfbc8 Mardin 2y ago }}
102 9ddfbc8 Mardin 2y ago >
103 9ddfbc8 Mardin 2y ago <SettingsIcon className="mr-2 h-4 w-4" />
104 9ddfbc8 Mardin 2y ago <span>{t("settings")}</span>
105 9ddfbc8 Mardin 2y ago </CommandItem>
106 9ddfbc8 Mardin 2y ago </CommandGroup>
107 9ddfbc8 Mardin 2y ago </>
108 9ddfbc8 Mardin 2y ago )}
109 9ddfbc8 Mardin 2y ago </CommandList>
110 9ddfbc8 Mardin 2y ago </CommandDialog>
111 9ddfbc8 Mardin 2y ago </>
112 9ddfbc8 Mardin 2y ago );
113 3d1a4b1 Mrdn 2y ago }