Merge pull request #6678 from FlowFuse/6669-wrong-url-and-favicon

Use correct favicon and use provided link to package

Author: Steve-Mcl

frontend/src/components/expert/resource-cards/PackageResourceCard.vue

@@ -6,7 +6,7 @@
         class="package-card"
     >
         <img
-            :src="'https://www.google.com/s2/favicons?domain=flows.nodered.org'"
+            :src="getFaviconUrl(nodePackage.metadata?.source || nodePackage.url)"
             alt="Node-RED"
             class="package-favicon"
             @error="handleImageError"
@@ -15,7 +15,7 @@
             <div class="package-name">{{ getPackageName(nodePackage) }}</div>
             <div class="package-url">{{ getPackageUrl(nodePackage) }}</div>
             <div class="package-actions">
-                <template v-if="canManagePalette">
+                <template v-if="canManagePalette && !isCorePackage(nodePackage)">
                     <ff-button v-if="isPackageInstalled(nodePackage)" class="w-20" size="small" kind="secondary" @click.stop.prevent="managePackage(nodePackage)">Manage</ff-button>
                     <ff-button v-else class="w-20" size="small" kind="secondary" @click.stop.prevent="installPackage(nodePackage)">Install</ff-button>
                 </template>
@@ -46,8 +46,17 @@ export default {
             return typeof pkg === 'object' ? (pkg.id || pkg.name) : pkg
         },
         getPackageUrl (pkg) {
-            const packageName = this.getPackageName(pkg)
-            return `https://flows.nodered.org/node/${packageName}`
+            if (!pkg) return 'https://flows.nodered.org/'
+            return pkg.url || pkg.metadata?.source || pkg.metadata?.url || `https://flows.nodered.org/node/${this.getPackageName(pkg)}`
+        },
+        getFaviconUrl (url) {
+            try {
+                const urlObj = new URL(url)
+                return `https://www.google.com/s2/favicons?domain=${urlObj.hostname}`
+            } catch (e) {
+                // If URL parsing fails, return empty string to trigger error handler
+                return 'flows.nodered.org'
+            }
         },
         isPackageInstalled (pkg) {
             return !!this.$store.state.product.assistant?.palette?.[pkg.id]
@@ -77,6 +86,9 @@ export default {
             const packageName = this.getPackageName(nodePackage)
             this.manageNodePackage(packageName)
             // TODO: hide the ff-expert panel after managing. Ideally after a "success" message is received from the assistant
+        },
+        isCorePackage (nodePackage) {
+            return nodePackage.type === 'core-node' || this.getPackageName(nodePackage).startsWith('node-red:')
         }
     }
 }