feat: ui, adds full/thumb buttons to assets (#3928)

lnbits/templates/pages/account.vue

@@ -1108,11 +1108,16 @@
                             <q-separator></q-separator>
 
                             <q-card-section>
+                              <div
+                                class="row items-center no-wrap q-col-gutter-sm"
+                              >
+                                <div class="col">
                                   <q-btn-dropdown
                                     color="grey"
                                     dense
                                     outline
                                     no-caps
+                                    class="full-width"
                                     :label="props.row.name"
                                     :icon="props.row.is_public ? 'public' : ''"
                                   >
@@ -1120,7 +1125,9 @@
                                       <q-item
                                         clickable
                                         v-close-popup
-                                    @click="copyAssetLinkToClipboard(props.row)"
+                                        @click="
+                                          copyAssetLinkToClipboard(props.row)
+                                        "
                                       >
                                         <q-item-section avatar>
                                           <q-avatar icon="content_copy" />
@@ -1137,7 +1144,9 @@
                                       <q-item
                                         clickable
                                         v-close-popup
-                                    @click="toggleAssetPublicAccess(props.row)"
+                                        @click="
+                                          toggleAssetPublicAccess(props.row)
+                                        "
                                       >
                                         <q-item-section avatar>
                                           <q-avatar
@@ -1149,16 +1158,20 @@
                                             text-color="primary"
                                           />
                                         </q-item-section>
-                                    <q-item-section v-if="props.row.is_public">
+                                        <q-item-section
+                                          v-if="props.row.is_public"
+                                        >
                                           <q-item-label>Unpublish</q-item-label>
                                           <q-item-label caption
-                                        >Make this asset private</q-item-label
+                                            >Make this asset
+                                            private</q-item-label
                                           >
                                         </q-item-section>
                                         <q-item-section v-else>
                                           <q-item-label>Publish</q-item-label>
                                           <q-item-label caption
-                                        >Make this asset public</q-item-label
+                                            >Make this asset
+                                            public</q-item-label
                                           >
                                         </q-item-section>
                                       </q-item>
@@ -1184,6 +1197,41 @@
                                       </q-item>
                                     </q-list>
                                   </q-btn-dropdown>
+                                </div>
+                                <div class="col-auto">
+                                  <q-btn
+                                    type="a"
+                                    target="_blank"
+                                    rel="noopener noreferrer"
+                                    color="primary"
+                                    dense
+                                    flat
+                                    round
+                                    icon="image"
+                                    :href="`/api/v1/assets/${props.row.id}/data`"
+                                  >
+                                    <q-tooltip>Full image</q-tooltip>
+                                  </q-btn>
+                                </div>
+                                <div
+                                  class="col-auto"
+                                  v-if="props.row.thumbnail_base64"
+                                >
+                                  <q-btn
+                                    type="a"
+                                    target="_blank"
+                                    rel="noopener noreferrer"
+                                    color="secondary"
+                                    dense
+                                    flat
+                                    round
+                                    icon="photo_size_select_small"
+                                    :href="`/api/v1/assets/${props.row.id}/thumbnail`"
+                                  >
+                                    <q-tooltip>Thumbnail</q-tooltip>
+                                  </q-btn>
+                                </div>
+                              </div>
                             </q-card-section>
                           </q-card>
                         </div>