From 841ed9552152c55bc5bee1f7ddff85e35662d16e Mon Sep 17 00:00:00 2001
From: Debanjum Singh Solanky <debanjum@gmail.com>
Date: Thu, 9 Nov 2023 18:05:19 -0800
Subject: [PATCH] Move active user profile halo check into nav pane macro on
 web app

---
 src/khoj/interface/web/base_config.html |  5 +----
 src/khoj/interface/web/chat.html        |  5 +----
 src/khoj/interface/web/search.html      |  5 +----
 src/khoj/interface/web/utils.html       | 10 +++++++++-
 src/khoj/routers/web_client.py          | 15 +++++++++++++++
 5 files changed, 27 insertions(+), 13 deletions(-)
diff --git a/src/khoj/interface/web/base_config.html b/src/khoj/interface/web/base_config.html
index bf64164c..fc1d8a0e 100644
--- a/src/khoj/interface/web/base_config.html
+++ b/src/khoj/interface/web/base_config.html
@@ -15,7 +15,7 @@
 
             <!--Add Header Logo and Nav Pane-->
             {% import 'utils.html' as utils %}
-            {{ utils.heading_pane(user_photo, username) }}
+            {{ utils.heading_pane(user_photo, username, is_active) }}
 
             <div class="filler"></div>
         </div>
@@ -26,9 +26,6 @@
     </body>
     <script>
         document.getElementById("settings-nav").classList.add("khoj-nav-selected");
-        {% if is_active %}
-        document.getElementById("profile-picture").classList.add("subscribed");
-        {% endif %}
     </script>
     <style>
         html, body {
diff --git a/src/khoj/interface/web/chat.html b/src/khoj/interface/web/chat.html
index b86adc3d..7fd054b8 100644
--- a/src/khoj/interface/web/chat.html
+++ b/src/khoj/interface/web/chat.html
@@ -363,7 +363,7 @@
 
         <!--Add Header Logo and Nav Pane-->
         {% import 'utils.html' as utils %}
-        {{ utils.heading_pane(user_photo, username) }}
+        {{ utils.heading_pane(user_photo, username, is_active) }}
 
         <!-- Chat Body -->
         <div id="chat-body"></div>
@@ -376,9 +376,6 @@
     </body>
     <script>
         document.getElementById("chat-nav").classList.add("khoj-nav-selected");
-        {% if is_active %}
-        document.getElementById("profile-picture").classList.add("subscribed");
-        {% endif %}
     </script>
     <style>
         html, body {
diff --git a/src/khoj/interface/web/search.html b/src/khoj/interface/web/search.html
index 7c6fd62b..00b378a2 100644
--- a/src/khoj/interface/web/search.html
+++ b/src/khoj/interface/web/search.html
@@ -272,7 +272,7 @@
     <body>
         <!--Add Header Logo and Nav Pane-->
         {% import 'utils.html' as utils %}
-        {{ utils.heading_pane(user_photo, username) }}
+        {{ utils.heading_pane(user_photo, username, is_active) }}
 
         <!--Add Text Box To Enter Query, Trigger Incremental Search OnChange -->
         <input type="text" id="query" class="option" onkeyup=incrementalSearch(event) autofocus="autofocus" placeholder="Search your knowledge base using natural language">
@@ -287,9 +287,6 @@
     </body>
     <script>
         document.getElementById("search-nav").classList.add("khoj-nav-selected");
-        {% if is_active %}
-        document.getElementById("profile-picture").classList.add("subscribed");
-        {% endif %}
     </script>
 
     <style>
diff --git a/src/khoj/interface/web/utils.html b/src/khoj/interface/web/utils.html
index 75bad8b7..7b9c99f1 100644
--- a/src/khoj/interface/web/utils.html
+++ b/src/khoj/interface/web/utils.html
@@ -1,4 +1,4 @@
-{% macro heading_pane(user_photo, username) -%}
+{% macro heading_pane(user_photo, username, is_active) -%}
     <div class="khoj-header">
         <a class="khoj-logo" href="/" target="_blank">
             <img class="khoj-logo" src="/static/assets/icons/khoj-logo-sideways-500.png" alt="Khoj"></img>
@@ -9,9 +9,17 @@
             <!-- Dropdown Menu -->
             <div id="khoj-nav-menu-container" class="khoj-nav dropdown">
                 {% if user_photo and user_photo != "None" %}
+                    {% if is_active %}
+                    <img id="profile-picture" class="circle subscribed" src="{{ user_photo }}" alt="{{ username[0].upper() }}" onclick="toggleMenu()" referrerpolicy="no-referrer">
+                    {% else %}
                     <img id="profile-picture" class="circle" src="{{ user_photo }}" alt="{{ username[0].upper() }}" onclick="toggleMenu()" referrerpolicy="no-referrer">
+                    {% endif %}
                 {% else %}
+                    {% if is_active %}
                     <div id="profile-picture" class="circle user-initial subscribed" alt="{{ username[0].upper() }}" onclick="toggleMenu()">{{ username[0].upper() }}</div>
+                    {% else %}
+                    <div id="profile-picture" class="circle user-initial" alt="{{ username[0].upper() }}" onclick="toggleMenu()">{{ username[0].upper() }}</div>
+                    {% endif %}
                 {% endif %}
                 <div id="khoj-nav-menu" class="khoj-nav-dropdown-content">
                     <div class="khoj-nav-username"> {{ username }} </div>
diff --git a/src/khoj/routers/web_client.py b/src/khoj/routers/web_client.py
index 45232a48..17d623ff 100644
--- a/src/khoj/routers/web_client.py
+++ b/src/khoj/routers/web_client.py
@@ -37,6 +37,8 @@ templates = Jinja2Templates(directory=constants.web_directory)
 def index(request: Request):
     user = request.user.object
     user_picture = request.session.get("user", {}).get("picture")
+    user_subscription = adapters.get_user_subscription(user.email)
+    user_subscription_state = get_user_subscription_state(user_subscription)
 
     return templates.TemplateResponse(
         "chat.html",
@@ -44,6 +46,7 @@ def index(request: Request):
             "request": request,
             "username": user.username,
             "user_photo": user_picture,
+            "is_active": user_subscription_state == "subscribed" or user_subscription_state == "unsubscribed",
         },
     )
 
@@ -53,6 +56,8 @@ def index(request: Request):
 def index_post(request: Request):
     user = request.user.object
     user_picture = request.session.get("user", {}).get("picture")
+    user_subscription = adapters.get_user_subscription(user.email)
+    user_subscription_state = get_user_subscription_state(user_subscription)
 
     return templates.TemplateResponse(
         "chat.html",
@@ -60,6 +65,7 @@ def index_post(request: Request):
             "request": request,
             "username": user.username,
             "user_photo": user_picture,
+            "is_active": user_subscription_state == "subscribed" or user_subscription_state == "unsubscribed",
         },
     )
 
@@ -170,6 +176,8 @@ def config_page(request: Request):
 def github_config_page(request: Request):
     user = request.user.object
     user_picture = request.session.get("user", {}).get("picture")
+    user_subscription = adapters.get_user_subscription(user.email)
+    user_subscription_state = get_user_subscription_state(user_subscription)
     current_github_config = get_user_github_config(user)
 
     if current_github_config:
@@ -198,6 +206,7 @@ def github_config_page(request: Request):
             "current_config": current_config,
             "username": user.username,
             "user_photo": user_picture,
+            "is_active": user_subscription_state == "subscribed" or user_subscription_state == "unsubscribed",
         },
     )
 
@@ -207,6 +216,8 @@ def github_config_page(request: Request):
 def notion_config_page(request: Request):
     user = request.user.object
     user_picture = request.session.get("user", {}).get("picture")
+    user_subscription = adapters.get_user_subscription(user.email)
+    user_subscription_state = get_user_subscription_state(user_subscription)
     current_notion_config = get_user_notion_config(user)
 
     current_config = NotionContentConfig(
@@ -222,6 +233,7 @@ def notion_config_page(request: Request):
             "current_config": current_config,
             "username": user.username,
             "user_photo": user_picture,
+            "is_active": user_subscription_state == "subscribed" or user_subscription_state == "unsubscribed",
         },
     )
 
@@ -231,6 +243,8 @@ def notion_config_page(request: Request):
 def computer_config_page(request: Request):
     user = request.user.object
     user_picture = request.session.get("user", {}).get("picture")
+    user_subscription = adapters.get_user_subscription(user.email)
+    user_subscription_state = get_user_subscription_state(user_subscription)
 
     return templates.TemplateResponse(
         "content_source_computer_input.html",
@@ -238,5 +252,6 @@ def computer_config_page(request: Request):
             "request": request,
             "username": user.username,
             "user_photo": user_picture,
+            "is_active": user_subscription_state == "subscribed" or user_subscription_state == "unsubscribed",
         },
     )
