From 2d010db83f14de3a961865c8fd85c50843a62861 Mon Sep 17 00:00:00 2001
From: Debanjum Singh Solanky <debanjum@gmail.com>
Date: Thu, 30 May 2024 13:47:26 +0530
Subject: [PATCH] Toggle chat session view on clicking the Obsidian chat
 sessions button

---
 src/interface/obsidian/src/chat_view.ts | 8 ++++++--
 src/interface/obsidian/styles.css       | 1 +
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/interface/obsidian/src/chat_view.ts b/src/interface/obsidian/src/chat_view.ts
index d669e929..295464a8 100644
--- a/src/interface/obsidian/src/chat_view.ts
+++ b/src/interface/obsidian/src/chat_view.ts
@@ -91,7 +91,7 @@ export class KhojChatView extends KhojPaneView {
                 class: "khoj-input-row-button clickable-icon",
             },
         })
-        chatSessions.addEventListener('click', async (_) => { await this.showChatSessions(chatBodyEl) });
+        chatSessions.addEventListener('click', async (_) => { await this.toggleChatSessions(chatBodyEl) });
         setIcon(chatSessions, "history");
 
         let chatInput = inputRow.createEl("textarea", {
@@ -468,7 +468,11 @@ export class KhojChatView extends KhojPaneView {
         this.renderMessage(chatBodyEl, "Hey 👋🏾, what's up?", "khoj");
     }
 
-    async showChatSessions(chatBodyEl: HTMLElement): Promise<boolean> {
+    async toggleChatSessions(chatBodyEl: HTMLElement): Promise<boolean> {
+        if (this.contentEl.getElementsByClassName("side-panel")?.length > 0) {
+            chatBodyEl.innerHTML = "";
+            return this.getChatHistory(chatBodyEl);
+        }
         chatBodyEl.innerHTML = "";
         const sidePanelEl = this.contentEl.createDiv("side-panel");
         const newConversationEl = sidePanelEl.createDiv("new-conversation");
diff --git a/src/interface/obsidian/styles.css b/src/interface/obsidian/styles.css
index a77416e0..be6f2805 100644
--- a/src/interface/obsidian/styles.css
+++ b/src/interface/obsidian/styles.css
@@ -24,6 +24,7 @@ If your plugin does not need CSS, delete this file.
 
 .khoj-chat {
     display: grid;
+    grid-template-rows: auto 1fr auto;
     background: var(--background-primary);
     color: var(--text-normal);
     text-align: center;