Add webonly build and push options to Makefile

Change container repo to private Gitea
Add webonly build Dockerfile
Add .node-version for fnm
Do not route settings, config, or logs to non admin users
Do not show settings, system logs, system restart or config editor links to non admin users
Add list of admin usernames to user.ts

web/.node-version

@@ -0,0 +1 @@
+20

web/src/App.tsx

@@ -10,6 +10,8 @@ import { Suspense, lazy } from "react";
 import { Redirect } from "./components/navigation/Redirect";
 import { cn } from "./lib/utils";
 import { isPWA } from "./utils/isPWA";
+import { ADMIN_USERS } from "@/types/user";
+import useSWR from "swr";
 
 const Live = lazy(() => import("@/pages/Live"));
 const Events = lazy(() => import("@/pages/Events"));
@@ -22,6 +24,7 @@ const UIPlayground = lazy(() => import("@/pages/UIPlayground"));
 const Logs = lazy(() => import("@/pages/Logs"));
 
 function App() {
+  const { data: profile } = useSWR("profile");
   return (
     <Providers>
       <BrowserRouter basename={window.baseUrl}>
@@ -47,9 +50,13 @@ function App() {
                   <Route path="/export" element={<Exports />} />
                   <Route path="/plus" element={<SubmitPlus />} />
                   <Route path="/system" element={<System />} />
-                  <Route path="/settings" element={<Settings />} />
-                  <Route path="/config" element={<ConfigEditor />} />
-                  <Route path="/logs" element={<Logs />} />
+                  {ADMIN_USERS.includes(profile?.username) && (
+                    <>
+                      <Route path="/settings" element={<Settings />} />
+                      <Route path="/config" element={<ConfigEditor />} />
+                      <Route path="/logs" element={<Logs />} />
+                    </>
+                  )}
                   <Route path="/playground" element={<UIPlayground />} />
                   <Route path="*" element={<Redirect to="/" />} />
                 </Routes>

web/src/components/menu/GeneralSettings.tsx

@@ -68,6 +68,8 @@ import {
 import { TooltipPortal } from "@radix-ui/react-tooltip";
 import { cn } from "@/lib/utils";
 import { baseUrl } from "@/api/baseUrl";
+import useSWR from "swr";
+import { ADMIN_USERS } from "@/types/user";
 
 type GeneralSettingsProps = {
   className?: string;
@@ -80,6 +82,8 @@ export default function GeneralSettings({ className }: GeneralSettingsProps) {
 
   const { send: sendRestart } = useRestart();
 
+  const { data: profile } = useSWR("profile");
+
   useEffect(() => {
     let countdownInterval: NodeJS.Timeout;
 
@@ -169,48 +173,58 @@ export default function GeneralSettings({ className }: GeneralSettingsProps) {
                   <span>System metrics</span>
                 </MenuItem>
               </Link>
-              <Link to="/logs">
-                <MenuItem
-                  className={
-                    isDesktop
-                      ? "cursor-pointer"
-                      : "flex w-full items-center p-2 text-sm"
-                  }
-                >
-                  <LuList className="mr-2 size-4" />
-                  <span>System logs</span>
-                </MenuItem>
-              </Link>
+              {ADMIN_USERS.includes(profile?.username) && (
+                <Link to="/logs">
+                  <MenuItem
+                    className={
+                      isDesktop
+                        ? "cursor-pointer"
+                        : "flex w-full items-center p-2 text-sm"
+                    }
+                  >
+                    <LuList className="mr-2 size-4" />
+                    <span>System logs</span>
+                  </MenuItem>
+                </Link>
+              )}
             </DropdownMenuGroup>
-            <DropdownMenuLabel className={isDesktop ? "mt-3" : "mt-1"}>
-              Configuration
-            </DropdownMenuLabel>
-            <DropdownMenuSeparator />
+            {ADMIN_USERS.includes(profile?.username) && (
+              <>
+                <DropdownMenuLabel className={isDesktop ? "mt-3" : "mt-1"}>
+                  Configuration
+                </DropdownMenuLabel>
+                <DropdownMenuSeparator />
+              </>
+            )}
             <DropdownMenuGroup>
-              <Link to="/settings">
-                <MenuItem
-                  className={
-                    isDesktop
-                      ? "cursor-pointer"
-                      : "flex w-full items-center p-2 text-sm"
-                  }
-                >
-                  <LuSettings className="mr-2 size-4" />
-                  <span>Settings</span>
-                </MenuItem>
-              </Link>
-              <Link to="/config">
-                <MenuItem
-                  className={
-                    isDesktop
-                      ? "cursor-pointer"
-                      : "flex w-full items-center p-2 text-sm"
-                  }
-                >
-                  <LuPenSquare className="mr-2 size-4" />
-                  <span>Configuration editor</span>
-                </MenuItem>
-              </Link>
+              {ADMIN_USERS.includes(profile?.username) && (
+                <>
+                  <Link to="/settings">
+                    <MenuItem
+                      className={
+                        isDesktop
+                          ? "cursor-pointer"
+                          : "flex w-full items-center p-2 text-sm"
+                      }
+                    >
+                      <LuSettings className="mr-2 size-4" />
+                      <span>Settings</span>
+                    </MenuItem>
+                  </Link>
+                  <Link to="/config">
+                    <MenuItem
+                      className={
+                        isDesktop
+                          ? "cursor-pointer"
+                          : "flex w-full items-center p-2 text-sm"
+                      }
+                    >
+                      <LuPenSquare className="mr-2 size-4" />
+                      <span>Configuration editor</span>
+                    </MenuItem>
+                  </Link>
+                </>
+              )}
               <DropdownMenuLabel className={isDesktop ? "mt-3" : "mt-1"}>
                 Appearance
               </DropdownMenuLabel>
@@ -358,16 +372,24 @@ export default function GeneralSettings({ className }: GeneralSettingsProps) {
                 <span>GitHub</span>
               </MenuItem>
             </a>
-            <DropdownMenuSeparator className={isDesktop ? "mt-3" : "mt-1"} />
-            <MenuItem
-              className={
-                isDesktop ? "cursor-pointer" : "flex items-center p-2 text-sm"
-              }
-              onClick={() => setRestartDialogOpen(true)}
-            >
-              <LuRotateCw className="mr-2 size-4" />
-              <span>Restart Frigate</span>
-            </MenuItem>
+            {ADMIN_USERS.includes(profile?.username) && (
+              <>
+                <DropdownMenuSeparator
+                  className={isDesktop ? "mt-3" : "mt-1"}
+                />
+                <MenuItem
+                  className={
+                    isDesktop
+                      ? "cursor-pointer"
+                      : "flex items-center p-2 text-sm"
+                  }
+                  onClick={() => setRestartDialogOpen(true)}
+                >
+                  <LuRotateCw className="mr-2 size-4" />
+                  <span>Restart Frigate</span>
+                </MenuItem>
+              </>
+            )}
           </div>
         </Content>
       </Container>

web/src/types/user.ts

@@ -1,3 +1,5 @@
 export type User = {
   username: string;
 };
+
+export const ADMIN_USERS: string[] = ["admin", "cking91977", "akadmin"];