Merge branch 'jetkvm:dev' into feat/local-web-server-loopback-mode

- Updated the configuration struct and related RPC methods to use the new name `LocalLoopbackOnly` for clarity.
- Adjusted the web server binding logic and device response structure to reflect this change.

.devcontainer/devcontainer.json

@@ -9,6 +9,19 @@
 	},
 	"mounts": [
     	"source=${localEnv:HOME}/.ssh,target=/home/vscode/.ssh,type=bind,consistency=cached"
-	]
+	],
+	"customizations": {
+		"vscode": {
+			"extensions": [
+				"bradlc.vscode-tailwindcss",
+				"GitHub.vscode-pull-request-github",
+				"dbaeumer.vscode-eslint",
+				"golang.go",
+				"ms-vscode.makefile-tools",
+				"esbenp.prettier-vscode",
+				"github.vscode-github-actions"
+			]
+		}
+	}
 }
 

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "tailwindCSS.classFunctions": ["cva", "cx"]
+}

config.go

@@ -75,48 +75,47 @@ func (m *KeyboardMacro) Validate() error {
 }
 
 type Config struct {
-	CloudURL                   string                 `json:"cloud_url"`
+	CloudURL             string                 `json:"cloud_url"`
-	CloudAppURL                string                 `json:"cloud_app_url"`
+	CloudAppURL          string                 `json:"cloud_app_url"`
-	CloudToken                 string                 `json:"cloud_token"`
+	CloudToken           string                 `json:"cloud_token"`
-	GoogleIdentity             string                 `json:"google_identity"`
+	GoogleIdentity       string                 `json:"google_identity"`
-	JigglerEnabled             bool                   `json:"jiggler_enabled"`
+	JigglerEnabled       bool                   `json:"jiggler_enabled"`
-	AutoUpdateEnabled          bool                   `json:"auto_update_enabled"`
+	AutoUpdateEnabled    bool                   `json:"auto_update_enabled"`
-	IncludePreRelease          bool                   `json:"include_pre_release"`
+	IncludePreRelease    bool                   `json:"include_pre_release"`
-	HashedPassword             string                 `json:"hashed_password"`
+	HashedPassword       string                 `json:"hashed_password"`
-	LocalAuthToken             string                 `json:"local_auth_token"`
+	LocalAuthToken       string                 `json:"local_auth_token"`
-	LocalAuthMode              string                 `json:"localAuthMode"` //TODO: fix it with migration
+	LocalAuthMode        string                 `json:"localAuthMode"` //TODO: fix it with migration
-	WakeOnLanDevices           []WakeOnLanDevice      `json:"wake_on_lan_devices"`
+	LocalLoopbackOnly    bool                   `json:"local_loopback_only"`
-	KeyboardMacros             []KeyboardMacro        `json:"keyboard_macros"`
+	WakeOnLanDevices     []WakeOnLanDevice      `json:"wake_on_lan_devices"`
-	KeyboardLayout             string                 `json:"keyboard_layout"`
+	KeyboardMacros       []KeyboardMacro        `json:"keyboard_macros"`
-	EdidString                 string                 `json:"hdmi_edid_string"`
+	KeyboardLayout       string                 `json:"keyboard_layout"`
-	ActiveExtension            string                 `json:"active_extension"`
+	EdidString           string                 `json:"hdmi_edid_string"`
-	DisplayRotation            string                 `json:"display_rotation"`
+	ActiveExtension      string                 `json:"active_extension"`
-	DisplayMaxBrightness       int                    `json:"display_max_brightness"`
+	DisplayRotation      string                 `json:"display_rotation"`
-	DisplayDimAfterSec         int                    `json:"display_dim_after_sec"`
+	DisplayMaxBrightness int                    `json:"display_max_brightness"`
-	DisplayOffAfterSec         int                    `json:"display_off_after_sec"`
+	DisplayDimAfterSec   int                    `json:"display_dim_after_sec"`
-	TLSMode                    string                 `json:"tls_mode"` // options: "self-signed", "user-defined", ""
+	DisplayOffAfterSec   int                    `json:"display_off_after_sec"`
-	LocalWebServerLoopbackOnly bool                   `json:"local_web_server_loopback_only"`
+	TLSMode              string                 `json:"tls_mode"` // options: "self-signed", "user-defined", ""
-	UsbConfig                  *usbgadget.Config      `json:"usb_config"`
+	UsbConfig            *usbgadget.Config      `json:"usb_config"`
-	UsbDevices                 *usbgadget.Devices     `json:"usb_devices"`
+	UsbDevices           *usbgadget.Devices     `json:"usb_devices"`
-	NetworkConfig              *network.NetworkConfig `json:"network_config"`
+	NetworkConfig        *network.NetworkConfig `json:"network_config"`
-	DefaultLogLevel            string                 `json:"default_log_level"`
+	DefaultLogLevel      string                 `json:"default_log_level"`
 }
 
 const configPath = "/userdata/kvm_config.json"
 
 var defaultConfig = &Config{
-	CloudURL:                   "https://api.jetkvm.com",
+	CloudURL:             "https://api.jetkvm.com",
-	CloudAppURL:                "https://app.jetkvm.com",
+	CloudAppURL:          "https://app.jetkvm.com",
-	AutoUpdateEnabled:          true, // Set a default value
+	AutoUpdateEnabled:    true, // Set a default value
-	ActiveExtension:            "",
+	ActiveExtension:      "",
-	KeyboardMacros:             []KeyboardMacro{},
+	KeyboardMacros:       []KeyboardMacro{},
-	DisplayRotation:            "270",
+	DisplayRotation:      "270",
-	KeyboardLayout:             "en-US",
+	KeyboardLayout:       "en-US",
-	DisplayMaxBrightness:       64,
+	DisplayMaxBrightness: 64,
-	DisplayDimAfterSec:         120,  // 2 minutes
+	DisplayDimAfterSec:   120,  // 2 minutes
-	DisplayOffAfterSec:         1800, // 30 minutes
+	DisplayOffAfterSec:   1800, // 30 minutes
-	TLSMode:                    "",
+	TLSMode:              "",
-	LocalWebServerLoopbackOnly: false, // Allow access from any network interface by default
 	UsbConfig: &usbgadget.Config{
 		VendorId:     "0x1d6b", //The Linux Foundation
 		ProductId:    "0x0104", //Multifunction Composite Gadget

jsonrpc.go

@@ -1006,18 +1006,18 @@ func setKeyboardMacros(params KeyboardMacrosParams) (interface{}, error) {
 	return nil, nil
 }
 
-func rpcGetLocalWebServerLoopbackOnly() (bool, error) {
+func rpcGetLocalLoopbackOnly() (bool, error) {
-	return config.LocalWebServerLoopbackOnly, nil
+	return config.LocalLoopbackOnly, nil
 }
 
-func rpcSetLocalWebServerLoopbackOnly(enabled bool) error {
+func rpcSetLocalLoopbackOnly(enabled bool) error {
 	// Check if the setting is actually changing
-	if config.LocalWebServerLoopbackOnly == enabled {
+	if config.LocalLoopbackOnly == enabled {
 		return nil
 	}
 
 	// Update the setting
-	config.LocalWebServerLoopbackOnly = enabled
+	config.LocalLoopbackOnly = enabled
 	if err := SaveConfig(); err != nil {
 		return fmt.Errorf("failed to save config: %w", err)
 	}
@@ -1026,82 +1026,82 @@ func rpcSetLocalWebServerLoopbackOnly(enabled bool) error {
 }
 
 var rpcHandlers = map[string]RPCHandler{
-	"ping":                          {Func: rpcPing},
+	"ping":                   {Func: rpcPing},
-	"reboot":                        {Func: rpcReboot, Params: []string{"force"}},
+	"reboot":                 {Func: rpcReboot, Params: []string{"force"}},
-	"getDeviceID":                   {Func: rpcGetDeviceID},
+	"getDeviceID":            {Func: rpcGetDeviceID},
-	"deregisterDevice":              {Func: rpcDeregisterDevice},
+	"deregisterDevice":       {Func: rpcDeregisterDevice},
-	"getCloudState":                 {Func: rpcGetCloudState},
+	"getCloudState":          {Func: rpcGetCloudState},
-	"getNetworkState":               {Func: rpcGetNetworkState},
+	"getNetworkState":        {Func: rpcGetNetworkState},
-	"getNetworkSettings":            {Func: rpcGetNetworkSettings},
+	"getNetworkSettings":     {Func: rpcGetNetworkSettings},
-	"setNetworkSettings":            {Func: rpcSetNetworkSettings, Params: []string{"settings"}},
+	"setNetworkSettings":     {Func: rpcSetNetworkSettings, Params: []string{"settings"}},
-	"renewDHCPLease":                {Func: rpcRenewDHCPLease},
+	"renewDHCPLease":         {Func: rpcRenewDHCPLease},
-	"keyboardReport":                {Func: rpcKeyboardReport, Params: []string{"modifier", "keys"}},
+	"keyboardReport":         {Func: rpcKeyboardReport, Params: []string{"modifier", "keys"}},
-	"getKeyboardLedState":           {Func: rpcGetKeyboardLedState},
+	"getKeyboardLedState":    {Func: rpcGetKeyboardLedState},
-	"absMouseReport":                {Func: rpcAbsMouseReport, Params: []string{"x", "y", "buttons"}},
+	"absMouseReport":         {Func: rpcAbsMouseReport, Params: []string{"x", "y", "buttons"}},
-	"relMouseReport":                {Func: rpcRelMouseReport, Params: []string{"dx", "dy", "buttons"}},
+	"relMouseReport":         {Func: rpcRelMouseReport, Params: []string{"dx", "dy", "buttons"}},
-	"wheelReport":                   {Func: rpcWheelReport, Params: []string{"wheelY"}},
+	"wheelReport":            {Func: rpcWheelReport, Params: []string{"wheelY"}},
-	"getVideoState":                 {Func: rpcGetVideoState},
+	"getVideoState":          {Func: rpcGetVideoState},
-	"getUSBState":                   {Func: rpcGetUSBState},
+	"getUSBState":            {Func: rpcGetUSBState},
-	"unmountImage":                  {Func: rpcUnmountImage},
+	"unmountImage":           {Func: rpcUnmountImage},
-	"rpcMountBuiltInImage":          {Func: rpcMountBuiltInImage, Params: []string{"filename"}},
+	"rpcMountBuiltInImage":   {Func: rpcMountBuiltInImage, Params: []string{"filename"}},
-	"setJigglerState":               {Func: rpcSetJigglerState, Params: []string{"enabled"}},
+	"setJigglerState":        {Func: rpcSetJigglerState, Params: []string{"enabled"}},
-	"getJigglerState":               {Func: rpcGetJigglerState},
+	"getJigglerState":        {Func: rpcGetJigglerState},
-	"sendWOLMagicPacket":            {Func: rpcSendWOLMagicPacket, Params: []string{"macAddress"}},
+	"sendWOLMagicPacket":     {Func: rpcSendWOLMagicPacket, Params: []string{"macAddress"}},
-	"getStreamQualityFactor":        {Func: rpcGetStreamQualityFactor},
+	"getStreamQualityFactor": {Func: rpcGetStreamQualityFactor},
-	"setStreamQualityFactor":        {Func: rpcSetStreamQualityFactor, Params: []string{"factor"}},
+	"setStreamQualityFactor": {Func: rpcSetStreamQualityFactor, Params: []string{"factor"}},
-	"getAutoUpdateState":            {Func: rpcGetAutoUpdateState},
+	"getAutoUpdateState":     {Func: rpcGetAutoUpdateState},
-	"setAutoUpdateState":            {Func: rpcSetAutoUpdateState, Params: []string{"enabled"}},
+	"setAutoUpdateState":     {Func: rpcSetAutoUpdateState, Params: []string{"enabled"}},
-	"getEDID":                       {Func: rpcGetEDID},
+	"getEDID":                {Func: rpcGetEDID},
-	"setEDID":                       {Func: rpcSetEDID, Params: []string{"edid"}},
+	"setEDID":                {Func: rpcSetEDID, Params: []string{"edid"}},
-	"getDevChannelState":            {Func: rpcGetDevChannelState},
+	"getDevChannelState":     {Func: rpcGetDevChannelState},
-	"setDevChannelState":            {Func: rpcSetDevChannelState, Params: []string{"enabled"}},
+	"setDevChannelState":     {Func: rpcSetDevChannelState, Params: []string{"enabled"}},
-	"getUpdateStatus":               {Func: rpcGetUpdateStatus},
+	"getUpdateStatus":        {Func: rpcGetUpdateStatus},
-	"tryUpdate":                     {Func: rpcTryUpdate},
+	"tryUpdate":              {Func: rpcTryUpdate},
-	"getDevModeState":               {Func: rpcGetDevModeState},
+	"getDevModeState":        {Func: rpcGetDevModeState},
-	"setDevModeState":               {Func: rpcSetDevModeState, Params: []string{"enabled"}},
+	"setDevModeState":        {Func: rpcSetDevModeState, Params: []string{"enabled"}},
-	"getSSHKeyState":                {Func: rpcGetSSHKeyState},
+	"getSSHKeyState":         {Func: rpcGetSSHKeyState},
-	"setSSHKeyState":                {Func: rpcSetSSHKeyState, Params: []string{"sshKey"}},
+	"setSSHKeyState":         {Func: rpcSetSSHKeyState, Params: []string{"sshKey"}},
-	"getTLSState":                   {Func: rpcGetTLSState},
+	"getTLSState":            {Func: rpcGetTLSState},
-	"setTLSState":                   {Func: rpcSetTLSState, Params: []string{"state"}},
+	"setTLSState":            {Func: rpcSetTLSState, Params: []string{"state"}},
-	"setMassStorageMode":            {Func: rpcSetMassStorageMode, Params: []string{"mode"}},
+	"setMassStorageMode":     {Func: rpcSetMassStorageMode, Params: []string{"mode"}},
-	"getMassStorageMode":            {Func: rpcGetMassStorageMode},
+	"getMassStorageMode":     {Func: rpcGetMassStorageMode},
-	"isUpdatePending":               {Func: rpcIsUpdatePending},
+	"isUpdatePending":        {Func: rpcIsUpdatePending},
-	"getUsbEmulationState":          {Func: rpcGetUsbEmulationState},
+	"getUsbEmulationState":   {Func: rpcGetUsbEmulationState},
-	"setUsbEmulationState":          {Func: rpcSetUsbEmulationState, Params: []string{"enabled"}},
+	"setUsbEmulationState":   {Func: rpcSetUsbEmulationState, Params: []string{"enabled"}},
-	"getUsbConfig":                  {Func: rpcGetUsbConfig},
+	"getUsbConfig":           {Func: rpcGetUsbConfig},
-	"setUsbConfig":                  {Func: rpcSetUsbConfig, Params: []string{"usbConfig"}},
+	"setUsbConfig":           {Func: rpcSetUsbConfig, Params: []string{"usbConfig"}},
-	"checkMountUrl":                 {Func: rpcCheckMountUrl, Params: []string{"url"}},
+	"checkMountUrl":          {Func: rpcCheckMountUrl, Params: []string{"url"}},
-	"getVirtualMediaState":          {Func: rpcGetVirtualMediaState},
+	"getVirtualMediaState":   {Func: rpcGetVirtualMediaState},
-	"getStorageSpace":               {Func: rpcGetStorageSpace},
+	"getStorageSpace":        {Func: rpcGetStorageSpace},
-	"mountWithHTTP":                 {Func: rpcMountWithHTTP, Params: []string{"url", "mode"}},
+	"mountWithHTTP":          {Func: rpcMountWithHTTP, Params: []string{"url", "mode"}},
-	"mountWithWebRTC":               {Func: rpcMountWithWebRTC, Params: []string{"filename", "size", "mode"}},
+	"mountWithWebRTC":        {Func: rpcMountWithWebRTC, Params: []string{"filename", "size", "mode"}},
-	"mountWithStorage":              {Func: rpcMountWithStorage, Params: []string{"filename", "mode"}},
+	"mountWithStorage":       {Func: rpcMountWithStorage, Params: []string{"filename", "mode"}},
-	"listStorageFiles":              {Func: rpcListStorageFiles},
+	"listStorageFiles":       {Func: rpcListStorageFiles},
-	"deleteStorageFile":             {Func: rpcDeleteStorageFile, Params: []string{"filename"}},
+	"deleteStorageFile":      {Func: rpcDeleteStorageFile, Params: []string{"filename"}},
-	"startStorageFileUpload":        {Func: rpcStartStorageFileUpload, Params: []string{"filename", "size"}},
+	"startStorageFileUpload": {Func: rpcStartStorageFileUpload, Params: []string{"filename", "size"}},
-	"getWakeOnLanDevices":           {Func: rpcGetWakeOnLanDevices},
+	"getWakeOnLanDevices":    {Func: rpcGetWakeOnLanDevices},
-	"setWakeOnLanDevices":           {Func: rpcSetWakeOnLanDevices, Params: []string{"params"}},
+	"setWakeOnLanDevices":    {Func: rpcSetWakeOnLanDevices, Params: []string{"params"}},
-	"resetConfig":                   {Func: rpcResetConfig},
+	"resetConfig":            {Func: rpcResetConfig},
-	"setDisplayRotation":            {Func: rpcSetDisplayRotation, Params: []string{"params"}},
+	"setDisplayRotation":     {Func: rpcSetDisplayRotation, Params: []string{"params"}},
-	"getDisplayRotation":            {Func: rpcGetDisplayRotation},
+	"getDisplayRotation":     {Func: rpcGetDisplayRotation},
-	"setBacklightSettings":          {Func: rpcSetBacklightSettings, Params: []string{"params"}},
+	"setBacklightSettings":   {Func: rpcSetBacklightSettings, Params: []string{"params"}},
-	"getBacklightSettings":          {Func: rpcGetBacklightSettings},
+	"getBacklightSettings":   {Func: rpcGetBacklightSettings},
-	"getDCPowerState":               {Func: rpcGetDCPowerState},
+	"getDCPowerState":        {Func: rpcGetDCPowerState},
-	"setDCPowerState":               {Func: rpcSetDCPowerState, Params: []string{"enabled"}},
+	"setDCPowerState":        {Func: rpcSetDCPowerState, Params: []string{"enabled"}},
-	"getActiveExtension":            {Func: rpcGetActiveExtension},
+	"getActiveExtension":     {Func: rpcGetActiveExtension},
-	"setActiveExtension":            {Func: rpcSetActiveExtension, Params: []string{"extensionId"}},
+	"setActiveExtension":     {Func: rpcSetActiveExtension, Params: []string{"extensionId"}},
-	"getATXState":                   {Func: rpcGetATXState},
+	"getATXState":            {Func: rpcGetATXState},
-	"setATXPowerAction":             {Func: rpcSetATXPowerAction, Params: []string{"action"}},
+	"setATXPowerAction":      {Func: rpcSetATXPowerAction, Params: []string{"action"}},
-	"getSerialSettings":             {Func: rpcGetSerialSettings},
+	"getSerialSettings":      {Func: rpcGetSerialSettings},
-	"setSerialSettings":             {Func: rpcSetSerialSettings, Params: []string{"settings"}},
+	"setSerialSettings":      {Func: rpcSetSerialSettings, Params: []string{"settings"}},
-	"getUsbDevices":                 {Func: rpcGetUsbDevices},
+	"getUsbDevices":          {Func: rpcGetUsbDevices},
-	"setUsbDevices":                 {Func: rpcSetUsbDevices, Params: []string{"devices"}},
+	"setUsbDevices":          {Func: rpcSetUsbDevices, Params: []string{"devices"}},
-	"setUsbDeviceState":             {Func: rpcSetUsbDeviceState, Params: []string{"device", "enabled"}},
+	"setUsbDeviceState":      {Func: rpcSetUsbDeviceState, Params: []string{"device", "enabled"}},
-	"setCloudUrl":                   {Func: rpcSetCloudUrl, Params: []string{"apiUrl", "appUrl"}},
+	"setCloudUrl":            {Func: rpcSetCloudUrl, Params: []string{"apiUrl", "appUrl"}},
-	"getKeyboardLayout":             {Func: rpcGetKeyboardLayout},
+	"getKeyboardLayout":      {Func: rpcGetKeyboardLayout},
-	"setKeyboardLayout":             {Func: rpcSetKeyboardLayout, Params: []string{"layout"}},
+	"setKeyboardLayout":      {Func: rpcSetKeyboardLayout, Params: []string{"layout"}},
-	"getKeyboardMacros":             {Func: getKeyboardMacros},
+	"getKeyboardMacros":      {Func: getKeyboardMacros},
-	"setKeyboardMacros":             {Func: setKeyboardMacros, Params: []string{"params"}},
+	"setKeyboardMacros":      {Func: setKeyboardMacros, Params: []string{"params"}},
-	"getLocalWebServerLoopbackOnly": {Func: rpcGetLocalWebServerLoopbackOnly},
+	"getLocalLoopbackOnly":   {Func: rpcGetLocalLoopbackOnly},
-	"setLocalWebServerLoopbackOnly": {Func: rpcSetLocalWebServerLoopbackOnly, Params: []string{"enabled"}},
+	"setLocalLoopbackOnly":   {Func: rpcSetLocalLoopbackOnly, Params: []string{"enabled"}},
 }

ui/src/components/popovers/PasteModal.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect, useRef, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { LuCornerDownLeft } from "react-icons/lu";
 import { ExclamationCircleIcon } from "@heroicons/react/16/solid";
 import { useClose } from "@headlessui/react";
@@ -39,6 +39,13 @@ export default function PasteModal() {
     state => state.setKeyboardLayout,
   );
 
+  // this ensures we always get the original en-US if it hasn't been set yet
+  const safeKeyboardLayout = useMemo(() => {
+    if (keyboardLayout && keyboardLayout.length > 0)
+      return keyboardLayout;
+    return "en-US";
+  }, [keyboardLayout]);
+
   useEffect(() => {
     send("getKeyboardLayout", {}, resp => {
       if ("error" in resp) return;
@@ -56,29 +63,28 @@ export default function PasteModal() {
     setPasteMode(false);
     setDisableVideoFocusTrap(false);
     if (rpcDataChannel?.readyState !== "open" || !TextAreaRef.current) return;
-    if (!keyboardLayout) return;
+    if (!safeKeyboardLayout) return;
-    if (!chars[keyboardLayout]) return;
+    if (!chars[safeKeyboardLayout]) return;
-
     const text = TextAreaRef.current.value;
 
     try {
       for (const char of text) {
-        const { key, shift, altRight, deadKey, accentKey } = chars[keyboardLayout][char]
+        const { key, shift, altRight, deadKey, accentKey } = chars[safeKeyboardLayout][char]
         if (!key) continue;
 
-	const keyz = [ keys[key] ];
+        const keyz = [ keys[key] ];
-	const modz = [ modifierCode(shift, altRight) ];
+        const modz = [ modifierCode(shift, altRight) ];
 
-	if (deadKey) {
+        if (deadKey) {
             keyz.push(keys["Space"]);
             modz.push(noModifier);
-	}
+        }
-	if (accentKey) {
+        if (accentKey) {
             keyz.unshift(keys[accentKey.key])
             modz.unshift(modifierCode(accentKey.shift, accentKey.altRight))
-	}
+        }
 
-	for (const [index, kei] of keyz.entries()) {
+        for (const [index, kei] of keyz.entries()) {
           await new Promise<void>((resolve, reject) => {
             send(
               "keyboardReport",
@@ -92,13 +98,13 @@ export default function PasteModal() {
               },
             );
           });
-	}
+        }
       }
     } catch (error) {
       console.error(error);
       notifications.error("Failed to paste text");
     }
-  }, [rpcDataChannel?.readyState, send, setDisableVideoFocusTrap, setPasteMode, keyboardLayout]);
+  }, [rpcDataChannel?.readyState, send, setDisableVideoFocusTrap, setPasteMode, safeKeyboardLayout]);
 
   useEffect(() => {
     if (TextAreaRef.current) {
@@ -148,7 +154,7 @@ export default function PasteModal() {
                             // @ts-expect-error TS doesn't recognize Intl.Segmenter in some environments
                             [...new Intl.Segmenter().segment(value)]
                               .map(x => x.segment)
-                              .filter(char => !chars[keyboardLayout][char]),
+                              .filter(char => !chars[safeKeyboardLayout][char]),
                           ),
                         ];
 
@@ -167,11 +173,11 @@ export default function PasteModal() {
                     )}
                   </div>
                 </div>
-		<div className="space-y-4">
+                <div className="space-y-4">
                   <p className="text-xs text-slate-600 dark:text-slate-400">
-                    Sending text using keyboard layout: {layouts[keyboardLayout]}
+                    Sending text using keyboard layout: {layouts[safeKeyboardLayout]}
                   </p>
-		</div>
+                </div>
               </div>
             </div>
           </div>

ui/src/routes/devices.$id.settings.keyboard.tsx

@@ -1,4 +1,4 @@
-import { useCallback, useEffect } from "react";
+import { useCallback, useEffect, useMemo } from "react";
 
 import { KeyboardLedSync, useSettingsStore } from "@/hooks/stores";
 import { useJsonRpc } from "@/hooks/useJsonRpc";
@@ -20,6 +20,13 @@ export default function SettingsKeyboardRoute() {
     state => state.setKeyboardLedSync,
   );
 
+  // this ensures we always get the original en-US if it hasn't been set yet
+  const safeKeyboardLayout = useMemo(() => {
+      if (keyboardLayout && keyboardLayout.length > 0)
+        return keyboardLayout;
+      return "en-US";
+  }, [keyboardLayout]);
+
   const layoutOptions = Object.entries(layouts).map(([code, language]) => { return { value: code, label: language } })
   const ledSyncOptions = [
     { value: "auto", label: "Automatic" },
@@ -69,7 +76,7 @@ export default function SettingsKeyboardRoute() {
             size="SM"
             label=""
             fullWidth
-            value={keyboardLayout}
+            value={safeKeyboardLayout}
             onChange={onKeyboardLayoutChange}
             options={layoutOptions}
           />

web.go

@@ -52,9 +52,9 @@ type ChangePasswordRequest struct {
 }
 
 type LocalDevice struct {
-	AuthMode                   *string `json:"authMode"`
+	AuthMode     *string `json:"authMode"`
-	DeviceID                   string  `json:"deviceId"`
+	DeviceID     string  `json:"deviceId"`
-	LocalWebServerLoopbackOnly bool    `json:"localWebServerLoopbackOnly"`
+	LoopbackOnly bool    `json:"loopbackOnly"`
 }
 
 type DeviceStatus struct {
@@ -536,11 +536,11 @@ func RunWebServer() {
 
 	// Determine the binding address based on the config
 	bindAddress := ":80" // Default to all interfaces
-	if config.LocalWebServerLoopbackOnly {
+	if config.LocalLoopbackOnly {
 		bindAddress = "localhost:80" // Loopback only (both IPv4 and IPv6)
 	}
 
-	logger.Info().Str("bindAddress", bindAddress).Bool("loopbackOnly", config.LocalWebServerLoopbackOnly).Msg("Starting web server")
+	logger.Info().Str("bindAddress", bindAddress).Bool("loopbackOnly", config.LocalLoopbackOnly).Msg("Starting web server")
 	err := r.Run(bindAddress)
 	if err != nil {
 		panic(err)
@@ -549,9 +549,9 @@ func RunWebServer() {
 
 func handleDevice(c *gin.Context) {
 	response := LocalDevice{
-		AuthMode:                   &config.LocalAuthMode,
+		AuthMode:     &config.LocalAuthMode,
-		DeviceID:                   GetDeviceID(),
+		DeviceID:     GetDeviceID(),
-		LocalWebServerLoopbackOnly: config.LocalWebServerLoopbackOnly,
+		LoopbackOnly: config.LocalLoopbackOnly,
 	}
 
 	c.JSON(http.StatusOK, response)