dbviewer 0.9.3 → 0.9.4.pre.alpha.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: d5835c049d579e6371f436079045d591582d15a007854de4e9fd8927f1f7f735
-  data.tar.gz: 119938578d1692bf4195069d6957e531704d991fe24f498683c124ad838ae64e
+  metadata.gz: bab71132b89e3a2b246802692149a2d662bc42bcfa54b9db4d71ab9593dc2c2a
+  data.tar.gz: 8d2160e56a9872ad9e1dfa274e5ccbdcb16c8ff1b65c134be00b806d91841a55
 SHA512:
-  metadata.gz: ba52d4e64b255e6ff36d185704c679a8480aad2ef0e02793c58b714ee78e3646848db8039ba8cbd778768c2d330705c9a66f4691638e47f73a1c942fb70466b3
-  data.tar.gz: 8c9456585431b06ca68e56f4e91d603185e7637915b51f495add7452ea6bf4feb00880334b443939beb4c802d2a8cd94063fec6f781c2dbb26174e38d671c44a
+  metadata.gz: c00de395e8f283afd2f6c905ae1e448438296ecfdc2167606d2216d3c39a492d27d2c60334d35234e5d460472a66730a6893fe79b81ce1f972b48b67d767b1b6
+  data.tar.gz: 8f9a53eb14f23c5aa2bb006458dcda9de39d031aa49907ff0a017f76d96950d101f14785292a7e0a062aac91915face67bbe34f28bfffc1fdf126076375127a8

data/README.md

@@ -14,6 +14,7 @@ It's designed for development, debugging, and database analysis, offering a clea
 - **Detailed Schema Information** - Column details, indexes, and constraints
 - **Entity Relationship Diagram (ERD)** - Interactive database schema visualization
 - **Data Browsing** - Paginated record viewing with search and filtering
+- **Data Management** - Create and delete database records directly from the interface
 - **SQL Queries** - Safe SQL query execution with validation
 - **Multiple Database Connections** - Support for multiple database sources
 - **PII Data Masking** - Configurable masking for sensitive data
@@ -98,6 +99,7 @@ Dbviewer.configure do |config|
   config.cache_expiry = 300                          # Cache expiration in seconds
   config.max_records = 10000                         # Maximum records to return in any query
   config.enable_data_export = false                  # Whether to allow data exporting
+  config.enable_record_deletion = true               # Whether to allow record deletion
   config.query_timeout = 30                          # SQL query timeout in seconds
 
   # Query logging options
@@ -197,7 +199,7 @@ DBViewer includes comprehensive security features to protect your database:
 
 ### Core Security
 
-- **Read-only Mode**: Only SELECT queries are allowed; all data modification operations are blocked
+- **Data Manipulation**: Create and read operations are supported through the UI with proper validation
 - **SQL Validation**: Prevents potentially harmful operations with comprehensive validation
 - **Query Limits**: Automatic LIMIT clause added to prevent excessive data retrieval
 - **Pattern Detection**: Detection of SQL injection patterns and suspicious constructs

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

@@ -0,0 +1,178 @@
+// Record Creation Modal
+document.addEventListener("DOMContentLoaded", function () {
+  const addRecordButton = document.getElementById("floatingAddRecordBtn");
+  if (!addRecordButton) return;
+
+  const tableName = document.getElementById("table_name").value;
+  const newRecordModal = document.getElementById("newRecordModal");
+
+  addRecordButton.addEventListener("click", async function () {
+    const modal = new bootstrap.Modal(newRecordModal);
+    const modalBody = newRecordModal.querySelector(".modal-content");
+
+    // Show loading state
+    modalBody.innerHTML = `
+      <div class="modal-body text-center py-5">
+        <div class="spinner-border text-primary" role="status">
+          <span class="visually-hidden">Loading...</span>
+        </div>
+        <p class="mt-3">Loading form...</p>
+      </div>
+    `;
+    modal.show();
+
+    try {
+      const response = await fetch(`/dbviewer/tables/${tableName}/new_record`);
+      const html = await response.text();
+      modalBody.innerHTML = html;
+      initializeFormElements();
+    } catch (error) {
+      modalBody.innerHTML = `
+        <div class="modal-header">
+          <h5 class="modal-title">Error</h5>
+          <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+        </div>
+        <div class="modal-body">
+          <div class="alert alert-danger">
+            Failed to load form: ${error.message}
+          </div>
+        </div>
+        <div class="modal-footer">
+          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+        </div>
+      `;
+    }
+  });
+
+  newRecordModal.addEventListener("submit", handleNewRecordSubmit);
+});
+
+// Initialize Select2 dropdowns and other form elements
+function initializeFormElements() {
+  if (typeof $.fn.select2 !== "undefined") {
+    // Use jquery select2 for now, maybe we can change the dependency later
+    $(".select2-dropdown").select2({
+      dropdownParent: $("#newRecordModal"),
+      theme: "bootstrap-5",
+      width: "100%",
+    });
+  }
+}
+
+async function handleNewRecordSubmit(event) {
+  event.preventDefault();
+
+  const form = event.target;
+  const submitButton = document.getElementById("createRecordButton");
+  const originalText = submitButton.innerHTML;
+  const formData = new FormData(form);
+
+  disableSubmitButton(submitButton);
+
+  try {
+    const response = await fetch(form.action, {
+      method: "POST",
+      body: formData,
+      headers: {
+        "X-Requested-With": "XMLHttpRequest",
+      },
+    });
+
+    const result = await response.json();
+
+    if (!response.ok) {
+      handleErrors(result, form);
+      return;
+    }
+
+    handleSuccess(result);
+  } catch (error) {
+    displayGenericError(form, error.message);
+  } finally {
+    enableSubmitButton(submitButton, originalText);
+  }
+}
+
+function disableSubmitButton(button) {
+  button.disabled = true;
+  button.innerHTML =
+    '<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Creating...';
+}
+
+function enableSubmitButton(button, originalText) {
+  button.disabled = false;
+  button.innerHTML = originalText;
+}
+
+function handleSuccess() {
+  const modal = bootstrap.Modal.getInstance(newRecordModal);
+  modal.hide();
+
+  Toastify({
+    text: `<span class="toast-icon"><i class="bi bi-clipboard-check"></i></span> Record created successfully!`,
+    className: "toast-factory-bot",
+    duration: 3000,
+    gravity: "bottom",
+    position: "right",
+    escapeMarkup: false,
+    style: {
+      animation: "slideInRight 0.3s ease-out, slideOutRight 0.3s ease-out 2.7s",
+    },
+  }).showToast();
+
+  setTimeout(() => {
+    window.location.reload();
+  }, 1000);
+}
+
+function handleErrors(result, form) {
+  if (result.errors) {
+    showToastErrors(result.messages);
+    showFieldErrors(result.errors, form);
+  }
+  initializeFormElements();
+}
+
+function showToastErrors(messages) {
+  const combinedMessages = Object.values(messages)
+    .flat()
+    .map((msg) => `<div>${msg}</div>`)
+    .join("");
+
+  Toastify({
+    text: `<span class="toast-icon"><i class="bi bi-exclamation-triangle"></i></span> ${combinedMessages}`,
+    className: "toast-factory-bot toast-error",
+    duration: 5000,
+    gravity: "bottom",
+    position: "right",
+    escapeMarkup: false,
+    style: {
+      animation: "slideInRight 0.3s ease-out, slideOutRight 0.3s ease-out 4.7s",
+      background: "#dc3545",
+    },
+  }).showToast();
+}
+
+function showFieldErrors(errors, form) {
+  form.querySelectorAll(".invalid-feedback").forEach((el) => el.remove());
+  Object.entries(errors).forEach(([field, messages]) => {
+    const input = document.getElementById(`record_${field}`);
+    if (!input) return;
+
+    let errorDiv = input.parentElement.querySelector(".invalid-feedback");
+    if (!errorDiv) {
+      errorDiv = document.createElement("div");
+      errorDiv.className = "invalid-feedback";
+      input.parentElement.appendChild(errorDiv);
+    }
+    errorDiv.innerHTML = messages.join("<br>");
+    input.classList.add("is-invalid");
+  });
+}
+
+function displayGenericError(form, message) {
+  const errorDiv = document.createElement("div");
+  errorDiv.className = "alert alert-danger";
+  errorDiv.textContent = `Error: ${message}`;
+  form.prepend(errorDiv);
+}

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

@@ -0,0 +1,171 @@
+document.addEventListener("DOMContentLoaded", () => {
+  const tableName = document.getElementById("table_name")?.value;
+  const deleteConfirmModal = document.getElementById("deleteConfirmModal");
+  const recordDeleteForm = document.getElementById("recordDeleteForm");
+
+  // === TOASTIFY UTIL ===
+  const showToast = (message, type = "success") => {
+    const icons = {
+      success: "clipboard-check",
+      info: "info-circle",
+      danger: "exclamation-triangle",
+      warning: "exclamation-diamond",
+    };
+
+    Toastify({
+      text: `
+        <span class="toast-icon">
+          <i class="bi bi-${icons[type] || "info-circle"}"></i>
+        </span>
+        ${message}
+      `,
+      className: `toast-factory-bot toast-${type}`,
+      duration: 3000,
+      gravity: "bottom",
+      position: "right",
+      escapeMarkup: false,
+      style: {
+        animation:
+          "slideInRight 0.3s ease-out, slideOutRight 0.3s ease-out 2.7s",
+        background: type === "danger" ? "#dc3545" : undefined,
+      },
+    }).showToast();
+  };
+
+  // === SETUP DELETE MODAL ===
+  const setupDeleteConfirmModal = (recordData, pkName, pkValue) => {
+    if (!recordData || !pkValue)
+      return console.error("Missing record data for delete confirmation");
+
+    const infoDiv = document.getElementById("deleteRecordInfo");
+    const idInput = document.getElementById("deleteRecordId");
+
+    idInput.value = pkValue;
+    recordDeleteForm.action = `${
+      window.location.pathname
+    }/records/${encodeURIComponent(pkValue)}`;
+    infoDiv.innerHTML = `<div><strong>${pkName}:</strong> ${pkValue}</div>`;
+
+    const importantFields = [
+      "name",
+      "title",
+      "email",
+      "username",
+      "code",
+      "reference",
+    ];
+    let count = 0;
+
+    for (const key of Object.keys(recordData)) {
+      if (count >= 3) break;
+      const lowerKey = key.toLowerCase();
+      if (
+        key !== pkName &&
+        importantFields.some((f) => lowerKey.includes(f)) &&
+        recordData[key]
+      ) {
+        const fieldDiv = document.createElement("div");
+        fieldDiv.className = "mt-1";
+        fieldDiv.innerHTML = `<strong>${key}:</strong> ${recordData[key]}`;
+        infoDiv.appendChild(fieldDiv);
+        count++;
+      }
+    }
+  };
+
+  // === DELETE FROM DETAIL MODAL ===
+  const detailDeleteBtn = document.getElementById("recordDetailDeleteBtn");
+  if (detailDeleteBtn) {
+    detailDeleteBtn.addEventListener("click", () => {
+      const rows = document.querySelectorAll("#recordDetailTableBody tr");
+      const recordData = {};
+
+      rows.forEach((row) => {
+        const [keyCell, valueCell] = row.querySelectorAll("td");
+        if (keyCell && valueCell) {
+          recordData[keyCell.textContent.trim()] = valueCell.textContent.trim();
+        }
+      });
+
+      const pkName =
+        Object.keys(recordData).find((k) => k.toLowerCase() === "id") ||
+        Object.keys(recordData)[0];
+      const pkValue = recordData[pkName];
+
+      setupDeleteConfirmModal(recordData, pkName, pkValue);
+
+      bootstrap.Modal.getInstance(
+        document.getElementById("recordDetailModal")
+      )?.hide();
+      setTimeout(() => new bootstrap.Modal(deleteConfirmModal).show(), 500);
+    });
+  }
+
+  // === DELETE FROM TABLE ROW ===
+  document.querySelectorAll(".delete-record-btn").forEach((button) => {
+    button.addEventListener("click", () => {
+      const recordData = JSON.parse(button.dataset.recordData || "{}");
+      const pkName =
+        Object.keys(recordData).find((k) => k.toLowerCase() === "id") ||
+        Object.keys(recordData)[0];
+      const pkValue = recordData[pkName];
+      setupDeleteConfirmModal(recordData, pkName, pkValue);
+    });
+  });
+
+  // === FORM SUBMIT (DELETE) ===
+  if (recordDeleteForm) {
+    recordDeleteForm.addEventListener("submit", async (e) => {
+      e.preventDefault();
+
+      const form = e.target;
+      const submitButton = document.querySelector(
+        "#recordDeleteForm button[type='submit']"
+      );
+      const originalText = submitButton.innerHTML;
+      const csrfToken = document.querySelector(
+        'meta[name="csrf-token"]'
+      )?.content;
+
+      disableSubmitButton(submitButton);
+
+      try {
+        const response = await fetch(form.action, {
+          method: "DELETE",
+          headers: {
+            "Content-Type": "application/json",
+            "X-CSRF-Token": csrfToken,
+          },
+          credentials: "same-origin",
+        });
+
+        const result = await response.json();
+
+        if (!response.ok) {
+          throw new Error(result?.error || "Failed to delete record");
+        }
+
+        showToast(result.message || "Record deleted successfully", "success");
+
+        const modal = bootstrap.Modal.getInstance(deleteConfirmModal);
+        modal.hide();
+
+        setTimeout(() => window.location.reload(), 1000);
+      } catch (error) {
+        console.error("Delete Error:", error);
+        showToast(error.message || "Unexpected error occurred", "danger");
+      } finally {
+        enableSubmitButton(submitButton, originalText);
+      }
+    });
+  }
+
+  // === BUTTON HELPERS ===
+  function disableSubmitButton(button) {
+    button.disabled = true;
+  }
+
+  function enableSubmitButton(button) {
+    button.disabled = false;
+  }
+});

data/app/assets/stylesheets/dbviewer/table.css

@@ -1067,3 +1067,136 @@ span.flatpickr-weekday {
   width: 0.875rem;
   height: 0.875rem;
 }
+
+/* ========== FLOATING ADD RECORD BUTTON STYLES ========== */
+.floating-add-record {
+  position: fixed;
+  bottom: 100px;
+  right: 30px;
+  z-index: 1050;
+}
+
+.floating-add-record .btn {
+  width: 60px;
+  height: 60px;
+  border-radius: 50%;
+  font-size: 1.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
+  transition: all 0.3s ease;
+}
+
+.floating-add-record .btn:hover {
+  transform: translateY(-3px);
+  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);
+}
+
+.floating-add-record .btn:active {
+  transform: translateY(-1px);
+  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
+}
+
+/* Dark mode styles */
+[data-bs-theme="dark"] .floating-add-record .btn {
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
+}
+
+/* Style for form select2 dropdowns */
+.select2-container--bootstrap-5 .select2-selection {
+  min-height: 38px;
+}
+
+/* ============================= */
+/* DARK MODE SUPPORT FOR SELECT2 */
+/* ============================= */
+
+[data-bs-theme="dark"] .select2-container--bootstrap-5 .select2-selection {
+  background-color: var(--bs-dark);
+  color: var(--bs-light);
+  border-color: var(--bs-border-color-translucent);
+}
+
+[data-bs-theme="dark"]
+  .select2-container--bootstrap-5
+  .select2-selection--single
+  .select2-selection__rendered {
+  color: var(--bs-light);
+}
+
+[data-bs-theme="dark"]
+  .select2-container--bootstrap-5
+  .select2-selection--multiple
+  .select2-selection__choice {
+  background-color: var(--bs-secondary-bg);
+  color: var(--bs-light);
+  border-color: var(--bs-border-color-translucent);
+}
+
+[data-bs-theme="dark"]
+  .select2-container--bootstrap-5
+  .select2-selection__placeholder {
+  color: var(--bs-secondary-color);
+}
+
+[data-bs-theme="dark"]
+  .select2-container--bootstrap-5
+  .select2-selection__arrow
+  b {
+  border-color: var(--bs-light) transparent transparent transparent;
+}
+
+[data-bs-theme="dark"]
+  .select2-container--bootstrap-5.select2-container--open
+  .select2-selection {
+  border-color: var(--bs-primary);
+  box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.25);
+}
+
+[data-bs-theme="dark"] .select2-dropdown {
+  background-color: var(--bs-dark);
+  border-color: var(--bs-border-color-translucent);
+  color: var(--bs-light);
+  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.5);
+}
+
+[data-bs-theme="dark"] .select2-results__option {
+  background-color: var(--bs-dark);
+  color: var(--bs-light);
+}
+
+[data-bs-theme="dark"] .select2-results__option--highlighted {
+  background-color: var(--bs-primary);
+  color: #fff;
+}
+
+[data-bs-theme="dark"]
+  .select2-container--bootstrap-5
+  .select2-dropdown
+  .select2-search
+  .select2-search__field {
+  background-color: var(--bs-dark);
+  color: var(--bs-light);
+  border: 1px solid var(--bs-border-color-translucent);
+}
+
+[data-bs-theme="dark"]
+  .select2-container--bootstrap-5
+  .select2-search__field::placeholder {
+  color: var(--bs-secondary-color);
+}
+
+/* Ensure select2 and form fields use Bootstrap default font size */
+.select2-container--bootstrap-5 .select2-selection,
+.select2-container--bootstrap-5 .select2-results__option,
+.select2-container--bootstrap-5 .select2-search__field,
+.form-control {
+  font-size: 1rem !important; /* Bootstrap default */
+  line-height: 1.5; /* Also aligns vertically */
+}
+
+/* Optional: improve vertical alignment of Select2 with input fields */
+.select2-container--bootstrap-5 .select2-selection {
+  padding: 0.375rem 0.75rem;
+}

data/app/controllers/dbviewer/tables_controller.rb

@@ -3,7 +3,7 @@ module Dbviewer
     include Dbviewer::AccessControlValidation
 
     before_action :set_table_name, except: [ :index ]
-    before_action :validate_table, only: [ :show, :query, :export_csv ]
+    before_action :validate_table, only: [ :show, :query, :export_csv, :new_record, :create_record, :destroy_record ]
     before_action :set_query_filters, only: [ :show, :export_csv ]
     before_action :set_global_filters, only: [ :show, :export_csv ]
 
@@ -30,6 +30,25 @@ module Dbviewer
       @metadata = datatable_data[:metadata]
     end
 
+    def new_record
+      @table_columns = filter_accessible_columns(@table_name, database_manager.table_columns(@table_name))
+      @metadata = database_manager.table_metadata(@table_name)
+      @foreign_key_options = load_foreign_key_options(@metadata)
+
+      render layout: false
+    end
+
+    def create_record
+      model_class = database_manager.get_model_for(@table_name)
+      record = model_class.new(record_params)
+
+      if record.save
+        render json: { message: "Record created successfully" }
+      else
+        render json: { errors: record.errors, messages: record.errors.full_messages }, status: :unprocessable_entity
+      end
+    end
+
     def query
       all_columns = fetch_table_columns(@table_name)
       @columns = filter_accessible_columns(@table_name, all_columns)
@@ -45,8 +64,6 @@ module Dbviewer
       end
 
       @records = execute_query(@query)
-
-      render :query
     end
 
     def export_csv
@@ -56,7 +73,6 @@ module Dbviewer
         return
       end
 
-      include_headers = params[:include_headers] != "0"
       query_params = Dbviewer::Datatable::QueryParams.new(
         page: @current_page,
         per_page: (params[:limit] || 10000).to_i,
@@ -64,18 +80,49 @@ module Dbviewer
         direction: @order_direction,
         column_filters: @column_filters.reject { |_, v| v.blank? }
       )
-      csv_data = export_table_to_csv(@table_name, query_params, include_headers)
 
-      timestamp = Time.now.strftime("%Y%m%d%H%M%S")
-      filename = "#{@table_name}_#{timestamp}.csv"
+      csv_data = export_table_to_csv(@table_name, query_params, params[:include_headers] != "0")
+      filename = "#{@table_name}_#{Time.now.strftime('%Y%m%d%H%M%S')}.csv"
 
       send_data csv_data,
                 type: "text/csv; charset=utf-8; header=present",
                 disposition: "attachment; filename=#{filename}"
     end
 
+    def destroy_record
+      model_class = database_manager.get_model_for(@table_name)
+      primary_key = database_manager.primary_key(@table_name) || "id"
+      record = model_class.find_by(primary_key => params[:record_id])
+
+      if record.nil?
+        render json: { error: "Record not found" }, status: :not_found
+        return
+      end
+
+      begin
+        if record.destroy
+          render json: { message: "Record deleted successfully" }, status: :ok
+        else
+          render json: { errors: record.errors.full_messages, message: "Failed to delete record" }, status: :unprocessable_entity
+        end
+      rescue => e
+        Rails.logger.error("Error deleting record from #{@table_name}: #{e.message}")
+        render json: { error: "Failed to delete record: #{e.message}" }, status: :internal_server_error
+      end
+    end
+
     private
 
+    def record_params
+      accessible_columns = filter_accessible_columns(@table_name, database_manager.table_columns(@table_name))
+
+      permitted_fields = accessible_columns
+        .reject { |col| %w[id created_at updated_at].include?(col[:name]) }
+        .map { |col| col[:name].to_sym }
+
+      params.require(:record).permit(*permitted_fields)
+    end
+
     def set_table_name
       @table_name = params[:id]
     end
@@ -86,78 +133,82 @@ module Dbviewer
 
     def set_query_filters
       @current_page = [ 1, params[:page].to_i ].max
-      @per_page = params[:per_page] ? params[:per_page].to_i : Dbviewer.configuration.default_per_page
-      @per_page = Dbviewer.configuration.default_per_page unless Dbviewer.configuration.per_page_options.include?(@per_page)
+      @per_page = Dbviewer.configuration.per_page_options.include?(params[:per_page].to_i) ? params[:per_page].to_i : Dbviewer.configuration.default_per_page
       @order_by = params[:order_by].presence || determine_default_order_column
-      @order_direction = params[:order_direction].upcase if params[:order_direction].present?
-      @order_direction = "DESC" unless %w[ASC DESC].include?(@order_direction)
+      @order_direction = %w[ASC DESC].include?(params[:order_direction].to_s.upcase) ? params[:order_direction].upcase : "DESC"
       @column_filters = params[:column_filters].presence ? params[:column_filters].to_enum.to_h : {}
     end
 
     def set_global_filters
-      # Store creation filter datetimes in session to persist between table navigation
-      if params[:creation_filter_start].present?
-        session[:creation_filter_start] = params[:creation_filter_start]
-      end
-
-      if params[:creation_filter_end].present?
-        session[:creation_filter_end] = params[:creation_filter_end]
-      end
+      session[:creation_filter_start] = params[:creation_filter_start] if params[:creation_filter_start].present?
+      session[:creation_filter_end] = params[:creation_filter_end] if params[:creation_filter_end].present?
 
-      # Clear filters if explicitly requested
       if params[:clear_creation_filter] == "true"
         session.delete(:creation_filter_start)
         session.delete(:creation_filter_end)
       end
 
-      # Set instance variables for view access
       @creation_filter_start = session[:creation_filter_start]
       @creation_filter_end = session[:creation_filter_end]
-
-      # Initialize column_filters if not present
       @column_filters ||= {}
 
-      # Apply creation filters to column_filters if the table has a created_at column
       if has_timestamp_column?(@table_name) && (@creation_filter_start.present? || @creation_filter_end.present?)
-        # Clear any existing created_at filters
         %w[created_at created_at_operator created_at_end].each { |key| @column_filters.delete(key) }
 
-        case
-        when @creation_filter_start.present? && @creation_filter_end.present?
-          @column_filters.merge!({
-            "created_at" => @creation_filter_start,
-            "created_at_end" => @creation_filter_end
-          })
-        when @creation_filter_start.present?
-          @column_filters.merge!({
-            "created_at" => @creation_filter_start,
-            "created_at_operator" => "gte"
-          })
-        when @creation_filter_end.present?
-          @column_filters.merge!({
-            "created_at" => @creation_filter_end,
-            "created_at_operator" => "lte"
-          })
+        if @creation_filter_start.present? && @creation_filter_end.present?
+          @column_filters.merge!("created_at" => @creation_filter_start, "created_at_end" => @creation_filter_end)
+        elsif @creation_filter_start.present?
+          @column_filters.merge!("created_at" => @creation_filter_start, "created_at_operator" => "gte")
+        elsif @creation_filter_end.present?
+          @column_filters.merge!("created_at" => @creation_filter_end, "created_at_operator" => "lte")
         end
       end
     end
 
-    # Determine the default order column using configurable ordering logic
     def determine_default_order_column
-      # Get the table columns to check what's available
       columns = @columns || fetch_table_columns(@table_name)
       column_names = columns.map { |col| col[:name] }
 
-      # Try the configured default order column first
-      default_column = Dbviewer.configuration.default_order_column
-      return default_column if default_column && column_names.include?(default_column)
+      Dbviewer.configuration.default_order_column.presence_in(column_names) ||
+        database_manager.primary_key(@table_name) ||
+        columns.first&.dig(:name)
+    end
+
+    def find_display_column(columns)
+      column_names = columns.map { |c| c[:name] }
+      # Common display columns to check for (TODO: next we can add this to configuration for better dev control)
+      # If none found, fallback to first non-id column or id column
+      # This ensures we have a sensible default for display purposes
+      %w[name title label display_name username email description].find { |name| column_names.include?(name) } ||
+        columns.find { |c| [ :string, :text ].include?(c[:type]) && c[:name] != "id" }&.[](:name) ||
+        columns.find { |c| c[:name] != "id" }&.[](:name) || "id"
+    end
 
-      # Fall back to primary key
-      primary_key = database_manager.primary_key(@table_name)
-      return primary_key if primary_key.present?
+    def load_foreign_key_options(metadata)
+      options = {}
+      metadata[:foreign_keys].each do |fk|
+        foreign_table = fk[:to_table]
+        foreign_key_column = fk[:primary_key] || "id"
+        next unless access_control.table_accessible?(foreign_table)
 
-      # Final fallback to first column
-      columns.first ? columns.first[:name] : nil
+        begin
+          foreign_columns = database_manager.table_columns(foreign_table)
+          display_column = find_display_column(foreign_columns)
+
+          foreign_model = database_manager.get_model_for(foreign_table)
+          records = foreign_model
+                    .select([ foreign_key_column, display_column ].uniq)
+                    .limit(100)
+                    .order(display_column)
+                    .map { |r| [ r[display_column].to_s, r[foreign_key_column] ] }
+
+          options[fk[:column]] = records
+        rescue => e
+          Rails.logger.error("Error fetching foreign key options for #{foreign_table}: #{e.message}")
+          options[fk[:column]] = []
+        end
+      end
+      options
     end
   end
 end

data/app/helpers/dbviewer/application_helper.rb

@@ -6,6 +6,7 @@ module Dbviewer
 
     include DatatableUiHelper
     include DatatableUiFilterHelper
+    include DatatableUiFormHelper
     include DatatableUiPaginationHelper
     include DatatableUiSortingHelper
     include DatatableUiTableHelper

data/app/helpers/dbviewer/datatable_ui_form_helper.rb

@@ -0,0 +1,18 @@
+module Dbviewer
+  module DatatableUiFormHelper
+    def determine_field_type(column_type)
+      case column_type
+      when :boolean
+        :check_box
+      when :text
+        :text_area
+      when :date
+        :date_field
+      when :datetime, :timestamp
+        :datetime_local_field
+      else
+        :text_field
+      end
+    end
+  end
+end

data/app/helpers/dbviewer/datatable_ui_table_helper.rb

@@ -137,8 +137,27 @@ module Dbviewer
             content_tag(:i, "", class: "bi bi-clipboard")
           end
 
-          # Concatenate both buttons
-          view_button + copy_factory_button
+          # Delete Record button (only if enabled in configuration)
+          delete_button = if Dbviewer.configuration.enable_record_deletion
+            button_tag(
+              type: "button",
+              class: "btn btn-sm btn-outline-danger delete-record-btn",
+              title: "Delete Record",
+              data: {
+                bs_toggle: "modal",
+                bs_target: "#deleteConfirmModal",
+                record_data: data_attributes.to_json,
+                table_name: table_name
+              }
+            ) do
+              content_tag(:i, "", class: "bi bi-trash")
+            end
+          else
+            "".html_safe
+          end
+
+          # Concatenate all buttons
+          view_button + copy_factory_button + delete_button
         end
       end
     end

data/app/views/dbviewer/tables/new_record.html.erb

@@ -0,0 +1,70 @@
+<% if @errors.present? %>
+  <div class="alert alert-danger">
+    <ul class="mb-0">
+      <% @errors.full_messages.each do |message| %>
+        <li><%= message %></li>
+      <% end %>
+    </ul>
+  </div>
+<% end %>
+
+<div class="modal-header">
+  <h5 class="modal-title" id="newRecordModalLabel">
+    <i class="bi bi-plus-circle me-1"></i> Create New <%= @table_name.humanize.titleize %> Record
+  </h5>
+  <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+</div>
+
+<div class="modal-body">
+  <%= form_with url: create_record_table_path(@table_name), method: :post, id: "newRecordForm" do |form| %>
+    <% @table_columns.each do |column| %>
+      <% 
+        column_name = column[:name]
+        is_primary_key = @metadata[:primary_key] == column_name
+        skip_column = is_primary_key && %w[id].include?(column_name.downcase) 
+        
+        # Skip auto-increment primary keys and timestamps
+        next if skip_column || %w[created_at updated_at].include?(column_name)
+      %>
+      
+      <div class="mb-3">
+        <% 
+          # Handle different field types
+          field_type = determine_field_type(column[:type])
+          foreign_key = @metadata[:foreign_keys].find { |fk| fk[:column] == column_name }
+          field_id = "record_#{column_name}"
+          required = !column[:null]
+        %>
+        
+        <%= form.label "record[#{column_name}]", column_name.humanize, class: "form-label" %>
+        
+        <% if foreign_key && @foreign_key_options[column_name].present? %>
+          <%= form.select "record[#{column_name}]", 
+            options_for_select(@foreign_key_options[column_name]), 
+            { include_blank: column[:null] ? "-- Select --" : false }, 
+            { class: "form-select form-control select2-dropdown" } 
+          %>
+        <% elsif field_type == :check_box %>
+          <div class="form-check">
+            <%= form.check_box "record[#{column_name}]", class: "form-check-input", id: field_id %>
+          </div>
+        <% elsif field_type == :text_area %>
+          <%= form.text_area "record[#{column_name}]", class: "form-control", id: field_id, rows: 3, required: required %>
+        <% else %>
+          <%= form.send(field_type, "record[#{column_name}]", class: "form-control", id: field_id, required: required) %>
+        <% end %>
+        
+        <% if column[:default].present? && column[:default] != "NULL" %>
+          <div class="form-text text-muted">Default: <%= column[:default] %></div>
+        <% end %>
+      </div>
+    <% end %>
+  <% end %>
+</div>
+
+<div class="modal-footer">
+  <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+  <button type="submit" form="newRecordForm" class="btn btn-primary" id="createRecordButton">
+    <i class="bi bi-plus-lg me-1"></i>Create Record
+  </button>
+</div>

data/app/views/dbviewer/tables/show.html.erb

@@ -5,8 +5,16 @@
 <% content_for :head do %>
   <script src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/svg-pan-zoom@3.6.1/dist/svg-pan-zoom.min.js"></script>
+  <!-- jQuery for Select2 -->
+  <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.0/dist/jquery.min.js"></script>
+  <!-- Select2 for searchable dropdowns -->
+  <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
+  <link href="https://cdn.jsdelivr.net/npm/select2-bootstrap-5-theme@1.3.0/dist/select2-bootstrap-5-theme.min.css" rel="stylesheet" />
+  <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
   <%= stylesheet_link_tag "dbviewer/table", "data-turbo-track": "reload" %>
   <%= javascript_include_tag "dbviewer/table", "data-turbo-track": "reload" %>
+  <%= javascript_include_tag "dbviewer/record_creation", "data-turbo-track": "reload" %>
+  <%= javascript_include_tag "dbviewer/record_deletion", "data-turbo-track": "reload" %>
 <% end %>
 
 <% content_for :sidebar_active do %>active<% end %>
@@ -185,6 +193,11 @@
       </div>
       <div class="modal-footer">
         <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+        <% if Dbviewer.configuration.enable_record_deletion %>
+        <button type="button" class="btn btn-danger" id="recordDetailDeleteBtn" data-record-id="">
+          <i class="bi bi-trash me-1"></i>Delete Record
+        </button>
+        <% end %>
       </div>
     </div>
   </div>
@@ -352,5 +365,68 @@
   </div>
 </div>
 <% end %>
+
+<!-- Floating Add Record Button -->
+<%# TODO: move this to helpers so that we can have centralized creation check %>
+<% if @table_name != 'schema_migrations'%> 
+<div class="floating-add-record d-none d-lg-block">
+  <button id="floatingAddRecordBtn"
+          class="btn btn-success btn-lg shadow-lg rounded-circle" 
+          type="button" 
+          title="Add New Record">
+    <i class="bi bi-plus-lg"></i>
+  </button>
+</div>
+<% end %>
+
+<!-- New Record Modal -->
+<div id="newRecordModal" class="modal fade" tabindex="-1" aria-labelledby="newRecordModalLabel" aria-hidden="true">
+  <div class="modal-dialog modal-lg">
+    <div class="modal-content">
+      <!-- Content will be loaded via AJAX -->
+    </div>
+  </div>
+</div>
+
+<% if Dbviewer.configuration.enable_record_deletion %>
+<!-- Delete Confirmation Modal -->
+<div class="modal fade" id="deleteConfirmModal" tabindex="-1" aria-labelledby="deleteConfirmModalLabel" aria-hidden="true">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header bg-danger text-white">
+        <h5 class="modal-title" id="deleteConfirmModalLabel">
+          <i class="bi bi-exclamation-triangle-fill me-2"></i>Confirm Deletion
+        </h5>
+        <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
+      </div>
+      <div class="modal-body">
+        <p>Are you sure you want to delete this record from <strong><%= @table_name %></strong>?</p>
+        <div class="alert alert-warning">
+          <i class="bi bi-exclamation-triangle-fill me-2"></i>
+          <strong>Warning:</strong> This action cannot be undone.
+        </div>
+        
+        <!-- Primary key info will be inserted here -->
+        <div id="deleteRecordInfo" class="mt-3 mb-2 p-2 border-start border-4 border-danger ps-3">
+          <!-- Record info will be displayed here -->
+        </div>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
+        <%= form_with(url: "#", method: :delete, id: "recordDeleteForm") do |form| %>
+          <input type="hidden" id="deleteRecordId" name="record_id" value="">
+          <button type="submit" class="btn btn-danger">
+            <i class="bi bi-trash me-1"></i>Delete Record
+          </button>
+        <% end %>
+      </div>
+    </div>
+  </div>
+</div>
+<% end %>
+
+<!-- Toast container for notifications -->
+<div id="toast-container" class="toast-container position-fixed bottom-0 end-0 p-3"></div>
+
 <input type="hidden" id="mini_erd_table_path" name="mini_erd_table_path" value="<%= dbviewer.mini_erd_api_table_path(@table_name, format: :json) %>">
 <input type="hidden" id="table_name" name="table_name" value="<%= @table_name %>">

data/config/routes.rb

@@ -4,6 +4,9 @@ Dbviewer::Engine.routes.draw do
       get "query"
       post "query"
       get "export_csv"
+      get "new_record"
+      post "create_record"
+      delete "records/:record_id", to: "tables#destroy_record", as: :destroy_record
     end
   end
 

data/lib/dbviewer/configuration.rb

@@ -117,6 +117,9 @@ module Dbviewer
     # Maximum number of security events to keep in memory
     attr_accessor :max_security_events
 
+    # Enable or disable record deletion functionality
+    attr_accessor :enable_record_deletion
+
     def initialize
       @per_page_options = [ 10, 20, 50, 100 ]
       @default_per_page = 20
@@ -124,6 +127,7 @@ module Dbviewer
       @max_query_length = 10000
       @cache_expiry = 300
       @enable_data_export = false
+      @enable_record_deletion = true
       @query_timeout = 30
       @query_logging_mode = :memory
       @query_log_path = "log/dbviewer.log"

data/lib/dbviewer/database/dynamic_model_factory.rb

@@ -2,12 +2,13 @@ module Dbviewer
   module Database
     # DynamicModelFactory creates and manages ActiveRecord models for database tables
     class DynamicModelFactory
-      # Initialize with a connection and cache manager
+      # Initialize with a connection, cache manager, and metadata manager
       # @param connection [ActiveRecord::ConnectionAdapters::AbstractAdapter] Database connection
-      # @param cache_manager [Dbviewer::Database::CacheManager] Cache manager instance
-      def initialize(connection, cache_manager)
+      # @param cache_manager [Dbviewer::Cache::Base] Cache manager instance
+      def initialize(connection, cache_manager, metadata_manager)
         @connection = connection
         @cache_manager = cache_manager
+        @metadata_manager = metadata_manager
       end
 
       # Get or create an ActiveRecord model for a table
@@ -16,7 +17,7 @@ module Dbviewer
       def get_model_for(table_name)
         # Cache models for shorter time since they might need refreshing more frequently
         @cache_manager.fetch("model-#{table_name}", expires_in: 300) do
-          create_model_for(table_name)
+          find_or_create_model_for(table_name)
         end
       end
 
@@ -25,14 +26,15 @@ module Dbviewer
       # Create a new ActiveRecord model for a table
       # @param table_name [String] Name of the table
       # @return [Class] ActiveRecord model class for the table
-      def create_model_for(table_name)
+      def find_or_create_model_for(table_name)
         class_name = table_name.classify
 
         # Check if we can reuse an existing constant
         existing_model = handle_existing_constant(class_name, table_name)
         return existing_model if existing_model
 
-        model = create_active_record_model(class_name, table_name)
+        table_metadata = @metadata_manager.table_metadata(table_name)
+        model = create_active_record_model(class_name, table_name, table_metadata)
         model.establish_connection(@connection.instance_variable_get(:@config))
         model
       end
@@ -64,7 +66,7 @@ module Dbviewer
       # @param class_name [String] The constant name for the model
       # @param table_name [String] The table name this model should represent
       # @return [Class] New ActiveRecord model class
-      def create_active_record_model(class_name, table_name)
+      def create_active_record_model(class_name, table_name, table_metadata)
         Dbviewer.const_set(class_name, Class.new(ActiveRecord::Base) do
           self.table_name = table_name
 
@@ -76,25 +78,17 @@ module Dbviewer
             self.primary_key = "id"
           end
 
-          # Disable STI
-          self.inheritance_column = :_type_disabled
-
-          # 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"
+          # Add validations from indexes
+          table_metadata[:indexes].each do |index|
+            next unless index[:unique] && index[:columns].present?
+
+            columns = index[:columns]
+            column = columns.first
+            if columns.size == 1
+              validates column, uniqueness: true
+            elsif columns.size > 1
+              # Validate composite uniqueness using `scope`
+              validates column, uniqueness: { scope: columns[1..].map(&:to_sym) }
             end
           end
         end)

data/lib/dbviewer/database/manager.rb

@@ -12,7 +12,7 @@ module Dbviewer
         ensure_connection
         @cache_manager = ::Dbviewer::Cache::InMemory.new(configuration.cache_expiry)
         @table_metadata_manager = ::Dbviewer::Database::MetadataManager.new(@connection, @cache_manager)
-        @dynamic_model_factory = ::Dbviewer::Database::DynamicModelFactory.new(@connection, @cache_manager)
+        @dynamic_model_factory = ::Dbviewer::Database::DynamicModelFactory.new(@connection, @cache_manager, @table_metadata_manager)
         @query_executor = ::Dbviewer::Query::Executor.new(@connection, configuration)
         @table_query_operations = ::Dbviewer::Datatable::QueryOperations.new(
           @connection,

data/lib/dbviewer/query/parser.rb

@@ -61,7 +61,7 @@ module Dbviewer
       # @param event [ActiveSupport::Notifications::Event] The notification event
       # @return [Boolean] True if the query should be skipped
       def self.should_skip_internal_query?(event)
-        event.payload[:name].include?("Dbviewer::") ||
+        event.payload[:name]&.include?("Dbviewer::") ||
         # SQLite specific check for size queries
         event.payload[:sql].include?("PRAGMA") ||
         # PostgreSQL specific check for size queries

data/lib/dbviewer/version.rb

@@ -1,3 +1,3 @@
 module Dbviewer
-  VERSION = "0.9.3"
+  VERSION = "0.9.4-alpha.2"
 end

data/lib/generators/dbviewer/templates/initializer.rb

@@ -13,6 +13,9 @@ Dbviewer.configure do |config|
   config.query_log_path = "log/dbviewer.log"         # Path for query log file when in :file mode
   config.max_memory_queries = 1000                   # Maximum number of queries to store in memory
 
+  # Data Management options
+  config.enable_record_deletion = true               # Whether to allow record deletion functionality
+
   # Authentication options (Basic Auth)
   # config.admin_credentials = {
   #   username: "admin",

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: dbviewer
 version: !ruby/object:Gem::Version
-  version: 0.9.3
+  version: 0.9.4.pre.alpha.2
 platform: ruby
 authors:
 - Wailan Tirajoh
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2025-06-29 00:00:00.000000000 Z
+date: 2025-07-06 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -86,6 +86,8 @@ files:
 - app/assets/javascripts/dbviewer/home.js
 - app/assets/javascripts/dbviewer/layout.js
 - app/assets/javascripts/dbviewer/query.js
+- app/assets/javascripts/dbviewer/record_creation.js
+- app/assets/javascripts/dbviewer/record_deletion.js
 - app/assets/javascripts/dbviewer/sidebar.js
 - app/assets/javascripts/dbviewer/table.js
 - app/assets/javascripts/dbviewer/utility.js
@@ -119,6 +121,7 @@ files:
 - app/helpers/dbviewer/application_helper.rb
 - app/helpers/dbviewer/database_helper.rb
 - app/helpers/dbviewer/datatable_ui_filter_helper.rb
+- app/helpers/dbviewer/datatable_ui_form_helper.rb
 - app/helpers/dbviewer/datatable_ui_helper.rb
 - app/helpers/dbviewer/datatable_ui_pagination_helper.rb
 - app/helpers/dbviewer/datatable_ui_sorting_helper.rb
@@ -136,6 +139,7 @@ files:
 - app/views/dbviewer/shared/_tables_sidebar.html.erb
 - app/views/dbviewer/tables/_table_structure.html.erb
 - app/views/dbviewer/tables/index.html.erb
+- app/views/dbviewer/tables/new_record.html.erb
 - app/views/dbviewer/tables/query.html.erb
 - app/views/dbviewer/tables/show.html.erb
 - app/views/layouts/dbviewer/application.html.erb
@@ -191,9 +195,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
       version: '0'
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
-  - - ">="
+  - - ">"
     - !ruby/object:Gem::Version
-      version: '0'
+      version: 1.3.1
 requirements: []
 rubygems_version: 3.4.10
 signing_key: