Merge a5b07b4862 into 584768bacf

ui/src/main.tsx

@@ -42,6 +42,7 @@ import SettingsHardwareRoute from "./routes/devices.$id.settings.hardware";
 import SettingsVideoRoute from "./routes/devices.$id.settings.video";
 import SettingsAppearanceRoute from "./routes/devices.$id.settings.appearance";
 import * as SettingsGeneralIndexRoute from "./routes/devices.$id.settings.general._index";
+import SettingsGeneralRebootRoute from "./routes/devices.$id.settings.general.reboot";
 import SettingsGeneralUpdateRoute from "./routes/devices.$id.settings.general.update";
 import SettingsNetworkRoute from "./routes/devices.$id.settings.network";
 import SecurityAccessLocalAuthRoute from "./routes/devices.$id.settings.access.local-auth";
@@ -140,6 +141,10 @@ if (isOnDevice) {
                   index: true,
                   element: <SettingsGeneralIndexRoute.default />,
                 },
+                {
+                  path: "reboot",
+                  element: <SettingsGeneralRebootRoute />,
+                },
                 {
                   path: "update",
                   element: <SettingsGeneralUpdateRoute />,

ui/src/routes/devices.$id.settings.general._index.tsx

@@ -92,6 +92,21 @@ export default function SettingsGeneralRoute() {
               />
             </SettingsItem>
           </div>
+
+          <div className="mt-2 flex items-center justify-between gap-x-2">
+            <SettingsItem
+              title="Reboot Device"
+              description="Power cycle the JetKVM"
+            />
+            <div>
+              <Button
+                size="SM"
+                theme="light"
+                text="Reboot Device"
+                onClick={() => navigateTo("./reboot")}
+              />
+            </div>
+          </div>
         </div>
       </div>
     </div>

ui/src/routes/devices.$id.settings.general.reboot.tsx

@@ -0,0 +1,66 @@
+import { useNavigate } from "react-router-dom";
+import { useCallback } from "react";
+
+import { useJsonRpc } from "@/hooks/useJsonRpc";
+import { Button } from "@components/Button";
+
+export default function SettingsGeneralRebootRoute() {
+  const navigate = useNavigate();
+  const [send] = useJsonRpc();
+
+  const onConfirmUpdate = useCallback(() => {
+    // This is where we send the RPC to the golang binary
+    send("reboot", {force: true});
+  }, [send]);
+
+  {
+    /* TODO: Migrate to using URLs instead of the global state. To simplify the refactoring, we'll keep the global state for now. */
+  }
+  return <Dialog onClose={() => navigate("..")} onConfirmUpdate={onConfirmUpdate} />;
+}
+
+export function Dialog({
+  onClose,
+  onConfirmUpdate,
+}: {
+  onClose: () => void;
+  onConfirmUpdate: () => void;
+}) {
+
+  return (
+    <div className="pointer-events-auto relative mx-auto text-left">
+      <div>
+          <ConfirmationBox
+            onYes={onConfirmUpdate}
+            onNo={onClose}
+          />
+      </div>
+    </div>
+  );
+}
+
+function ConfirmationBox({
+  onYes,
+  onNo,
+}: {
+  onYes: () => void;
+  onNo: () => void;
+}) {
+  return (
+    <div className="flex flex-col items-start justify-start space-y-4 text-left">
+      <div className="text-left">
+        <p className="text-base font-semibold text-black dark:text-white">
+          Reboot JetKVM
+        </p>
+        <p className="text-sm text-slate-600 dark:text-slate-300">
+          Do you want to proceed with rebooting the system?
+        </p>
+
+        <div className="mt-4 flex gap-x-2">
+          <Button size="SM" theme="light" text="Yes" onClick={onYes} />
+          <Button size="SM" theme="blank" text="No" onClick={onNo} />
+        </div>
+      </div>
+    </div>
+  );
+}

web.go

@@ -97,9 +97,6 @@ func setupRouter() *gin.Engine {
 	// We use this to determine if the device is setup
 	r.GET("/device/status", handleDeviceStatus)
 
-	// We use this to provide the UI with the device configuration
-	r.GET("/device/ui-config.js", handleDeviceUIConfig)
-
 	// We use this to setup the device in the welcome page
 	r.POST("/device/setup", handleSetup)
 
@@ -694,21 +691,6 @@ func handleCloudState(c *gin.Context) {
 	c.JSON(http.StatusOK, response)
 }
 
-func handleDeviceUIConfig(c *gin.Context) {
-	config, _ := json.Marshal(gin.H{
-		"CLOUD_API":      config.CloudURL,
-		"DEVICE_VERSION": builtAppVersion,
-	})
-	if config == nil {
-		c.JSON(http.StatusInternalServerError, gin.H{"error": "Failed to marshal config"})
-		return
-	}
-
-	response := fmt.Sprintf("window.JETKVM_CONFIG = %s;", config)
-
-	c.Data(http.StatusOK, "text/javascript; charset=utf-8", []byte(response))
-}
-
 func handleSetup(c *gin.Context) {
 	// Check if the device is already set up
 	if config.LocalAuthMode != "" || config.HashedPassword != "" {