refactor: g.settings with a PublicSettings class for mapping, for reactive WINDOW_SETTINGS (#3644)

lnbits/static/js/components.js

@@ -35,23 +35,6 @@ window.app.component('lnbits-extension-rating', {
 
 window.app.component('lnbits-manage', {
   template: '#lnbits-manage',
-  computed: {
-    showAdmin() {
-      return this.LNBITS_ADMIN_UI
-    },
-    showUsers() {
-      return this.LNBITS_ADMIN_UI
-    },
-    showNode() {
-      return this.LNBITS_NODE_UI
-    },
-    showAudit() {
-      return this.LNBITS_AUDIT_ENABLED
-    },
-    showExtensions() {
-      return this.LNBITS_EXTENSIONS_DEACTIVATE_ALL === false
-    }
-  },
   methods: {
     isActive(path) {
       return window.location.pathname === path
@@ -462,9 +445,7 @@ window.app.component('username-password', {
       username: this.userName,
       password: this.password_1,
       passwordRepeat: this.password_2,
-      reset_key: this.resetKey,
-      keycloakOrg: LNBITS_AUTH_KEYCLOAK_ORG || 'Keycloak',
-      keycloakIcon: LNBITS_AUTH_KEYCLOAK_ICON
+      reset_key: this.resetKey
     }
   },
   methods: {

lnbits/static/js/components/lnbits-footer.js

@@ -1,14 +1,11 @@
 window.app.component('lnbits-footer', {
   template: '#lnbits-footer',
   computed: {
-    version() {
-      return this.LNBITS_VERSION || 'unknown version'
-    },
     title() {
-      return `${this.SITE_TITLE}, ${this.SITE_TAGLINE}`
+      return `${this.g.settings.siteTitle}, ${this.g.settings.siteTagline}`
     },
-    showFooter() {
-      return this.LNBITS_SHOW_HOME_PAGE_ELEMENTS == true
+    version() {
+      return this.$t('lnbits_version') + ': ' + this.g.settings.version
     }
   }
 })

lnbits/static/js/components/lnbits-header.js

@@ -1,48 +1,9 @@
 window.app.component('lnbits-header', {
   template: '#lnbits-header',
   computed: {
-    hasServiceFeeMax() {
-      return (
-        this.g.user &&
-        this.LNBITS_SERVICE_FEE_MAX &&
-        this.LNBITS_SERVICE_FEE_MAX > 0
-      )
-    },
-    serviceFeeMax() {
-      return this.LNBITS_SERVICE_FEE_MAX || 0
-    },
-    hasServiceFee() {
-      return (
-        this.g.user && this.LNBITS_SERVICE_FEE && this.LNBITS_SERVICE_FEE > 0
-      )
-    },
-    serviceFee() {
-      return this.LNBITS_SERVICE_FEE || 0
-    },
-    hasCustomBadge() {
-      return this.LNBITS_CUSTOM_BADGE && this.LNBITS_CUSTOM_BADGE != ''
-    },
-    customBadge() {
-      return this.LNBITS_CUSTOM_BADGE || ''
-    },
-    customBadgeColor() {
-      return this.LNBITS_CUSTOM_BADGE_COLOR || ''
-    },
-    title() {
-      return this.SITE_TITLE
-    },
-    titleIsLnbits() {
-      return this.SITE_TITLE == 'LNbits'
-    },
-    customLogoUrl() {
-      return this.USE_CUSTOM_LOGO || null
-    },
     showAdmin() {
       return this.g.user && (this.g.user.super_user || this.g.user.admin)
     },
-    showVoidwallet() {
-      return this.g.user && this.VOIDWALLET == true
-    },
     displayName() {
       return (
         this.g.user?.extra?.display_name ||

lnbits/static/js/components/lnbits-home-logos.js

@@ -95,8 +95,8 @@ window.app.component('lnbits-home-logos', {
     showLogos() {
       return (
         this.g.isSatsDenomination &&
-        this.SITE_TITLE == 'LNbits' &&
-        this.LNBITS_SHOW_HOME_PAGE_ELEMENTS == true
+        this.g.settings.siteTitle == 'LNbits' &&
+        this.g.settings.showHomePageElements == true
       )
     }
   }

lnbits/static/js/components/lnbits-qrcode.js

@@ -34,7 +34,7 @@ window.app.component('lnbits-qrcode', {
     },
     logo: {
       type: String,
-      default: LNBITS_QR_LOGO
+      default: window.g.settings.qrLogo || null
     }
   },
   data() {

lnbits/static/js/globals.js

@@ -9,26 +9,22 @@ const localStore = (key, defaultValue) => {
 }
 
 window.g = Vue.reactive({
-  errorCode: null,
-  errorMessage: null,
-  user: null,
-  wallet: null,
-  isPublicPage: true,
-  isUserAuthorized: !!Quasar.Cookies.get('is_lnbits_user_authorized'),
-  isUserImpersonated: !!Quasar.Cookies.get('is_lnbits_user_impersonated'),
-  offline: !navigator.onLine,
-  hasCamera: false,
-  visibleDrawer: false,
-  extensions: WINDOW_SETTINGS.EXTENSIONS,
-  fiatBalance: 0,
-  exchangeRate: 0,
-  fiatTracking: false,
-  payments: [],
-  walletEventListeners: [],
-  updatePayments: false, // used for updating the lnbits-payment-list
-  updatePaymentsHash: false, // used for closing the receive dialog
-  currencies: WINDOW_SETTINGS.LNBITS_CURRENCIES ?? [],
-  allowedCurrencies: WINDOW_SETTINGS.LNBITS_ALLOWED_CURRENCIES ?? [],
+  // vars from server
+  settings: SETTINGS,
+  currencies: CURRENCIES,
+  extensions: SETTINGS.extensions,
+  allowedCurrencies: SETTINGS.allowedCurrencies,
+  denomination: SETTINGS.denomination,
+  isSatsDenomination: SETTINGS.denomination == 'sats',
+  // local storage vars
+  themeChoice: localStore('lnbits.theme', SETTINGS.defaultTheme),
+  borderChoice: localStore('lnbits.border', SETTINGS.defaultBorder),
+  gradientChoice: localStore('lnbits.gradientBg', SETTINGS.defaultGradient),
+  reactionChoice: localStore('lnbits.reactions', SETTINGS.defaultReaction),
+  bgimageChoice: localStore(
+    'lnbits.backgroundImage',
+    SETTINGS.defaultBgimage || ''
+  ),
   locale: localStore('lnbits.lang', navigator.languages[1] ?? 'en'),
   disclaimerShown: localStore('lnbits.disclaimerShown', false),
   isFiatPriority: localStore('lnbits.isFiatPriority', false),
@@ -36,26 +32,25 @@ window.g = Vue.reactive({
   walletFlip: localStore('lnbits.walletFlip', false),
   lastActiveWallet: localStore('lnbits.lastActiveWallet', null),
   darkChoice: localStore('lnbits.darkMode', true),
-  themeChoice: localStore('lnbits.theme', WINDOW_SETTINGS.LNBITS_DEFAULT_THEME),
-  borderChoice: localStore(
-    'lnbits.border',
-    WINDOW_SETTINGS.LNBITS_DEFAULT_BORDER || 'hard-border'
-  ),
-  gradientChoice: localStore(
-    'lnbits.gradientBg',
-    WINDOW_SETTINGS.LNBITS_DEFAULT_GRADIENT || false
-  ),
-  reactionChoice: localStore(
-    'lnbits.reactions',
-    WINDOW_SETTINGS.LNBITS_DEFAULT_REACTION || 'confettiBothSides'
-  ),
-  bgimageChoice: localStore(
-    'lnbits.backgroundImage',
-    WINDOW_SETTINGS.LNBITS_DEFAULT_BGIMAGE || ''
-  ),
-  ads: WINDOW_SETTINGS.AD_SPACE.split(',').map(ad => ad.split(';')),
-  denomination: WINDOW_SETTINGS.LNBITS_DENOMINATION,
-  isSatsDenomination: WINDOW_SETTINGS.LNBITS_DENOMINATION == 'sats',
+  // cookie vars
+  isUserAuthorized: !!Quasar.Cookies.get('is_lnbits_user_authorized'),
+  isUserImpersonated: !!Quasar.Cookies.get('is_lnbits_user_impersonated'),
+  // frontend vars
+  errorCode: null,
+  errorMessage: null,
+  user: null,
+  wallet: null,
+  isPublicPage: true,
+  offline: !navigator.onLine,
+  hasCamera: false,
+  visibleDrawer: false,
+  fiatBalance: 0,
+  exchangeRate: 0,
+  fiatTracking: false,
+  payments: [],
+  walletEventListeners: [],
+  updatePayments: false, // used for updating the lnbits-payment-list
+  updatePaymentsHash: false, // used for closing the receive dialog
   scanner: null,
   newWalletType: null
 })

lnbits/static/js/init-app.js

@@ -157,8 +157,7 @@ window.app.mixin({
     return {
       api: window._lnbitsApi,
       utils: window._lnbitsUtils,
-      g: window.g,
-      ...WINDOW_SETTINGS
+      g: window.g
     }
   },
   // backwards compatibility for extensions, should not be used in the future

lnbits/static/js/pages/account.js

@@ -711,7 +711,7 @@ window.PageAccount = {
     await this.getUserAssets()
     // filter out themes that are not allowed
     this.themeOptions = this.themeOptions.filter(theme =>
-      this.LNBITS_THEME_OPTIONS.includes(theme.name)
+      this.g.settings.themeOptions.includes(theme.name)
     )
   }
 }

lnbits/static/js/pages/extensions.js

@@ -842,8 +842,8 @@ window.PageExtensions = {
   },
   async created() {
     this.extensions = await this.fetchAllExtensions()
-    this.extbuilderEnabled = this.g.user.admin || this.LNBITS_EXT_BUILDER
-    this.reviewsUrl = this.LNBITS_EXTENSIONS_REVIEWS_URL
+    this.extbuilderEnabled = this.g.user.admin || this.g.settings.extBuilder
+    this.reviewsUrl = this.g.settings.extensionsReviewsUrl
 
     if (this.g.user.extensions.length === 0) {
       this.tab = 'all'

lnbits/static/js/pages/home.js

@@ -19,40 +19,15 @@ window.PageHome = {
     showClaimLnurl() {
       return (
         this.lnurl !== '' &&
-        this.allowRegister &&
-        'user-id-only' in this.LNBITS_AUTH_METHODS
+        this.g.settings.allowRegister &&
+        'user-id-only' in this.g.settings.authMethods
       )
     },
     formatDescription() {
-      return LNbits.utils.convertMarkdown(this.SITE_DESCRIPTION)
+      return LNbits.utils.convertMarkdown(this.g.settings.siteDescription)
     },
     isAccessTokenExpired() {
       return this.$q.cookies.get('is_access_token_expired')
-    },
-    allowRegister() {
-      return this.LNBITS_NEW_ACCOUNTS_ALLOWED
-    },
-    // TODO: this makes no sense
-    hasCustomImage() {
-      return this.LNBITS_CUSTOM_IMAGE
-    },
-    showHomepageElements() {
-      return this.LNBITS_SHOW_HOME_PAGE_ELEMENTS === true
-    },
-    siteTitle() {
-      return this.SITE_TITLE || ''
-    },
-    siteTagline() {
-      return this.SITE_TAGLINE || ''
-    },
-    adsEnabled() {
-      return this.AD_SPACE_ENABLED && this.AD_SPACE && this.AD_SPACE.length > 0
-    },
-    adsTitle() {
-      return this.AD_SPACE_TITLE || ''
-    },
-    ads() {
-      return this.AD_SPACE.map(ad => ad.split(';'))
     }
   },
   methods: {

lnbits/static/js/utils.js

@@ -1,7 +1,7 @@
 window._lnbitsUtils = {
   url_for(url) {
     const _url = new URL(url, window.location.origin)
-    _url.searchParams.set('v', WINDOW_SETTINGS.CACHE_KEY)
+    _url.searchParams.set('v', window.g.settings.cacheKey)
     return _url.toString()
   },
   loadScript(src) {