From 50458901d6a132531d8a5c43427d1f7b77870237 Mon Sep 17 00:00:00 2001
From: ben <ben@arc.wales>
Date: Wed, 25 Jan 2023 16:55:08 +0000
Subject: [PATCH] Added generic icon for iconless plugiins

---
 lnbits/core/static/extension.png           | Bin 0 -> 8913 bytes
 lnbits/core/static/js/extensions.js        |   8 ++-
 lnbits/core/templates/core/extensions.html |  39 +++++++++--
 lnbits/core/templates/core/install.html    |  75 +++++++++++++--------
 lnbits/static/js/components.js             |   2 +-
 5 files changed, 89 insertions(+), 35 deletions(-)
 create mode 100644 lnbits/core/static/extension.png

diff --git a/lnbits/core/static/extension.png b/lnbits/core/static/extension.png
new file mode 100644
index 0000000000000000000000000000000000000000..78378fd7679c93434adca5d0cbb64bae0e3c72a2
GIT binary patch
literal 8913
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

literal 0
HcmV?d00001

diff --git a/lnbits/core/static/js/extensions.js b/lnbits/core/static/js/extensions.js
index c51af4b8..ad9745e7 100644
--- a/lnbits/core/static/js/extensions.js
+++ b/lnbits/core/static/js/extensions.js
@@ -4,7 +4,8 @@ new Vue({
     return {
       searchTerm: '',
       filteredExtensions: null,
-      maxStars: 5
+      maxStars: 5,
+      user: null
     }
   },
   mounted() {
@@ -33,5 +34,10 @@ new Vue({
       }
     }
   },
+  created() {
+    if (window.user) {
+      this.user = LNbits.map.user(window.user)
+    }
+  },
   mixins: [windowMixin]
 })
diff --git a/lnbits/core/templates/core/extensions.html b/lnbits/core/templates/core/extensions.html
index 1db58a00..bf41e276 100644
--- a/lnbits/core/templates/core/extensions.html
+++ b/lnbits/core/templates/core/extensions.html
@@ -3,9 +3,19 @@
 <script src="/core/static/js/extensions.js"></script>
 {% endblock %} {% block page %}
 <div class="row q-col-gutter-md q-mb-md">
-  <div class="col-sm-9 col-xs-12 mt-lg">
-    <p class="text-h4">Extensions</p>
+  <div class="col-sm-9 gt-sm col-xs-12 mt-lg">
+    <p class="text-h4">
+      Extensions
+      <q-btn
+        flat
+        color="primary"
+        type="a"
+        :href="['/install?usr=', user.id].join('')"
+        >Add Extensions</q-btn
+      >
+    </p>
   </div>
+
   <div class="col-sm-3 col-xs-12 q-ml-auto">
     <q-input v-model="searchTerm" label="Search extensions">
       <q-icon
@@ -25,18 +35,39 @@
     :key="extension.code"
   >
     <q-card>
-      <q-card-section>
+      <q-card-section style="min-height: 140px">
         <div class="row">
           <div class="col-3">
             <q-img
+              v-if="extension.tile"
               :src="extension.tile"
               spinner-color="white"
               style="max-width: 100%"
             ></q-img>
+            <div v-else>
+              <q-icon
+                class="gt-sm"
+                name="extension"
+                color="primary"
+                size="70px"
+              ></q-icon>
+              <q-icon
+                class="lt-md"
+                name="extension"
+                color="primary"
+                size="35px"
+              ></q-icon>
+            </div>
           </div>
           <div class="col-9 q-pl-sm">
             {% raw %}
-            <div class="text-h5 gt-sm q-mt-sm q-mb-xs">
+            <div class="text-h5 gt-sm q-mt-sm q-mb-xs gt-sm">
+              {{ extension.name }}
+            </div>
+            <div
+              class="text-h5 gt-sm q-mt-sm q-mb-xs lt-md"
+              style="min-height: 60px"
+            >
               {{ extension.name }}
             </div>
             <div
diff --git a/lnbits/core/templates/core/install.html b/lnbits/core/templates/core/install.html
index a9fd933a..5aba9fb3 100644
--- a/lnbits/core/templates/core/install.html
+++ b/lnbits/core/templates/core/install.html
@@ -2,7 +2,7 @@
 %} {% block page %}
 <div class="row q-col-gutter-md q-mb-md">
   <div class="col-sm-9 col-xs-12">
-    <p class="text-h4">
+    <p class="text-h4 gt-sm">
       Add Extensions <small v-if="!g.user.admin">(admin only)</small>
     </p>
   </div>
@@ -58,22 +58,29 @@
     :key="extension.id + extension.hash"
   >
     <q-card>
-      <q-card-section>
+      <q-card-section style="min-height: 140px">
         <div class="row">
           <div class="col-3">
             <q-img
-              v-if="extension.iconUrl"
-              :src="extension.iconUrl"
+              v-if="extension.tile"
+              :src="extension.tile"
               spinner-color="white"
-              style="max-width: 64px"
-              class="rounded-borders"
+              style="max-width: 100%"
             ></q-img>
-            <q-icon
-              v-else
-              :name="extension.icon"
-              color="grey-5"
-              size="lg"
-            ></q-icon>
+            <div v-else>
+              <q-icon
+                class="gt-sm"
+                name="extension"
+                color="primary"
+                size="70px"
+              ></q-icon>
+              <q-icon
+                class="lt-md"
+                name="extension"
+                color="primary"
+                size="35px"
+              ></q-icon>
+            </div>
           </div>
           <div class="col-9 q-pl-sm">
             <q-badge
@@ -84,7 +91,13 @@
               <small>New Version</small>
             </q-badge>
             {% raw %}
-            <div class="text-h5 gt-sm q-mt-sm q-mb-xs">
+            <div class="text-h5 gt-sm q-mt-sm q-mb-xs gt-sm">
+              {{ extension.name }}
+            </div>
+            <div
+              class="text-h5 gt-sm q-mt-sm q-mb-xs lt-md"
+              style="min-height: 60px"
+            >
               {{ extension.name }}
             </div>
             <div
@@ -118,21 +131,25 @@
             </q-badge>
           </div>
         </div>
-        <div class="row q-pt-sm">
-          <div class="col">
-            <q-rating
-              max="5"
-              disable
-              v-model="maxStars"
-              size="1.5em"
-              color="primary"
-              icon-selected="star"
-              readonly
-              no-dimming
-            >
-            </q-rating>
-            <q-tooltip>Ratings coming soon</q-tooltip>
-          </div>
+      </q-card-section>
+      <q-card-section>
+        <div>
+          <q-rating
+            class="gt-sm"
+            v-model="maxStars"
+            disable
+            size="1.5em"
+            :max="5"
+            color="primary"
+          ></q-rating>
+          <q-rating
+            v-model="maxStars"
+            class="lt-md"
+            size="1.5em"
+            :max="5"
+            color="primary"
+          ></q-rating
+          ><q-tooltip>Ratings coming soon</q-tooltip>
         </div>
       </q-card-section>
       <q-separator v-if="g.user.admin"></q-separator>
@@ -309,7 +326,7 @@
         showUpgradeDialog: false,
         selectedExtension: null,
         selectedExtensionRepos: null,
-        maxStars: 0
+        maxStars: 5
       }
     },
     watch: {
diff --git a/lnbits/static/js/components.js b/lnbits/static/js/components.js
index b67380ad..0911ea4a 100644
--- a/lnbits/static/js/components.js
+++ b/lnbits/static/js/components.js
@@ -145,7 +145,7 @@ Vue.component('lnbits-extension-list', {
           <q-icon name="playlist_add" color="grey-5" size="md"></q-icon>
         </q-item-section>
         <q-item-section>
-          <q-item-label lines="1" class="text-caption">Add extensions</q-item-label>
+          <q-item-label lines="1" class="text-caption">Add Extensions</q-item-label>
         </q-item-section>
       </q-item>
     </q-list>