tina4ruby 3.10.3 → 3.10.4

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: cfe8b7f49e17e2a703725d23ce90791acca6e078dc7747a0eebaf97091121330
-  data.tar.gz: a6a2e0c2e48b69e332d6bc0358929a141f91919b19062639259d7c51cb390a39
+  metadata.gz: deb48b3053a6cde8d4d7fef6645b5e4a25eaff05c1d11b8b255c9c5ff42e7759
+  data.tar.gz: 5c7a65aa85b1a3d39676cf90b404cae1fbb3731c4e5c1fbbbbbae02ed97b468f
 SHA512:
-  metadata.gz: 24a17f01e57ffda9278e80e0451e54f82111921c1066f21ab30436391e05c475c613c6948824f4fe8d94ddc17f39796240ca47f6ecda8bfe166f805b54335b22
-  data.tar.gz: 2b0c24c5dbef5d4f4d2c3e5337f7dce2bc1f8a89a90cbb149484fe375914cf8465e604ccc6f30e264a78922e4132ad27f7f4d7189e7f589450cf3baa5361c0f1
+  metadata.gz: a1d8a2d31f0b1be83d4974190a6e7bf55aad671f7b8945444fc39335f14ddb537b98c887f975fba1f1d3f020f461703936000f33855845b3058de00c5147a377
+  data.tar.gz: 5b1c9e819c1b771c3d6308e23b9fbd1246906d0f96fce21b2a54ea38c27e5bb4af3a0032313101529960498b70f8be6283137d50ee5f172326f9070d681a1ee2

data/lib/tina4/crud.rb

@@ -1,8 +1,95 @@
 # frozen_string_literal: true
+require "json"
 
 module Tina4
+  # Crud — Auto-generate a complete HTML CRUD interface from a SQL query or ORM model.
+  #
+  # Usage:
+  #   Tina4.get "/admin/users" do |request, response|
+  #     response.html(Tina4::Crud.to_crud(request, {
+  #       sql: "SELECT id, name, email FROM users",
+  #       title: "User Management",
+  #       primary_key: "id"
+  #     }))
+  #   end
+  #
+  # Or with an ORM model class:
+  #   Tina4.get "/admin/users" do |request, response|
+  #     response.html(Tina4::Crud.to_crud(request, {
+  #       model: User,
+  #       title: "User Management"
+  #     }))
+  #   end
   module Crud
     class << self
+      # Generate a complete CRUD HTML interface: searchable/paginated table
+      # with create, edit, and delete modals. Also registers the supporting
+      # REST API routes on first call per table.
+      #
+      # @param request [Tina4::Request] the current request
+      # @param options [Hash] configuration options
+      # @option options [String]  :sql         SQL query for listing records
+      # @option options [Class]   :model       ORM model class (alternative to :sql)
+      # @option options [String]  :title       page title (default: table name)
+      # @option options [String]  :primary_key primary key column (default: "id")
+      # @option options [String]  :prefix      API route prefix (default: "/api")
+      # @option options [Integer] :limit       records per page (default: 10)
+      # @return [String] complete HTML page
+      def to_crud(request, options = {})
+        sql        = options[:sql]
+        model      = options[:model]
+        title      = options[:title] || "CRUD"
+        pk         = options[:primary_key] || "id"
+        prefix     = options[:prefix] || "/api"
+        limit      = (options[:limit] || 10).to_i
+
+        # Determine table name and columns from SQL or model
+        if model
+          table_name = model.table_name.to_s
+          pk = (model.primary_key_field || :id).to_s
+          columns = model.field_definitions.keys.map(&:to_s)
+        elsif sql
+          table_name = extract_table_name(sql)
+          columns = extract_columns(sql)
+        else
+          raise ArgumentError, "Crud.to_crud requires either :sql or :model option"
+        end
+
+        # Parse request params for pagination, search, and sorting
+        query_params = request.respond_to?(:query) ? request.query : {}
+        page       = [(query_params["page"] || 1).to_i, 1].max
+        search     = query_params["search"].to_s.strip
+        sort_col   = query_params["sort"] || pk
+        sort_dir   = query_params["sort_dir"] == "desc" ? "desc" : "asc"
+        offset     = (page - 1) * limit
+
+        # Build the data query
+        if model
+          records, total = fetch_model_data(model, search: search, sort: sort_col,
+                                            sort_dir: sort_dir, limit: limit, offset: offset)
+        else
+          records, total = fetch_sql_data(sql, search: search, sort: sort_col,
+                                          sort_dir: sort_dir, limit: limit, offset: offset)
+        end
+
+        total_pages = total > 0 ? (total.to_f / limit).ceil : 1
+        api_path = "#{prefix}/#{table_name}"
+
+        # Register supporting CRUD API routes (idempotent)
+        register_crud_routes(model, table_name, pk, prefix) unless crud_routes_registered?(table_name, prefix)
+
+        # Build the HTML
+        build_crud_html(
+          title: title, table_name: table_name, pk: pk,
+          columns: columns, records: records,
+          page: page, total_pages: total_pages, total: total,
+          limit: limit, search: search, sort_col: sort_col,
+          sort_dir: sort_dir, api_path: api_path,
+          request_path: request.path
+        )
+      end
+
+      # Generate an HTML table from an array of record hashes.
       def generate_table(records, table_name: "data", primary_key: "id", editable: true)
         return "<p>No records found.</p>" if records.nil? || records.empty?
 
@@ -43,12 +130,13 @@ module Tina4
         html += "</tbody></table></div>"
 
         if editable
-          html += crud_javascript(table_name)
+          html += inline_crud_javascript(table_name)
         end
 
         html
       end
 
+      # Generate an HTML form from a field definition array.
       def generate_form(fields, action: "/", method: "POST", table_name: "data")
         html = "<form action=\"#{action}\" method=\"#{method}\" class=\"needs-validation\" novalidate>"
         html += "<input type=\"hidden\" name=\"_method\" value=\"#{method}\">" if %w[PUT PATCH DELETE].include?(method.upcase)
@@ -95,7 +183,484 @@ module Tina4
 
       private
 
-      def crud_javascript(table_name)
+      # Track which tables have had CRUD routes registered
+      def registered_tables
+        @registered_tables ||= {}
+      end
+
+      def crud_routes_registered?(table_name, prefix)
+        registered_tables["#{prefix}/#{table_name}"]
+      end
+
+      # Register REST API routes for the CRUD interface when using :sql mode.
+      # When using :model mode, the caller should use AutoCrud.register instead
+      # for full ORM-backed routes. These routes provide basic SQL-backed CRUD.
+      def register_crud_routes(model, table_name, pk, prefix)
+        api_path = "#{prefix}/#{table_name}"
+        registered_tables[api_path] = true
+
+        # If we have a model, use AutoCrud for full ORM-backed routes
+        if model
+          Tina4::AutoCrud.register(model)
+          Tina4::AutoCrud.generate_routes(prefix: prefix)
+          return
+        end
+
+        db = Tina4.database
+        return unless db
+
+        # GET list (already handled by the page itself)
+        # POST create
+        Tina4::Router.add_route("POST", api_path, proc { |req, res|
+          begin
+            data = req.body_parsed
+            result = db.insert(table_name, data)
+            res.json({ data: data, message: "Created" }, status: 201)
+          rescue => e
+            res.json({ error: e.message }, status: 500)
+          end
+        })
+
+        # PUT update
+        Tina4::Router.add_route("PUT", "#{api_path}/{id}", proc { |req, res|
+          begin
+            id = req.params["id"]
+            data = req.body_parsed
+            db.update(table_name, data, { pk => id })
+            res.json({ data: data, message: "Updated" })
+          rescue => e
+            res.json({ error: e.message }, status: 500)
+          end
+        })
+
+        # DELETE
+        Tina4::Router.add_route("DELETE", "#{api_path}/{id}", proc { |req, res|
+          begin
+            id = req.params["id"]
+            db.delete(table_name, { pk => id })
+            res.json({ message: "Deleted" })
+          rescue => e
+            res.json({ error: e.message }, status: 500)
+          end
+        })
+      end
+
+      # Fetch data using an ORM model class
+      def fetch_model_data(model, search: "", sort: "id", sort_dir: "asc", limit: 10, offset: 0)
+        order_by = "#{sort} #{sort_dir.upcase}"
+
+        if search.empty?
+          records = model.all(limit: limit, offset: offset, order_by: order_by)
+          total = model.count
+        else
+          # Build search across all string/text fields
+          searchable = model.field_definitions.select { |_, opts|
+            [:string, :text].include?(opts[:type])
+          }.keys
+          if searchable.empty?
+            records = model.all(limit: limit, offset: offset, order_by: order_by)
+            total = model.count
+          else
+            where_parts = searchable.map { |col| "#{col} LIKE ?" }
+            where_clause = where_parts.join(" OR ")
+            params = searchable.map { "%#{search}%" }
+            records = model.where(where_clause, params)
+            total = records.length
+            records = records.slice(offset, limit) || []
+          end
+        end
+
+        record_hashes = records.map { |r| r.to_h }
+        [record_hashes, total]
+      end
+
+      # Fetch data using a raw SQL query
+      def fetch_sql_data(sql, search: "", sort: "id", sort_dir: "asc", limit: 10, offset: 0)
+        db = Tina4.database
+        return [[], 0] unless db
+
+        # Wrap the original SQL for sorting
+        query = sql.gsub(/ORDER BY .+$/i, "").gsub(/LIMIT .+$/i, "").strip
+        query += " ORDER BY #{sort} #{sort_dir.upcase}"
+
+        if !search.empty?
+          # Wrap in a subquery to add search filtering
+          wrapped = "SELECT * FROM (#{sql.gsub(/ORDER BY .+$/i, '').gsub(/LIMIT .+$/i, '').strip}) AS _crud_sub WHERE "
+          columns = extract_columns(sql)
+          search_parts = columns.map { |col| "CAST(#{col} AS TEXT) LIKE ?" }
+          wrapped += search_parts.join(" OR ")
+          wrapped += " ORDER BY #{sort} #{sort_dir.upcase}"
+          params = columns.map { "%#{search}%" }
+
+          # Get total count
+          count_sql = "SELECT COUNT(*) as cnt FROM (#{sql.gsub(/ORDER BY .+$/i, '').gsub(/LIMIT .+$/i, '').strip}) AS _crud_cnt WHERE #{search_parts.join(' OR ')}"
+          count_result = db.fetch_one(count_sql, params)
+          total = count_result ? (count_result[:cnt] || count_result["cnt"] || 0).to_i : 0
+
+          results = db.fetch(wrapped, params, limit: limit, offset: offset)
+        else
+          # Get total count
+          count_sql = "SELECT COUNT(*) as cnt FROM (#{sql.gsub(/ORDER BY .+$/i, '').gsub(/LIMIT .+$/i, '').strip}) AS _crud_cnt"
+          count_result = db.fetch_one(count_sql)
+          total = count_result ? (count_result[:cnt] || count_result["cnt"] || 0).to_i : 0
+
+          results = db.fetch(query, [], limit: limit, offset: offset)
+        end
+
+        records = results.respond_to?(:records) ? results.records : results.to_a
+        [records, total]
+      end
+
+      # Extract table name from a SQL SELECT statement
+      def extract_table_name(sql)
+        match = sql.match(/FROM\s+(\w+)/i)
+        match ? match[1] : "data"
+      end
+
+      # Extract column names from a SQL SELECT statement
+      def extract_columns(sql)
+        match = sql.match(/SELECT\s+(.+?)\s+FROM/im)
+        return ["*"] unless match
+
+        cols_str = match[1].strip
+        return ["*"] if cols_str == "*"
+
+        cols_str.split(",").map { |c|
+          c = c.strip
+          # Handle "table.column AS alias" or "column AS alias"
+          if c =~ /\bAS\s+(\w+)/i
+            $1
+          elsif c.include?(".")
+            c.split(".").last.strip
+          else
+            c.strip
+          end
+        }
+      end
+
+      # Escape HTML special characters
+      def h(text)
+        text.to_s
+          .gsub("&", "&amp;")
+          .gsub("<", "&lt;")
+          .gsub(">", "&gt;")
+          .gsub('"', "&quot;")
+          .gsub("'", "&#39;")
+      end
+
+      # Pretty label from a column name: "user_name" => "User Name"
+      def pretty_label(col)
+        col.to_s.split("_").map(&:capitalize).join(" ")
+      end
+
+      # Determine input type from column name or ORM field type
+      def input_type_for(col, model = nil)
+        if model && model.respond_to?(:field_definitions)
+          opts = model.field_definitions[col.to_sym]
+          if opts
+            case opts[:type]
+            when :integer             then return "number"
+            when :float, :decimal     then return "number"
+            when :boolean             then return "checkbox"
+            when :date                then return "date"
+            when :datetime, :timestamp then return "datetime-local"
+            when :text                then return "textarea"
+            end
+          end
+        end
+        # Guess from column name
+        return "email" if col.to_s.include?("email")
+        return "date"  if col.to_s.end_with?("_at", "_date")
+        return "number" if col.to_s.end_with?("_id") && col.to_s != "id"
+        "text"
+      end
+
+      # Build the complete CRUD HTML page
+      def build_crud_html(title:, table_name:, pk:, columns:, records:,
+                          page:, total_pages:, total:, limit:, search:,
+                          sort_col:, sort_dir:, api_path:, request_path:)
+        # Filter out auto-increment PK from editable columns
+        editable_columns = columns.reject { |c| c.to_s == pk.to_s }
+
+        html = <<~HTML
+          <!DOCTYPE html>
+          <html lang="en">
+          <head>
+          <meta charset="UTF-8">
+          <meta name="viewport" content="width=device-width, initial-scale=1.0">
+          <title>#{h(title)}</title>
+          <link rel="stylesheet" href="/css/tina4.min.css">
+          <style>
+          .crud-container { max-width: 1200px; margin: 2rem auto; padding: 0 1rem; }
+          .crud-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
+          .crud-search { max-width: 300px; }
+          .crud-actions { display: flex; gap: 0.5rem; align-items: center; }
+          .crud-info { color: var(--text-muted, #6c757d); font-size: 0.875rem; margin-bottom: 0.5rem; }
+          .crud-pagination { display: flex; justify-content: center; gap: 0.25rem; margin-top: 1rem; }
+          .sort-link { text-decoration: none; color: inherit; cursor: pointer; }
+          .sort-link:hover { text-decoration: underline; }
+          .sort-indicator { font-size: 0.75rem; }
+          .modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%;
+            background: rgba(0,0,0,0.5); z-index: 1000; justify-content: center; align-items: center; }
+          .modal-overlay.active { display: flex; }
+          .modal-box { background: var(--bg, #fff); border-radius: 0.5rem; padding: 1.5rem;
+            width: 90%; max-width: 600px; max-height: 80vh; overflow-y: auto;
+            box-shadow: 0 4px 20px rgba(0,0,0,0.3); }
+          .modal-box h3 { margin-top: 0; }
+          .modal-footer { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 1rem; }
+          .alert { padding: 0.75rem 1rem; border-radius: 0.25rem; margin-bottom: 1rem; display: none; }
+          .alert-success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
+          .alert-danger { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
+          </style>
+          </head>
+          <body>
+          <div class="crud-container">
+            <div id="crud-alert" class="alert"></div>
+            <div class="crud-header">
+              <h2>#{h(title)}</h2>
+              <div class="crud-actions">
+                <form method="GET" action="#{h(request_path)}" style="display:flex;gap:0.5rem;">
+                  <input type="text" name="search" value="#{h(search)}" placeholder="Search..."
+                    class="form-control crud-search">
+                  <button type="submit" class="btn btn-secondary">Search</button>
+                </form>
+                <button class="btn btn-primary" onclick="crudShowCreate()">+ New</button>
+              </div>
+            </div>
+            <div class="crud-info">
+              Showing #{records.length} of #{total} records (page #{page} of #{total_pages})
+            </div>
+            <div class="table-responsive">
+            <table class="table table-striped table-hover">
+            <thead class="table-dark"><tr>
+        HTML
+
+        # Table headers with sort links
+        columns.each do |col|
+          next_dir = (sort_col == col.to_s && sort_dir == "asc") ? "desc" : "asc"
+          indicator = ""
+          if sort_col == col.to_s
+            indicator = sort_dir == "asc" ? " <span class=\"sort-indicator\">&#9650;</span>" : " <span class=\"sort-indicator\">&#9660;</span>"
+          end
+          sort_params = "sort=#{h(col)}&sort_dir=#{next_dir}&page=#{page}&search=#{URI.encode_www_form_component(search)}&limit=#{limit}"
+          html += "<th><a class=\"sort-link\" href=\"#{h(request_path)}?#{sort_params}\">#{pretty_label(col)}#{indicator}</a></th>"
+        end
+        html += "<th>Actions</th></tr></thead><tbody>"
+
+        # Table body
+        if records.empty?
+          html += "<tr><td colspan=\"#{columns.length + 1}\" style=\"text-align:center;padding:2rem;\">No records found.</td></tr>"
+        else
+          records.each do |row|
+            pk_value = row[pk.to_sym] || row[pk.to_s] || row[pk]
+            html += "<tr>"
+            columns.each do |col|
+              value = row[col.to_sym] || row[col.to_s] || row[col]
+              html += "<td>#{h(value)}</td>"
+            end
+            html += "<td>"
+            html += "<button class=\"btn btn-sm btn-primary me-1\" onclick=\"crudShowEdit(#{pk_value.is_a?(String) ? "'#{h(pk_value)}'" : pk_value})\">Edit</button>"
+            html += "<button class=\"btn btn-sm btn-danger\" onclick=\"crudShowDelete(#{pk_value.is_a?(String) ? "'#{h(pk_value)}'" : pk_value})\">Delete</button>"
+            html += "</td></tr>"
+          end
+        end
+        html += "</tbody></table></div>"
+
+        # Pagination
+        if total_pages > 1
+          html += "<div class=\"crud-pagination\">"
+          if page > 1
+            html += "<a class=\"btn btn-sm btn-secondary\" href=\"#{h(request_path)}?page=#{page - 1}&search=#{URI.encode_www_form_component(search)}&sort=#{h(sort_col)}&sort_dir=#{h(sort_dir)}&limit=#{limit}\">Prev</a>"
+          end
+          # Show page numbers (max 7)
+          start_page = [page - 3, 1].max
+          end_page = [start_page + 6, total_pages].min
+          start_page = [end_page - 6, 1].max
+          (start_page..end_page).each do |p|
+            active = p == page ? " btn-primary" : " btn-secondary"
+            html += "<a class=\"btn btn-sm#{active}\" href=\"#{h(request_path)}?page=#{p}&search=#{URI.encode_www_form_component(search)}&sort=#{h(sort_col)}&sort_dir=#{h(sort_dir)}&limit=#{limit}\">#{p}</a>"
+          end
+          if page < total_pages
+            html += "<a class=\"btn btn-sm btn-secondary\" href=\"#{h(request_path)}?page=#{page + 1}&search=#{URI.encode_www_form_component(search)}&sort=#{h(sort_col)}&sort_dir=#{h(sort_dir)}&limit=#{limit}\">Next</a>"
+          end
+          html += "</div>"
+        end
+
+        # Create modal
+        html += build_modal("create", "Create New Record", editable_columns, pk, api_path, request_path)
+
+        # Edit modal
+        html += build_modal("edit", "Edit Record", editable_columns, pk, api_path, request_path, edit: true)
+
+        # Delete confirmation modal
+        html += <<~HTML
+          <div class="modal-overlay" id="modal-delete">
+            <div class="modal-box">
+              <h3>Confirm Delete</h3>
+              <p>Are you sure you want to delete this record? This action cannot be undone.</p>
+              <input type="hidden" id="delete-pk-value">
+              <div class="modal-footer">
+                <button class="btn btn-secondary" onclick="crudCloseModal('delete')">Cancel</button>
+                <button class="btn btn-danger" onclick="crudConfirmDelete()">Delete</button>
+              </div>
+            </div>
+          </div>
+        HTML
+
+        # JavaScript
+        html += build_crud_javascript(api_path, pk, editable_columns, request_path)
+
+        html += "</div></body></html>"
+        html
+      end
+
+      # Build a create or edit modal
+      def build_modal(id, title, columns, pk, api_path, request_path, edit: false)
+        html = "<div class=\"modal-overlay\" id=\"modal-#{id}\">"
+        html += "<div class=\"modal-box\">"
+        html += "<h3>#{h(title)}</h3>"
+        html += "<form id=\"form-#{id}\" onsubmit=\"return false;\">"
+        html += "<input type=\"hidden\" id=\"#{id}-pk-value\" name=\"#{pk}\">" if edit
+
+        columns.each do |col|
+          label = pretty_label(col)
+          field_id = "#{id}-#{col}"
+          html += "<div class=\"mb-3\">"
+          html += "<label for=\"#{field_id}\" class=\"form-label\">#{label}</label>"
+          html += "<input type=\"text\" class=\"form-control\" id=\"#{field_id}\" name=\"#{col}\" placeholder=\"Enter #{label.downcase}\">"
+          html += "</div>"
+        end
+
+        html += "<div class=\"modal-footer\">"
+        html += "<button type=\"button\" class=\"btn btn-secondary\" onclick=\"crudCloseModal('#{id}')\">Cancel</button>"
+        html += "<button type=\"button\" class=\"btn btn-primary\" onclick=\"crudSave#{edit ? 'Edit' : 'Create'}()\">Save</button>"
+        html += "</div></form></div></div>"
+        html
+      end
+
+      # Build the JavaScript for the CRUD interface
+      def build_crud_javascript(api_path, pk, columns, request_path)
+        columns_json = JSON.generate(columns.map(&:to_s))
+        <<~HTML
+          <script>
+          var CRUD_API = '#{api_path}';
+          var CRUD_PK = '#{pk}';
+          var CRUD_COLUMNS = #{columns_json};
+
+          function crudShowAlert(message, type) {
+            var el = document.getElementById('crud-alert');
+            el.className = 'alert alert-' + type;
+            el.textContent = message;
+            el.style.display = 'block';
+            setTimeout(function() { el.style.display = 'none'; }, 3000);
+          }
+
+          function crudShowCreate() {
+            var form = document.getElementById('form-create');
+            form.reset();
+            document.getElementById('modal-create').classList.add('active');
+          }
+
+          function crudShowEdit(id) {
+            fetch(CRUD_API + '/' + id)
+              .then(function(r) { return r.json(); })
+              .then(function(result) {
+                var data = result.data || result;
+                document.getElementById('edit-pk-value').value = id;
+                CRUD_COLUMNS.forEach(function(col) {
+                  var input = document.getElementById('edit-' + col);
+                  if (input) input.value = data[col] != null ? data[col] : '';
+                });
+                document.getElementById('modal-edit').classList.add('active');
+              })
+              .catch(function(e) { crudShowAlert('Failed to load record: ' + e, 'danger'); });
+          }
+
+          function crudShowDelete(id) {
+            document.getElementById('delete-pk-value').value = id;
+            document.getElementById('modal-delete').classList.add('active');
+          }
+
+          function crudCloseModal(name) {
+            document.getElementById('modal-' + name).classList.remove('active');
+          }
+
+          function crudSaveCreate() {
+            var data = {};
+            CRUD_COLUMNS.forEach(function(col) {
+              var input = document.getElementById('create-' + col);
+              if (input) data[col] = input.value;
+            });
+            fetch(CRUD_API, {
+              method: 'POST',
+              headers: { 'Content-Type': 'application/json' },
+              body: JSON.stringify(data)
+            })
+            .then(function(r) { return r.json(); })
+            .then(function(result) {
+              if (result.error) { crudShowAlert(result.error, 'danger'); return; }
+              crudCloseModal('create');
+              crudShowAlert('Record created successfully', 'success');
+              setTimeout(function() { window.location.reload(); }, 500);
+            })
+            .catch(function(e) { crudShowAlert('Failed to create: ' + e, 'danger'); });
+          }
+
+          function crudSaveEdit() {
+            var id = document.getElementById('edit-pk-value').value;
+            var data = {};
+            CRUD_COLUMNS.forEach(function(col) {
+              var input = document.getElementById('edit-' + col);
+              if (input) data[col] = input.value;
+            });
+            fetch(CRUD_API + '/' + id, {
+              method: 'PUT',
+              headers: { 'Content-Type': 'application/json' },
+              body: JSON.stringify(data)
+            })
+            .then(function(r) { return r.json(); })
+            .then(function(result) {
+              if (result.error) { crudShowAlert(result.error, 'danger'); return; }
+              crudCloseModal('edit');
+              crudShowAlert('Record updated successfully', 'success');
+              setTimeout(function() { window.location.reload(); }, 500);
+            })
+            .catch(function(e) { crudShowAlert('Failed to update: ' + e, 'danger'); });
+          }
+
+          function crudConfirmDelete() {
+            var id = document.getElementById('delete-pk-value').value;
+            fetch(CRUD_API + '/' + id, { method: 'DELETE' })
+            .then(function(r) { return r.json(); })
+            .then(function(result) {
+              if (result.error) { crudShowAlert(result.error, 'danger'); return; }
+              crudCloseModal('delete');
+              crudShowAlert('Record deleted successfully', 'success');
+              setTimeout(function() { window.location.reload(); }, 500);
+            })
+            .catch(function(e) { crudShowAlert('Failed to delete: ' + e, 'danger'); });
+          }
+
+          // Close modal on overlay click
+          document.querySelectorAll('.modal-overlay').forEach(function(overlay) {
+            overlay.addEventListener('click', function(e) {
+              if (e.target === overlay) overlay.classList.remove('active');
+            });
+          });
+
+          // Close modal on Escape key
+          document.addEventListener('keydown', function(e) {
+            if (e.key === 'Escape') {
+              document.querySelectorAll('.modal-overlay.active').forEach(function(m) {
+                m.classList.remove('active');
+              });
+            }
+          });
+          </script>
+        HTML
+      end
+
+      def inline_crud_javascript(table_name)
         <<~JS
           <script>
           function crudSave(table, id) {
@@ -121,4 +686,7 @@ module Tina4
       end
     end
   end
+
+  # Uppercase alias for convenience: Tina4::CRUD.to_crud(...)
+  CRUD = Crud
 end

data/lib/tina4/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Tina4
-  VERSION = "3.10.3"
+  VERSION = "3.10.4"
 end

data/lib/tina4.rb

@@ -82,6 +82,7 @@ module Tina4
   # ── Lazy-loaded: optional modules ─────────────────────────────────────
   autoload :Swagger,             File.expand_path("tina4/swagger", __dir__)
   autoload :Crud,                File.expand_path("tina4/crud", __dir__)
+  autoload :CRUD,                File.expand_path("tina4/crud", __dir__)
   autoload :API,                 File.expand_path("tina4/api", __dir__)
   autoload :APIResponse,         File.expand_path("tina4/api", __dir__)
   autoload :GraphQLType,         File.expand_path("tina4/graphql", __dir__)

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: tina4ruby
 version: !ruby/object:Gem::Version
-  version: 3.10.3
+  version: 3.10.4
 platform: ruby
 authors:
 - Tina4 Team