Update sidepane.html

sidepane.html

@@ -1,105 +1,210 @@
-<!-- sidepane.html -->
-
-<!-- This file represents the sidepane component of a web application. It contains the navigation menu and sidebar. -->
-
-<nav class="main-header navbar navbar-expand navbar-white navbar-light" style="text-align: center;margin-left: 100px;">
-    <div class="container-fluid d-flex justify-content-center align-items-center">
-        <img src="/static/img/redmindlogo3.jpg" alt="Logo" style="width: 80px; height: auto; margin-right: 10px;">
-
-        <h3 style="text-align: center; margin-bottom: 0;">Redmind GPT  -  {{title}}</h3>
-        <button class="btn btn-primary" style="position: absolute; top: 30px;right:10px;" onclick="logout()">Logout</button>
-
-    </div>
-    <!-- Left navbar links -->
-    <!-- <ul class="navbar-nav">
-        <li class="nav-item">
-            <a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
-        </li>
-    </ul> -->
-</nav>
-
-<!-- Main Sidebar Container -->
-<aside class="main-sidebar sidebar-dark-primary elevation-4" style="width: 200px; position: fixed; top: 0; left: 0; height: 100vh; overflow: hidden;">
-    <!-- Sidebar -->
-    <div class="sidebar">
-        <!-- Sidebar Menu -->
-        <nav class="mt-2">
-            <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
-                <!-- Navigation Links -->
-                <li class="nav-item">
-                    <a href="{{url_for('dashboard')}}" class="nav-link">
-                        <i class="nav-icon fas fa-home"></i>
-                        <p>Dashboard</p>
-                    </a>
-                </li>
-                <li class="nav-item">
-                    <a href="{{ url_for('company_profile') }}" class="nav-link">
-                        <i class="nav-icon fas fa-users"></i>
-                        <p>Company Profile</p>
-                    </a>
-                </li>
-                <li class="nav-item">
-                    <a href="{{ url_for('knowledgebase') }}" class="nav-link">
-                        <i class="nav-icon fas fa-cogs"></i>
-                        <p>KnowledgeBase</p>
-                    </a>
-                </li>
-                <li class="nav-item">
-                    <a href="{{ url_for('data_connectors') }}" class="nav-link">
-                        <i class="nav-icon fas fa-cogs"></i>
-                        <p>Data Connectors</p>
-                    </a>
-                </li>
-                <li class="nav-item">
-                    <a href="{{ url_for('API_connectors') }}" class="nav-link">
-                        <i class="nav-icon fas fa-cogs"></i>
-                        <p>API Connectors</p>
-                    </a>
-                </li>
-                <li class="nav-item">
-                    <a href="{{url_for('prompt_template')}}" class="nav-link">
-                        <i class="nav-icon fas fa-cogs"></i>
-                        <p>Prompt Templates</p>
-                    </a>
-                </li>
-             <!--<li class="nav-item">
-                    <a href="#" class="nav-link">
-                        <i class="nav-icon fas fa-cogs"></i>
-                        <p>LLM Settings</p>
-                    </a>
-                    <ul class="nav nav-treeview">
-                        <li class="nav-item">
-                            <a href="#" class="nav-link">
-                                <i class="far fa-circle nav-icon"></i>
-                                <p>Sublink 1</p>
-                            </a>
-                        </li>
-                        <li class="nav-item">
-                            <a href="#" class="nav-link">
-                                <i class="far fa-circle nav-icon"></i>
-                                <p>Sublink 2</p>
-                            </a>
-                        </li>
-                        
-                    </ul>
-                </li> -->
-
-                <!-- Add more navigation links here -->
-            </ul>
-        </nav>
-        <!-- /.sidebar-menu -->
-    </div>
-    <!-- /.sidebar -->
-</aside>
-
-
-<!-- AdminLTE JS -->
-<script >
-        function logout() {
-        // Clear session storage
-        sessionStorage.clear();
-
-        // Redirect to the login page
-        window.location.href = '/';
-    }
-</script>
+<!-- sidepane.html -->
+
+<!-- This file represents the sidepane component of a web application. It contains the navigation menu and sidebar. -->
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Company Profile</title>
+    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
+   
+    <div class="container-fluid d-flex justify-content-center align-items-center">
+        <img src="/static/img/redmindlogo3.jpg" alt="Logo" style="width: 80px; height: auto; margin-right: 10px;">
+
+        <h3 style="text-align: center; margin-bottom: 0;">Redmind GPT  -  {{title}}</h3>
+        <button class="btn btn-primary" style="position: absolute; top: 30px;right:40px;" onclick="logout()">Logout</button>
+
+    </div>
+    <!-- Left navbar links -->
+    <!-- <ul class="navbar-nav">
+        <li class="nav-item">
+            <a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
+        </li>
+    </ul> -->
+</nav>
+
+<!-- Main Sidebar Container -->
+<aside class="main-sidebar sidebar-dark-primary elevation-4" style="width: 200px; position: fixed; top: 0; left: 0; height: 100vh; overflow: hidden;">
+    <!-- Sidebar -->
+    <div class="sidebar">
+        <!-- Sidebar Menu -->
+        <nav class="mt-2">
+            <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
+             
+                    <input type="hidden" id="userRole" name="userRole" value={{role}}>
+                    <input type="hidden" id="company_id" name="company_id" value={{company_id}}>
+                    <div class="form-group"style="display: none;">
+                    <label for="llm_tools" >LLM Tools<span class="text-danger">*</span></label>
+                    <select class="form-control" id="llm_tools" name="llm_tools" multiple required style="display: none;">
+                        <option value="Database">Database</option>
+                        <option value="Static Documents">Static Documents</option>
+                        <option value="API">API</option>
+                    </select>
+                    <div class="invalid-feedback">
+                        Please select at least one LLM tool.
+                    </div>
+                </div>
+                
+                <li class="nav-item">
+                    <a href="{{url_for('dashboard')}}" class="nav-link">
+                        <i class="nav-icon fas fa-home"></i>
+                        <p>Dashboard</p>
+                    </a>
+                </li>
+                <li class="nav-item" >
+                    <a href="{{ url_for('company_profile') }}" class="nav-link">
+                        <i class="nav-icon fas fa-users"></i>
+                        <p>Company Profile</p>
+                    </a>
+                </li>
+                <li class="nav-item" id="knowledgebase_link">
+                    <a href="{{ url_for('knowledgebase') }}" class="nav-link">
+                        <i class="nav-icon fas fa-cogs"></i>
+                        <p>KnowledgeBase</p>
+                    </a>
+                </li>
+                <li class="nav-item" id="data_connectors_link">
+                    <a href="{{ url_for('data_connectors') }}" class="nav-link">
+                        <i class="nav-icon fas fa-cogs"></i>
+                        <p>Data Connectors</p>
+                    </a>
+                </li>
+                <li class="nav-item" id="api_connectors_link">
+                    <a href="{{ url_for('API_connectors') }}" class="nav-link">
+                        <i class="nav-icon fas fa-cogs"></i>
+                        <p>API Connectors</p>
+                    </a>
+                </li>
+                <li class="nav-item">
+                    <a href="{{url_for('prompt_template')}}" class="nav-link">
+                        <i class="nav-icon fas fa-cogs"></i>
+                        <p>Prompt Templates</p>
+                    </a>
+                </li>
+             <!--<li class="nav-item">
+                    <a href="#" class="nav-link">
+                        <i class="nav-icon fas fa-cogs"></i>
+                        <p>LLM Settings</p>
+                    </a>
+                    <ul class="nav nav-treeview">
+                        <li class="nav-item">
+                            <a href="#" class="nav-link">
+                                <i class="far fa-circle nav-icon"></i>
+                                <p>Sublink 1</p>
+                            </a>
+                        </li>
+                        <li class="nav-item">
+                            <a href="#" class="nav-link">
+                                <i class="far fa-circle nav-icon"></i>
+                                <p>Sublink 2</p>
+                            </a>
+                        </li>
+                        
+                    </ul>
+                </li> -->
+
+                <!-- Add more navigation links here -->
+            </ul>
+        </nav>
+        <!-- /.sidebar-menu -->
+    </div>
+    <!-- /.sidebar -->
+</aside>
+
+
+<!-- AdminLTE JS -->
+<script >
+    
+        function logout() {
+            sessionStorage.removeItem('role');
+            sessionStorage.clear();
+            window.location.href = '/';
+    }
+
+
+document.addEventListener("DOMContentLoaded", function() {
+   
+    const company_id1 = document.getElementById("company_id").value;  
+    const role1 = document.getElementById("userRole").value;
+    sessionStorage.setItem('siderole1',role1);
+    sessionStorage.setItem('sidecompanyId1',company_id1);
+
+        const sidecompanyId = sessionStorage.getItem('sidecompanyId1');
+        const siderole = sessionStorage.getItem('siderole1');
+        if (sidecompanyId && siderole) {
+            console.log("Company ID inside sidepane:", sidecompanyId);
+            console.log("Role inside sidepane:",siderole);
+           
+            editCompany(sidecompanyId,siderole);
+            if (siderole==='admin')
+        {
+            console.log("inside admin before edit");
+            updateLinkVisibility(siderole);
+        }
+    }
+          
+     });
+
+    async function updateLinkVisibility(siderole) {
+        //const role = sessionStorage.getItem('role');
+    if(siderole==='admin')
+    {
+    const displayState = JSON.parse(sessionStorage.getItem('displayState'));
+    
+    // Update the visibility of links based on the stored state
+    document.getElementById('api_connectors_link').style.display = displayState.apiConnectors;
+    document.getElementById('knowledgebase_link').style.display = displayState.knowledgeBase;
+    document.getElementById('data_connectors_link').style.display = displayState.dataConnectors
+}
+    }
+    async function  editCompany(sidecompanyId,siderole) {
+        console.log("inside edit ", sidecompanyId); 
+        console.log("inside edit role role",siderole);
+        $.getJSON(`/api/getcompanydetails/${sidecompanyId}`, function (company) {
+            // Set the value of #llm_tools and trigger change event
+            $('#llm_tools').val(company.llm_tools.split(',')).trigger('change');
+            
+            // Get the selected values from #llm_tools
+            const llmTools = $('#llm_tools').val(); // This is an array
+            
+            console.log("inside sidepane edit llmTools", llmTools); 
+        //const role =sessionStorage.getItem('role');
+               
+        if (llmTools && llmTools.length > 0) {
+              console.log("inside if");
+              if (siderole === 'admin') {        
+                    // Example: Conditionally display some links based on llm_tools
+          if (api_connectors_link) {
+            api_connectors_link.style.display = llmTools.includes('API') ? 'block' : 'none';
+            console.log("state api",api_connectors_link.style.display );
+        }
+
+        if (knowledgebase_link) {
+            knowledgebase_link.style.display = llmTools.includes('Static Documents') ? 'block' : 'none';
+            console.log("state know", knowledgebase_link.style.display);
+        }
+
+        if (data_connectors_link) {
+            data_connectors_link.style.display = llmTools.includes('Database') ? 'block' : 'none';
+            console.log("state dataconn", data_connectors_link.style.display);
+        }
+        
+          console.log("inside storageadmin");
+            sessionStorage.setItem('displayState', JSON.stringify({
+            apiConnectors: api_connectors_link.style.display,
+            knowledgeBase:  knowledgebase_link.style.display ,
+            dataConnectors:  data_connectors_link.style.display
+            
+        }));  
+                }
+           }
+        }).fail(function () {
+            alert("Error retrieving company details.");
+        });
+        
+    }
+</script>
+</head>
+</html>