feat: improve user admin (#2777)

lnbits/core/crud/__init__.py

@@ -13,6 +13,7 @@ from .extensions import (
     get_installed_extensions,
     get_user_active_extensions_ids,
     get_user_extension,
+    get_user_extensions,
     update_installed_extension,
     update_installed_extension_state,
     update_user_extension,
@@ -98,6 +99,7 @@ __all__ = [
     "update_installed_extension",
     "update_installed_extension_state",
     "update_user_extension",
+    "get_user_extensions",
     # payments
     "DateTrunc",
     "check_internal",

lnbits/core/crud/users.py

@@ -20,7 +20,9 @@ async def create_account(
     account: Optional[Account] = None,
     conn: Optional[Connection] = None,
 ) -> Account:
-    if not account:
+    if account:
+        account.validate_fields()
+    else:
         now = datetime.now(timezone.utc)
         account = Account(id=uuid4().hex, created_at=now, updated_at=now)
     await (conn or db).insert("accounts", account)
@@ -50,6 +52,8 @@ async def get_accounts(
             accounts.id,
             accounts.username,
             accounts.email,
+            accounts.pubkey,
+            wallets.id as wallet_id,
             SUM(COALESCE((
                 SELECT balance FROM balances WHERE wallet_id = wallets.id
             ), 0)) as balance_msat,

lnbits/core/models/__init__.py

@@ -28,6 +28,7 @@ from .users import (
     CreateUser,
     LoginUsernamePassword,
     LoginUsr,
+    RegisterUser,
     ResetUserPassword,
     UpdateSuperuserPassword,
     UpdateUser,
@@ -70,6 +71,7 @@ __all__ = [
     "AccountOverview",
     "CreateTopup",
     "CreateUser",
+    "RegisterUser",
     "LoginUsernamePassword",
     "LoginUsr",
     "ResetUserPassword",

lnbits/core/models/users.py

@@ -2,12 +2,14 @@ from __future__ import annotations
 
 from datetime import datetime, timezone
 from typing import Optional
+from uuid import UUID
 
 from fastapi import Query
 from passlib.context import CryptContext
 from pydantic import BaseModel, Field
 
 from lnbits.db import FilterModel
+from lnbits.helpers import is_valid_email_address, is_valid_pubkey, is_valid_username
 from lnbits.settings import settings
 
 from .wallets import Wallet
@@ -36,13 +38,13 @@ class Account(BaseModel):
     created_at: datetime = Field(default_factory=lambda: datetime.now(timezone.utc))
     updated_at: datetime = Field(default_factory=lambda: datetime.now(timezone.utc))
 
-    @property
-    def is_super_user(self) -> bool:
-        return self.id == settings.super_user
+    is_super_user: bool = Field(default=False, no_database=True)
+    is_admin: bool = Field(default=False, no_database=True)
 
-    @property
-    def is_admin(self) -> bool:
-        return self.id in settings.lnbits_admin_users or self.is_super_user
+    def __init__(self, **data):
+        super().__init__(**data)
+        self.is_super_user = settings.is_super_user(self.id)
+        self.is_admin = settings.is_admin_user(self.id)
 
     def hash_password(self, password: str) -> str:
         """sets and returns the hashed password"""
@@ -57,6 +59,17 @@ class Account(BaseModel):
         pwd_context = CryptContext(schemes=["bcrypt"], deprecated="auto")
         return pwd_context.verify(password, self.password_hash)
 
+    def validate_fields(self):
+        if self.username and not is_valid_username(self.username):
+            raise ValueError("Invalid username.")
+        if self.email and not is_valid_email_address(self.email):
+            raise ValueError("Invalid email.")
+        if self.pubkey and not is_valid_pubkey(self.pubkey):
+            raise ValueError("Invalid pubkey.")
+        user_uuid4 = UUID(hex=self.id, version=4)
+        if user_uuid4.hex != self.id:
+            raise ValueError("User ID is not valid UUID4 hex string.")
+
 
 class AccountOverview(Account):
     transaction_count: Optional[int] = 0
@@ -66,7 +79,7 @@ class AccountOverview(Account):
 
 
 class AccountFilters(FilterModel):
-    __search_fields__ = ["id", "email", "username"]
+    __search_fields__ = ["user", "email", "username", "pubkey", "wallet_id"]
     __sort_fields__ = [
         "balance_msat",
         "email",
@@ -76,12 +89,11 @@ class AccountFilters(FilterModel):
         "last_payment",
     ]
 
-    id: str
-    last_payment: Optional[datetime] = None
-    transaction_count: Optional[int] = None
-    wallet_count: Optional[int] = None
-    username: Optional[str] = None
     email: Optional[str] = None
+    user: Optional[str] = None
+    username: Optional[str] = None
+    pubkey: Optional[str] = None
+    wallet_id: Optional[str] = None
 
 
 class User(BaseModel):
@@ -117,13 +129,24 @@ class User(BaseModel):
         return False
 
 
-class CreateUser(BaseModel):
+class RegisterUser(BaseModel):
     email: Optional[str] = Query(default=None)
     username: str = Query(default=..., min_length=2, max_length=20)
     password: str = Query(default=..., min_length=8, max_length=50)
     password_repeat: str = Query(default=..., min_length=8, max_length=50)
 
 
+class CreateUser(BaseModel):
+    id: Optional[str] = Query(default=None)
+    email: Optional[str] = Query(default=None)
+    username: Optional[str] = Query(default=None, min_length=2, max_length=20)
+    password: Optional[str] = Query(default=None, min_length=8, max_length=50)
+    password_repeat: Optional[str] = Query(default=None, min_length=8, max_length=50)
+    pubkey: str = Query(default=None, max_length=64)
+    extensions: Optional[list[str]] = None
+    extra: Optional[UserExtra] = None
+
+
 class UpdateUser(BaseModel):
     user_id: str
     email: Optional[str] = Query(default=None)

lnbits/core/services/__init__.py

@@ -20,7 +20,14 @@ from .settings import (
     check_webpush_settings,
     update_cached_settings,
 )
-from .users import check_admin_settings, create_user_account, init_admin_settings
+from .users import (
+    check_admin_settings,
+    create_user_account,
+    create_user_account_no_ckeck,
+    init_admin_settings,
+    update_user_account,
+    update_user_extensions,
+)
 from .websockets import websocket_manager, websocket_updater
 
 __all__ = [
@@ -48,7 +55,10 @@ __all__ = [
     # users
     "check_admin_settings",
     "create_user_account",
+    "create_user_account_no_ckeck",
     "init_admin_settings",
+    "update_user_account",
+    "update_user_extensions",
     # websockets
     "websocket_manager",
     "websocket_updater",

lnbits/core/services/users.py

@@ -1,6 +1,6 @@
 from pathlib import Path
 from typing import Optional
-from uuid import UUID, uuid4
+from uuid import uuid4
 
 from loguru import logger
 
@@ -15,13 +15,16 @@ from lnbits.settings import (
 from ..crud import (
     create_account,
     create_admin_settings,
+    create_user_extension,
     create_wallet,
     get_account,
     get_account_by_email,
     get_account_by_pubkey,
     get_account_by_username,
     get_super_settings,
+    get_user_extensions,
     get_user_from_account,
+    update_account,
     update_super_user,
     update_user_extension,
 )
@@ -39,7 +42,16 @@ async def create_user_account(
 ) -> User:
     if not settings.new_accounts_allowed:
         raise ValueError("Account creation is disabled.")
+
+    return await create_user_account_no_ckeck(account, wallet_name)
+
+
+async def create_user_account_no_ckeck(
+    account: Optional[Account] = None, wallet_name: Optional[str] = None
+) -> User:
+
     if account:
+        account.validate_fields()
         if account.username and await get_account_by_username(account.username):
             raise ValueError("Username already exists.")
 
@@ -49,10 +61,7 @@ async def create_user_account(
         if account.pubkey and await get_account_by_pubkey(account.pubkey):
             raise ValueError("Pubkey already exists.")
 
-        if account.id:
-            user_uuid4 = UUID(hex=account.id, version=4)
-            assert user_uuid4.hex == account.id, "User ID is not valid UUID4 hex string"
-        else:
+        if not account.id:
             account.id = uuid4().hex
 
     account = await create_account(account)
@@ -71,6 +80,58 @@ async def create_user_account(
     return user
 
 
+async def update_user_account(account: Account) -> Account:
+    account.validate_fields()
+
+    existing_account = await get_account(account.id)
+    if not existing_account:
+        raise ValueError("User does not exist.")
+
+    account.password_hash = existing_account.password_hash
+
+    if existing_account.username and not account.username:
+        raise ValueError("Cannot remove username.")
+
+    if account.username:
+        existing_account = await get_account_by_username(account.username)
+        if existing_account and existing_account.id != account.id:
+            raise ValueError("Username already exists.")
+    elif existing_account.username:
+        raise ValueError("Cannot remove username.")
+
+    if account.email:
+        existing_account = await get_account_by_email(account.email)
+        if existing_account and existing_account.id != account.id:
+            raise ValueError("Email already exists.")
+
+    if account.pubkey:
+        existing_account = await get_account_by_pubkey(account.pubkey)
+        if existing_account and existing_account.id != account.id:
+            raise ValueError("Pubkey already exists.")
+
+    return await update_account(account)
+
+
+async def update_user_extensions(user_id: str, extensions: list[str]):
+    user_extensions = await get_user_extensions(user_id)
+    for user_ext in user_extensions:
+        if user_ext.active:
+            if user_ext.extension not in extensions:
+                user_ext.active = False
+                await update_user_extension(user_ext)
+        else:
+            if user_ext.extension in extensions:
+                user_ext.active = True
+                await update_user_extension(user_ext)
+
+    user_extension_ids = [ue.extension for ue in user_extensions]
+    for ext in extensions:
+        if ext in user_extension_ids:
+            continue
+        user_extension = UserExtension(user=user_id, extension=ext, active=True)
+        await create_user_extension(user_extension)
+
+
 async def check_admin_settings():
     if settings.super_user:
         settings.super_user = to_valid_user_id(settings.super_user).hex

lnbits/core/templates/core/wallet.html

@@ -101,11 +101,25 @@
             </div>
           </div>
         </q-card>
-        <payment-list
-          :update="updatePayments"
-          :wallet="this.g.wallet"
-          :mobile-simple="mobileSimple"
-        />
+        <q-card
+          :style="
+          $q.screen.lt.md
+            ? {
+                background: $q.screen.lt.md ? 'none !important' : '',
+                boxShadow: $q.screen.lt.md ? 'none !important' : '',
+                marginTop: $q.screen.lt.md ? '0px !important' : ''
+              }
+            : ''
+        "
+        >
+          <q-card-section>
+            <payment-list
+              :update="updatePayments"
+              :wallet="this.g.wallet"
+              :mobile-simple="mobileSimple"
+            />
+          </q-card-section>
+        </q-card>
       </div>
       {% if HIDE_API %}
       <div class="col-12 col-md-4 q-gutter-y-md">

lnbits/core/templates/users/_createUserDialog.html

@@ -1,23 +0,0 @@
-<q-dialog v-model="createUserDialog.show">
-  <q-card class="q-pa-lg q-pt-xl lnbits__dialog-card">
-    <p>Create User</p>
-    <div class="row">
-      <div class="col-12">
-        <q-form @submit="createUser">
-          <lnbits-dynamic-fields
-            :options="createUserDialog.fields"
-            v-model="createUserDialog.data"
-          ></lnbits-dynamic-fields>
-          <div class="row q-mt-lg">
-            <q-btn v-close-popup unelevated color="primary" type="submit"
-              >Create</q-btn
-            >
-            <q-btn v-close-popup flat color="grey" class="q-ml-auto"
-              >Cancel</q-btn
-            >
-          </div>
-        </q-form>
-      </div>
-    </div>
-  </q-card>
-</q-dialog>

lnbits/core/templates/users/_createWalletDialog.html

@@ -1,22 +1,43 @@
-<q-dialog v-model="createWalletDialog.show">
-  <q-card class="q-pa-lg q-pt-xl lnbits__dialog-card">
-    <p>Create Wallet</p>
+<q-dialog v-model="createWalletDialog.show" position="top">
+  <q-card class="q-pa-md q-pt-md lnbits__dialog-card">
+    <strong>Create Wallet</strong>
     <div class="row">
       <div class="col-12">
-        <q-form @submit="createWallet">
-          <lnbits-dynamic-fields
-            :options="createWalletDialog.fields"
-            v-model="createUserDialog.data"
-          ></lnbits-dynamic-fields>
-          <div class="row q-mt-lg">
-            <q-btn v-close-popup unelevated color="primary" type="submit"
-              >Create</q-btn
-            >
-            <q-btn v-close-popup flat color="grey" class="q-ml-auto"
-              >Cancel</q-btn
+        <div class="row q-mt-lg">
+          <div class="col">
+            <q-input
+              v-model="createWalletDialog.data.name"
+              :label='$t("name_your_wallet")'
+              filled
+              dense
+              class="q-mb-md"
             >
+            </q-input>
           </div>
-        </q-form>
+        </div>
+        <div class="row q-mt-lg">
+          <div class="col">
+            <q-select
+              filled
+              dense
+              v-model="createWalletDialog.data.currency"
+              :options="{{ currencies | safe }}"
+            ></q-select>
+          </div>
+        </div>
+        <div class="row q-mt-lg">
+          <q-btn
+            v-close-popup
+            @click="createWallet()"
+            unelevated
+            color="primary"
+            type="submit"
+            >Create</q-btn
+          >
+          <q-btn v-close-popup flat color="grey" class="q-ml-auto"
+            >Cancel</q-btn
+          >
+        </div>
       </div>
     </div>
   </q-card>

lnbits/core/templates/users/_manageUser.html

@@ -0,0 +1,187 @@
+<div class="row q-mb-lg">
+  <div class="col">
+    <q-btn
+      icon="arrow_back_ios"
+      @click="backToUsersPage()"
+      :label="$t('back')"
+    ></q-btn>
+    <q-btn
+      v-if="activeUser.data.id"
+      @click="updateUser()"
+      color="primary"
+      :label="$t('update_account')"
+      class="q-ml-md"
+    ></q-btn>
+    <q-btn
+      v-else
+      @click="createUser()"
+      :label="$t('create_account')"
+      color="primary"
+      class="float-right"
+    ></q-btn>
+  </div>
+</div>
+<q-card v-if="activeUser.show" class="q-pa-md">
+  <q-card-section>
+    <div class="text-h6">
+      <span v-if="activeUser.data.id" v-text="$t('update_account')"></span>
+      <span v-else v-text="$t('create_account')"></span>
+    </div>
+  </q-card-section>
+  <q-card-section>
+    <q-input
+      v-if="activeUser.data.id"
+      v-model="activeUser.data.id"
+      :label="$t('user_id')"
+      filled
+      dense
+      readonly
+      :type="activeUser.data.showUserId ? 'text': 'password'"
+      class="q-mb-md"
+      ><q-btn
+        @click="activeUser.data.showUserId = !activeUser.data.showUserId"
+        dense
+        flat
+        :icon="activeUser.data.showUserId ? 'visibility_off' : 'visibility'"
+        color="grey"
+      ></q-btn>
+    </q-input>
+    <q-input
+      v-model="activeUser.data.username"
+      :label="$t('username')"
+      filled
+      dense
+      class="q-mb-md"
+    >
+    </q-input>
+    <q-toggle
+      size="xs"
+      v-if="!activeUser.data.id"
+      color="secondary"
+      :label="$t('set_password')"
+      v-model="activeUser.setPassword"
+    >
+      <q-tooltip>Toggle Admin</q-tooltip>
+    </q-toggle>
+
+    <q-input
+      v-if="activeUser.setPassword"
+      v-model="activeUser.data.password"
+      :type="activeUser.data.showPassword ? 'text': 'password'"
+      autocomplete="off"
+      :label="$t('password')"
+      filled
+      dense
+      :rules="[(val) => !val || val.length >= 8 || $t('invalid_password')]"
+    >
+      <q-btn
+        @click="activeUser.data.showPassword = !activeUser.data.showPassword"
+        dense
+        flat
+        :icon="activeUser.data.showPassword ? 'visibility_off' : 'visibility'"
+        color="grey"
+      ></q-btn>
+    </q-input>
+    <q-input
+      v-if="activeUser.setPassword"
+      v-model="activeUser.data.password_repeat"
+      :type="activeUser.data.showPassword ? 'text': 'password'"
+      type="password"
+      autocomplete="off"
+      :label="$t('password_repeat')"
+      filled
+      dense
+      class="q-mb-md"
+      :rules="[(val) => !val || val.length >= 8 || $t('invalid_password')]"
+    >
+      <q-btn
+        @click="activeUser.data.showPassword = !activeUser.data.showPassword"
+        dense
+        flat
+        :icon="activeUser.data.showPassword ? 'visibility_off' : 'visibility'"
+        color="grey"
+      ></q-btn>
+    </q-input>
+
+    <q-input
+      v-model="activeUser.data.pubkey"
+      :label="$t('pubkey')"
+      filled
+      dense
+      class="q-mb-md"
+    >
+    </q-input>
+    <q-input
+      v-model="activeUser.data.email"
+      :label="$t('email')"
+      filled
+      dense
+      class="q-mb-md"
+    >
+    </q-input>
+  </q-card-section>
+
+  <q-card-section v-if="activeUser.data.extra">
+    <q-input
+      v-model="activeUser.data.extra.first_name"
+      :label="$t('first_name')"
+      filled
+      dense
+      class="q-mb-md"
+    >
+    </q-input>
+    <q-input
+      v-model="activeUser.data.extra.last_name"
+      :label="$t('last_name')"
+      filled
+      dense
+      class="q-mb-md"
+    >
+    </q-input>
+    <q-input
+      v-model="activeUser.data.extra.provider"
+      :label="$t('auth_provider')"
+      filled
+      dense
+      class="q-mb-md"
+    >
+    </q-input>
+    <q-input
+      v-model="activeUser.data.extra.picture"
+      :label="$t('picture')"
+      filled
+      dense
+      class="q-mb-md"
+    >
+    </q-input>
+    <q-select
+      filled
+      dense
+      v-model="activeUser.data.extensions"
+      multiple
+      label="User extensions"
+      :options="g.extensions"
+    ></q-select>
+  </q-card-section>
+  <q-card-section v-if="activeUser.data.id">
+    <q-btn
+      @click="resetPassword(activeUser.data.id)"
+      :disable="activeUser.data.is_super_user"
+      :label="$t('reset_password')"
+      icon="refresh"
+      color="primary"
+    >
+      <q-tooltip>Generate and copy password reset url</q-tooltip>
+    </q-btn>
+    <q-btn
+      @click="deleteUser(activeUser.data.id)"
+      :disable="activeUser.data.is_super_user"
+      :label="$t('delete')"
+      icon="delete"
+      color="negative"
+      class="float-right"
+    >
+      <q-tooltip>Delete User</q-tooltip></q-btn
+    >
+  </q-card-section>
+</q-card>

lnbits/core/templates/users/_manageWallet.html

@@ -1,11 +1,37 @@
-<q-dialog v-model="walletDialog.show">
-  <q-card class="q-pa-lg" style="width: 700px; max-width: 80vw">
+<div v-if="paymentPage.show">
+  <div class="row q-mb-lg">
+    <div class="col">
+      <q-btn
+        icon="arrow_back_ios"
+        @click="paymentPage.show = false"
+        :label="$t('back')"
+      ></q-btn>
+    </div>
+  </div>
+  <q-card class="q-pa-md">
+    <q-card-section>
+      <payment-list :wallet="paymentsWallet" />
+    </q-card-section>
+  </q-card>
+</div>
+<div v-else-if="activeWallet.show">
+  <div class="row q-mb-lg">
+    <div class="col">
+      <q-btn
+        icon="arrow_back_ios"
+        @click="backToUsersPage()"
+        :label="$t('back')"
+      ></q-btn>
+      <q-btn
+        @click="createWalletDialog.show = true"
+        :label="$t('create_new_wallet')"
+        color="primary"
+        class="q-ml-md"
+      ></q-btn>
+    </div>
+  </div>
+  <q-card class="q-pa-md">
     <h2 class="text-h6 q-mb-md">Wallets</h2>
-    <q-dialog v-model="paymentDialog.show">
-      <q-card class="q-pa-lg" style="width: 700px; max-width: 80vw">
-        <payment-list :wallet="activeWallet" />
-      </q-card>
-    </q-dialog>
     <q-table :rows="wallets" :columns="walletTable.columns">
       <template v-slot:header="props">
         <q-tr :props="props">
@@ -22,6 +48,13 @@
       <template v-slot:body="props">
         <q-tr :props="props">
           <q-td auto-width>
+            <q-btn
+              :label="$t('topup')"
+              @click="showTopupDialog(props.row.id)"
+              color="secondary"
+              size="sm"
+              class="q-mr-md"
+            ></q-btn>
             <q-btn
               round
               icon="menu"
@@ -31,23 +64,7 @@
             >
               <q-tooltip>Show Payments</q-tooltip>
             </q-btn>
-            <q-btn
-              v-if="!props.row.deleted"
-              round
-              icon="content_copy"
-              size="sm"
-              color="primary"
-              class="q-ml-xs"
-              @click="copyText(props.row.id)"
-            >
-              <q-tooltip>Copy Wallet ID</q-tooltip>
-            </q-btn>
-            <lnbits-update-balance
-              v-if="!props.row.deleted"
-              :wallet_id="props.row.id"
-              :callback="topupCallback"
-              class="q-ml-xs"
-            ></lnbits-update-balance>
+
             <q-btn
               round
               v-if="!props.row.deleted"
@@ -70,17 +87,7 @@
             >
               <q-tooltip>Copy Invoice Key</q-tooltip>
             </q-btn>
-            <q-btn
-              round
-              v-if="props.row.deleted"
-              icon="toggle_off"
-              size="sm"
-              color="secondary"
-              class="q-ml-xs"
-              @click="undeleteUserWallet(props.row.user, props.row.id)"
-            >
-              <q-tooltip>Undelete Wallet</q-tooltip>
-            </q-btn>
+
             <q-btn
               round
               icon="delete"
@@ -92,21 +99,51 @@
               <q-tooltip>Delete Wallet</q-tooltip>
             </q-btn>
           </q-td>
-          <q-td auto-width v-text="props.row.name"></q-td>
+          <q-td auto-width>
+            <q-btn
+              icon="link"
+              size="sm"
+              flat
+              class="cursor-pointer q-mr-xs"
+              @click="copyWalletLink(props.row.id)"
+            >
+              <q-tooltip>Copy Wallet Link</q-tooltip>
+            </q-btn>
+
+            <span v-text="props.row.name"></span>
+            <q-btn
+              round
+              v-if="props.row.deleted"
+              icon="toggle_off"
+              size="sm"
+              color="secondary"
+              class="q-ml-xs"
+              @click="undeleteUserWallet(props.row.user, props.row.id)"
+            >
+              <q-tooltip>Undelete Wallet</q-tooltip>
+            </q-btn>
+          </q-td>
+          <q-td auto-width>
+            <q-btn
+              icon="content_copy"
+              size="sm"
+              flat
+              class="cursor-pointer q-mr-xs"
+              @click="copyText(props.row.id)"
+            >
+              <q-tooltip>Copy Wallet ID</q-tooltip>
+            </q-btn>
+
+            <span
+              v-text="props.row.id"
+              :class="props.row.deleted ? 'text-strike' : ''"
+            ></span>
+          </q-td>
+
           <q-td auto-width v-text="props.row.currency"></q-td>
           <q-td auto-width v-text="formatSat(props.row.balance_msat)"></q-td>
-          <q-td auto-width v-text="props.row.deleted"></q-td>
         </q-tr>
       </template>
     </q-table>
-    <div class="row q-mt-lg">
-      <q-btn
-        v-close-popup
-        flat
-        color="grey"
-        class="q-ml-auto"
-        :label="$t('close')"
-      ></q-btn>
-    </div>
   </q-card>
-</q-dialog>
+</div>

lnbits/core/templates/users/index.html

@@ -1,28 +1,25 @@
 {% extends "base.html" %} {% from "macros.jinja" import window_vars with context
-%} {% block page %} {% include "users/_walletDialog.html" %} {% include
-"users/_topupDialog.html" %} {% include "users/_createUserDialog.html" %} {%
-include "users/_createWalletDialog.html" %}
-
-<h3 class="text-subtitle q-my-none" v-text="$t('users')"></h3>
+%} {% block page %}{% include "users/_topupDialog.html" %}
 
 <div class="row q-col-gutter-md justify-center">
-  <div class="col q-gutter-y-md" style="width: 300px">
-    <div style="width: 100%; max-width: 2000px">
-      <canvas ref="chart1"></canvas>
+  <div class="col">
+    {% include "users/_manageWallet.html" %}
+    <div v-if="activeUser.show" class="row">
+      <div class="col-12 col-md-6">{%include "users/_manageUser.html" %}</div>
     </div>
-  </div>
-</div>
-<div class="row q-col-gutter-md justify-center">
-  <div class="col q-gutter-y-md">
-    <q-card>
-      <q-card-section>
-        <div class="row items-center no-wrap q-mb-sm">
-          <q-btn :label="$t('topup')" @click="topupDialog.show = true">
-            <q-tooltip
-              >{%raw%}{{ $t('add_funds_tooltip') }}{%endraw%}</q-tooltip
-            >
-          </q-btn>
-        </div>
+    <div v-else-if="activeWallet.show">
+      {%include "users/_createWalletDialog.html" %}
+    </div>
+    <div v-else>
+      <q-btn
+        @click="showAccountPage()"
+        :label="$t('create_account')"
+        color="primary"
+        class="q-mb-md"
+      >
+      </q-btn>
+
+      <q-card class="q-pa-md">
         <q-table
           row-key="id"
           :rows="users"
@@ -36,94 +33,118 @@ include "users/_createWalletDialog.html" %}
           <template v-slot:header="props">
             <q-tr :props="props">
               <q-th auto-width></q-th>
-              <q-th
-                v-for="col in props.cols"
-                v-text="col.label"
-                :key="col.name"
-                :props="props"
-              ></q-th>
+              <q-th v-for="col in props.cols" :key="col.name" :props="props">
+                <q-input
+                  v-if="['user', 'username', 'email', 'pubkey', 'wallet_id'].includes(col.name)"
+                  v-model="searchData[col.name]"
+                  @keydown.enter="searchUserBy(col.name)"
+                  dense
+                  type="text"
+                  filled
+                  :label="col.label"
+                >
+                  <template v-slot:append>
+                    <q-icon
+                      name="search"
+                      @click="searchUserBy(col.name)"
+                      class="cursor-pointer"
+                    />
+                  </template>
+                </q-input>
+
+                <span v-else v-text="col.label"></span>
+              </q-th>
             </q-tr>
           </template>
           <template v-slot:body="props">
             <q-tr auto-width :props="props">
               <q-td>
                 <q-btn
+                  @click="showAccountPage(props.row.id)"
                   round
-                  icon="list"
+                  icon="edit"
                   size="sm"
                   color="secondary"
-                  @click="fetchWallets(props.row.id)"
-                >
-                  <q-tooltip>Show Wallets</q-tooltip>
-                </q-btn>
-                <q-btn
-                  round
-                  icon="content_copy"
-                  size="sm"
-                  color="primary"
                   class="q-ml-xs"
-                  @click="copyText(props.row.id)"
                 >
-                  <q-tooltip>Copy User ID</q-tooltip>
+                  <q-tooltip>
+                    <span v-text="$t('update_account')"></span>
+                  </q-tooltip>
                 </q-btn>
-                <q-btn
-                  round
+              </q-td>
+              <q-td>
+                <q-toggle
+                  size="xs"
                   v-if="!props.row.is_super_user"
-                  icon="build"
-                  size="sm"
-                  :color="props.row.is_admin ? 'primary' : 'grey'"
-                  class="q-ml-xs"
-                  @click="toggleAdmin(props.row.id)"
+                  color="secondary"
+                  v-model="props.row.is_admin"
+                  @update:model-value="toggleAdmin(props.row.id)"
                 >
                   <q-tooltip>Toggle Admin</q-tooltip>
-                </q-btn>
+                </q-toggle>
                 <q-btn
                   round
                   v-if="props.row.is_super_user"
-                  icon="build"
+                  icon="verified"
                   size="sm"
-                  color="positive"
+                  color="secondary"
                   class="q-ml-xs"
                 >
                   <q-tooltip>Super User</q-tooltip>
                 </q-btn>
+              </q-td>
+
+              <q-td>
                 <q-btn
-                  round
-                  icon="refresh"
+                  icon="list"
                   size="sm"
                   color="secondary"
-                  @click="resetPassword(props.row.id)"
+                  :label="props.row.wallet_count"
+                  @click="fetchWallets(props.row.id)"
                 >
-                  <q-tooltip>Generate and copy password reset url</q-tooltip>
-                </q-btn>
-                <q-btn
-                  round
-                  icon="delete"
-                  size="sm"
-                  color="negative"
-                  class="q-ml-xs"
-                  @click="deleteUser(props.row.id, props)"
-                >
-                  <q-tooltip>Delete User</q-tooltip>
+                  <q-tooltip>Show Wallets</q-tooltip>
                 </q-btn>
               </q-td>
-              <q-td
-                auto-width
-                v-text="formatSat(props.row.balance_msat)"
-              ></q-td>
-              <q-td auto-width v-text="props.row.wallet_count"></q-td>
-              <q-td auto-width v-text="props.row.transaction_count"></q-td>
-              <q-td auto-width v-text="props.row.username"></q-td>
-              <q-td auto-width v-text="props.row.email"></q-td>
-              <q-td
-                auto-width
-                v-text="formatDate(props.row.last_payment)"
-              ></q-td>
+
+              <q-td>
+                <q-btn
+                  icon="content_copy"
+                  size="sm"
+                  flat
+                  class="cursor-pointer q-mr-xs"
+                  @click="copyText(props.row.id)"
+                >
+                  <q-tooltip>Copy User ID</q-tooltip>
+                </q-btn>
+                <span v-text="shortify(props.row.id)"></span>
+              </q-td>
+              <q-td v-text="props.row.username"></q-td>
+
+              <q-td v-text="props.row.email"></q-td>
+
+              <q-td>
+                <q-btn
+                  v-if="props.row.pubkey"
+                  icon="content_copy"
+                  size="sm"
+                  flat
+                  class="cursor-pointer q-mr-xs"
+                  @click="copyText(props.row.pubkey)"
+                >
+                  <q-tooltip>Copy Public Key</q-tooltip>
+                </q-btn>
+                <span v-text="shortify(props.row.pubkey)"></span>
+              </q-td>
+              <q-td v-text="formatSat(props.row.balance_msat)"></q-td>
+
+              <q-td v-text="props.row.transaction_count"></q-td>
+
+              <q-td v-text="formatDate(props.row.last_payment)"></q-td>
             </q-tr>
           </template>
         </q-table>
-      </q-card-section>
-    </q-card>
+      </q-card>
+    </div>
   </div>
 </div>
 

lnbits/core/views/auth_api.py

@@ -35,9 +35,9 @@ from ..crud import (
 from ..models import (
     AccessTokenPayload,
     Account,
-    CreateUser,
     LoginUsernamePassword,
     LoginUsr,
+    RegisterUser,
     ResetUserPassword,
     UpdateSuperuserPassword,
     UpdateUser,
@@ -145,7 +145,7 @@ async def logout() -> JSONResponse:
 
 
 @auth_router.post("/register")
-async def register(data: CreateUser) -> JSONResponse:
+async def register(data: RegisterUser) -> JSONResponse:
     if not settings.is_auth_method_allowed(AuthMethods.username_and_password):
         raise HTTPException(
             HTTPStatus.UNAUTHORIZED,

lnbits/core/views/user_api.py

@@ -2,39 +2,59 @@ import base64
 import json
 import time
 from http import HTTPStatus
-from typing import List
+from typing import List, Optional
+from uuid import uuid4
 
-from fastapi import APIRouter, Depends
+import shortuuid
+from fastapi import APIRouter, Body, Depends
 from fastapi.exceptions import HTTPException
 
 from lnbits.core.crud import (
+    create_wallet,
     delete_account,
     delete_wallet,
     force_delete_wallet,
     get_accounts,
+    get_user,
     get_wallet,
     get_wallets,
     update_admin_settings,
+    update_wallet,
 )
 from lnbits.core.models import (
     AccountFilters,
     AccountOverview,
     CreateTopup,
+    CreateUser,
+    SimpleStatus,
     User,
+    UserExtra,
     Wallet,
 )
-from lnbits.core.services import update_wallet_balance
+from lnbits.core.models.users import Account
+from lnbits.core.services import (
+    create_user_account_no_ckeck,
+    update_user_account,
+    update_user_extensions,
+    update_wallet_balance,
+)
 from lnbits.db import Filters, Page
 from lnbits.decorators import check_admin, check_super_user, parse_filters
-from lnbits.helpers import encrypt_internal_message, generate_filter_params_openapi
+from lnbits.helpers import (
+    encrypt_internal_message,
+    generate_filter_params_openapi,
+)
 from lnbits.settings import EditableSettings, settings
+from lnbits.utils.exchange_rates import allowed_currencies
 
-users_router = APIRouter(prefix="/users/api/v1", dependencies=[Depends(check_admin)])
+users_router = APIRouter(
+    prefix="/users/api/v1", dependencies=[Depends(check_admin)], tags=["Users"]
+)
 
 
 @users_router.get(
     "/user",
-    name="get accounts",
+    name="Get accounts",
     summary="Get paginated list of accounts",
     openapi_extra=generate_filter_params_openapi(AccountFilters),
 )
@@ -44,10 +64,80 @@ async def api_get_users(
     return await get_accounts(filters=filters)
 
 
-@users_router.delete("/user/{user_id}", status_code=HTTPStatus.OK)
+@users_router.get(
+    "/user/{user_id}",
+    name="Get user",
+    summary="Get user by Id",
+)
+async def api_get_user(user_id: str) -> User:
+    user = await get_user(user_id)
+    if not user:
+        raise HTTPException(HTTPStatus.NOT_FOUND, "User not found.")
+    return user
+
+
+@users_router.post("/user", name="Create user")
+async def api_create_user(data: CreateUser) -> CreateUser:
+    if not data.username and data.password:
+        raise HTTPException(
+            HTTPStatus.BAD_REQUEST, "Username required when password provided."
+        )
+
+    if data.password != data.password_repeat:
+        raise HTTPException(HTTPStatus.BAD_REQUEST, "Passwords do not match.")
+
+    if not data.password:
+        random_password = shortuuid.uuid()
+        data.password = random_password
+        data.password_repeat = random_password
+    data.extra = data.extra or UserExtra()
+    data.extra.provider = data.extra.provider or "lnbits"
+
+    account = Account(
+        id=uuid4().hex,
+        username=data.username,
+        email=data.email,
+        pubkey=data.pubkey,
+        extra=data.extra,
+    )
+    account.validate_fields()
+    account.hash_password(data.password)
+    user = await create_user_account_no_ckeck(account)
+    data.id = user.id
+    return data
+
+
+@users_router.put("/user/{user_id}", name="Update user")
+async def api_update_user(user_id: str, data: CreateUser) -> CreateUser:
+    if user_id != data.id:
+        raise HTTPException(HTTPStatus.BAD_REQUEST, "User Id missmatch.")
+
+    if data.password or data.password_repeat:
+        raise HTTPException(
+            HTTPStatus.BAD_REQUEST, "Use 'reset password' functionality."
+        )
+
+    account = Account(
+        id=user_id,
+        username=data.username,
+        email=data.email,
+        pubkey=data.pubkey,
+        extra=data.extra or UserExtra(),
+    )
+    await update_user_account(account)
+
+    await update_user_extensions(user_id, data.extensions or [])
+    return data
+
+
+@users_router.delete(
+    "/user/{user_id}",
+    status_code=HTTPStatus.OK,
+    name="Delete user by Id",
+)
 async def api_users_delete_user(
     user_id: str, user: User = Depends(check_admin)
-) -> None:
+) -> SimpleStatus:
     wallets = await get_wallets(user_id)
     if len(wallets) > 0:
         raise HTTPException(
@@ -67,10 +157,13 @@ async def api_users_delete_user(
             detail="Only super_user can delete admin user.",
         )
     await delete_account(user_id)
+    return SimpleStatus(success=True, message="User deleted.")
 
 
 @users_router.put(
-    "/user/{user_id}/reset_password", dependencies=[Depends(check_super_user)]
+    "/user/{user_id}/reset_password",
+    dependencies=[Depends(check_super_user)],
+    name="Reset user password",
 )
 async def api_users_reset_password(user_id: str) -> str:
     if user_id == settings.super_user:
@@ -87,28 +180,54 @@ async def api_users_reset_password(user_id: str) -> str:
     return f"reset_key_{reset_key_b64}"
 
 
-@users_router.get("/user/{user_id}/admin", dependencies=[Depends(check_super_user)])
-async def api_users_toggle_admin(user_id: str) -> None:
+@users_router.get(
+    "/user/{user_id}/admin",
+    dependencies=[Depends(check_super_user)],
+    name="Give or revoke admin permsisions to a user",
+)
+async def api_users_toggle_admin(user_id: str) -> SimpleStatus:
     if user_id == settings.super_user:
         raise HTTPException(
             status_code=HTTPStatus.BAD_REQUEST,
             detail="Cannot change super user.",
         )
-    if user_id in settings.lnbits_admin_users:
+
+    if settings.is_admin_user(user_id):
         settings.lnbits_admin_users.remove(user_id)
     else:
         settings.lnbits_admin_users.append(user_id)
     update_settings = EditableSettings(lnbits_admin_users=settings.lnbits_admin_users)
     await update_admin_settings(update_settings)
+    return SimpleStatus(
+        success=True, message=f"User admin: '{settings.is_admin_user(user_id)}'."
+    )
 
 
-@users_router.get("/user/{user_id}/wallet")
+@users_router.get("/user/{user_id}/wallet", name="Get wallets for user")
 async def api_users_get_user_wallet(user_id: str) -> List[Wallet]:
     return await get_wallets(user_id)
 
 
-@users_router.get("/user/{user_id}/wallet/{wallet}/undelete")
-async def api_users_undelete_user_wallet(user_id: str, wallet: str) -> None:
+@users_router.post("/user/{user_id}/wallet", name="Create a new wallet for user")
+async def api_users_create_user_wallet(
+    user_id: str, name: Optional[str] = Body(None), currency: Optional[str] = Body(None)
+):
+    if currency and currency not in allowed_currencies():
+        raise ValueError(f"Currency '{currency}' not allowed.")
+
+    wallet = await create_wallet(user_id=user_id, wallet_name=name)
+
+    if currency:
+        wallet.currency = currency
+        await update_wallet(wallet)
+
+    return wallet
+
+
+@users_router.put(
+    "/user/{user_id}/wallet/{wallet}/undelete", name="Reactivate deleted wallet"
+)
+async def api_users_undelete_user_wallet(user_id: str, wallet: str) -> SimpleStatus:
     wal = await get_wallet(wallet)
     if not wal:
         raise HTTPException(
@@ -123,10 +242,18 @@ async def api_users_undelete_user_wallet(user_id: str, wallet: str) -> None:
         )
     if wal.deleted:
         await delete_wallet(user_id=user_id, wallet_id=wallet, deleted=False)
+        return SimpleStatus(success=True, message="Wallet undeleted.")
+
+    return SimpleStatus(success=True, message="Wallet is already active.")
 
 
-@users_router.delete("/user/{user_id}/wallet/{wallet}")
-async def api_users_delete_user_wallet(user_id: str, wallet: str) -> None:
+@users_router.delete(
+    "/user/{user_id}/wallet/{wallet}",
+    name="Delete wallet by id",
+    summary="First time it is called it does a soft delete (only sets a flag)."
+    "The second time it is called will delete the entry from the DB",
+)
+async def api_users_delete_user_wallet(user_id: str, wallet: str) -> SimpleStatus:
     wal = await get_wallet(wallet)
     if not wal:
         raise HTTPException(
@@ -136,18 +263,20 @@ async def api_users_delete_user_wallet(user_id: str, wallet: str) -> None:
     if wal.deleted:
         await force_delete_wallet(wallet)
     await delete_wallet(user_id=user_id, wallet_id=wallet)
+    return SimpleStatus(success=True, message="Wallet deleted.")
 
 
 @users_router.put(
     "/topup",
     name="Topup",
+    summary="Update balance for a particular wallet.",
     status_code=HTTPStatus.OK,
     dependencies=[Depends(check_super_user)],
 )
-async def api_topup_balance(data: CreateTopup) -> dict[str, str]:
+async def api_topup_balance(data: CreateTopup) -> SimpleStatus:
     await get_wallet(data.id)
     if settings.lnbits_backend_wallet_class == "VoidWallet":
         raise Exception("VoidWallet active")
 
     await update_wallet_balance(wallet_id=data.id, amount=int(data.amount))
-    return {"status": "Success"}
+    return SimpleStatus(success=True, message="Balance updated.")

lnbits/db.py

@@ -647,7 +647,7 @@ def dict_to_model(_row: dict, model: type[TModel]) -> TModel:
         if value is None:
             continue
         if key not in model.__fields__:
-            logger.warning(f"Converting {key} to model `{model}`.")
+            # Somethimes an SQL JOIN will create additional column
             continue
         type_ = model.__fields__[key].type_
         outertype_ = model.__fields__[key].outer_type_
@@ -678,4 +678,6 @@ def dict_to_model(_row: dict, model: type[TModel]) -> TModel:
         _dict[key] = value
         continue
     _model = model.construct(**_dict)
+    if isinstance(_model, BaseModel):
+        _model.__init__(**_dict)  # type: ignore
     return _model

lnbits/helpers.py

@@ -186,6 +186,16 @@ def is_valid_username(username: str) -> bool:
     return re.fullmatch(username_regex, username) is not None
 
 
+def is_valid_pubkey(pubkey: str) -> bool:
+    if len(pubkey) != 64:
+        return False
+    try:
+        int(pubkey, 16)
+        return True
+    except Exception as _:
+        return False
+
+
 def create_access_token(data: dict):
     expire = datetime.now(timezone.utc) + timedelta(
         minutes=settings.auth_token_expire_minutes

lnbits/settings.py

@@ -673,8 +673,11 @@ class Settings(EditableSettings, ReadOnlySettings, TransientSettings, BaseSettin
             or user_id == self.super_user
         )
 
+    def is_super_user(self, user_id: str) -> bool:
+        return user_id == self.super_user
+
     def is_admin_user(self, user_id: str) -> bool:
-        return user_id in self.lnbits_admin_users or user_id == self.super_user
+        return self.is_super_user(user_id) or user_id in self.lnbits_admin_users
 
     def is_admin_extension(self, ext_id: str) -> bool:
         return ext_id in self.lnbits_admin_extensions

lnbits/static/i18n/en.js

@@ -122,6 +122,7 @@ window.localisation.en = {
   pay_to_enable: 'Pay To Enable',
   enable_extension_details: 'Enable extension for current user',
   disable: 'Disable',
+  delete: 'Delete',
   installed: 'Installed',
   activated: 'Activated',
   deactivated: 'Deactivated',

lnbits/static/js/users.js

@@ -3,60 +3,35 @@ window.app = Vue.createApp({
   mixins: [window.windowMixin],
   data: function () {
     return {
-      isSuperUser: false,
-      activeWallet: {},
+      paymentsWallet: {},
       wallet: {},
       cancel: {},
       users: [],
       wallets: [],
-      paymentDialog: {
+      searchData: {
+        user: '',
+        username: '',
+        email: '',
+        pubkey: ''
+      },
+      paymentPage: {
         show: false
       },
-      walletDialog: {
+      activeWallet: {
+        userId: null,
         show: false
       },
       topupDialog: {
         show: false
       },
-      createUserDialog: {
-        data: {},
-        fields: [
-          {
-            description: 'Username',
-            name: 'username'
-          },
-          {
-            description: 'Email',
-            name: 'email'
-          },
-          {
-            type: 'password',
-            description: 'Password',
-            name: 'password'
-          }
-        ],
+      activeUser: {
+        data: null,
+        showUserId: false,
         show: false
       },
+
       createWalletDialog: {
         data: {},
-        fields: [
-          {
-            type: 'str',
-            description: 'Wallet Name',
-            name: 'name'
-          },
-          {
-            type: 'select',
-            values: ['', 'EUR', 'USD'],
-            description: 'Currency',
-            name: 'currency'
-          },
-          {
-            type: 'str',
-            description: 'Balance',
-            name: 'balance'
-          }
-        ],
         show: false
       },
       walletTable: {
@@ -67,6 +42,12 @@ window.app = Vue.createApp({
             label: 'Name',
             field: 'name'
           },
+          {
+            name: 'id',
+            align: 'left',
+            label: 'Wallet Id',
+            field: 'id'
+          },
           {
             name: 'currency',
             align: 'left',
@@ -78,17 +59,65 @@ window.app = Vue.createApp({
             align: 'left',
             label: 'Balance',
             field: 'balance_msat'
-          },
-          {
-            name: 'deleted',
-            align: 'left',
-            label: 'Deleted',
-            field: 'deleted'
           }
-        ]
+        ],
+        pagination: {
+          sortBy: 'name',
+          rowsPerPage: 10,
+          page: 1,
+          descending: true,
+          rowsNumber: 10
+        },
+        search: null,
+        hideEmpty: true,
+        loading: false
       },
       usersTable: {
         columns: [
+          {
+            name: 'admin',
+            align: 'left',
+            label: 'Admin',
+            field: 'admin',
+            sortable: false
+          },
+          {
+            name: 'wallet_id',
+            align: 'left',
+            label: 'Wallets',
+            field: 'wallet_id',
+            sortable: false
+          },
+          {
+            name: 'user',
+            align: 'left',
+            label: 'User Id',
+            field: 'user',
+            sortable: false
+          },
+
+          {
+            name: 'username',
+            align: 'left',
+            label: 'Username',
+            field: 'username',
+            sortable: false
+          },
+
+          {
+            name: 'email',
+            align: 'left',
+            label: 'Email',
+            field: 'email',
+            sortable: false
+          },
+          {
+            name: 'pubkey',
+            align: 'left',
+            label: 'Public Key',
+            field: 'pubkey',
+            sortable: false
+          },
           {
             name: 'balance_msat',
             align: 'left',
@@ -96,34 +125,15 @@ window.app = Vue.createApp({
             field: 'balance_msat',
             sortable: true
           },
-          {
-            name: 'wallet_count',
-            align: 'left',
-            label: 'Wallet Count',
-            field: 'wallet_count',
-            sortable: true
-          },
+
           {
             name: 'transaction_count',
             align: 'left',
-            label: 'Transaction Count',
+            label: 'Payments',
             field: 'transaction_count',
             sortable: true
           },
-          {
-            name: 'username',
-            align: 'left',
-            label: 'Username',
-            field: 'username',
-            sortable: true
-          },
-          {
-            name: 'email',
-            align: 'left',
-            label: 'Email',
-            field: 'email',
-            sortable: true
-          },
+
           {
             name: 'last_payment',
             align: 'left',
@@ -160,50 +170,7 @@ window.app = Vue.createApp({
   created() {
     this.fetchUsers()
   },
-  mounted() {
-    this.chart1 = new Chart(this.$refs.chart1.getContext('2d'), {
-      type: 'bubble',
-      options: {
-        scales: {
-          x: {
-            type: 'linear',
-            beginAtZero: true,
-            title: {
-              text: 'Transaction count'
-            }
-          },
-          y: {
-            type: 'linear',
-            beginAtZero: true,
-            title: {
-              text: 'User balance in million sats'
-            }
-          }
-        },
-        tooltip: {
-          callbacks: {
-            label: function (tooltipItem, data) {
-              const dataset = data.datasets[tooltipItem.datasetIndex]
-              const dataPoint = dataset.data[tooltipItem.index]
-              return dataPoint.customLabel || ''
-            }
-          }
-        },
-        layout: {
-          padding: 10
-        }
-      },
-      data: {
-        datasets: [
-          {
-            label: 'Wallet balance vs transaction count',
-            backgroundColor: 'rgb(255, 99, 132)',
-            data: []
-          }
-        ]
-      }
-    })
-  },
+
   methods: {
     formatDate: function (value) {
       return LNbits.utils.formatDate(value)
@@ -211,17 +178,24 @@ window.app = Vue.createApp({
     formatSat: function (value) {
       return LNbits.utils.formatSat(Math.floor(value / 1000))
     },
+    backToUsersPage() {
+      this.activeUser.show = false
+      this.paymentPage.show = false
+      this.activeWallet.show = false
+      this.fetchUsers()
+    },
     resetPassword(user_id) {
       return LNbits.api
         .request('PUT', `/users/api/v1/user/${user_id}/reset_password`)
         .then(res => {
-          this.$q.notify({
-            type: 'positive',
-            message: 'generated key for password reset',
-            icon: null
-          })
-          const url = window.location.origin + '?reset_key=' + res.data
-          this.copyText(url)
+          LNbits.utils
+            .confirmDialog(
+              'A reset key has been generated. Click OK to copy the rest key to your clipboard.'
+            )
+            .onOk(() => {
+              const url = window.location.origin + '?reset_key=' + res.data
+              this.copyText(url)
+            })
         })
         .catch(function (error) {
           LNbits.utils.notifyApiError(error)
@@ -229,33 +203,66 @@ window.app = Vue.createApp({
     },
     createUser() {
       LNbits.api
-        .request('POST', '/users/api/v1/user', null, this.createUserDialog.data)
-        .then(() => {
-          this.fetchUsers()
+        .request('POST', '/users/api/v1/user', null, this.activeUser.data)
+        .then(resp => {
           Quasar.Notify.create({
             type: 'positive',
-            message: 'Success! User created!',
+            message: 'User created!',
             icon: null
           })
+
+          this.activeUser.setPassword = true
+          this.activeUser.data = resp.data
+          this.fetchUsers()
         })
         .catch(function (error) {
           LNbits.utils.notifyApiError(error)
         })
     },
-    createWallet(user_id) {
+    updateUser() {
+      LNbits.api
+        .request(
+          'PUT',
+          `/users/api/v1/user/${this.activeUser.data.id}`,
+          null,
+          this.activeUser.data
+        )
+        .then(() => {
+          Quasar.Notify.create({
+            type: 'positive',
+            message: 'User updated!',
+            icon: null
+          })
+          this.activeUser.data = null
+          this.activeUser.show = false
+          this.fetchUsers()
+        })
+        .catch(function (error) {
+          LNbits.utils.notifyApiError(error)
+        })
+    },
+    createWallet() {
+      const userId = this.activeWallet.userId
+      if (!userId) {
+        Quasar.Notify.create({
+          type: 'warning',
+          message: 'No user selected!',
+          icon: null
+        })
+        return
+      }
       LNbits.api
         .request(
           'POST',
-          `/users/api/v1/user/${user_id}/wallet`,
+          `/users/api/v1/user/${userId}/wallet`,
           null,
           this.createWalletDialog.data
         )
         .then(() => {
-          this.fetchUsers()
+          this.fetchWallets(userId)
           Quasar.Notify.create({
             type: 'positive',
-            message: 'Success! User created!',
-            icon: null
+            message: 'Wallet created!'
           })
         })
         .catch(function (error) {
@@ -272,9 +279,11 @@ window.app = Vue.createApp({
               this.fetchUsers()
               Quasar.Notify.create({
                 type: 'positive',
-                message: 'Success! User deleted!',
+                message: 'User deleted!',
                 icon: null
               })
+              this.activeUser.data = null
+              this.activeUser.show = false
             })
             .catch(function (error) {
               LNbits.utils.notifyApiError(error)
@@ -284,14 +293,14 @@ window.app = Vue.createApp({
     undeleteUserWallet(user_id, wallet) {
       LNbits.api
         .request(
-          'GET',
+          'PUT',
           `/users/api/v1/user/${user_id}/wallet/${wallet}/undelete`
         )
         .then(() => {
           this.fetchWallets(user_id)
           Quasar.Notify.create({
             type: 'positive',
-            message: 'Success! Undeleted user wallet!',
+            message: 'Undeleted user wallet!',
             icon: null
           })
         })
@@ -310,7 +319,7 @@ window.app = Vue.createApp({
             this.fetchWallets(user_id)
             Quasar.Notify.create({
               type: 'positive',
-              message: 'Success! User wallet deleted!',
+              message: 'User wallet deleted!',
               icon: null
             })
           })
@@ -319,38 +328,11 @@ window.app = Vue.createApp({
           })
       })
     },
-    updateChart(users) {
-      const filtered = users.filter(user => {
-        if (
-          user.balance_msat === null ||
-          user.balance_msat === 0 ||
-          user.wallet_count === 0
-        ) {
-          return false
-        }
-        return true
-      })
-
-      const data = filtered.map(user => {
-        const labelUsername = `${user.username ? 'User: ' + user.username + '. ' : ''}`
-        const userBalanceSats = Math.floor(
-          user.balance_msat / 1000
-        ).toLocaleString()
-        return {
-          x: user.transaction_count,
-          y: user.balance_msat / 1000000000,
-          r: 4,
-          customLabel:
-            labelUsername +
-            'Balance: ' +
-            userBalanceSats +
-            ' sats. Tx count: ' +
-            user.transaction_count
-        }
-      })
-      this.chart1.data.datasets[0].data = data
-      this.chart1.update()
+    copyWalletLink(walletId) {
+      const url = `${window.location.origin}/wallet?usr=${this.activeWallet.userId}&wal=${walletId}`
+      this.copyText(url)
     },
+
     fetchUsers(props) {
       const params = LNbits.utils.prepareFilterQuery(this.usersTable, props)
       LNbits.api
@@ -359,38 +341,32 @@ window.app = Vue.createApp({
           this.usersTable.loading = false
           this.usersTable.pagination.rowsNumber = res.data.total
           this.users = res.data.data
-          this.updateChart(this.users)
         })
         .catch(function (error) {
           LNbits.utils.notifyApiError(error)
         })
     },
-    fetchWallets(user_id) {
+    fetchWallets(userId) {
       LNbits.api
-        .request('GET', `/users/api/v1/user/${user_id}/wallet`)
+        .request('GET', `/users/api/v1/user/${userId}/wallet`)
         .then(res => {
           this.wallets = res.data
-          this.walletDialog.show = this.wallets.length > 0
-          if (!this.walletDialog.show) {
-            this.fetchUsers()
-          }
+          this.activeWallet.userId = userId
+          this.activeWallet.show = true
         })
         .catch(function (error) {
           LNbits.utils.notifyApiError(error)
         })
     },
-    showPayments(wallet_id) {
-      this.activeWallet = this.wallets.find(wallet => wallet.id === wallet_id)
-      this.paymentDialog.show = true
-    },
-    toggleAdmin(user_id) {
+
+    toggleAdmin(userId) {
       LNbits.api
-        .request('GET', `/users/api/v1/user/${user_id}/admin`)
+        .request('GET', `/users/api/v1/user/${userId}/admin`)
         .then(() => {
           this.fetchUsers()
           Quasar.Notify.create({
             type: 'positive',
-            message: 'Success! Toggled admin!',
+            message: 'Toggled admin!',
             icon: null
           })
         })
@@ -401,6 +377,40 @@ window.app = Vue.createApp({
     exportUsers() {
       console.log('export users')
     },
+    async showAccountPage(user_id) {
+      this.activeUser.showPassword = false
+      this.activeUser.showUserId = false
+      this.activeUser.setPassword = false
+      if (!user_id) {
+        this.activeUser.data = {extra: {}}
+        this.activeUser.show = true
+        return
+      }
+      try {
+        const {data} = await LNbits.api.request(
+          'GET',
+          `/users/api/v1/user/${user_id}`
+        )
+        this.activeUser.data = data
+
+        this.activeUser.show = true
+      } catch (error) {
+        console.warn(error)
+        Quasar.Notify.create({
+          type: 'warning',
+          message: 'Failed to get user!'
+        })
+        this.activeUser.show = false
+      }
+    },
+    showTopupDialog(walletId) {
+      this.wallet.id = walletId
+      this.topupDialog.show = true
+    },
+    showPayments(wallet_id) {
+      this.paymentsWallet = this.wallets.find(wallet => wallet.id === wallet_id)
+      this.paymentPage.show = true
+    },
     topupCallback(res) {
       if (res.success) {
         this.wallets.forEach(wallet => {
@@ -422,14 +432,31 @@ window.app = Vue.createApp({
         .then(_ => {
           Quasar.Notify.create({
             type: 'positive',
-            message: `Success! Added ${this.wallet.amount} to ${this.wallet.id}`,
+            message: `Added ${this.wallet.amount} to ${this.wallet.id}`,
             icon: null
           })
           this.wallet = {}
+          this.fetchWallets(this.activeWallet.userId)
         })
         .catch(function (error) {
           LNbits.utils.notifyApiError(error)
         })
+    },
+    searchUserBy(fieldName) {
+      const fieldValue = this.searchData[fieldName]
+      this.usersTable.filter = {}
+      if (fieldValue) {
+        this.usersTable.filter[fieldName] = fieldValue
+      }
+
+      this.fetchUsers()
+    },
+    shortify(value) {
+      valueLength = (value || '').length
+      if (valueLength <= 10) {
+        return value
+      }
+      return `${value.substring(0, 5)}...${value.substring(valueLength - 5, valueLength)}`
     }
   }
 })

lnbits/static/js/wallet.js

@@ -700,7 +700,7 @@ window.app = Vue.createApp({
     LNbits.events.onInvoicePaid(this.g.wallet, payment => {
       this.onPaymentReceived(payment.payment_hash)
     })
-    eventReactionWebocket(wallet.id)
+    eventReactionWebocket(wallet.inkey)
   }
 })
 

lnbits/templates/components.vue

@@ -550,285 +550,266 @@
 </template>
 
 <template id="payment-list">
-  <q-card
+  <div class="row items-center no-wrap q-mb-sm">
+    <div class="col">
+      <h5 class="text-subtitle1 q-my-none" :v-text="$t('transactions')"></h5>
+    </div>
+    <div class="gt-sm col-auto">
+      <q-btn-dropdown
+        outline
+        persistent
+        class="q-mr-sm"
+        color="grey"
+        :label="$t('export_csv')"
+        split
+        @click="exportCSV(false)"
+      >
+        <q-list>
+          <q-item>
+            <q-item-section>
+              <q-input
+                @keydown.enter="addFilterTag"
+                filled
+                dense
+                v-model="exportTagName"
+                type="text"
+                label="Payment Tags"
+                class="q-pa-sm"
+              >
+                <q-btn @click="addFilterTag" dense flat icon="add"></q-btn>
+              </q-input>
+            </q-item-section>
+          </q-item>
+          <q-item v-if="exportPaymentTagList.length">
+            <q-item-section>
+              <div>
+                <q-chip
+                  v-for="tag in exportPaymentTagList"
+                  :key="tag"
+                  removable
+                  @remove="removeExportTag(tag)"
+                  color="primary"
+                  text-color="white"
+                  :label="tag"
+                ></q-chip>
+              </div>
+            </q-item-section>
+          </q-item>
+
+          <q-item>
+            <q-item-section>
+              <q-btn
+                v-close-popup
+                outline
+                color="grey"
+                @click="exportCSV(true)"
+                label="Export to CSV with details"
+              ></q-btn>
+            </q-item-section>
+          </q-item>
+        </q-list>
+      </q-btn-dropdown>
+      <payment-chart :wallet="wallet" />
+    </div>
+  </div>
+  <q-input
     :style="
       $q.screen.lt.md
         ? {
-            background: $q.screen.lt.md ? 'none !important' : '',
-            boxShadow: $q.screen.lt.md ? 'none !important' : '',
-            marginTop: $q.screen.lt.md ? '0px !important' : ''
+            display: mobileSimple ? 'none !important' : ''
           }
         : ''
     "
+    filled
+    dense
+    clearable
+    v-model="paymentsTable.search"
+    debounce="300"
+    :placeholder="$t('search_by_tag_memo_amount')"
+    class="q-mb-md"
   >
-    <q-card-section>
-      <div class="row items-center no-wrap q-mb-sm">
-        <div class="col">
-          <h5
-            class="text-subtitle1 q-my-none"
-            :v-text="$t('transactions')"
-          ></h5>
-        </div>
-        <div class="gt-sm col-auto">
-          <q-btn-dropdown
-            outline
-            persistent
-            class="q-mr-sm"
-            color="grey"
-            :label="$t('export_csv')"
-            split
-            @click="exportCSV(false)"
+  </q-input>
+  <q-table
+    dense
+    flat
+    :rows="paymentsOmitter"
+    :row-key="paymentTableRowKey"
+    :columns="paymentsTable.columns"
+    :no-data-label="$t('no_transactions')"
+    :filter="paymentsTable.search"
+    :loading="paymentsTable.loading"
+    :hide-header="mobileSimple"
+    :hide-bottom="mobileSimple"
+    v-model:pagination="paymentsTable.pagination"
+    @request="fetchPayments"
+  >
+    <template v-slot:header="props">
+      <q-tr :props="props">
+        <q-th auto-width></q-th>
+        <q-th
+          v-for="col in props.cols"
+          :key="col.name"
+          :props="props"
+          v-text="col.label"
+        ></q-th>
+      </q-tr>
+    </template>
+    <template v-slot:body="props">
+      <q-tr :props="props">
+        <q-td auto-width class="text-center">
+          <q-icon
+            v-if="props.row.isPaid"
+            size="14px"
+            :name="props.row.isOut ? 'call_made' : 'call_received'"
+            :color="props.row.isOut ? 'pink' : 'green'"
+            @click="props.expand = !props.expand"
+          ></q-icon>
+          <q-icon
+            v-else-if="props.row.isFailed"
+            name="warning"
+            color="yellow"
+            @click="props.expand = !props.expand"
           >
-            <q-list>
-              <q-item>
-                <q-item-section>
-                  <q-input
-                    @keydown.enter="addFilterTag"
-                    filled
-                    dense
-                    v-model="exportTagName"
-                    type="text"
-                    label="Payment Tags"
-                    class="q-pa-sm"
-                  >
-                    <q-btn @click="addFilterTag" dense flat icon="add"></q-btn>
-                  </q-input>
-                </q-item-section>
-              </q-item>
-              <q-item v-if="exportPaymentTagList.length">
-                <q-item-section>
-                  <div>
-                    <q-chip
-                      v-for="tag in exportPaymentTagList"
-                      :key="tag"
-                      removable
-                      @remove="removeExportTag(tag)"
-                      color="primary"
-                      text-color="white"
-                      :label="tag"
-                    ></q-chip>
-                  </div>
-                </q-item-section>
-              </q-item>
+            <q-tooltip><span>failed</span></q-tooltip>
+          </q-icon>
+          <q-icon
+            v-else
+            name="settings_ethernet"
+            color="grey"
+            @click="props.expand = !props.expand"
+          >
+            <q-tooltip><span v-text="$t('pending')"></span></q-tooltip>
+          </q-icon>
+        </q-td>
+        <q-td
+          key="time"
+          :props="props"
+          style="white-space: normal; word-break: break-all"
+        >
+          <q-badge v-if="props.row.tag" color="yellow" text-color="black">
+            <a
+              v-text="'#' + props.row.tag"
+              class="inherit"
+              :href="['/', props.row.tag].join('')"
+            ></a>
+          </q-badge>
+          <span v-text="props.row.memo"></span>
+          <br />
 
-              <q-item>
-                <q-item-section>
+          <i>
+            <span v-text="props.row.dateFrom"></span>
+            <q-tooltip><span v-text="props.row.date"></span></q-tooltip>
+          </i>
+        </q-td>
+        <q-td
+          auto-width
+          key="amount"
+          v-if="denomination != 'sats'"
+          :props="props"
+          class="col1"
+          v-text="parseFloat(String(props.row.fsat).replaceAll(',', '')) / 100"
+        >
+        </q-td>
+        <q-td class="col2" auto-width key="amount" v-else :props="props">
+          <span v-text="props.row.fsat"></span>
+          <br />
+          <i v-if="props.row.extra.wallet_fiat_currency">
+            <span
+              v-text="
+                formatCurrency(
+                  props.row.extra.wallet_fiat_amount,
+                  props.row.extra.wallet_fiat_currency
+                )
+              "
+            ></span>
+            <br />
+          </i>
+          <i v-if="props.row.extra.fiat_currency">
+            <span
+              v-text="
+                formatCurrency(
+                  props.row.extra.fiat_amount,
+                  props.row.extra.fiat_currency
+                )
+              "
+            ></span>
+          </i>
+        </q-td>
+
+        <q-dialog v-model="props.expand" :props="props" position="top">
+          <q-card class="q-pa-lg q-pt-xl lnbits__dialog-card">
+            <div class="text-center q-mb-lg">
+              <div v-if="props.row.isIn && props.row.isPending">
+                <q-icon name="settings_ethernet" color="grey"></q-icon>
+                <span v-text="$t('invoice_waiting')"></span>
+                <lnbits-payment-details
+                  :payment="props.row"
+                ></lnbits-payment-details>
+                <div v-if="props.row.bolt11" class="text-center q-mb-lg">
+                  <a :href="'lightning:' + props.row.bolt11">
+                    <lnbits-qrcode
+                      :value="'lightning:' + props.row.bolt11.toUpperCase()"
+                    ></lnbits-qrcode>
+                  </a>
+                </div>
+                <div class="row q-mt-lg">
                   <q-btn
-                    v-close-popup
                     outline
                     color="grey"
-                    @click="exportCSV(true)"
-                    label="Export to CSV with details"
+                    @click="copyText(props.row.bolt11)"
+                    :label="$t('copy_invoice')"
+                  ></q-btn>
+                  <q-btn
+                    v-close-popup
+                    flat
+                    color="grey"
+                    class="q-ml-auto"
+                    :label="$t('close')"
                   ></q-btn>
-                </q-item-section>
-              </q-item>
-            </q-list>
-          </q-btn-dropdown>
-          <payment-chart :wallet="wallet" />
-        </div>
-      </div>
-      <q-input
-        :style="
-          $q.screen.lt.md
-            ? {
-                display: mobileSimple ? 'none !important' : ''
-              }
-            : ''
-        "
-        filled
-        dense
-        clearable
-        v-model="paymentsTable.search"
-        debounce="300"
-        :placeholder="$t('search_by_tag_memo_amount')"
-        class="q-mb-md"
-      >
-      </q-input>
-      <q-table
-        dense
-        flat
-        :rows="paymentsOmitter"
-        :row-key="paymentTableRowKey"
-        :columns="paymentsTable.columns"
-        :no-data-label="$t('no_transactions')"
-        :filter="paymentsTable.search"
-        :loading="paymentsTable.loading"
-        :hide-header="mobileSimple"
-        :hide-bottom="mobileSimple"
-        v-model:pagination="paymentsTable.pagination"
-        @request="fetchPayments"
-      >
-        <template v-slot:header="props">
-          <q-tr :props="props">
-            <q-th auto-width></q-th>
-            <q-th
-              v-for="col in props.cols"
-              :key="col.name"
-              :props="props"
-              v-text="col.label"
-            ></q-th>
-          </q-tr>
-        </template>
-        <template v-slot:body="props">
-          <q-tr :props="props">
-            <q-td auto-width class="text-center">
-              <q-icon
-                v-if="props.row.isPaid"
-                size="14px"
-                :name="props.row.isOut ? 'call_made' : 'call_received'"
-                :color="props.row.isOut ? 'pink' : 'green'"
-                @click="props.expand = !props.expand"
-              ></q-icon>
-              <q-icon
-                v-else-if="props.row.isFailed"
-                name="warning"
-                color="yellow"
-                @click="props.expand = !props.expand"
-              >
-                <q-tooltip><span>failed</span></q-tooltip>
-              </q-icon>
-              <q-icon
-                v-else
-                name="settings_ethernet"
-                color="grey"
-                @click="props.expand = !props.expand"
-              >
-                <q-tooltip><span v-text="$t('pending')"></span></q-tooltip>
-              </q-icon>
-            </q-td>
-            <q-td
-              key="time"
-              :props="props"
-              style="white-space: normal; word-break: break-all"
-            >
-              <q-badge v-if="props.row.tag" color="yellow" text-color="black">
-                <a
-                  v-text="'#' + props.row.tag"
-                  class="inherit"
-                  :href="['/', props.row.tag].join('')"
-                ></a>
-              </q-badge>
-              <span v-text="props.row.memo"></span>
-              <br />
-
-              <i>
-                <span v-text="props.row.dateFrom"></span>
-                <q-tooltip><span v-text="props.row.date"></span></q-tooltip>
-              </i>
-            </q-td>
-            <q-td
-              auto-width
-              key="amount"
-              v-if="denomination != 'sats'"
-              :props="props"
-              class="col1"
-              v-text="
-                parseFloat(String(props.row.fsat).replaceAll(',', '')) / 100
-              "
-            >
-            </q-td>
-            <q-td class="col2" auto-width key="amount" v-else :props="props">
-              <span v-text="props.row.fsat"></span>
-              <br />
-              <i v-if="props.row.extra.wallet_fiat_currency">
-                <span
-                  v-text="
-                    formatCurrency(
-                      props.row.extra.wallet_fiat_amount,
-                      props.row.extra.wallet_fiat_currency
-                    )
-                  "
-                ></span>
-                <br />
-              </i>
-              <i v-if="props.row.extra.fiat_currency">
-                <span
-                  v-text="
-                    formatCurrency(
-                      props.row.extra.fiat_amount,
-                      props.row.extra.fiat_currency
-                    )
-                  "
-                ></span>
-              </i>
-            </q-td>
-
-            <q-dialog v-model="props.expand" :props="props" position="top">
-              <q-card class="q-pa-lg q-pt-xl lnbits__dialog-card">
-                <div class="text-center q-mb-lg">
-                  <div v-if="props.row.isIn && props.row.isPending">
-                    <q-icon name="settings_ethernet" color="grey"></q-icon>
-                    <span v-text="$t('invoice_waiting')"></span>
-                    <lnbits-payment-details
-                      :payment="props.row"
-                    ></lnbits-payment-details>
-                    <div v-if="props.row.bolt11" class="text-center q-mb-lg">
-                      <a :href="'lightning:' + props.row.bolt11">
-                        <lnbits-qrcode
-                          :value="'lightning:' + props.row.bolt11.toUpperCase()"
-                        ></lnbits-qrcode>
-                      </a>
-                    </div>
-                    <div class="row q-mt-lg">
-                      <q-btn
-                        outline
-                        color="grey"
-                        @click="copyText(props.row.bolt11)"
-                        :label="$t('copy_invoice')"
-                      ></q-btn>
-                      <q-btn
-                        v-close-popup
-                        flat
-                        color="grey"
-                        class="q-ml-auto"
-                        :label="$t('close')"
-                      ></q-btn>
-                    </div>
-                  </div>
-                  <div v-else-if="props.row.isOut && props.row.isPending">
-                    <q-icon name="settings_ethernet" color="grey"></q-icon>
-                    <span v-text="$t('outgoing_payment_pending')"></span>
-                    <lnbits-payment-details
-                      :payment="props.row"
-                    ></lnbits-payment-details>
-                  </div>
-                  <div v-else-if="props.row.isPaid && props.row.isIn">
-                    <q-icon
-                      size="18px"
-                      :name="'call_received'"
-                      :color="'green'"
-                    ></q-icon>
-                    <span v-text="$t('payment_received')"></span>
-                    <lnbits-payment-details
-                      :payment="props.row"
-                    ></lnbits-payment-details>
-                  </div>
-                  <div v-else-if="props.row.isPaid && props.row.isOut">
-                    <q-icon
-                      size="18px"
-                      :name="'call_made'"
-                      :color="'pink'"
-                    ></q-icon>
-                    <span v-text="$t('payment_sent')"></span>
-                    <lnbits-payment-details
-                      :payment="props.row"
-                    ></lnbits-payment-details>
-                  </div>
-                  <div v-else-if="props.row.isFailed">
-                    <q-icon name="warning" color="yellow"></q-icon>
-                    <span>Payment failed</span>
-                    <lnbits-payment-details
-                      :payment="props.row"
-                    ></lnbits-payment-details>
-                  </div>
                 </div>
-              </q-card>
-            </q-dialog>
-          </q-tr>
-        </template>
-      </q-table>
-    </q-card-section>
-  </q-card>
+              </div>
+              <div v-else-if="props.row.isOut && props.row.isPending">
+                <q-icon name="settings_ethernet" color="grey"></q-icon>
+                <span v-text="$t('outgoing_payment_pending')"></span>
+                <lnbits-payment-details
+                  :payment="props.row"
+                ></lnbits-payment-details>
+              </div>
+              <div v-else-if="props.row.isPaid && props.row.isIn">
+                <q-icon
+                  size="18px"
+                  :name="'call_received'"
+                  :color="'green'"
+                ></q-icon>
+                <span v-text="$t('payment_received')"></span>
+                <lnbits-payment-details
+                  :payment="props.row"
+                ></lnbits-payment-details>
+              </div>
+              <div v-else-if="props.row.isPaid && props.row.isOut">
+                <q-icon
+                  size="18px"
+                  :name="'call_made'"
+                  :color="'pink'"
+                ></q-icon>
+                <span v-text="$t('payment_sent')"></span>
+                <lnbits-payment-details
+                  :payment="props.row"
+                ></lnbits-payment-details>
+              </div>
+              <div v-else-if="props.row.isFailed">
+                <q-icon name="warning" color="yellow"></q-icon>
+                <span>Payment failed</span>
+                <lnbits-payment-details
+                  :payment="props.row"
+                ></lnbits-payment-details>
+              </div>
+            </div>
+          </q-card>
+        </q-dialog>
+      </q-tr>
+    </template>
+  </q-table>
 </template>
 
 <template id="lnbits-extension-rating">