simvyn 2.0.0 → 2.2.0

package/dist/dashboard/assets/{index-Pv0mHRGr.css → index-B6SC-KfX.css}

@@ -471,6 +471,10 @@
     z-index: 50;
   }
 
+  .z-\[100\] {
+    z-index: 100;
+  }
+
   .col-span-2 {
     grid-column: span 2 / span 2;
   }
@@ -776,8 +780,8 @@
     width: calc(var(--spacing) * 48);
   }
 
-  .w-72 {
-    width: calc(var(--spacing) * 72);
+  .w-84 {
+    width: calc(var(--spacing) * 84);
   }
 
   .w-\[30\%\] {
@@ -1314,6 +1318,10 @@
     background-color: #1e1e2d99 !important;
   }
 
+  .\!bg-\[rgba\(30\,30\,45\,0\.85\)\] {
+    background-color: #1e1e2dd9 !important;
+  }
+
   .bg-accent-blue {
     background-color: var(--color-accent-blue);
   }
@@ -1542,6 +1550,10 @@
     }
   }
 
+  .fill-amber-400 {
+    fill: var(--color-amber-400);
+  }
+
   .object-cover {
     object-fit: cover;
   }
@@ -1865,6 +1877,16 @@
     color: var(--color-text-muted);
   }
 
+  .text-text-muted\/40 {
+    color: #54555866;
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .text-text-muted\/40 {
+      color: color-mix(in oklab, var(--color-text-muted) 40%, transparent);
+    }
+  }
+
   .text-text-muted\/50 {
     color: #54555880;
   }
@@ -1944,6 +1966,16 @@
     }
   }
 
+  .shadow-black\/40 {
+    --tw-shadow-color: #0006;
+  }
+
+  @supports (color: color-mix(in lab, red, red)) {
+    .shadow-black\/40 {
+      --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 40%, transparent) var(--tw-shadow-alpha), transparent);
+    }
+  }
+
   .ring-green-500\/20 {
     --tw-ring-color: #00c75833;
   }
@@ -2103,6 +2135,16 @@
       }
     }
 
+    .hover\:text-amber-400\/60:hover {
+      color: #fcbb0099;
+    }
+
+    @supports (color: color-mix(in lab, red, red)) {
+      .hover\:text-amber-400\/60:hover {
+        color: color-mix(in oklab, var(--color-amber-400) 60%, transparent);
+      }
+    }
+
     .hover\:text-red-200:hover {
       color: var(--color-red-200);
     }

package/dist/dashboard/assets/{index-SgS9nwZ7.js → index-B_mApJSj.js}

@@ -30173,6 +30173,46 @@ function useWsListener(channel, type, handler) {
     return addListener(channel, type, handler);
   }, [addListener, channel, type, handler]);
 }
+const useFavouriteStore = create((set, get2) => ({
+  favouriteIds: /* @__PURE__ */ new Set(),
+  loaded: false,
+  load: async () => {
+    try {
+      const res = await fetch("/api/modules/devices/favourites");
+      if (res.ok) {
+        const data = await res.json();
+        const ids = data.favourites ?? [];
+        set({ favouriteIds: new Set(ids), loaded: true });
+      }
+    } catch {
+    }
+  },
+  toggle: async (id2) => {
+    const { favouriteIds } = get2();
+    const wasFavourite = favouriteIds.has(id2);
+    const next = new Set(favouriteIds);
+    if (wasFavourite) {
+      next.delete(id2);
+    } else {
+      next.add(id2);
+    }
+    set({ favouriteIds: next });
+    try {
+      const res = await fetch("/api/modules/devices/favourites", {
+        method: wasFavourite ? "DELETE" : "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ deviceId: id2 })
+      });
+      if (!res.ok) {
+        set({ favouriteIds });
+      }
+    } catch {
+      set({ favouriteIds });
+    }
+  },
+  isFavourite: (id2) => get2().favouriteIds.has(id2)
+}));
+useFavouriteStore.getState().load();
 const MULTI_SELECT_MODULES = /* @__PURE__ */ new Set(["location"]);
 function groupDevices(devices) {
   const groups = {};
@@ -30193,22 +30233,52 @@ function groupDevices(devices) {
   }
   return ordered;
 }
+function StarIcon({
+  filled,
+  onClick
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    "svg",
+    {
+      className: `h-3.5 w-3.5 shrink-0 cursor-pointer transition-colors ${filled ? "text-amber-400" : "text-text-muted/40 hover:text-amber-400/60"}`,
+      viewBox: "0 0 24 24",
+      fill: filled ? "currentColor" : "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      onClick,
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx("title", { children: filled ? "Remove from Favourites" : "Add to Favourites" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "path",
+          {
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            d: "M11.48 3.499a.562.562 0 011.04 0l2.125 5.111a.563.563 0 00.475.345l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 00-.182.557l1.285 5.385a.562.562 0 01-.84.61l-4.725-2.885a.563.563 0 00-.586 0L6.982 20.54a.562.562 0 01-.84-.61l1.285-5.386a.562.562 0 00-.182-.557l-4.204-3.602a.563.563 0 01.321-.988l5.518-.442a.563.563 0 00.475-.345L11.48 3.5z"
+          }
+        )
+      ]
+    }
+  );
+}
 function StateIndicator({ state }) {
   return /* @__PURE__ */ jsxRuntimeExports.jsx(
     "span",
     {
-      className: `inline-block h-2 w-2 rounded-full ${state === "booted" ? "bg-green-500 ring-2 ring-green-500/20" : "bg-text-muted/50"}`
+      className: `inline-block h-2 w-2 shrink-0 rounded-full ${state === "booted" ? "bg-green-500 ring-2 ring-green-500/20" : "bg-text-muted/50"}`
     }
   );
 }
 function DeviceSelector() {
   const [open, setOpen] = reactExports.useState(false);
+  const [contextMenu, setContextMenu] = reactExports.useState(null);
   const ref = reactExports.useRef(null);
   const devices = useDeviceStore((s) => s.devices);
   const selectedDeviceIds = useDeviceStore((s) => s.selectedDeviceIds);
   const selectDevice = useDeviceStore((s) => s.selectDevice);
   const toggleDevice = useDeviceStore((s) => s.toggleDevice);
   const truncateToFirst = useDeviceStore((s) => s.truncateToFirst);
+  const toggleFavourite = useFavouriteStore((s) => s.toggle);
+  const isFavourite = useFavouriteStore((s) => s.isFavourite);
   const activeModule = useModuleStore((s) => s.activeModule);
   const isMultiSelect = MULTI_SELECT_MODULES.has(activeModule ?? "");
   const handleDeviceDisconnected = reactExports.useCallback((payload) => {
@@ -30226,11 +30296,24 @@ function DeviceSelector() {
     function handleClick(e) {
       if (ref.current && !ref.current.contains(e.target)) {
         setOpen(false);
+        setContextMenu(null);
       }
     }
     document.addEventListener("mousedown", handleClick);
     return () => document.removeEventListener("mousedown", handleClick);
   }, []);
+  reactExports.useEffect(() => {
+    if (!contextMenu) return;
+    function handleClick() {
+      setContextMenu(null);
+    }
+    document.addEventListener("mousedown", handleClick);
+    return () => document.removeEventListener("mousedown", handleClick);
+  }, [contextMenu]);
+  const handleContextMenu = (e, deviceId) => {
+    e.preventDefault();
+    setContextMenu({ x: e.clientX, y: e.clientY, deviceId });
+  };
   const selectedSet = new Set(selectedDeviceIds);
   const firstDevice = devices.find((d) => d.id === selectedDeviceIds[0]);
   let label;
@@ -30266,7 +30349,7 @@ function DeviceSelector() {
         ]
       }
     ),
-    open && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "glass-panel absolute top-full right-0 z-50 mt-2 w-72 max-h-96 overflow-y-auto p-1 shadow-xl shadow-black/30 !backdrop-blur-2xl !bg-[rgba(30,30,45,0.6)]", children: [
+    open && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "glass-panel absolute top-full right-0 z-50 mt-2 w-84 max-h-96 overflow-y-auto p-1 shadow-xl shadow-black/30 !backdrop-blur-2xl !bg-[rgba(30,30,45,0.6)]", children: [
       Object.entries(groups).map(([platform, devs]) => /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-3 py-1 text-[10px] font-semibold uppercase tracking-wider text-text-muted", children: platform }),
         devs.map((d) => {
@@ -30283,24 +30366,32 @@ function DeviceSelector() {
                   setOpen(false);
                 }
               },
+              onContextMenu: (e) => handleContextMenu(e, d.id),
               className: `flex w-full items-center gap-2 rounded-[var(--radius-button)] px-3 py-2 text-left text-sm transition-colors ${isSelected ? "bg-accent-blue/20 text-accent-blue" : "text-text-primary hover:bg-[rgba(255,255,255,0.08)]"}`,
               children: [
                 isMultiSelect ? /* @__PURE__ */ jsxRuntimeExports.jsx(
                   "span",
                   {
-                    className: `inline-flex h-3.5 w-3.5 items-center justify-center rounded-full border ${isSelected ? "border-accent-blue bg-accent-blue" : "border-text-muted/50 bg-transparent"}`,
+                    className: `inline-flex h-3.5 w-3.5 shrink-0 items-center justify-center rounded-full border ${isSelected ? "border-accent-blue bg-accent-blue" : "border-text-muted/50 bg-transparent"}`,
                     children: isSelected && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "h-1.5 w-1.5 rounded-full bg-white" })
                   }
                 ) : /* @__PURE__ */ jsxRuntimeExports.jsx(StateIndicator, { state: d.state }),
-                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "flex-1 truncate", children: d.name }),
-                /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "text-xs text-text-muted", children: [
-                  d.osVersion,
-                  d.deviceType !== "Physical" && d.deviceType !== "Emulator" && d.deviceType !== "Unknown" && (d.id.startsWith("physical:") || d.deviceType !== d.name) ? ` · ${d.deviceType}` : ""
-                ] }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "flex-1 truncate", title: d.name, children: d.name }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "shrink-0 text-xs text-text-muted", children: d.osVersion }),
+                /* @__PURE__ */ jsxRuntimeExports.jsx(
+                  StarIcon,
+                  {
+                    filled: isFavourite(d.id),
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      toggleFavourite(d.id);
+                    }
+                  }
+                ),
                 !isMultiSelect && isSelected && /* @__PURE__ */ jsxRuntimeExports.jsxs(
                   "svg",
                   {
-                    className: "h-4 w-4 text-accent-blue",
+                    className: "h-4 w-4 shrink-0 text-accent-blue",
                     fill: "none",
                     viewBox: "0 0 24 24",
                     stroke: "currentColor",
@@ -30325,7 +30416,27 @@ function DeviceSelector() {
         })
       ] }, platform)),
       devices.length === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "px-3 py-4 text-center text-sm text-text-muted", children: "No devices detected" })
-    ] })
+    ] }),
+    contextMenu && /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "div",
+      {
+        className: "glass-panel fixed p-1 shadow-xl shadow-black/40 z-[100] !backdrop-blur-2xl !bg-[rgba(30,30,45,0.85)]",
+        style: { left: contextMenu.x, top: contextMenu.y },
+        children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "button",
+          {
+            type: "button",
+            className: "flex w-full items-center gap-2 rounded-[var(--radius-button)] px-3 py-1.5 text-left text-sm text-text-primary hover:bg-[rgba(255,255,255,0.08)] whitespace-nowrap",
+            onMouseDown: (e) => {
+              e.stopPropagation();
+              toggleFavourite(contextMenu.deviceId);
+              setContextMenu(null);
+            },
+            children: isFavourite(contextMenu.deviceId) ? "Remove from Favourites" : "Add to Favourites"
+          }
+        )
+      }
+    )
   ] });
 }
 function isMac() {
@@ -30485,6 +30596,8 @@ function DevicePanel() {
     } catch {
     }
   }
+  const favouriteIds = useFavouriteStore((s) => s.favouriteIds);
+  const favouriteDevices = devices.filter((d) => favouriteIds.has(d.id));
   const iosDevices = devices.filter((d) => d.platform === "ios");
   const androidDevices = devices.filter((d) => d.platform === "android");
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "p-6 space-y-6", children: [
@@ -30508,6 +30621,17 @@ function DevicePanel() {
       /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-base font-medium text-text-primary mb-2", children: "No Devices Detected" }),
       /* @__PURE__ */ jsxRuntimeExports.jsx("p", { className: "text-sm text-text-secondary", children: "Make sure Xcode Simulator or Android Emulator tools are installed." })
     ] }),
+    favouriteDevices.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(
+      FavouritesSection,
+      {
+        devices: favouriteDevices,
+        actionInFlight,
+        onAction: doAction,
+        onClone: handleClone,
+        onRename: handleRename,
+        onDelete: handleDelete
+      }
+    ),
     iosDevices.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(
       IosDeviceSection,
       {
@@ -30629,6 +30753,35 @@ function CreateSimulatorForm({ onCreated }) {
     ] })
   ] });
 }
+function FavouritesSection({
+  devices,
+  actionInFlight,
+  onAction,
+  onClone,
+  onRename,
+  onDelete
+}) {
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-2 mb-3", children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx(Star, { size: 14, className: "text-amber-400", fill: "currentColor" }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("h2", { className: "text-sm font-medium text-text-muted uppercase tracking-wider", children: "Favourites" })
+    ] }),
+    /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "grid gap-3 grid-cols-1 sm:grid-cols-2 lg:grid-cols-3", children: devices.map((device) => /* @__PURE__ */ jsxRuntimeExports.jsx(
+      DeviceCard,
+      {
+        device,
+        isLoading: actionInFlight?.deviceId === device.id,
+        loadingAction: actionInFlight?.deviceId === device.id ? actionInFlight.action : void 0,
+        onAction,
+        onClone: device.platform === "ios" ? () => onClone(device) : void 0,
+        onRename: device.platform === "ios" ? () => onRename(device) : void 0,
+        onDelete: device.platform === "ios" ? () => onDelete(device) : void 0,
+        showLifecycleActions: device.platform === "ios"
+      },
+      device.id
+    )) })
+  ] });
+}
 function IosDeviceSection({
   devices,
   actionInFlight,
@@ -30872,13 +31025,32 @@ function DeviceCard({
   onDelete,
   showLifecycleActions
 }) {
+  const isFav = useFavouriteStore((s) => s.isFavourite)(device.id);
+  const toggleFavourite = useFavouriteStore((s) => s.toggle);
   const truncatedId = device.id.length > 16 ? `${device.id.slice(0, 8)}…${device.id.slice(-6)}` : device.id;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "glass-panel p-4 flex flex-col gap-3 hover:border-glass-border-hover transition-all duration-150", children: [
-    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-start justify-between", children: [
+    /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-start justify-between gap-2", children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "min-w-0 flex-1", children: [
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "font-medium text-text-primary truncate", children: device.name }),
         /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text-xs text-text-muted mt-0.5 font-mono", children: truncatedId })
       ] }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => toggleFavourite(device.id),
+          className: "shrink-0 mt-0.5",
+          title: isFav ? "Remove from Favourites" : "Add to Favourites",
+          children: /* @__PURE__ */ jsxRuntimeExports.jsx(
+            Star,
+            {
+              size: 16,
+              className: `transition-colors cursor-pointer ${isFav ? "text-amber-400 fill-amber-400" : "text-text-muted/40 hover:text-amber-400/60"}`,
+              fill: isFav ? "currentColor" : "none"
+            }
+          )
+        }
+      ),
       /* @__PURE__ */ jsxRuntimeExports.jsx(StateBadge, { state: device.state })
     ] }),
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-3 text-xs text-text-secondary", children: [
@@ -51520,7 +51692,7 @@ function ToolSettingsPanel() {
   const [copied, setCopied] = reactExports.useState(false);
   const devices = useDeviceStore((s) => s.devices);
   const modules = useModuleStore((s) => s.modules);
-  const version = "2.0.0";
+  const version = "2.2.0";
   const fetchStorage = reactExports.useCallback(() => {
     fetch("/api/tool-settings/storage").then((r) => r.json()).then((data) => setStorage(data)).catch(() => {
     });
@@ -52868,4 +53040,4 @@ function App() {
 clientExports.createRoot(document.getElementById("root")).render(
   /* @__PURE__ */ jsxRuntimeExports.jsx(reactExports.StrictMode, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(App, {}) })
 );
-//# sourceMappingURL=index-SgS9nwZ7.js.map
+//# sourceMappingURL=index-B_mApJSj.js.map