Show empty Pinned section with hint; fix stale Recent card on launch (#70)

* show pinned section with empty hint when no pins exist

Display the Pinned section on the dashboard even when no installations
are pinned, with a hint message guiding users to right-click an install
to pin it. Uses a computed to avoid ref unwrapping issues in templates.

Amp-Thread-ID: https://ampcode.com/threads/T-019ca6df-24c7-750c-bbc0-fdefff59f674
Co-authored-by: Amp <amp@ampcode.com>

* fix: pinned section hint and stale Recent card after launch

- Replace v-else-if='!hasAnyPins' with v-else so the hint always
  renders when no pinned cards are visible
- Add allPinsInQuickLaunch computed to show a distinct message when
  all pins are already displayed in Quick Launch
- Broadcast installations-changed after lastLaunchedAt update so the
  dashboard Recent card refreshes immediately on launch

Amp-Thread-ID: https://ampcode.com/threads/T-019ca83b-24f9-746a-a55b-d5392c404bc9
Co-authored-by: Amp <amp@ampcode.com>

---------

Co-authored-by: Amp <amp@ampcode.com>

Author: Kosinkadink

locales/en.json

@@ -15,6 +15,8 @@
     "setPrimary": "Set as Primary",
     "cloudSection": "ComfyUI Cloud",
     "pinned": "Pinned",
+    "noPinned": "No pinned installations. Right-click an install to pin it to the dashboard.",
+    "pinnedInQuickLaunch": "Pinned installations are already shown in Quick Launch above.",
     "pinToDashboard": "Pin to Dashboard",
     "unpinFromDashboard": "Unpin from Dashboard"
   },

locales/zh.json

@@ -16,6 +16,8 @@
     "setPrimary": "设为主要",
     "cloudSection": "ComfyUI 云",
     "pinned": "已固定",
+    "noPinned": "没有固定的安装。右键单击安装以将其固定到仪表盘。",
+    "pinnedInQuickLaunch": "已固定的安装已在上方的快速启动中显示。",
     "pinToDashboard": "固定到仪表盘",
     "unpinFromDashboard": "从仪表盘取消固定"
   },

src/main/lib/ipc.ts

@@ -245,9 +245,11 @@ function _broadcastToRenderer(channel: string, data: Record<string, unknown>): v
 function _addSession(installationId: string, { proc, port, url, mode, installationName }: Omit<SessionInfo, 'startedAt'>): void {
   _runningSessions.set(installationId, { proc, port, url, mode, installationName, startedAt: Date.now() })
   _broadcastToRenderer('instance-started', { installationId, port, url, mode, installationName })
-  installations.update(installationId, { lastLaunchedAt: Date.now() }).catch((err) => {
-    console.error('Failed to update lastLaunchedAt:', err)
-  })
+  installations.update(installationId, { lastLaunchedAt: Date.now() })
+    .then(() => _broadcastToRenderer('installations-changed', {}))
+    .catch((err) => {
+      console.error('Failed to update lastLaunchedAt:', err)
+    })
 }
 
 function _removeSession(installationId: string): void {

src/renderer/src/assets/main.css

@@ -410,6 +410,7 @@ input[type="checkbox"]:checked::after { transform: translateX(16px); }
 .channel-preview-value { font-size: 13px; color: var(--text); }
 .channel-switch-btn { margin-top: 10px; }
 .channel-actions { display: flex; gap: 8px; margin-top: 10px; }
+.dashboard-empty-hint { font-size: 14px; color: var(--text-faint); padding: 12px 0; }
 .detail-item-list {
   background: var(--surface); border: 1px solid var(--border);
   border-radius: 8px; margin-bottom: 8px;

src/renderer/src/views/DashboardView.vue

@@ -83,6 +83,14 @@ const pinnedInstalls = computed(() => {
     .filter((i): i is Installation => !!i && i.sourceCategory !== 'cloud' && !excludeIds.has(i.id))
 })
 
+const allPinsInQuickLaunch = computed(() => {
+  if (pinnedInstalls.value.length > 0) return false
+  const quickLaunchIds = new Set<string>()
+  if (primaryInstall.value) quickLaunchIds.add(primaryInstall.value.id)
+  if (showLatestCard.value && latestInstall.value) quickLaunchIds.add(latestInstall.value.id)
+  return prefs.pinnedInstallIds.value.some((id) => quickLaunchIds.has(id))
+})
+
 // --- Actions for cards (separate generation counters) ---
 const primaryActions = ref<ListAction[]>([])
 const latestActions = ref<ListAction[]>([])
@@ -335,12 +343,12 @@ async function changePrimary(): Promise<void> {
       </div>
 
       <!-- Pinned section -->
-      <div v-if="pinnedInstalls.length > 0" class="dashboard-section">
+      <div v-if="primaryInstall" class="dashboard-section">
         <div class="dashboard-section-label">
           <Pin :size="14" style="vertical-align: -2px; margin-right: 4px;" />
           {{ $t('dashboard.pinned') }}
         </div>
-        <div class="dashboard-quick-launch">
+        <div v-if="pinnedInstalls.length > 0" class="dashboard-quick-launch">
           <div
             v-for="pinned in pinnedInstalls"
             :key="pinned.id"
@@ -363,6 +371,9 @@ async function changePrimary(): Promise<void> {
             </DashboardCard>
           </div>
         </div>
+        <div v-else class="dashboard-empty-hint">
+          {{ $t(allPinsInQuickLaunch ? 'dashboard.pinnedInQuickLaunch' : 'dashboard.noPinned') }}
+        </div>
       </div>
 
       <!-- Cloud section -->