refactor: decorators, models and more broken bits

2020-03-04 23:11:15 +01:00
parent ee70161854
commit f98a5040ac
69 changed files with 52715 additions and 1018 deletions
@@ -0,0 +1,146 @@
+var LOCALE = 'en'
+
+var LNbits = {
+  api: {
+    request: function (method, url, macaroon, data) {
+      return axios({
+        method: method,
+        url: url,
+        headers: {
+          'Grpc-Metadata-macaroon': macaroon
+        },
+        data: data
+      });
+    },
+    createInvoice: function (wallet, amount, memo) {
+      return this.request('post', '/api/v1/invoices', wallet.inkey, {
+        amount: amount,
+        memo: memo
+      });
+    },
+    getInvoice: function (wallet, payhash) {
+      return this.request('get', '/api/v1/invoices/' + payhash, wallet.inkey);
+    },
+    getTransactions: function (wallet) {
+      return this.request('get', '/api/v1/transactions', wallet.inkey);
+    }
+  },
+  href: {
+    openWallet: function (wallet) {
+      window.location.href = '/wallet?usr=' + wallet.user + '&wal=' + wallet.id;
+    },
+    createWallet: function (walletName, userId) {
+      window.location.href = '/wallet?' + (userId ? 'usr=' + userId + '&' : '') + 'nme=' + walletName;
+    },
+    deleteWallet: function (walletId, userId) {
+      window.location.href = '/deletewallet?usr=' + userId + '&wal=' + walletId;
+    }
+  },
+  map: {
+    extension: function (data) {
+      var obj = _.object(['code', 'isValid', 'name', 'shortDescription', 'icon'], data);
+      obj.url = ['/', obj.code, '/'].join('');
+      return obj;
+    },
+    transaction: function (data) {
+      var obj = _.object(['payhash', 'pending', 'amount', 'fee', 'memo', 'time'], data);
+      obj.date = Quasar.utils.date.formatDate(new Date(obj.time * 1000), 'YYYY-MM-DD HH:mm')
+      obj.msat = obj.amount;
+      obj.sat = obj.msat / 1000;
+      obj.fsat = new Intl.NumberFormat(LOCALE).format(obj.sat);
+      return obj;
+    },
+    user: function (data) {
+      var obj = _.object(['id', 'email', 'extensions', 'wallets'], data);
+      var mapWallet = this.wallet;
+      obj.wallets = obj.wallets.map(function (obj) {
+        return mapWallet(obj);
+      }).sort(function (a, b) {
+        return a.name > b.name;
+      });
+      return obj;
+    },
+    wallet: function (data) {
+      var obj = _.object(['id', 'name', 'user', 'adminkey', 'inkey', 'balance'], data);
+      obj.sat = Math.round(obj.balance);
+      obj.fsat = new Intl.NumberFormat(LOCALE).format(obj.sat);
+      obj.url = ['/wallet?usr=', obj.user, '&wal=', obj.id].join('');
+      return obj;
+    }
+  },
+  utils: {
+    formatSat: function (value) {
+      return new Intl.NumberFormat(LOCALE).format(value);
+    },
+    notifyApiError: function (error) {
+      var types = {
+        400: 'warning',
+        401: 'warning',
+        500: 'negative'
+      }
+      Quasar.plugins.Notify.create({
+        progress: true,
+        timeout: 3000,
+        type: types[error.response.status] || 'warning',
+        message: error.response.data.message || null,
+        caption: [error.response.status, ' ', error.response.statusText].join('') || null,
+        icon: null
+      });
+    }
+  }
+};
+
+var windowMixin = {
+  data: function () {
+    return {
+      w: {
+        visibleDrawer: false,
+        extensions: [],
+        user: null,
+        wallet: null,
+        transactions: [],
+      }
+    };
+  },
+  methods: {
+    toggleDarkMode: function () {
+      this.$q.dark.toggle();
+      this.$q.localStorage.set('lnbits.darkMode', this.$q.dark.isActive);
+    },
+    copyText: function (text, message) {
+      var notify = this.$q.notify;
+      Quasar.utils.copyToClipboard(text).then(function () {
+        notify({message: 'Copied to clipboard!'});
+      });
+    }
+  },
+  created: function () {
+    this.$q.dark.set(this.$q.localStorage.getItem('lnbits.darkMode'));
+    if (window.user) {
+      this.w.user = Object.freeze(LNbits.map.user(window.user));
+    }
+    if (window.wallet) {
+      this.w.wallet = Object.freeze(LNbits.map.wallet(window.wallet));
+    }
+    if (window.transactions) {
+      this.w.transactions = window.transactions.map(function (data) {
+        return LNbits.map.transaction(data);
+      });
+    }
+    if (window.extensions) {
+      var user = this.w.user;
+      this.w.extensions = Object.freeze(window.extensions.map(function (data) {
+        return LNbits.map.extension(data);
+      }).map(function (obj) {
+        if (user) {
+          obj.isEnabled = user.extensions.indexOf(obj.code) != -1;
+        } else {
+          obj.isEnabled = false;
+        }
+        return obj;
+      }).sort(function (a, b) {
+        return a.name > b.name;
+      }));
+    }
+  }
+};
@@ -0,0 +1,122 @@
+Vue.component('lnbits-wallet-list', {
+  data: function () {
+    return {
+      user: null,
+      activeWallet: null,
+      showForm: false,
+      walletName: ''
+    }
+  },
+  template: `
+    <q-list v-if="user && user.wallets.length" dense class="lnbits-drawer__q-list">
+      <q-item-label header>Wallets</q-item-label>
+      <q-item v-for="wallet in user.wallets" :key="wallet.id"
+        clickable
+        :active="activeWallet && activeWallet.id == wallet.id"
+        tag="a" :href="wallet.url">
+        <q-item-section side>
+          <q-avatar size="md"
+            :color="(activeWallet && activeWallet.id == wallet.id)
+              ? (($q.dark.isActive) ? 'deep-purple-5' : 'deep-purple')
+              : 'grey-5'">
+            <q-icon name="flash_on" :size="($q.dark.isActive) ? '21px' : '20px'"
+              :color="($q.dark.isActive) ? 'blue-grey-10' : 'grey-3'"></q-icon>
+          </q-avatar>
+        </q-item-section>
+        <q-item-section>
+          <q-item-label lines="1">{{ wallet.name }}</q-item-label>
+          <q-item-label caption>{{ wallet.fsat }} sat</q-item-label>
+        </q-item-section>
+        <q-item-section side v-show="activeWallet && activeWallet.id == wallet.id">
+          <q-icon name="chevron_right" color="grey-5" size="md"></q-icon>
+        </q-item-section>
+      </q-item>
+      <q-item clickable @click="showForm = !showForm">
+        <q-item-section side>
+          <q-icon :name="(showForm) ? 'remove' : 'add'" color="grey-5" size="md"></q-icon>
+        </q-item-section>
+        <q-item-section>
+          <q-item-label lines="1" class="text-caption">Add a wallet</q-item-label>
+        </q-item-section>
+      </q-item>
+      <q-item v-if="showForm">
+        <q-item-section>
+          <q-form>
+            <q-input filled dense v-model="walletName" label="Name wallet *">
+              <template v-slot:append>
+                <q-btn round dense flat icon="send" size="sm" @click="createWallet" :disable="walletName == ''"></q-btn>
+              </template>
+            </q-input>
+          </q-form>
+        </q-item-section>
+      </q-item>
+    </q-list>
+  `,
+  methods: {
+    createWallet: function () {
+      LNbits.href.createWallet(this.walletName, this.user.id);
+    }
+  },
+  created: function () {
+    if (window.user) {
+      this.user = LNbits.map.user(window.user);
+    }
+    if (window.wallet) {
+      this.activeWallet = LNbits.map.wallet(window.wallet);
+    }
+  }
+});
+
+Vue.component('lnbits-extension-list', {
+  data: function () {
+    return {
+      extensions: [],
+      user: null
+    }
+  },
+  template: `
+    <q-list v-if="user" dense class="lnbits-drawer__q-list">
+      <q-item-label header>Extensions</q-item-label>
+      <q-item v-for="extension in userExtensions" :key="extension.code"
+        clickable
+        tag="a" :href="[extension.url, '?usr=', user.id].join('')">
+        <q-item-section side>
+          <q-avatar size="md" color="grey-5">
+            <q-icon :name="extension.icon" :size="($q.dark.isActive) ? '21px' : '20px'"
+              :color="($q.dark.isActive) ? 'blue-grey-10' : 'grey-3'"></q-icon>
+          </q-avatar>
+        </q-item-section>
+        <q-item-section>
+          <q-item-label lines="1">{{ extension.name }}</q-item-label>
+        </q-item-section>
+      </q-item>
+      <q-item clickable tag="a" :href="['/extensions?usr=', user.id].join('')">
+        <q-item-section side>
+          <q-icon name="clear_all" color="grey-5" size="md"></q-icon>
+        </q-item-section>
+        <q-item-section>
+          <q-item-label lines="1" class="text-caption">Manage extensions</q-item-label>
+        </q-item-section>
+      </q-item>
+    </q-list>
+  `,
+  computed: {
+    userExtensions: function () {
+      if (!this.user) return [];
+      var userExtensions = this.user.extensions;
+      return this.extensions.filter(function (obj) {
+        return userExtensions.indexOf(obj.code) !== -1;
+      });
+    }
+  },
+  created: function () {
+    this.extensions = window.extensions.map(function (data) {
+      return LNbits.map.extension(data);
+    }).sort(function (a, b) {
+      return a.name > b.name;
+    });
+    if (window.user) {
+      this.user = LNbits.map.user(window.user);
+    }
+  }
+});