Implement CORS-fields in views & HTML, improve list rendering & selection

eveai_app/templates/macros.html

@@ -64,6 +64,53 @@
 </div>
 {% endmacro %}
 
+{% macro render_selectable_table(headers, rows, selectable, id) %}
+<div class="card">
+  <div class="table-responsive">
+    <table class="table align-items-center mb-0" id="{{ id }}">
+      <thead>
+        <tr>
+          {% if selectable %}
+            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Select</th>
+          {% endif %}
+          {% for header in headers %}
+            <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">{{ header }}</th>
+          {% endfor %}
+        </tr>
+      </thead>
+      <tbody>
+        {% for row in rows %}
+          <tr>
+            {% if selectable %}
+              <td><input type="radio" name="selected_row" value="{{ row[0] }}" required></td>
+            {% endif %}
+            {% for cell in row %}
+              <td class="{{ cell.class }}">
+                {% if cell.type == 'image' %}
+                  <div class="d-flex px-2 py-1">
+                    <div>
+                      <img src="{{ cell.value }}" class="avatar avatar-sm me-3">
+                    </div>
+                  </div>
+                {% elif cell.type == 'text' %}
+                  <p class="text-xs {{ cell.text_class }}">{{ cell.value }}</p>
+                {% elif cell.type == 'badge' %}
+                  <span class="badge badge-sm {{ cell.badge_class }}">{{ cell.value }}</span>
+                {% elif cell.type == 'link' %}
+                  <a href="{{ cell.href }}" class="text-secondary font-weight-normal text-xs" data-toggle="tooltip" data-original-title="{{ cell.title }}">{{ cell.value }}</a>
+                {% else %}
+                  {{ cell.value }}
+                {% endif %}
+              </td>
+            {% endfor %}
+          </tr>
+        {% endfor %}
+      </tbody>
+    </table>
+  </div>
+</div>
+{% endmacro %}
+
 {% macro render_accordion(accordion_id, accordion_items, header_title, header_description) %}
 <div class="accordion-1">
   <div class="container">

eveai_app/templates/navbar.html

@@ -69,10 +69,13 @@
                         <ul class="navbar-nav navbar-nav-hover mx-auto">
                             {% if current_user.is_authenticated %}
                                 {{ dropdown('User Mgmt', 'contacts', [
-                                    {'name': 'Select Tenant', 'url': '/user/select_tenant', 'roles': ['Super User']},
+                                    {'name': 'Tenant List', 'url': '/user/select_tenant', 'roles': ['Super User']},
                                     {'name': 'Tenant Registration', 'url': '/user/tenant', 'roles': ['Super User']},
+                                    {'name': 'Generate API Key', 'url': '/user/generate_api_key', 'roles': ['Super User']},
+                                    {'name': 'Tenant Domains', 'url': '/user/view_tenant_domains/' + session['tenant']['id']|string, 'roles': ['Super User', 'Tenant Admin']},
+                                    {'name': 'Tenant Domain Registration', 'url': '/user/tenant_domain', 'roles': ['Super User', 'Tenant Admin']},
+                                    {'name': 'User List', 'url': '/user/view_users/' + session['tenant']['id']|string, 'roles': ['Super User', 'Tenant Admin']},
                                     {'name': 'User Registration', 'url': '/user/user', 'roles': ['Super User', 'Tenant Admin']},
-                                    {'name': 'User List', 'url': '/user/view_users/' + session['tenant']['id']|string, 'roles': ['Super User', 'Tenant Admin']}
                                 ]) }}
                             {% endif %}
                         {% if current_user.is_authenticated %}

eveai_app/templates/scripts.html

@@ -1,6 +1,7 @@
         <!-- Optional JavaScript -->
         <!-- jQuery first, then Popper.js, then Bootstrap JS -->
         <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
+        <script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
         <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
         <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
         {% block scripts %}

eveai_app/templates/user/edit_tenant_domain.html

@@ -0,0 +1,24 @@
+{% extends 'base.html' %}
+{% from "macros.html" import render_field %}
+
+{% block title %}Update Tenant Domain{% endblock %}
+
+{% block content_title %}Update Tenant Domain{% endblock %}
+{% block content_description %}Disable a tenant domain{% endblock %}
+
+{% block content %}
+    <form method="post">
+        {{ form.hidden_tag() }}
+        {%  set disabled_fields = ['domain'] %}
+        {%  set exclude_fields = [] %}
+        {% for field in form %}
+            {{ render_field(field, disabled_fields, exclude_fields) }}
+        {% endfor %}
+        <button type="submit" class="btn btn-primary">Update Domain</button>
+    </form>
+{% endblock %}
+
+
+{% block content_footer %}
+
+{% endblock %}

eveai_app/templates/user/select_tenant.html

@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% from "macros.html" import render_field %}
+{% from "macros.html" import render_selectable_table %}
 
 {% block title %}Tenant Selection{% endblock %}
 
@@ -8,27 +8,38 @@
 
 {% block content %}
 <form method="POST" action="{{ url_for('user_bp.handle_tenant_selection') }}">
-    <table class="table">
-        <thead>
-            <tr>
-                <th>Select</th>
-                <th>Tenant Name</th>
-                <th>Tenant ID</th>
-            </tr>
-        </thead>
-        <tbody>
-            {% for tenant in tenants %}
-            <tr>
-                <td><input type="radio" name="tenant_id" value="{{ tenant.id }}" required></td>
-                <td>{{ tenant.name }}</td>
-                <td>{{ tenant.id }}</td>
-            </tr>
-            {% endfor %}
-        </tbody>
-    </table>
-    <button type="submit" name="action" value="select_tenant" class="btn btn-primary">Set Session Tenant</button>
-    <button type="submit" name="action" value="view_users" class="btn btn-secondary">View Users</button>
-    <button type="submit" name="action" value="edit_tenant" class="btn btn-secondary">Edit Tenant</button>
-    <!-- Add more buttons as needed -->
+    {{ render_selectable_table(headers=["Tenant ID", "Tenant Name","Website"], rows=tenants, selectable=True, id="tenantsTable") }}
+    <div class="form-group mt-3">
+        <button type="submit" name="action" value="select_tenant" class="btn btn-primary">Set Session Tenant</button>
+        <button type="submit" name="action" value="view_users" class="btn btn-secondary">View Users</button>
+        <button type="submit" name="action" value="edit_tenant" class="btn btn-secondary">Edit Tenant</button>
+        <!-- Add more buttons as needed -->
+    </div>
 </form>
 {% endblock %}
+{% block scripts %}
+<script>
+$(document).ready(function() {
+    $('#tenantsTable').DataTable({
+        'columnDefs': [{
+            'targets': 0,
+            'searchable': false,
+            'orderable': false,
+            'className': 'dt-body-center',
+            'render': function (data, type, full, meta){
+                return '<input type="radio" name="user_id" value="' + $('<div/>').text(data).html() + '">';
+            }
+        },
+        {
+            'targets': 1,
+            'orderable': true
+        },
+        {
+            'targets': 2,
+            'orderable': true
+        }],
+        'order': [[1, 'asc']]
+    });
+});
+</script>
+{% endblock %}

eveai_app/templates/user/tenant_domain.html

@@ -0,0 +1,24 @@
+{% extends 'base.html' %}
+{% from "macros.html" import render_field %}
+
+{% block title %}Tenant Domain Registration{% endblock %}
+
+{% block content_title %}Register Tenant Domain{% endblock %}
+{% block content_description %}Make a new tenant domain, which enables the chat client on the specified domain{% endblock %}
+
+{% block content %}
+    <form method="post">
+        {{ form.hidden_tag() }}
+        {%  set disabled_fields = [] %}
+        {%  set exclude_fields = [] %}
+        {% for field in form %}
+            {{ render_field(field, disabled_fields, exclude_fields) }}
+        {% endfor %}
+        <button type="submit" class="btn btn-primary">Register Domain</button>
+    </form>
+{% endblock %}
+
+
+{% block content_footer %}
+
+{% endblock %}

eveai_app/templates/user/view_tenant_domains.html

@@ -0,0 +1,45 @@
+{% extends 'base.html' %}
+{% from "macros.html" import render_selectable_table %}
+
+{% block title %}View Tenant Domains{% endblock %}
+
+{%  block content_title %}Select a domain{% endblock %}
+{% block content_description %}Select the domain you'd like to action upon{% endblock %}
+
+{% block content %}
+<form action="{{ url_for('user_bp.handle_tenant_domain_action') }}" method="POST">
+    {{ render_selectable_table(headers=["ID", "Domain Name", "Valid To"], rows=tenant_domains, selectable=True, id="tenantDomainsTable") }}
+    <div class="form-group mt-3">
+        <button type="submit" name="action" value="edit_tenant_domain" class="btn btn-primary">Edit Selected Domain</button>
+        <!-- Additional buttons can be added here for other actions -->
+    </div>
+</form>
+{% endblock %}
+{% block scripts %}
+<script>
+$(document).ready(function() {
+    $('#tenantDomainsTable').DataTable({
+        'columnDefs': [
+            {
+                'targets': 0,
+                'searchable': false,
+                'orderable': false,
+                'className': 'dt-body-center',
+                'render': function (data, type, full, meta) {
+                    return '<input type="radio" name="user_id" value="' + $('<div/>').text(data).html() + '">';
+                }
+            },
+            {
+                'targets': 1,
+                'orderable': true,
+            },
+            {
+                'targets': 2,
+                'orderable': true,
+            },
+        ],
+        'order': [[1, 'asc']]
+    });
+});
+</script>
+{% endblock %}

eveai_app/templates/user/view_users.html

@@ -1,5 +1,5 @@
 {% extends 'base.html' %}
-{% from "macros.html" import render_field %}
+{% from "macros.html" import render_selectable_table %}
 
 {% block title %}View Users{% endblock %}
 
@@ -7,49 +7,43 @@
 {% block content_description %}Select the user you'd like to action upon{% endblock %}
 
 {% block content %}
-<h3>Users for Selected Tenant</h3>
 <form action="{{ url_for('user_bp.handle_user_action') }}" method="POST">
-    <table id="usersTable" class="display" style="width:100%">
-        <thead>
-            <tr>
-                <th>Select</th>
-                <th>User ID</th>
-                <th>Name</th>
-                <th>Email</th>
-            </tr>
-        </thead>
-        <tbody>
-            {% for user in users %}
-            <tr>
-                <td><input type="radio" name="user_id" value="{{ user.id }}" required></td>
-                <td>{{ user.id }}</td>
-                <td>{{ user.name }}</td>
-                <td>{{ user.email }}</td>
-            </tr>
-            {% endfor %}
-        </tbody>
-    </table>
+    {{ render_selectable_table(headers=["User ID", "User Name", "Email"], rows=users, selectable=True, id="usersTable") }}
     <div class="form-group mt-3">
         <button type="submit" name="action" value="edit_user" class="btn btn-primary">Edit Selected User</button>
         <!-- Additional buttons can be added here for other actions -->
     </div>
 </form>
-<script src="https://code.jquery.com/jquery-3.5.1.js"></script>
-<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
+{% endblock %}
+{% block scripts %}
 <script>
 $(document).ready(function() {
     $('#usersTable').DataTable({
-        'columnDefs': [{
-            'targets': 0,
-            'searchable': false,
-            'orderable': false,
-            'className': 'dt-body-center',
-            'render': function (data, type, full, meta){
-                return '<input type="radio" name="user_id" value="' + $('<div/>').text(data).html() + '">';
+        'columnDefs': [
+            {
+                'targets': 0,
+                'searchable': false,
+                'orderable': false,
+                'className': 'dt-body-center',
+                'render': function (data, type, full, meta) {
+                    return '<input type="radio" name="user_id" value="' + $('<div/>').text(data).html() + '">';
+                }
+            },
+            {
+                'targets': 1,
+                'orderable': true,
+            },
+            {
+                'targets': 2,
+                'orderable': true,
+            },
+            {
+                'targets': 3,
+                'orderable': true,
             }
-        }],
+        ],
         'order': [[1, 'asc']]
     });
 });
 </script>
-{% endblock %}
+{% endblock %}