From 87d12634f7a090c427336f5349cb0d79ffb0982c Mon Sep 17 00:00:00 2001
From: Tiago vasconcelos <talvasconcelos@gmail.com>
Date: Wed, 30 Jun 2021 17:00:56 +0100
Subject: [PATCH] Read .env themeing colors - allowed/availabe themes defined
 by admin

---
 .env.example               |  3 ++-
 lnbits/app.py              |  1 +
 lnbits/static/js/base.js   |  4 +++-
 lnbits/templates/base.html | 12 ++++++++++++
 4 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/.env.example b/.env.example
index d44f95554..795bb6357 100644
--- a/.env.example
+++ b/.env.example
@@ -15,7 +15,8 @@ LNBITS_SERVICE_FEE="0.0"
 
 # Change theme
 LNBITS_SITE_TITLE=LNbits
-LNBITS_THEME_OPTIONS="classic,green,orange"
+# Choose from mint, flamingo, quasar, autumn, monochrome
+LNBITS_THEME_OPTIONS="mint, flamingo, quasar, autumn, monochrome"
 
 # Choose from LNPayWallet, OpenNodeWallet, LntxbotWallet, LndWallet (gRPC),
 #             LndRestWallet, CLightningWallet, LNbitsWallet, SparkWallet
diff --git a/lnbits/app.py b/lnbits/app.py
index fe86e7300..40d50d045 100644
--- a/lnbits/app.py
+++ b/lnbits/app.py
@@ -104,6 +104,7 @@ def register_assets(app: QuartTrio):
 def register_filters(app: QuartTrio):
     """Jinja filters."""
     app.jinja_env.globals["SITE_TITLE"] = app.config["LNBITS_SITE_TITLE"]
+    app.jinja_env.globals["LNBITS_THEME_OPTIONS"] = app.config["LNBITS_THEME_OPTIONS"]
     app.jinja_env.globals["LNBITS_VERSION"] = app.config["LNBITS_COMMIT"]
     app.jinja_env.globals["EXTENSIONS"] = get_valid_extensions()
 
diff --git a/lnbits/static/js/base.js b/lnbits/static/js/base.js
index ca30dfefe..40044cb74 100644
--- a/lnbits/static/js/base.js
+++ b/lnbits/static/js/base.js
@@ -307,7 +307,8 @@ window.windowMixin = {
         extensions: [],
         user: null,
         wallet: null,
-        payments: []
+        payments: [],
+        allowedThemes: null
       }
     }
   },
@@ -335,6 +336,7 @@ window.windowMixin = {
   },
   created: function () {
     this.$q.dark.set(this.$q.localStorage.getItem('lnbits.darkMode'))
+    this.g.allowedThemes = window.allowedThemes
     if (this.$q.localStorage.getItem('lnbits.theme')) {
       document.body.setAttribute(
         'data-theme',
diff --git a/lnbits/templates/base.html b/lnbits/templates/base.html
index 78bbd5d50..0e4fd787c 100644
--- a/lnbits/templates/base.html
+++ b/lnbits/templates/base.html
@@ -48,6 +48,7 @@
           </q-badge>
           {% endblock %}
           <q-btn-dropdown
+            v-if="g.allowedThemes"
             dense
             flat
             round
@@ -65,6 +66,7 @@
                 size="md"
                 ><q-tooltip>classic</q-tooltip> </q-btn
               ><q-btn
+                v-if="g.allowedThemes.includes('mint')"
                 dense
                 flat
                 @click="changeColor('mint')"
@@ -73,6 +75,7 @@
                 size="md"
                 ><q-tooltip>mint</q-tooltip> </q-btn
               ><q-btn
+                v-if="g.allowedThemes.includes('autumn')"
                 dense
                 flat
                 @click="changeColor('autumn')"
@@ -82,6 +85,7 @@
                 ><q-tooltip>autumn</q-tooltip>
               </q-btn>
               <q-btn
+                v-if="g.allowedThemes.includes('flamingo')"
                 dense
                 flat
                 @click="changeColor('flamingo')"
@@ -91,6 +95,7 @@
                 ><q-tooltip>flamingo</q-tooltip>
               </q-btn>
               <q-btn
+                v-if="g.allowedThemes.includes('monochrome')"
                 dense
                 flat
                 @click="changeColor('monochrome')"
@@ -100,6 +105,7 @@
                 ><q-tooltip>monochrome</q-tooltip>
               </q-btn>
               <q-btn
+                v-if="g.allowedThemes.includes('quasar')"
                 dense
                 flat
                 @click="changeColor('quasar')"
@@ -179,6 +185,12 @@
     <!---->
     <script src="/static/js/base.js"></script>
     <script src="/static/js/components.js"></script>
+    <script type="text/javascript">
+      const themes = {{ LNBITS_THEME_OPTIONS  | tojson }}
+      if(themes && themes.length) {
+        window.allowedThemes = themes.trim()
+      }
+    </script>
     {% block scripts %}{% endblock %}
   </body>
 </html>