dbviewer 0.7.1 → 0.7.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8ae5e2964635ef24eaa04e213e09c6ec284b2361d4b23d648297b92b9c276474
-  data.tar.gz: f205bbb6df4cf8bbc5b748ae91b9843e8704f26d16d37337747ad8023f5825db
+  metadata.gz: 50301b7fa1867ac7e266e3b48eb962e7e456de1e43a664750e8885a9b603f6ca
+  data.tar.gz: 0377f20859609a2807bdecc8bc5f9118dae6581b7d4819504900e7e6a371dba3
 SHA512:
-  metadata.gz: 5541be4f54077ebd58091153cbeb53464e4f32469e8a10220f823d1528e59a90e6edfeba26e910f4362528e69013e537619a3d6c79938024dbca5be3fee490e3
-  data.tar.gz: d68cb03d0f721cc96561c809ede600b99f702a69c9607719916a60edb431659e9a6eb41abd6b3330de56a0fe48bf48d9d06d3d88a0d9f1b567378330beca1a9e
+  metadata.gz: b17042fe0172fba83874c2498a99e9b9681092c5aedefb495cd2d55a41913d2d84dbbbdac3daa03a59928d465d7538183aa3dc5f12e41fda54add729b8963291
+  data.tar.gz: e3163cce763297208aeccae790ee6fb9890a2f084a974e2ac3e41acc0dac51ea6d005409cc57c71e3e605d1d406e7ea95b1ae9b83647800ae6d26d1444b8083e

data/README.md

@@ -37,7 +37,7 @@ You can explore a live demo of DBViewer at [https://dbviewer-demo.wailantirajoh.
 Add this line to your application's Gemfile:
 
 ```ruby
-gem "dbviewer", group: :development
+gem "dbviewer"
 ```
 
 And then execute:
@@ -151,9 +151,11 @@ end
 
 Each connection needs to reference an ActiveRecord class that establishes a database connection. For more details, see [Multiple Database Connections](docs/multiple_connections.md).
 
-## 🪵 Query Logging
+## 🪵 Query Logging (Development Only)
 
-DBViewer includes a powerful SQL query logging system that captures and analyzes database queries. You can access this log through the `/dbviewer/logs` endpoint. The logging system offers two storage backends:
+DBViewer includes a powerful SQL query logging system that captures and analyzes database queries. You can access this log through the `/dbviewer/logs` endpoint.
+
+The logging system offers two storage backends:
 
 ### Disabling Query Logging
 
@@ -210,34 +212,6 @@ end
 When credentials are provided, all DBViewer routes will be protected by HTTP Basic Authentication.
 Without valid credentials, users will be prompted for a username and password before they can access any DBViewer page.
 
-## 🌱 Production Access
-
-With the addition of Basic Authentication, DBViewer can now be used in any environment including production. We recommend the following for production deployments:
-
-1. **Always** enable HTTP Basic Authentication with strong credentials:
-
-   ```ruby
-   Dbviewer.configure do |config|
-     config.admin_credentials = {
-       username: "unique_username",
-       password: SecureRandom.hex(16)  # Generate a strong random password
-     }
-   end
-   ```
-
-2. Mount the engine in your routes file:
-
-   ```ruby
-   # In any environment, with Basic Auth protection
-   mount Dbviewer::Engine, at: "/dbviewer"
-   ```
-
-3. Access the tool through your regular application URL:
-
-   ```
-   https://yourdomain.com/dbviewer
-   ```
-
 ## 📝 Security Note
 
 ⚠️ **Warning**: This engine provides direct access to your database contents, which contains sensitive information. Always protect it with HTTP Basic Authentication by configuring strong credentials as shown above.
@@ -260,10 +234,10 @@ The simplest way to update is using Bundler:
 
   ```ruby
   # For the latest version
-  gem "dbviewer", group: :development
+  gem "dbviewer"
 
   # Or specify a version
-  gem "dbviewer", "~> 0.3.2", group: :development
+  gem "dbviewer", "~> 0.7.2"
   ```
 
 - Run bundle update:

data/app/assets/javascripts/dbviewer/entity_relationship_diagram.js

@@ -100,37 +100,35 @@ document.addEventListener("DOMContentLoaded", function () {
   let relationshipsLoaded = false;
 
   // Function to fetch relationships asynchronously
-  function fetchRelationships() {
+  async function fetchRelationships() {
     const apiPath = document.getElementById("relationships_api_path").value;
-    return fetch(apiPath, {
-      headers: {
-        Accept: "application/json",
-        "X-Requested-With": "XMLHttpRequest",
-      },
-    })
-      .then((response) => {
-        if (!response.ok) {
-          throw new Error(`HTTP error! status: ${response.status}`);
-        }
-        return response.json();
-      })
-      .then((data) => {
-        relationships = data.relationships || [];
-        relationshipsLoaded = true;
-        updateRelationshipsStatus(true);
-        return relationships;
-      })
-      .catch((error) => {
-        console.error("Error fetching relationships:", error);
-        relationshipsLoaded = true; // Mark as loaded even on error to prevent infinite loading
-        updateRelationshipsStatus(true);
-        return [];
+    try {
+      const response = await fetch(apiPath, {
+        headers: {
+          Accept: "application/json",
+          "X-Requested-With": "XMLHttpRequest",
+        },
       });
+
+      if (!response.ok) {
+        throw new Error(`HTTP error! status: ${response.status}`);
+      }
+
+      const data = await response.json();
+      relationships = data.relationships || [];
+      relationshipsLoaded = true;
+      updateRelationshipsStatus(true);
+      return relationships;
+    } catch (error) {
+      console.error("Error fetching relationships:", error);
+      relationshipsLoaded = true; // Mark as loaded even on error to prevent infinite loading
+      updateRelationshipsStatus(true);
+      return [];
+    }
   }
 
   // Function to update loading status
   function updateLoadingStatus(message) {
-    const loadingElement = document.getElementById("erd-loading");
     const loadingPhase = document.getElementById("loading-phase");
     if (loadingPhase) {
       loadingPhase.textContent = message;
@@ -196,6 +194,35 @@ document.addEventListener("DOMContentLoaded", function () {
   const tablePath = document.getElementById("tables_path").value;
 
   // First pass: add all tables with minimal info and start loading columns
+  // Function to fetch column data for a table
+  async function fetchTableColumns(tableName) {
+    try {
+      const response = await fetch(`${tablePath}/${tableName}?format=json`, {
+        headers: {
+          Accept: "application/json",
+          "X-Requested-With": "XMLHttpRequest",
+        },
+      });
+
+      const data = await response.json();
+
+      if (data && data.columns) {
+        tableColumns[tableName] = data.columns;
+        columnsLoadedCount++;
+
+        // Update progress bar
+        updateTableProgress(columnsLoadedCount, totalTables);
+
+        checkIfReadyToUpdate();
+      }
+    } catch (error) {
+      console.error(`Error fetching columns for table ${tableName}:`, error);
+      columnsLoadedCount++;
+      updateTableProgress(columnsLoadedCount, totalTables);
+      checkIfReadyToUpdate();
+    }
+  }
+
   tables.forEach(function (table) {
     const tableName = table.name;
     mermaidDefinition += `  ${tableName} {\n`;
@@ -203,30 +230,7 @@ document.addEventListener("DOMContentLoaded", function () {
     mermaidDefinition += "  }\n";
 
     // Start loading column data asynchronously
-    fetch(`${tablePath}/${tableName}?format=json`, {
-      headers: {
-        Accept: "application/json",
-        "X-Requested-With": "XMLHttpRequest",
-      },
-    })
-      .then((response) => response.json())
-      .then((data) => {
-        if (data && data.columns) {
-          tableColumns[tableName] = data.columns;
-          columnsLoadedCount++;
-
-          // Update progress bar
-          updateTableProgress(columnsLoadedCount, totalTables);
-
-          checkIfReadyToUpdate();
-        }
-      })
-      .catch((error) => {
-        console.error(`Error fetching columns for table ${tableName}:`, error);
-        columnsLoadedCount++;
-        updateTableProgress(columnsLoadedCount, totalTables);
-        checkIfReadyToUpdate();
-      });
+    fetchTableColumns(tableName);
   });
 
   // Function to check if we're ready to update the diagram with full data

data/app/assets/javascripts/dbviewer/sidebar.js

@@ -0,0 +1,210 @@
+document.addEventListener("DOMContentLoaded", function () {
+  const searchInput = document.getElementById("tableSearch");
+  const sidebarContent = document.querySelector(".dbviewer-sidebar-content");
+
+  // Storage keys for persistence
+  const STORAGE_KEYS = {
+    searchFilter: "dbviewer_sidebar_search_filter",
+    scrollPosition: "dbviewer_sidebar_scroll_position",
+  };
+
+  if (searchInput) {
+    // Debounce function to limit how often the filter runs
+    function debounce(func, wait) {
+      let timeout;
+      return function () {
+        const context = this;
+        const args = arguments;
+        clearTimeout(timeout);
+        timeout = setTimeout(function () {
+          func.apply(context, args);
+        }, wait);
+      };
+    }
+
+    // Filter function
+    const filterTables = debounce(function () {
+      const query = searchInput.value.toLowerCase();
+      const tableItems = document.querySelectorAll(
+        "#tablesList .list-group-item-action"
+      );
+      let visibleCount = 0;
+
+      // Save the current search filter to localStorage
+      localStorage.setItem(STORAGE_KEYS.searchFilter, searchInput.value);
+
+      tableItems.forEach(function (item) {
+        // Get the table name from the title attribute for more accurate matching
+        const tableName = (item.getAttribute("title") || item.textContent)
+          .trim()
+          .toLowerCase();
+
+        // Also get the displayed text content for a broader match
+        const displayedText = item.textContent.trim().toLowerCase();
+
+        if (tableName.includes(query) || displayedText.includes(query)) {
+          item.classList.remove("d-none");
+          visibleCount++;
+        } else {
+          item.classList.add("d-none");
+        }
+      });
+
+      // Update the tables count in the sidebar
+      const tableCountElement = document.getElementById("table-count");
+      if (tableCountElement) {
+        tableCountElement.textContent = visibleCount;
+      }
+
+      // Show/hide no results message
+      let noResultsEl = document.getElementById("dbviewer-no-filter-results");
+      if (visibleCount === 0 && query !== "") {
+        if (!noResultsEl) {
+          noResultsEl = document.createElement("div");
+          noResultsEl.id = "dbviewer-no-filter-results";
+          noResultsEl.className = "list-group-item text-muted text-center py-3";
+          noResultsEl.innerHTML =
+            '<i class="bi bi-search me-1"></i> No tables match "<span class="fw-bold"></span>"';
+          document.getElementById("tablesList").appendChild(noResultsEl);
+        }
+        noResultsEl.querySelector(".fw-bold").textContent = query;
+        noResultsEl.style.display = "block";
+      } else if (noResultsEl) {
+        noResultsEl.style.display = "none";
+      }
+    }, 150); // Debounce for 150ms
+
+    // Set up clear button first
+    const clearButton = document.createElement("button");
+    clearButton.type = "button";
+    clearButton.className = "btn btn-sm btn-link position-absolute";
+    clearButton.style.right = "15px";
+    clearButton.style.top = "50%";
+    clearButton.style.transform = "translateY(-50%)";
+    clearButton.style.display = "none";
+    clearButton.style.color = "#6c757d";
+    clearButton.style.fontSize = "0.85rem";
+    clearButton.style.padding = "0.25rem";
+    clearButton.style.width = "1.5rem";
+    clearButton.style.textAlign = "center";
+    clearButton.innerHTML = '<i class="bi bi-x-circle"></i>';
+    clearButton.addEventListener("click", function () {
+      searchInput.value = "";
+      // Clear the saved filter from localStorage
+      localStorage.removeItem(STORAGE_KEYS.searchFilter);
+      // Call filter directly without debouncing for immediate feedback
+      filterTables();
+      this.style.display = "none";
+    });
+
+    const filterContainer = document.querySelector(
+      ".dbviewer-table-filter-container"
+    );
+    if (filterContainer) {
+      filterContainer.style.position = "relative";
+      filterContainer.appendChild(clearButton);
+
+      searchInput.addEventListener("input", function () {
+        clearButton.style.display = this.value ? "block" : "none";
+      });
+    }
+
+    // Restore saved search filter on page load and apply it immediately
+    const savedFilter = localStorage.getItem(STORAGE_KEYS.searchFilter);
+    if (savedFilter) {
+      searchInput.value = savedFilter;
+      // Show clear button immediately when filter is restored
+      clearButton.style.display = "block";
+      // Apply filter immediately without debouncing to prevent blinking
+      const query = savedFilter.toLowerCase();
+      const tableItems = document.querySelectorAll(
+        "#tablesList .list-group-item-action"
+      );
+      let visibleCount = 0;
+
+      tableItems.forEach(function (item) {
+        const tableName = (item.getAttribute("title") || item.textContent)
+          .trim()
+          .toLowerCase();
+        const displayedText = item.textContent.trim().toLowerCase();
+
+        if (tableName.includes(query) || displayedText.includes(query)) {
+          item.classList.remove("d-none");
+          visibleCount++;
+        } else {
+          item.classList.add("d-none");
+        }
+      });
+
+      // Update the tables count immediately
+      const tableCountElement = document.getElementById("table-count");
+      if (tableCountElement) {
+        tableCountElement.textContent = visibleCount;
+      }
+
+      // Handle no results message immediately
+      let noResultsEl = document.getElementById("dbviewer-no-filter-results");
+      if (visibleCount === 0 && query !== "") {
+        if (!noResultsEl) {
+          noResultsEl = document.createElement("div");
+          noResultsEl.id = "dbviewer-no-filter-results";
+          noResultsEl.className = "list-group-item text-muted text-center py-3";
+          noResultsEl.innerHTML =
+            '<i class="bi bi-search me-1"></i> No tables match "<span class="fw-bold"></span>"';
+          document.getElementById("tablesList").appendChild(noResultsEl);
+        }
+        noResultsEl.querySelector(".fw-bold").textContent = query;
+        noResultsEl.style.display = "block";
+      } else if (noResultsEl) {
+        noResultsEl.style.display = "none";
+      }
+    }
+
+    // Restore saved scroll position on page load
+    if (sidebarContent) {
+      const savedScrollPosition = localStorage.getItem(
+        STORAGE_KEYS.scrollPosition
+      );
+      if (savedScrollPosition) {
+        // Use requestAnimationFrame to ensure DOM is fully rendered
+        requestAnimationFrame(() => {
+          sidebarContent.scrollTop = parseInt(savedScrollPosition, 10);
+        });
+      }
+
+      // Save scroll position on scroll
+      const saveScrollPosition = debounce(function () {
+        localStorage.setItem(
+          STORAGE_KEYS.scrollPosition,
+          sidebarContent.scrollTop
+        );
+      }, 100);
+
+      sidebarContent.addEventListener("scroll", saveScrollPosition);
+    }
+
+    // Set up event listeners for the search input
+    searchInput.addEventListener("input", filterTables);
+    searchInput.addEventListener("keyup", function (e) {
+      filterTables();
+
+      // Add keyboard navigation for the filtered list
+      if (e.key === "Enter" || e.key === "ArrowDown") {
+        e.preventDefault();
+        // Focus the first visible table item (not having d-none class)
+        const firstVisibleItem = document.querySelector(
+          "#tablesList .list-group-item-action:not(.d-none)"
+        );
+        if (firstVisibleItem) {
+          firstVisibleItem.focus();
+          // Make sure the item is visible in the scrollable area
+          firstVisibleItem.scrollIntoView({
+            behavior: "smooth",
+            block: "nearest",
+          });
+        }
+      }
+    });
+    searchInput.addEventListener("search", filterTables); // For clearing via the "x" in some browsers
+  }
+});

data/app/controllers/dbviewer/home_controller.rb

@@ -7,11 +7,5 @@ module Dbviewer
         key: current_connection_key
       }
     end
-
-    private
-
-    def set_tables
-      @tables = fetch_tables(include_record_counts: true)
-    end
   end
 end

data/app/views/dbviewer/shared/_tables_sidebar.html.erb

@@ -11,23 +11,7 @@
                 title: table[:name],
                 class: "list-group-item list-group-item-action d-flex align-items-center #{'active' if current_table?(table[:name])}", 
                 tabindex: "0", 
-                data: { table_name: table[:name] },
-                onkeydown: "
-                  if(event.key === 'ArrowDown') { 
-                    event.preventDefault();
-                    let next = this.nextElementSibling;
-                    while(next && next.classList.contains('d-none')) {
-                      next = next.nextElementSibling;
-                    }
-                    if(next) next.focus();
-                  } else if(event.key === 'ArrowUp') { 
-                    event.preventDefault();
-                    let prev = this.previousElementSibling;
-                    while(prev && prev.classList.contains('d-none')) {
-                      prev = prev.previousElementSibling;
-                    }
-                    if(prev) prev.focus();
-                  }" do %>
+                data: { table_name: table[:name] } do %>
       <div class="d-flex justify-content-between align-items-center w-100">
         <div class="text-truncate">
           <i class="bi bi-table me-2 small"></i>

data/app/views/layouts/dbviewer/application.html.erb

@@ -38,6 +38,7 @@
   <script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
   
   <%= javascript_include_tag "dbviewer/layout", "data-turbo-track": "reload" %>
+  <%= javascript_include_tag "dbviewer/sidebar", "data-turbo-track": "reload" %>
   <%= stylesheet_link_tag "dbviewer/application", "data-turbo-track": "reload" %>
   
   <%= yield :head %>

data/app/views/layouts/dbviewer/shared/_sidebar.html.erb

@@ -3,58 +3,6 @@
     <input type="text" class="form-control form-control-sm dbviewer-table-filter mb-0" 
            id="tableSearch" placeholder="Filter tables..." aria-label="Filter tables">
   </div>
-  
-
-  
-  <!-- Add custom styling for datetime inputs -->
-  <style>
-    /* Better datetime input styling */
-    input[type="datetime-local"] {
-      padding-right: 0.5rem;
-    }
-    
-    /* Dark mode support for datetime inputs */
-    [data-bs-theme="dark"] input[type="datetime-local"] {
-      background-color: rgba(255,255,255,0.1);
-      color: #fff;
-      border-color: rgba(255,255,255,0.15);
-    }
-    
-    [data-bs-theme="dark"] input[type="datetime-local"]::-webkit-calendar-picker-indicator {
-      filter: invert(1);
-    }
-  </style>
-  
-  <script>
-    // Set default values for datetime inputs when empty
-    document.addEventListener('DOMContentLoaded', function() {
-      const startInput = document.getElementById('creationFilterStart');
-      const endInput = document.getElementById('creationFilterEnd');
-      
-      // When applying filter with empty start date, default to beginning of current month
-      if (startInput) {
-        startInput.addEventListener('click', function() {
-          if (!this.value) {
-            const now = new Date();
-            const firstDay = new Date(now.getFullYear(), now.getMonth(), 1);
-            const formattedDate = firstDay.toISOString().slice(0, 16); // Format: YYYY-MM-DDTHH:MM
-            this.value = formattedDate;
-          }
-        });
-      }
-      
-      // When applying filter with empty end date, default to current datetime
-      if (endInput) {
-        endInput.addEventListener('click', function() {
-          if (!this.value) {
-            const now = new Date();
-            const formattedDate = now.toISOString().slice(0, 16); // Format: YYYY-MM-DDTHH:MM
-            this.value = formattedDate;
-          }
-        });
-      }
-    });
-  </script>
 </div>
 
 <div class="dbviewer-sidebar-content">
@@ -115,194 +63,3 @@
   <i class="bi bi-gem me-1"></i>
   DBViewer v<%= Dbviewer::VERSION %>
 </div>
-
-<script>
-  document.addEventListener('DOMContentLoaded', function() {
-    const searchInput = document.getElementById('tableSearch');
-    const sidebarContent = document.querySelector('.dbviewer-sidebar-content');
-    
-    // Storage keys for persistence
-    const STORAGE_KEYS = {
-      searchFilter: 'dbviewer_sidebar_search_filter',
-      scrollPosition: 'dbviewer_sidebar_scroll_position'
-    };
-    
-    if (searchInput) {
-      // Debounce function to limit how often the filter runs
-      function debounce(func, wait) {
-        let timeout;
-        return function() {
-          const context = this;
-          const args = arguments;
-          clearTimeout(timeout);
-          timeout = setTimeout(function() {
-            func.apply(context, args);
-          }, wait);
-        };
-      }
-      
-      // Filter function
-      const filterTables = debounce(function() {
-        const query = searchInput.value.toLowerCase();
-        const tableItems = document.querySelectorAll('#tablesList .list-group-item-action');
-        let visibleCount = 0;
-        
-        // Save the current search filter to localStorage
-        localStorage.setItem(STORAGE_KEYS.searchFilter, searchInput.value);
-        
-        tableItems.forEach(function(item) {
-          // Get the table name from the title attribute for more accurate matching
-          const tableName = (item.getAttribute('title') || item.textContent).trim().toLowerCase();
-          
-          // Also get the displayed text content for a broader match
-          const displayedText = item.textContent.trim().toLowerCase();
-          
-          if (tableName.includes(query) || displayedText.includes(query)) {
-            item.classList.remove('d-none');
-            visibleCount++;
-          } else {
-            item.classList.add('d-none');
-          }
-        });
-        
-        // Update the tables count in the sidebar
-        const tableCountElement = document.getElementById('table-count');
-        if (tableCountElement) {
-          tableCountElement.textContent = visibleCount;
-        }
-        
-        // Show/hide no results message
-        let noResultsEl = document.getElementById('dbviewer-no-filter-results');
-        if (visibleCount === 0 && query !== '') {
-          if (!noResultsEl) {
-            noResultsEl = document.createElement('div');
-            noResultsEl.id = 'dbviewer-no-filter-results';
-            noResultsEl.className = 'list-group-item text-muted text-center py-3';
-            noResultsEl.innerHTML = '<i class="bi bi-search me-1"></i> No tables match "<span class="fw-bold"></span>"';
-            document.getElementById('tablesList').appendChild(noResultsEl);
-          }
-          noResultsEl.querySelector('.fw-bold').textContent = query;
-          noResultsEl.style.display = 'block';
-        } else if (noResultsEl) {
-          noResultsEl.style.display = 'none';
-        }
-      }, 150); // Debounce for 150ms
-      
-      // Set up clear button first
-      const clearButton = document.createElement('button');
-      clearButton.type = 'button';
-      clearButton.className = 'btn btn-sm btn-link position-absolute';
-      clearButton.style.right = '15px';
-      clearButton.style.top = '50%';
-      clearButton.style.transform = 'translateY(-50%)';
-      clearButton.style.display = 'none';
-      clearButton.style.color = '#6c757d';
-      clearButton.style.fontSize = '0.85rem';
-      clearButton.style.padding = '0.25rem';
-      clearButton.style.width = '1.5rem';
-      clearButton.style.textAlign = 'center';
-      clearButton.innerHTML = '<i class="bi bi-x-circle"></i>';
-      clearButton.addEventListener('click', function() {
-        searchInput.value = '';
-        // Clear the saved filter from localStorage
-        localStorage.removeItem(STORAGE_KEYS.searchFilter);
-        // Call filter directly without debouncing for immediate feedback
-        filterTables();
-        this.style.display = 'none';
-      });
-      
-      const filterContainer = document.querySelector('.dbviewer-table-filter-container');
-      if (filterContainer) {
-        filterContainer.style.position = 'relative';
-        filterContainer.appendChild(clearButton);
-        
-        searchInput.addEventListener('input', function() {
-          clearButton.style.display = this.value ? 'block' : 'none';
-        });
-      }
-      
-      // Restore saved search filter on page load and apply it immediately
-      const savedFilter = localStorage.getItem(STORAGE_KEYS.searchFilter);
-      if (savedFilter) {
-        searchInput.value = savedFilter;
-        // Show clear button immediately when filter is restored
-        clearButton.style.display = 'block';
-        // Apply filter immediately without debouncing to prevent blinking
-        const query = savedFilter.toLowerCase();
-        const tableItems = document.querySelectorAll('#tablesList .list-group-item-action');
-        let visibleCount = 0;
-        
-        tableItems.forEach(function(item) {
-          const tableName = (item.getAttribute('title') || item.textContent).trim().toLowerCase();
-          const displayedText = item.textContent.trim().toLowerCase();
-          
-          if (tableName.includes(query) || displayedText.includes(query)) {
-            item.classList.remove('d-none');
-            visibleCount++;
-          } else {
-            item.classList.add('d-none');
-          }
-        });
-        
-        // Update the tables count immediately
-        const tableCountElement = document.getElementById('table-count');
-        if (tableCountElement) {
-          tableCountElement.textContent = visibleCount;
-        }
-        
-        // Handle no results message immediately
-        let noResultsEl = document.getElementById('dbviewer-no-filter-results');
-        if (visibleCount === 0 && query !== '') {
-          if (!noResultsEl) {
-            noResultsEl = document.createElement('div');
-            noResultsEl.id = 'dbviewer-no-filter-results';
-            noResultsEl.className = 'list-group-item text-muted text-center py-3';
-            noResultsEl.innerHTML = '<i class="bi bi-search me-1"></i> No tables match "<span class="fw-bold"></span>"';
-            document.getElementById('tablesList').appendChild(noResultsEl);
-          }
-          noResultsEl.querySelector('.fw-bold').textContent = query;
-          noResultsEl.style.display = 'block';
-        } else if (noResultsEl) {
-          noResultsEl.style.display = 'none';
-        }
-      }
-      
-      // Restore saved scroll position on page load
-      if (sidebarContent) {
-        const savedScrollPosition = localStorage.getItem(STORAGE_KEYS.scrollPosition);
-        if (savedScrollPosition) {
-          // Use requestAnimationFrame to ensure DOM is fully rendered
-          requestAnimationFrame(() => {
-            sidebarContent.scrollTop = parseInt(savedScrollPosition, 10);
-          });
-        }
-        
-        // Save scroll position on scroll
-        const saveScrollPosition = debounce(function() {
-          localStorage.setItem(STORAGE_KEYS.scrollPosition, sidebarContent.scrollTop);
-        }, 100);
-        
-        sidebarContent.addEventListener('scroll', saveScrollPosition);
-      }
-      
-      // Set up event listeners for the search input
-      searchInput.addEventListener('input', filterTables);
-      searchInput.addEventListener('keyup', function(e) {
-        filterTables();
-        
-        // Add keyboard navigation for the filtered list
-        if (e.key === 'Enter' || e.key === 'ArrowDown') {
-          e.preventDefault();
-          // Focus the first visible table item (not having d-none class)
-          const firstVisibleItem = document.querySelector('#tablesList .list-group-item-action:not(.d-none)');
-          if (firstVisibleItem) {
-            firstVisibleItem.focus();
-            // Make sure the item is visible in the scrollable area
-            firstVisibleItem.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
-          }
-        }
-      });
-      searchInput.addEventListener('search', filterTables);  // For clearing via the "x" in some browsers
-    }
-  });
-</script>

data/lib/dbviewer/database/dynamic_model_factory.rb

@@ -83,6 +83,22 @@ module Dbviewer
 
           # Disable timestamps for better compatibility
           self.record_timestamps = false
+
+          # Make the model read-only to prevent accidental data modifications
+          def readonly?
+            true
+          end
+
+          # Disable write operations at the class level
+          class << self
+            def delete_all(*)
+              raise ActiveRecord::ReadOnlyRecord, "#{name} is a read-only model"
+            end
+
+            def update_all(*)
+              raise ActiveRecord::ReadOnlyRecord, "#{name} is a read-only model"
+            end
+          end
         end)
       end
     end

data/lib/dbviewer/version.rb

@@ -1,3 +1,3 @@
 module Dbviewer
-  VERSION = "0.7.1"
+  VERSION = "0.7.3"
 end

data/lib/dbviewer.rb

@@ -21,6 +21,8 @@ require "dbviewer/database/metadata_manager"
 require "dbviewer/datatable/query_operations"
 require "dbviewer/datatable/query_params"
 
+require "propshaft"
+
 module Dbviewer
   # Main module for the database viewer
 

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: dbviewer
 version: !ruby/object:Gem::Version
-  version: 0.7.1
+  version: 0.7.3
 platform: ruby
 authors:
 - Wailan Tirajoh
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-06-10 00:00:00.000000000 Z
+date: 2025-06-12 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -67,6 +67,7 @@ files:
 - app/assets/javascripts/dbviewer/home.js
 - app/assets/javascripts/dbviewer/layout.js
 - app/assets/javascripts/dbviewer/query.js
+- app/assets/javascripts/dbviewer/sidebar.js
 - app/assets/javascripts/dbviewer/table.js
 - app/assets/stylesheets/dbviewer/application.css
 - app/assets/stylesheets/dbviewer/entity_relationship_diagram.css