ruby_cms 0.1.0

data/app/components/ruby_cms/admin/base_component.rb

@@ -0,0 +1,78 @@
+# frozen_string_literal: true
+
+module RubyCms
+  module Admin
+    # Base component class for admin components
+    # Inherits from RubyUI::Base if available, otherwise Phlex::HTML
+    class BaseComponent < (defined?(RubyUI) && RubyUI.const_defined?(:Base) ? RubyUI::Base : Phlex::HTML)
+      # Include Rails helpers if Phlex::HTML is used directly
+      if defined?(Phlex::Rails::Helpers)
+        include Phlex::Rails::Helpers::FormAuthenticityToken if defined?(Phlex::Rails::Helpers::FormAuthenticityToken)
+        include Phlex::Rails::Helpers::TurboFrameTag if defined?(Phlex::Rails::Helpers::TurboFrameTag)
+        include Phlex::Rails::Helpers::Sanitize if defined?(Phlex::Rails::Helpers::Sanitize)
+        include Phlex::Rails::Helpers::LinkTo if defined?(Phlex::Rails::Helpers::LinkTo)
+        include Phlex::Rails::Helpers::ButtonTo if defined?(Phlex::Rails::Helpers::ButtonTo)
+        include Phlex::Rails::Helpers::FormWith if defined?(Phlex::Rails::Helpers::FormWith)
+      end
+
+      # Helper method to build CSS classes from hash or array
+      def build_classes(*classes)
+        classes.flatten.compact.join(" ")
+      end
+
+      # Helper method to merge data attributes
+      def merge_data_attributes(base_data, additional_data)
+        base_data.merge(additional_data || {})
+      end
+
+      # Helper method to conditionally add attributes
+      def conditional_attributes(condition, attributes)
+        condition ? attributes : {}
+      end
+
+      # Access Rails helpers (works in Phlex and RubyUI contexts)
+      def helpers
+        @helpers ||=
+          if respond_to?(:view_context)
+            view_context
+          elsif defined?(Phlex::Rails::ViewContext)
+            Phlex::Rails::ViewContext.current
+          elsif defined?(Phlex::HTML) && respond_to?(:call)
+            Thread.current[:phlex_view_context] || raise("View context not available")
+          else
+            raise("View context not available. Ensure component is rendered from a Rails view.")
+          end
+      end
+
+      # Get form authenticity token
+      def form_authenticity_token
+        return helpers.form_authenticity_token if token_from_helpers?
+        return super if respond_to?(:form_authenticity_token, true)
+        return token_from_controller if token_from_controller?
+
+        ""
+      end
+
+      def token_from_helpers?
+        respond_to?(:helpers) && helpers.respond_to?(:form_authenticity_token)
+      end
+
+      def token_from_controller?
+        defined?(ActionController::Base) && respond_to?(:controller)
+      end
+
+      def token_from_controller
+        controller&.form_authenticity_token || ""
+      end
+
+      # Access controller if available
+      def controller
+        @controller ||= if respond_to?(:helpers) && helpers.respond_to?(:controller)
+                          helpers.controller
+                        elsif defined?(ActionController::Base)
+                          Thread.current[:phlex_controller]
+                        end
+      end
+    end
+  end
+end

data/app/components/ruby_cms/admin/bulk_action_table/bulk_action_table.rb

@@ -0,0 +1,149 @@
+# frozen_string_literal: true
+
+module RubyCms
+  module Admin
+    module BulkActionTable
+      # Root component for bulk action table
+      # Wraps entire table with Turbo Frame support, pagination, and bulk actions bar
+      #
+      # @param turbo_frame [String, nil] Turbo Frame ID (e.g., "admin_table_content")
+      # @param pagination [Hash, nil] Pagination hash with current_page, total_pages, etc.
+      # @param pagination_path [Proc, nil] Lambda that generates pagination URLs
+      # @param bulk_actions_url [String, nil] URL for bulk delete action
+      # @param bulk_actions_buttons [Array<Hash>] Array of custom bulk action button configs
+      # @param item_name [String] Singular name for items (e.g., "error", "schedule")
+      # @param controller_name [String] Stimulus controller identifier
+      #   (default: "ruby-cms--bulk-action-table")
+      class BulkActionTable < BaseComponent
+        def initialize(**options)
+          super()
+          @turbo_frame = options[:turbo_frame]
+          @pagination = options[:pagination]
+          @pagination_path = options[:pagination_path]
+          @bulk_actions_url = options[:bulk_actions_url]
+          @bulk_actions_buttons = options[:bulk_actions_buttons] || []
+          @item_name = options.fetch(:item_name, "item")
+          @controller_name = options.fetch(:controller_name, "ruby-cms--bulk-action-table")
+          @csrf_token = options[:csrf_token]
+          @header = options[:header]
+          @header_title = options[:header_title]
+          @header_filter = options[:header_filter]
+          @header_action_icons = options[:header_action_icons] || []
+          @header_search_url = options[:header_search_url] || "#"
+          @header_search_param = options[:header_search_param] || "q"
+          @user_attrs = extract_user_attrs(options)
+          @has_bulk_actions = @bulk_actions_url.present? || @bulk_actions_buttons.any?
+        end
+
+        def extract_user_attrs(options)
+          excluded_keys = %i[
+            turbo_frame pagination pagination_path bulk_actions_url
+            bulk_actions_buttons item_name controller_name csrf_token header
+            header_title header_filter header_action_icons header_search_url header_search_param
+          ]
+          options.except(*excluded_keys)
+        end
+
+        def view_template(&block)
+          if @turbo_frame
+            # Use turbo_frame_tag for proper Turbo Frame navigation (pagination, search)
+            turbo_frame_tag(@turbo_frame, **turbo_frame_options) do
+              render_table_content(&block)
+            end
+          else
+            render_table_content(&block)
+          end
+        end
+
+        def render_table_content(&block)
+          div(
+            class: build_classes(
+              "rounded-lg border border-gray-200/80 bg-white shadow-sm overflow-hidden " \
+              "flex flex-col",
+              @user_attrs[:class]
+            ),
+            **table_data_attributes.except(:class)
+          ) do
+            render_header
+            render_table_wrapper(&block)
+            div(class: "border-t border-gray-200/80 bg-white") do
+              render_bulk_actions if @has_bulk_actions
+              render_pagination if @pagination && @pagination_path
+            end
+          end
+        end
+
+        def render_header
+          if @header_title.present? || @header_action_icons.any? || @header_search_url.present?
+            render BulkActionTableHeaderBar.new(
+              title: @header_title,
+              header_filter: @header_filter,
+              action_icons: @header_action_icons,
+              search_url: @header_search_url,
+              search_param: @header_search_param,
+              turbo_frame: @turbo_frame
+            )
+          elsif @header
+            div(class: "px-6 py-4 border-b border-gray-200/80 bg-white") do
+              if @header.respond_to?(:call)
+                raw(@header.call) # rubocop:disable Rails/OutputSafety -- legacy capture support
+              elsif @header.kind_of?(String)
+                raw(sanitize(@header)) # rubocop:disable Rails/OutputSafety -- legacy capture support
+              end
+            end
+          end
+        end
+
+        def render_table_wrapper(&)
+          div(class: "w-full overflow-x-auto") do
+            table(class: "min-w-full text-sm") do
+              yield if block_given?
+            end
+          end
+        end
+
+        def render_bulk_actions
+          render BulkActions.new(
+            controller_name: @controller_name,
+            item_name: @item_name,
+            bulk_actions_url: @bulk_actions_url,
+            bulk_action_buttons: @bulk_actions_buttons
+          )
+          render BulkActionTableDeleteModal.new(controller_name: @controller_name)
+        end
+
+        def render_pagination
+          render BulkActionTablePagination.new(
+            pagination: @pagination,
+            pagination_path: @pagination_path,
+            turbo_frame: @turbo_frame
+          )
+        end
+
+        private
+
+        def table_data_attributes
+          csrf_token = @csrf_token || form_authenticity_token
+          attrs = {
+            data: {
+              controller: @controller_name,
+              "#{@controller_name}-csrf-token-value": csrf_token,
+              "#{@controller_name}-item-name-value": @item_name
+            }
+          }
+
+          attrs[:data]["#{@controller_name}-bulk-action-url-value"] = @bulk_actions_url if @bulk_actions_url.present?
+
+          attrs.merge(@user_attrs)
+        end
+
+        def turbo_frame_options
+          {
+            class: "flex-1 flex flex-col min-h-0",
+            data: { turbo_action: "advance" }
+          }
+        end
+      end
+    end
+  end
+end

data/app/components/ruby_cms/admin/bulk_action_table/bulk_action_table_actions.rb

@@ -0,0 +1,127 @@
+# frozen_string_literal: true
+
+module RubyCms
+  module Admin
+    module BulkActionTable
+      # Row action buttons component
+      # Renders Edit and Delete buttons for each table row
+      #
+      # @param edit_path [String, nil] URL to edit page
+      # @param delete_path [String, nil] URL to delete action
+      # @param delete_confirm [String] Confirmation message for delete
+      # @param require_confirm [Boolean] Whether to require confirmation (default: true)
+      # @param turbo_frame [String, nil] Turbo Frame ID for updates
+      # @param controller_name [String] Stimulus controller identifier
+      class BulkActionTableActions < BaseComponent
+        def initialize(
+          delete_path:,
+          item_id:,
+          edit_path: nil,
+          delete_confirm: "Are you sure you want to delete this item?",
+          require_confirm: true,
+          turbo_frame: nil,
+          controller_name: "ruby-cms--bulk-action-table"
+        )
+          super
+          @edit_path = edit_path
+          @delete_path = delete_path
+          @item_id = item_id
+          @delete_confirm = delete_confirm
+          @require_confirm = require_confirm
+          @turbo_frame = turbo_frame
+          @controller_name = controller_name
+        end
+
+        def view_template
+          div(class: "flex items-center justify-end gap-1") do
+            render_edit_button if @edit_path
+
+            render_delete_button if @delete_path
+          end
+        end
+
+        private
+
+        def render_edit_button
+          link_options = {
+            href: @edit_path,
+            class: "inline-flex h-8 w-8 items-center justify-center rounded-md text-gray-500 " \
+                   "hover:bg-gray-100 hover:text-gray-900 transition-colors"
+          }
+          link_options[:data] = { turbo_frame: @turbo_frame } if @turbo_frame
+
+          a(**link_options) do
+            svg(
+              xmlns: "http://www.w3.org/2000/svg",
+              viewBox: "0 0 20 20",
+              fill: "currentColor",
+              class: "h-4 w-4"
+            ) do |s|
+              s.path(
+                d: edit_icon_path_d
+              )
+              s.path(
+                d: edit_icon_path_d2
+              )
+            end
+          end
+        end
+
+        def render_delete_button
+          item_id = @item_id || extract_item_id_from_path
+          button(
+            type: "button",
+            class: "inline-flex h-8 w-8 items-center justify-center rounded-md text-rose-600 " \
+                   "hover:bg-rose-50 hover:text-rose-700 transition-colors",
+            data: {
+              action: "click->#{@controller_name}#showIndividualDeleteDialog",
+              "#{@controller_name}-item-id-param": item_id,
+              delete_path: @delete_path,
+              require_confirm: @require_confirm
+            }
+          ) do
+            svg(
+              xmlns: "http://www.w3.org/2000/svg",
+              viewBox: "0 0 20 20",
+              fill: "currentColor",
+              class: "h-4 w-4"
+            ) do |s|
+              s.path(
+                fill_rule: "evenodd",
+                d: delete_icon_path_d,
+                clip_rule: "evenodd"
+              )
+            end
+          end
+        end
+
+        def edit_icon_path_d
+          "M5.433 13.917l1.262-3.155A4 4 0 017.58 9.42l6.92-6.918a2.121 2.121 0 013 3" \
+            "l-6.92 6.918c-.383.383-.84.685-1.343.886l-3.154 1.262a.5.5 0 01-.65-.65z"
+        end
+
+        def edit_icon_path_d2
+          "M3.5 5.75c0-.69.56-1.25 1.25-1.25H10A.75.75 0 0010 3H4.75A2.75 2.75 0 002 5.75" \
+            "v9.5A2.75 2.75 0 004.75 18h9.5A2.75 2.75 0 0017 15.25V10a.75.75 0 00-1.5 0" \
+            "v5.25c0 .69-.56 1.25-1.25 1.25h-9.5c-.69 0-1.25-.56-1.25-1.25v-9.5z"
+        end
+
+        def delete_icon_path_d
+          "M8.75 1A2.75 2.75 0 006 3.75v.443c-.795.077-1.584.176-2.365.298a.75.75 0 10" \
+            ".23 1.482l.149-.022.841 10.518A2.75 2.75 0 007.596 19h4.807a2.75 2.75 0 00" \
+            "2.742-2.53l.841-10.52.149.023a.75.75 0 00.23-1.482A41.03 41.03 0 0014 4.193" \
+            "V3.75A2.75 2.75 0 0011.25 1h-2.5zM10 4c.84 0 1.673.025 2.5.075V3.75c0-.69" \
+            "-.56-1.25-1.25-1.25h-2.5c-.69 0-1.25.56-1.25 1.25v.325C8.327 4.025 9.16 4 " \
+            "10 4zM8.58 7.72a.75.75 0 00-1.5.06l.3 7.5a.75.75 0 101.5-.06l-.3-7.5zm4.34" \
+            ".06a.75.75 0 10-1.5-.06l-.3 7.5a.75.75 0 101.5.06l.3-7.5z"
+        end
+
+        def extract_item_id_from_path
+          # Try to extract item ID from delete_path (e.g., "/admin/users/123" -> "123")
+          # This is a fallback - ideally item_id should be passed explicitly
+          @delete_path.to_s.split("/").last
+        end
+      end
+    end
+  end
+end

data/app/components/ruby_cms/admin/bulk_action_table/bulk_action_table_body.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+module RubyCms
+  module Admin
+    module BulkActionTable
+      # Table body component
+      # Simple wrapper for <tbody> content
+      class BulkActionTableBody < BaseComponent
+        def view_template(&)
+          tbody(class: "divide-y divide-gray-100", &)
+        end
+      end
+    end
+  end
+end

data/app/components/ruby_cms/admin/bulk_action_table/bulk_action_table_checkbox_cell.rb

@@ -0,0 +1,41 @@
+# frozen_string_literal: true
+
+module RubyCms
+  module Admin
+    module BulkActionTable
+      # Checkbox cell component
+      # Renders checkbox in table row for bulk selection
+      #
+      # @param item_id [Integer, String] Item ID for checkbox value
+      # @param controller_name [String] Stimulus controller identifier
+      class BulkActionTableCheckboxCell < BaseComponent
+        def initialize(
+          item_id:,
+          controller_name: "ruby-cms--bulk-action-table"
+        )
+          super
+          @item_id = item_id
+          @controller_name = controller_name
+        end
+
+        def view_template
+          td(class: "w-12 px-6 py-3",
+             data: { action: "click->#{@controller_name}#stopPropagation" }) do
+            input(
+              type: "checkbox",
+              role: "checkbox",
+              value: @item_id,
+              class: "h-4 w-4 rounded border-gray-300 text-teal-600 focus:ring-teal-200",
+              data: {
+                "#{@controller_name}-target": "itemCheckbox",
+                item_id: @item_id,
+                action: "change->#{@controller_name}#updateSelection"
+              },
+              aria_label: "Select row"
+            )
+          end
+        end
+      end
+    end
+  end
+end

data/app/components/ruby_cms/admin/bulk_action_table/bulk_action_table_checkbox_head.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module RubyCms
+  module Admin
+    module BulkActionTable
+      # Checkbox header cell component
+      # Renders select-all checkbox in table header
+      #
+      # @param controller_name [String] Stimulus controller identifier
+      class BulkActionTableCheckboxHead < BaseComponent
+        def initialize(controller_name: "ruby-cms--bulk-action-table")
+          super()
+          @controller_name = controller_name
+        end
+
+        def view_template
+          th(class: "w-12 px-6 py-3") do
+            input(
+              type: "checkbox",
+              role: "checkbox",
+              class: "h-4 w-4 rounded border-gray-300 text-teal-600 focus:ring-teal-200",
+              data: {
+                "#{@controller_name}-target": "selectAllCheckbox",
+                action: "change->#{@controller_name}#toggleSelectAll"
+              },
+              aria_label: "Select all"
+            )
+          end
+        end
+      end
+    end
+  end
+end

data/app/components/ruby_cms/admin/bulk_action_table/bulk_action_table_delete_modal.rb

@@ -0,0 +1,174 @@
+# frozen_string_literal: true
+
+module RubyCms
+  module Admin
+    module BulkActionTable
+      # Delete confirmation modal component
+      # Shows confirmation dialog for bulk delete actions
+      #
+      # @param controller_name [String] Stimulus controller identifier
+      class BulkActionTableDeleteModal < BaseComponent
+        def initialize(controller_name: "ruby-cms--bulk-action-table")
+          super
+          @controller_name = controller_name
+        end
+
+        def view_template
+          div(**dialog_overlay_attributes) do
+            render_backdrop
+            render_dialog_container
+          end
+        end
+
+        private
+
+        def dialog_overlay_attributes
+          {
+            class: "fixed inset-0 z-50 hidden",
+            data: {
+              "#{@controller_name}-target": "dialogOverlay",
+              action: "keydown->#{@controller_name}#handleKeydown"
+            },
+            role: "dialog",
+            aria_modal: "true",
+            aria_labelledby: "dialog-title"
+          }
+        end
+
+        def render_backdrop
+          div(
+            class: "absolute inset-0 bg-black/50",
+            data: {
+              action: "click->#{@controller_name}#closeDialog"
+            }
+          )
+        end
+
+        def render_dialog_container
+          div(class: "relative flex min-h-full items-center justify-center p-4") do
+            div(**dialog_content_attributes) do
+              render_header_with_close
+              render_message
+              render_footer
+            end
+          end
+        end
+
+        def render_header_with_close
+          div(class: "flex items-start justify-between gap-4") do
+            render_header
+            render_close_button
+          end
+        end
+
+        def dialog_content_attributes
+          {
+            class: "w-full max-w-md rounded-lg border border-gray-200 bg-white p-6 shadow-lg",
+            data: {
+              "#{@controller_name}-target": "dialogContent"
+            },
+            tabindex: "-1"
+          }
+        end
+
+        def render_close_button
+          button(
+            type: "button",
+            class: "inline-flex h-8 w-8 items-center justify-center rounded-md text-gray-500 " \
+                   "hover:bg-gray-100 hover:text-gray-900 transition-colors",
+            data: {
+              action: "click->#{@controller_name}#closeDialog"
+            },
+            aria_label: "Close"
+          ) do
+            render_close_icon
+            span(class: "sr-only") { "Close" }
+          end
+        end
+
+        def render_close_icon
+          svg(
+            width: "15",
+            height: "15",
+            viewBox: "0 0 15 15",
+            fill: "none",
+            xmlns: "http://www.w3.org/2000/svg",
+            class: "h-4 w-4"
+          ) do |s|
+            s.path(
+              d: close_icon_path_d,
+              fill: "currentColor",
+              fill_rule: "evenodd",
+              clip_rule: "evenodd"
+            )
+          end
+        end
+
+        def close_icon_path_d
+          "M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 " \
+            "2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 " \
+            "3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 " \
+            "3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 " \
+            "10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 " \
+            "12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 " \
+            "11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 " \
+            "11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 " \
+            "4.03157Z"
+        end
+
+        def render_header
+          h3(
+            id: "dialog-title",
+            class: "text-base font-semibold text-gray-900",
+            data: {
+              "#{@controller_name}-target": "dialogTitle"
+            }
+          ) { "Delete Selected Items" }
+        end
+
+        def render_message
+          div(
+            class: "mt-3 text-sm text-gray-600 space-y-1",
+            data: {
+              "#{@controller_name}-target": "dialogMessage"
+            }
+          ) do
+            p { "Are you sure you want to delete the selected items?" }
+            p { "This action cannot be undone." }
+          end
+        end
+
+        def render_footer
+          div(class: "mt-6 flex items-center justify-end gap-2") do
+            render_cancel_button
+            render_confirm_button
+          end
+        end
+
+        def render_cancel_button
+          button(
+            type: "button",
+            class: "inline-flex h-9 items-center justify-center rounded-md border " \
+                   "border-gray-200 bg-white px-4 text-sm font-medium text-gray-900 " \
+                   "shadow-sm hover:bg-gray-50 transition-colors",
+            data: {
+              action: "click->#{@controller_name}#closeDialog"
+            }
+          ) { "Cancel" }
+        end
+
+        def render_confirm_button
+          button(
+            type: "button",
+            class: "inline-flex h-9 items-center justify-center rounded-md bg-rose-600 px-4 " \
+                   "text-sm font-medium text-white shadow-sm hover:bg-rose-700 transition-colors",
+            data: {
+              "#{@controller_name}-target": "dialogConfirmButton",
+              action: "click->#{@controller_name}#confirmAction"
+            }
+          ) { "Delete Selected" }
+        end
+      end
+    end
+  end
+end

data/app/components/ruby_cms/admin/bulk_action_table/bulk_action_table_header.rb

@@ -0,0 +1,59 @@
+# frozen_string_literal: true
+
+module RubyCms
+  module Admin
+    module BulkActionTable
+      # Table header component
+      # Renders <thead> with column headers and optional select-all checkbox
+      #
+      # @param headers [Array<String>] Array of header text
+      # @param bulk_actions_enabled [Boolean] Whether to show select-all checkbox
+      # @param controller_name [String] Stimulus controller identifier
+      class BulkActionTableHeader < BaseComponent
+        def initialize(
+          headers: [],
+          bulk_actions_enabled: true,
+          controller_name: "ruby-cms--bulk-action-table"
+        )
+          super
+          @headers = headers
+          @bulk_actions_enabled = bulk_actions_enabled
+          @controller_name = controller_name
+        end
+
+        def view_template
+          thead(class: "bg-gray-50") do
+            tr do
+              render_bulk_checkbox_header
+              render_table_headers
+            end
+          end
+        end
+
+        private
+
+        def render_bulk_checkbox_header
+          return unless @bulk_actions_enabled
+
+          render BulkActionTableCheckboxHead.new(controller_name: @controller_name)
+        end
+
+        def render_table_headers
+          Array(@headers).each do |header|
+            if header.kind_of?(Hash)
+              th(class: build_classes(th_base_classes, header[:class])) do
+                header[:text] || header[:label]
+              end
+            else
+              th(class: th_base_classes) { header }
+            end
+          end
+        end
+
+        def th_base_classes
+          "px-6 py-3 text-left text-xs font-semibold uppercase tracking-wider text-gray-500"
+        end
+      end
+    end
+  end
+end