refactor: update ActionDialog logic for plugin installation and clean…

CatalogModel.js

@@ -105,10 +105,15 @@ function activityState(record, nowValue) {
 
 function marketplaceAssetUrl(value, variant) {
   var path = cleanText(value)
+  if (!path) return ""
+  if (path.indexOf("http://") === 0 || path.indexOf("https://") === 0 || path.indexOf("file://") === 0)
+    return path
   var suffix = variant === "card" ? "card" : "detail"
   var pattern = new RegExp("^assets/img/plugins/[A-Za-z0-9._-]+-"
     + suffix + "\\.webp$")
-  return pattern.test(path) ? "https://omarchyplugins.com/" + path : ""
+  if (pattern.test(path)) return "https://omarchyplugins.com/" + path
+  if (path.indexOf("assets/img/plugins/") === 0) return "https://omarchyplugins.com/" + path
+  return ""
 }
 
 function normalizeRecord(value) {
@@ -136,11 +141,16 @@ function normalizeRecord(value) {
   record.addedAt = cleanText(record.addedAt)
   record.listedAt = cleanText(record.listedAt)
   record.versionUpdatedAt = cleanText(record.versionUpdatedAt)
-  record.previewImageUrl = record.marketplaceListed
-    ? marketplaceAssetUrl(record.previewImage, "detail") : ""
-  record.previewThumbnailUrl = record.marketplaceListed
-    ? marketplaceAssetUrl(record.previewThumbnail, "card")
-      || record.previewImageUrl : ""
+  record.previewImageUrl = marketplaceAssetUrl(record.previewImage, "detail")
+  record.previewThumbnailUrl = marketplaceAssetUrl(record.previewThumbnail, "card")
+    || record.previewImageUrl
+  if (!record.previewImageUrl && !record.previewThumbnailUrl && record.id) {
+    var configBase = (typeof Quickshell !== "undefined" && Quickshell && Quickshell.env)
+      ? (Quickshell.env("XDG_CONFIG_HOME") || (Quickshell.env("HOME") + "/.config"))
+      : "/home/harsh/.config"
+    record.previewThumbnailUrl = "file://" + configBase + "/omarchy/plugins/" + record.id + "/preview.png"
+    record.previewImageUrl = record.previewThumbnailUrl
+  }
   record.previewWidth = count(record.previewWidth)
   record.previewHeight = count(record.previewHeight)
   record.previewThumbnailWidth = count(record.previewThumbnailWidth)

PaletteResultRow.qml

@@ -1,4 +1,5 @@
 import QtQuick
+import Quickshell
 import qs.Commons
 
 Rectangle {
@@ -19,17 +20,23 @@ Rectangle {
   required property bool separatorBefore
   required property bool dangerous
 
+  property string previewThumbnailUrl: ""
+  property string previewImageUrl: ""
+  property bool installed: false
+  property bool builtIn: false
+
   property bool selected: false
   property bool settingsMenuOpen: false
   property bool pointerInteractive: true
-  property int rowHeight: Style.space(60)
+  property int rowHeight: Style.space(62)
   property color foreground: Color.menu.text
   property color selectedBackground: Color.menu.selectedBackground
   property color selectedText: Color.menu.selectedText
   property color urgent: Color.urgent
+  property color accent: Color.accent
 
-  signal hovered()
-  signal activated()
+  signal hovered
+  signal activated
   signal repositoryRequested(string url)
 
   height: rowHeight
@@ -48,15 +55,104 @@ Rectangle {
   MouseArea {
     anchors.fill: parent
     hoverEnabled: true
-    cursorShape: root.pointerInteractive
-      ? Qt.PointingHandCursor : Qt.ArrowCursor
-    onEntered: if (root.pointerInteractive) root.hovered()
-    onClicked: if (root.pointerInteractive) root.activated()
+    cursorShape: root.pointerInteractive ? Qt.PointingHandCursor : Qt.ArrowCursor
+    onEntered: if (root.pointerInteractive)
+      root.hovered()
+    onClicked: if (root.pointerInteractive)
+      root.activated()
   }
 
-  Column {
+  // Left Section: Index Number
+  Text {
+    id: indexLabel
+    visible: !root.settingsMenuOpen
     anchors.left: parent.left
-    anchors.leftMargin: Style.spacing.md
+    anchors.leftMargin: Style.spacing.sm
+    anchors.verticalCenter: parent.verticalCenter
+    width: Style.space(26)
+    text: String(root.index + 1)
+    textFormat: Text.PlainText
+    color: root.selected ? root.selectedText : Qt.darker(root.foreground, 1.45)
+    font.family: Style.font.menuFamily
+    font.pixelSize: Style.font.body
+    font.bold: true
+    horizontalAlignment: Text.AlignHCenter
+    elide: Text.ElideNone
+  }
+
+  // Thumbnail Container
+  Rectangle {
+    id: thumbBox
+    visible: !root.settingsMenuOpen
+    anchors.left: indexLabel.right
+    anchors.leftMargin: Style.space(4)
+    anchors.verticalCenter: parent.verticalCenter
+    width: Style.space(48)
+    height: Style.space(40)
+    radius: Style.space(6)
+    color: Util.alpha(root.foreground, 0.08)
+    border.width: 1
+    border.color: root.selected ? Util.alpha(root.selectedText, 0.35) : Util.alpha(root.foreground, 0.14)
+    clip: true
+
+    Image {
+      id: thumbImage
+      anchors.fill: parent
+      anchors.margins: 1
+      asynchronous: true
+      cache: true
+      fillMode: Image.PreserveAspectCrop
+      mipmap: true
+      source: {
+        if (root.previewThumbnailUrl)
+          return root.previewThumbnailUrl
+        if (root.previewImageUrl)
+          return root.previewImageUrl
+        if (root.pluginId) {
+          var cfg = Quickshell.env("XDG_CONFIG_HOME") || (Quickshell.env("HOME") + "/.config")
+          return "file://" + cfg + "/omarchy/plugins/" + root.pluginId + "/preview.png"
+        }
+        return ""
+      }
+    }
+
+    Text {
+      anchors.centerIn: parent
+      visible: thumbImage.status !== Image.Ready
+      text: {
+        var id = root.pluginId.toLowerCase()
+        if (id.indexOf("ram") >= 0 || id.indexOf("memory") >= 0)
+          return "󰍛"
+        if (id.indexOf("monitor") >= 0 || id.indexOf("display") >= 0)
+          return "󰍹"
+        if (id.indexOf("audio") >= 0 || id.indexOf("volume") >= 0)
+          return "󰕾"
+        if (id.indexOf("power") >= 0 || id.indexOf("battery") >= 0)
+          return "󰁹"
+        if (id.indexOf("weather") >= 0)
+          return "󰖙"
+        if (id.indexOf("wifi") >= 0 || id.indexOf("network") >= 0 || id.indexOf("tailscale") >= 0)
+          return "󰖩"
+        if (id.indexOf("bluetooth") >= 0)
+          return "󰂯"
+        if (id.indexOf("clock") >= 0 || id.indexOf("time") >= 0)
+          return "󰥔"
+        if (id.indexOf("agent") >= 0 || id.indexOf("ai") >= 0)
+          return "󰚥"
+        if (id.indexOf("bar") >= 0)
+          return "󱊔"
+        return "󰏗"
+      }
+      color: root.selected ? root.selectedText : root.accent
+      font.family: Style.font.family
+      font.pixelSize: Style.font.title
+    }
+  }
+
+  // Text Content Column
+  Column {
+    anchors.left: root.settingsMenuOpen ? parent.left : thumbBox.right
+    anchors.leftMargin: root.settingsMenuOpen ? Style.spacing.md : Style.spacing.md
     anchors.right: badgeColumn.left
     anchors.rightMargin: Style.spacing.sm
     anchors.verticalCenter: parent.verticalCenter
@@ -67,12 +163,10 @@ Rectangle {
       spacing: Style.spacing.sm
 
       Text {
-        width: Math.min(implicitWidth, parent.width
-          * (root.settingsMenuOpen ? 1 : 0.52))
+        width: Math.min(implicitWidth, parent.width * (root.settingsMenuOpen ? 1 : 0.52))
         text: root.pluginName
         textFormat: Text.PlainText
-        color: root.selected ? root.selectedText
-          : (root.dangerous ? root.urgent : root.foreground)
+        color: root.selected ? root.selectedText : (root.dangerous ? root.urgent : root.foreground)
         font.family: Style.font.menuFamily
         font.pixelSize: Style.font.title
         font.bold: true
@@ -94,8 +188,7 @@ Rectangle {
 
     Text {
       width: parent.width
-      text: root.settingsMenuOpen ? root.description
-        : root.author + " - " + (root.description || root.kind)
+      text: root.settingsMenuOpen ? root.description : root.author + " - " + (root.description || root.kind)
       textFormat: Text.PlainText
       color: root.selected ? root.selectedText : root.foreground
       opacity: 0.65
@@ -124,15 +217,16 @@ Rectangle {
         id: repositoryMouse
         anchors.fill: parent
         hoverEnabled: true
-        cursorShape: root.pointerInteractive
-          ? Qt.PointingHandCursor : Qt.ArrowCursor
-        onEntered: if (root.pointerInteractive) root.hovered()
+        cursorShape: root.pointerInteractive ? Qt.PointingHandCursor : Qt.ArrowCursor
+        onEntered: if (root.pointerInteractive)
+          root.hovered()
         onClicked: if (root.pointerInteractive)
           root.repositoryRequested(root.repository)
       }
     }
   }
 
+  // Badges Column on Right
   Column {
     id: badgeColumn
     visible: !root.settingsMenuOpen
@@ -144,9 +238,7 @@ Rectangle {
 
     Text {
       width: parent.width
-      text: root.stateLabel
-        + (root.version ? "  " + root.version : "")
-        + (root.releaseTag ? "  " + root.releaseTag : "")
+      text: root.stateLabel + (root.version ? "  " + root.version : "") + (root.releaseTag ? "  " + root.releaseTag : "")
       textFormat: Text.PlainText
       color: root.selected ? root.selectedText : root.foreground
       font.family: Style.font.menuFamily
@@ -159,8 +251,7 @@ Rectangle {
       width: parent.width
       text: root.sourceLabel + (root.warning ? " - " + root.warning : "")
       textFormat: Text.PlainText
-      color: root.warning ? root.urgent
-        : (root.selected ? root.selectedText : root.foreground)
+      color: root.warning ? root.urgent : (root.selected ? root.selectedText : root.foreground)
       opacity: root.warning ? 1 : 0.55
       font.family: Style.font.menuFamily
       font.pixelSize: Style.font.body

PaletteViewModel.js

@@ -30,9 +30,15 @@ function settingsResult() {
 
 function displayRecord(record) {
   var value = record || {}
+  var id = String(value.id || "")
+  var thumbUrl = String(value.previewThumbnailUrl || value.previewImageUrl || "")
+  var detailUrl = String(value.previewImageUrl || "")
+  if (!thumbUrl && id) {
+    thumbUrl = "file://" + (Quickshell.env("XDG_CONFIG_HOME") || (Quickshell.env("HOME") + "/.config")) + "/omarchy/plugins/" + id + "/preview.png"
+  }
   return {
     pluginName: String(value.name || value.id || ""),
-    pluginId: String(value.id || ""),
+    pluginId: id,
     description: String(value.description || ""),
     author: String(value.author || "Unknown"),
     kind: String(value.kind || value.category || "Plugin"),
@@ -43,7 +49,11 @@ function displayRecord(record) {
     releaseTag: String(value.releaseTag || ""),
     repository: String(value.repository || ""),
     separatorBefore: value.separatorBefore === true,
-    dangerous: value.dangerous === true
+    dangerous: value.dangerous === true,
+    previewThumbnailUrl: thumbUrl,
+    previewImageUrl: detailUrl,
+    installed: value.installed === true,
+    builtIn: value.builtIn === true
   }
 }
 
@@ -91,13 +101,11 @@ function actionOptions(record, readOnly) {
         ? { operation: "enable", label: "Enable", available: true }
         : { operation: "disable", label: "Disable", available: true })
     }
-    if (record.removable === true) {
-      options.push({ operation: "remove", label: "Remove",
-        available: record.dirty !== true,
-        reason: record.dirty === true
-          ? "Removal is blocked because this Git checkout has local changes."
-          : "", dangerous: true })
-    }
+    options.push({ operation: "remove", label: "Uninstall",
+      available: record.dirty !== true,
+      reason: record.dirty === true
+        ? "Removal is blocked because this Git checkout has local changes."
+        : "", dangerous: true })
     return options
   }
   if (record.installable === true)