refactor: move _api_docs.html into vue component (#3520)

lnbits/templates/components.vue

@@ -18,98 +18,9 @@ include('components/lnbits-drawer.vue') %} {%
 include('components/lnbits-home-logos.vue') %} {%
 include('components/lnbits-manage-extension-list.vue') %} {%
 include('components/lnbits-language-dropdown.vue') %} {%
-include('components/lnbits-payment-list.vue') %}
-
-<template id="lnbits-wallet-list">
-  <q-list
-    v-if="g.user && g.user.wallets.length"
-    dense
-    class="lnbits-drawer__q-list"
-  >
-    <q-item
-      v-for="walletRec in g.user.wallets.slice(
-        0,
-        g.user.extra.visible_wallet_count || 10
-      )"
-      :key="walletRec.id"
-      clickable
-      :active="g.wallet && g.wallet.id === walletRec.id"
-      @click="selectWallet(walletRec)"
-    >
-      <q-item-section side>
-        <q-avatar
-          size="lg"
-          :text-color="$q.dark.isActive ? 'black' : 'grey-3'"
-          :class="g.wallet && g.wallet.id === walletRec.id ? '' : 'disabled'"
-          :color="
-            g.wallet && g.wallet.id === walletRec.id
-              ? walletRec.extra.color
-              : walletRec.extra.color
-          "
-          :icon="
-            g.wallet && g.wallet.id === walletRec.id
-              ? walletRec.extra.icon
-              : walletRec.extra.icon
-          "
-        >
-        </q-avatar>
-      </q-item-section>
-      <q-item-section
-        style="max-width: 100px"
-        class="q-my-none ellipsis full-width"
-      >
-        <q-item-label lines="1"
-          ><span v-text="walletRec.name"></span
-        ></q-item-label>
-        <q-item-label class="q-my-none ellipsis full-width" caption>
-          <strong v-text="formatBalance(walletRec.sat)"></strong>
-        </q-item-label>
-      </q-item-section>
-      <q-item-section
-        v-if="walletRec.walletType == 'lightning-shared'"
-        side
-        top
-      >
-        <q-icon name="group" :color="walletRec.extra.color" size="xs"></q-icon>
-      </q-item-section>
-    </q-item>
-    <q-item
-      v-if="g.user.hiddenWalletsCount > 0"
-      clickable
-      @click="goToWallets()"
-    >
-      <q-item-section side>
-        <q-icon name="more_horiz" color="grey-5" size="md"></q-icon>
-      </q-item-section>
-      <q-item-section>
-        <q-item-label
-          lines="1"
-          class="text-caption"
-          v-text="$t('more_count', {count: g.user.hiddenWalletsCount})"
-        ></q-item-label>
-      </q-item-section>
-    </q-item>
-    <q-item clickable @click="createWallet()">
-      <q-item-section side>
-        <q-icon name="add" color="grey-5" size="md"></q-icon>
-      </q-item-section>
-      <q-item-section>
-        <q-item-label
-          lines="1"
-          class="text-caption"
-          v-text="$t('add_new_wallet')"
-        ></q-item-label>
-        <q-item-section v-if="g.user.walletInvitesCount" side>
-          <q-badge>
-            <span
-              v-text="'Wallet Invite (' + g.user.walletInvitesCount + ')'"
-            ></span>
-          </q-badge>
-        </q-item-section>
-      </q-item-section>
-    </q-item>
-  </q-list>
-</template>
+include('components/lnbits-payment-list.vue') %} {%
+include('components/lnbits-wallet-api-docs.vue') %} {%
+include('components/lnbits-wallet-list.vue') %}
 
 <template id="lnbits-manage">
   <q-list v-if="g.user" dense class="lnbits-drawer__q-list">