From 46567e3d2ba7a3d9cd7810c6f2fcc3eb33dcbf09 Mon Sep 17 00:00:00 2001
From: Guillaume Chau <alphadelta.fg@gmail.com>
Date: Thu, 12 Apr 2018 20:26:44 +0200
Subject: [PATCH] feat(ui): try to load logo.png in package search

---
 .../src/components/PackageSearchItem.vue      | 31 ++++++++++++++++++-
 1 file changed, 30 insertions(+), 1 deletion(-)

diff --git a/packages/@vue/cli-ui/src/components/PackageSearchItem.vue b/packages/@vue/cli-ui/src/components/PackageSearchItem.vue
index de6d3bba3e..da6c11dc6b 100644
--- a/packages/@vue/cli-ui/src/components/PackageSearchItem.vue
+++ b/packages/@vue/cli-ui/src/components/PackageSearchItem.vue
@@ -6,7 +6,7 @@
     }"
   >
     <ItemLogo
-      :image="pkg.owner.avatar"
+      :image="logoUrl"
       :selected="selected"
     />
 
@@ -62,10 +62,39 @@ export default {
     }
   },
 
+  data () {
+    return {
+      logoUrl: null
+    }
+  },
+
   computed: {
     official () {
       return this.pkg.owner.name === 'vuejs'
     }
+  },
+
+  watch: {
+    pkg: {
+      handler: 'updateLogo',
+      immediate: true
+    }
+  },
+
+  methods: {
+    updateLogo () {
+      // By default, show the npm user avatar
+      this.logoUrl = this.pkg.owner.avatar
+
+      // Try to load the logo.png file inside the package
+      const name = this.pkg.name
+      const img = new Image()
+      img.onload = () => {
+        if (name !== this.pkg.name) return
+        this.logoUrl = img.src
+      }
+      img.src = `https://unpkg.com/${name}/logo.png`
+    }
   }
 }
 </script>