🔧 use board serial number as the keyboard ID

Author: peppapighs

bun.lock

@@ -15,43 +15,42 @@
   },
   "devDependencies": {
     "@eslint/compat": "^1.4.0",
-    "@eslint/js": "^9.37.0",
+    "@eslint/js": "^9.38.0",
     "@ianvs/prettier-plugin-sort-imports": "^4.7.0",
     "@internationalized/date": "^3.10.0",
     "@lucide/svelte": "^0.544.0",
     "@sveltejs/adapter-vercel": "^5.10.3",
-    "@sveltejs/kit": "^2.43.8",
+    "@sveltejs/kit": "^2.47.3",
     "@sveltejs/vite-plugin-svelte": "^6.2.1",
-    "@tailwindcss/vite": "^4.1.14",
+    "@tailwindcss/vite": "^4.1.16",
     "@types/w3c-web-hid": "^1.0.6",
-    "bits-ui": "^2.11.4",
+    "bits-ui": "^2.14.1",
     "clsx": "^2.1.1",
-    "eslint": "^9.37.0",
+    "eslint": "^9.38.0",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.4",
-    "eslint-plugin-svelte": "^3.12.4",
+    "eslint-plugin-svelte": "^3.12.5",
     "globals": "^16.4.0",
     "paneforge": "^1.0.2",
     "prettier": "^3.6.2",
     "prettier-plugin-svelte": "^3.4.0",
     "prettier-plugin-tailwindcss": "^0.6.14",
-    "svelte": "^5.39.8",
-    "svelte-check": "^4.3.2",
+    "svelte": "^5.42.2",
+    "svelte-check": "^4.3.3",
     "svelte-sonner": "^1.0.5",
     "tailwind-merge": "^3.3.1",
     "tailwind-variants": "^3.1.1",
-    "tailwindcss": "^4.1.14",
+    "tailwindcss": "^4.1.16",
     "tw-animate-css": "^1.4.0",
     "typescript": "^5.9.3",
-    "typescript-eslint": "^8.45.0",
-    "vite": "^7.1.9"
+    "typescript-eslint": "^8.46.2",
+    "vite": "^7.1.12"
   },
   "dependencies": {
     "@fontsource-variable/geist": "^5.2.8",
     "@fontsource-variable/geist-mono": "^5.2.7",
     "mode-watcher": "^1.1.0",
     "runed": "^0.34.0",
-    "uuid": "^13.0.0",
-    "zod": "^4.1.11"
+    "zod": "^4.1.12"
   }
 }

package.json

@@ -18,7 +18,7 @@ import {
   ArrowDownToLineIcon,
   ArrowUpFromLineIcon,
   ArrowUpToLineIcon,
-  FileQuestionIcon,
+  FileQuestionMarkIcon,
   LayersIcon,
   LayoutTemplateIcon,
   MoveHorizontalIcon,
@@ -90,7 +90,7 @@ export function getAdvancedKeyMetadata(type: HMK_AKType): AdvancedKeyMetadata {
   return (
     metadata ?? {
       type,
-      icon: FileQuestionIcon,
+      icon: FileQuestionMarkIcon,
       title: `Unknown ${displayUInt8(type)}`,
       description: "This Advanced Key type is not recognized.",
       numKeys: 0,

src/lib/configurator/lib/advanced-keys.ts

@@ -42,7 +42,9 @@ this program. If not, see <https://www.gnu.org/licenses/>.
 >
   {#snippet child({ props })}
     <AreaSelect
-      bind:selections={performanceState.keys}
+      bind:selections={
+        () => performanceState.keys, (v) => (performanceState.keys = v)
+      }
       class="flex flex-1 flex-col"
       {...props}
     >

src/lib/configurator/performance/performance-keyboard.svelte

@@ -13,6 +13,7 @@
  * this program. If not, see <https://www.gnu.org/licenses/>.
  */
 
+import { displayUInt16 } from "$lib/integer"
 import {
   HMK_DEVICE_USAGE_ID,
   HMK_DEVICE_USAGE_PAGE,
@@ -52,9 +53,9 @@ import {
   resetProfile,
 } from "$lib/libhmk/commands/profile"
 import { reboot } from "$lib/libhmk/commands/reboot"
+import { getSerial } from "$lib/libhmk/commands/serial"
 import { getTickRate, setTickRate } from "$lib/libhmk/commands/tick-rate"
 import { displayVersion, isWebHIDSSupported } from "$lib/utils"
-import { v4 as uuidv4 } from "uuid"
 import type {
   DuplicateProfileParams,
   GetActuationMapParams,
@@ -78,6 +79,7 @@ import { Commander } from "./commander"
 import type { KeyboardMetadata } from "./metadata"
 
 type HMKKeyboardProps = {
+  id: string
   metadata: KeyboardMetadata
   commander: Commander
   onDisconnect?: (keyboard: Keyboard) => void
@@ -90,8 +92,8 @@ class HMKKeyboard implements Keyboard {
   commander: Commander
   onDisconnect?: (keyboard: Keyboard) => void
 
-  constructor({ metadata, commander, onDisconnect }: HMKKeyboardProps) {
-    this.id = uuidv4()
+  constructor({ id, metadata, commander, onDisconnect }: HMKKeyboardProps) {
+    this.id = id
     this.metadata = metadata
     this.commander = commander
     this.onDisconnect = onDisconnect
@@ -224,9 +226,14 @@ export async function connect(
       )
     }
 
+    const serial = await getSerial(commander)
     const metadata = await getMetadata(commander)
-    console.log(metadata)
-    const keyboard = new HMKKeyboard({ metadata, commander, onDisconnect })
+    const keyboard = new HMKKeyboard({
+      id: `${displayUInt16(commander.hidDevice.vendorId)}-${displayUInt16(commander.hidDevice.productId)}-${serial}`,
+      metadata,
+      commander,
+      onDisconnect,
+    })
 
     navigator.hid.addEventListener("disconnect", async function handler() {
       navigator.hid.removeEventListener("disconnect", handler)

src/lib/keyboard/hmk-keyboard.svelte.ts

@@ -31,6 +31,7 @@ export enum HMK_Command {
   RESET_PROFILE,
   DUPLICATE_PROFILE,
   GET_METADATA,
+  GET_SERIAL,
 
   GET_KEYMAP = 128,
   SET_KEYMAP,

src/lib/libhmk/commands/index.ts

@@ -0,0 +1,27 @@
+/*
+ * This program is free software: you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License as published by the Free Software
+ * Foundation, either version 3 of the License, or (at your option) any later
+ * version.
+ *
+ * This program is distributed in the hope that it will be useful, but WITHOUT
+ * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
+ * FOR A PARTICULAR PURPOSE. See the GNU General Public License for more
+ * details.
+ *
+ * You should have received a copy of the GNU General Public License along with
+ * this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+import type { Commander } from "$lib/keyboard/commander"
+import { HMK_Command } from "."
+
+const SERIAL_MAX_LENGTH = 32
+
+export async function getSerial(commander: Commander) {
+  const decoder = new TextDecoder("utf-8")
+  const view = await commander.sendCommand({ command: HMK_Command.GET_SERIAL })
+  return decoder
+    .decode(view.buffer.slice(0, SERIAL_MAX_LENGTH))
+    .replace(/\0/g, "")
+}