tramway 0.4.9.3 → 0.5

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: a319164d807e5ed06f1a2a94f0fc4158850e83134390b65c1567f0192bb56bc8
-  data.tar.gz: 21a85ecb9c14cbd30d6ebe145289917a8d935a36039813274b2d3a5b7992e723
+  metadata.gz: 7383199c539bbfdb97568068d0568fbf9366f2d3d6069258f2b96182c31bf2b4
+  data.tar.gz: d2320192e25efa23450e4e33730d869fe6c94b8bf8af885a494c4dfc5e808c44
 SHA512:
-  metadata.gz: 418663e713b81978e3026d4be7e0a671936564957bdede23c9a979f0f8a525c558eda982f668e6e59ed01ec29b03ccadf80b393eea414a4f246c251532fabee6
-  data.tar.gz: f67485a339908dbea9ff9a95054c645196d3e3d58bfe678487a8652925e35f110167acbd84ead6e3dab362162f8e49de1290b093e15dd4022fe9d4407183e350
+  metadata.gz: 70f4ea1f899fbf291fafb530129d5b4778b114d7f4c17115192c0f90a35269f871e7d23cd494361b175811d50542b746079abd0e1aacdd65963eb892f984f25b
+  data.tar.gz: 3db27c125714d2f67500e703fe10bc3497926672b943b34ea9d222e1832a7976b589cb0e502b0ab7a8400fb9616c784007c109facbf52f859e072bc51291420f

data/README.md

@@ -539,9 +539,7 @@ user_2.object #=> returns pure user object
 Install [lefthook](https://github.com/evilmartians/lefthook)
 
 ```
-bundle
-lefthook install
-rspec
+make install
 ```
 
 ## License

data/app/assets/javascripts/tramway/multiselect_controller.js

@@ -17,22 +17,25 @@ export default class Multiselect extends Controller {
 
   connect() {
     this.dropdownState = 'closed';
-    this.unselectedItems = JSON.parse(this.element.dataset.items).map((item) => {
+    this.items = JSON.parse(this.element.dataset.items).map((item, index) => {
       return {
+        index,
         text: item.text,
-        value: item.value.toString()
+        value: item.value.toString(),
+        selected: false
       }
     });
 
     const initialValues = this.element.dataset.value === undefined ? [] : this.element.dataset.value.split(',')
-    this.selectedItems = this.unselectedItems.filter(item => initialValues.includes(item.value));
-    this.unselectedItems = this.unselectedItems.filter(item => !initialValues.includes(item.value));
+    this.selectedItems = this.items.filter(item => initialValues.includes(item.value));
+    this.items = this.items.filter(item => !initialValues.includes(item.value));
 
     this.renderSelectedItems();
   }
 
   renderSelectedItems() {
     const allItems = this.fillTemplate(this.element.dataset.selectedItemTemplate, this.selectedItems);
+
     this.showSelectedAreaTarget.innerHTML = allItems;
     this.showSelectedAreaTarget.insertAdjacentHTML("beforeEnd", this.input());
     this.updateInputOptions();
@@ -86,25 +89,22 @@ export default class Multiselect extends Controller {
   get template() {
     return this.element.dataset.dropdownContainer.replace(
       /{{content}}/g,
-      this.fillTemplate(this.element.dataset.itemContainer, this.unselectedItems)
+      this.fillTemplate(this.element.dataset.itemContainer, this.items.filter(item => !item.selected))
     );
   }
 
   toggleItem({ currentTarget }) {
-    const item = {
-      text: currentTarget.dataset.text,
-      value: currentTarget.dataset.value
-    };
-
-    const itemIndex = this.selectedItems.findIndex(x => x.value === item.value);
-    if (itemIndex !== -1) {
-      this.selectedItems = this.selectedItems.filter((_, index) => index !== itemIndex);
+    const itemIndex = this.items.findIndex(x => x.value === currentTarget.dataset.value);
+    const itemSelectedIndex = this.selectedItems.findIndex(x => x.value === currentTarget.dataset.value);
+
+    if (itemSelectedIndex !== -1) {
+      this.selectedItems = this.selectedItems.filter((_, index) => index !== itemSelectedIndex);
+      this.items[itemIndex].selected = false; 
     } else {
-      this.selectedItems.push(item);
+      this.selectedItems.push(this.items[itemIndex]);
+      this.items[itemIndex].selected = true;
     }
 
-    this.unselectedItems = this.unselectedItems.filter(x => x.value !== item.value);
-
     this.renderSelectedItems();
     this.rerenderItems();
   }

data/app/assets/javascripts/tramway/table_row_preview_controller.js

@@ -0,0 +1,83 @@
+import { Controller } from "@hotwired/stimulus";
+
+export default class TableRowPreview extends Controller {
+  connect() {
+    this.items = JSON.parse(this.element.dataset.items || '{}');
+  }
+
+  toggle() {
+    const rollUp = document.getElementById("roll-up");
+
+    const existingTable = rollUp.querySelector(".div-table");
+    if (existingTable) {
+      existingTable.remove();
+    }
+
+    const existingTitle = rollUp.querySelector("h3");
+    if (existingTitle) {
+      existingTitle.remove();
+    }
+
+    if (Object.keys(this.items).length === 0) return;
+
+    const titleText = document.createElement("h3");
+
+    titleText.classList.add("text-xl");
+    titleText.classList.add("text-white");
+    titleText.classList.add("py-4");
+    titleText.classList.add("px-4");
+    titleText.textContent = Object.values(this.items)[0];
+
+    const table = this.createTable(this.items);
+
+    rollUp.insertAdjacentElement('afterbegin', table);
+    rollUp.insertAdjacentElement('afterbegin', titleText);
+
+    rollUp.classList.toggle("hidden");
+  }
+
+  close() {
+    const rollUp = document.getElementById("roll-up");
+    rollUp.classList.add("hidden");
+  }
+
+  createTable(items) {
+    const table = document.createElement("div");
+    table.classList.add("div-table");
+    table.classList.add("text-white");
+    table.classList.add("px-2");
+
+    Object.entries(items).forEach(([key, value]) => {
+      const rows = this.createTableRow(key, value);
+
+      rows.forEach((row) => table.appendChild(row));
+    });
+
+    return table;
+  }
+
+  createTableRow(key, value) {
+    const keyRow = document.createElement("div");
+    keyRow.classList.add("div-table-row");
+    keyRow.classList.add("bg-purple-300");
+    keyRow.classList.add("text-purple-700");
+    keyRow.classList.add("dark:text-white");
+    keyRow.classList.add("dark:bg-gray-700");
+    keyRow.classList.add("px-2");
+    keyRow.classList.add("py-1");
+    keyRow.classList.add("text-xs");
+    keyRow.classList.add("font-semibold");
+    keyRow.textContent = key;
+
+    const valueRow = document.createElement("div"); 
+    valueRow.classList.add("div-table-row");
+    valueRow.classList.add("dark:bg-gray-800");
+    valueRow.classList.add("px-2");
+    valueRow.classList.add("py-2");
+    valueRow.textContent = value;
+
+    return [keyRow, valueRow];
+  }
+}
+
+export { TableRowPreview };

data/app/components/tailwind_component.rb

@@ -3,9 +3,7 @@
 require 'view_component'
 
 # Base TailwindComponent. Contains base features for all tailwind components
-class TailwindComponent < ViewComponent::Base
-  extend Dry::Initializer[undefined: false]
-
+class TailwindComponent < Tramway::Component::Base
   option :input
   option :attribute
   option :value, optional: true

data/app/components/tailwinds/form/label_component.html.haml

@@ -0,0 +1,2 @@
+%label.block.text-gray-700.text-sm.font-bold.mb-2.dark:text-white{ for: }
+  = content

data/app/components/tailwinds/form/label_component.rb

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Form
+    # Form label for all tailwind-styled forms
+    class LabelComponent < Tramway::Component::Base
+      option :for
+    end
+  end
+end

data/app/components/tailwinds/form/multiselect_component.html.haml

@@ -1,8 +1,8 @@
 .mb-4
   - if @label
-    %label.block.text-gray-700.text-sm.font-bold.mb-2{ for: @for }
+    = component('tailwinds/form/label', for: @for) do
       = @label
-  .flex.flex-col.items-center.relative{ data: multiselect_hash, id: "#{@for}_multiselect" }
+  .flex.flex-col.relative{ data: multiselect_hash, id: "#{@for}_multiselect" }
     .min-w-96.w-fit
       .p-1.flex.border.border-gray-200.bg-white.rounded{ data: { "multiselect-target" => "dropdown" } }
         .flex.flex-auto.flex-wrap{ data: { "multiselect-target" => "showSelectedArea" } }

data/app/components/tailwinds/form/select_component.html.haml

@@ -1,5 +1,5 @@
 .mb-4
   - if @label
-    %label.block.text-gray-700.text-sm.font-bold.mb-2{ for: @for }
+    = component('tailwinds/form/label', for: @for) do
       = @label
   = @input.call(@attribute, @collection, { selected: @value }, @options.merge(class: 'bg-white border border-gray-300 text-gray-700 py-2.5 px-2 rounded focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent'))

data/app/components/tailwinds/form/text_field_component.html.haml

@@ -1,5 +1,5 @@
 .mb-4
   - if @label
-    %label.block.text-gray-700.text-sm.font-bold.mb-2{ for: @for }
+    = component('tailwinds/form/label', for: @for) do
       = @label
   = @input.call @attribute, **@options.merge(class: 'w-full px-3 py-2 border border-gray-300 rounded focus:outline-none focus:border-red-500'), value: @value

data/app/components/tailwinds/nav/item/button_component.rb

@@ -11,7 +11,7 @@ module Tailwinds
         def initialize(**options)
           @href = options[:href]
           @method = options[:method]
-          @style = 'text-white hover:bg-red-300 px-4 py-2 rounded'
+          @style = 'text-white hover:bg-gray-300 hover:text-gray-800 px-4 py-2 rounded whitespace-nowrap'
           @options = options.except(:href, :method)
         end
       end

data/app/components/tailwinds/nav/item/link_component.rb

@@ -10,7 +10,7 @@ module Tailwinds
       class LinkComponent < TailwindComponent
         def initialize(**options)
           @href = options[:href]
-          @style = 'text-white hover:bg-red-300 px-4 py-2 rounded'
+          @style = 'text-white hover:bg-gray-300 hover:text-gray-800 px-4 py-2 rounded whitespace-nowrap'
           @options = Rules::TurboHtmlAttributesRules.prepare_turbo_html_attributes(options:)
         end
       end

data/app/components/tailwinds/navbar_component.html.haml

@@ -1,16 +1,38 @@
-%nav.py-4.px-8.flex.justify-between.items-center{ class: "bg-#{@color}" }
-  - if @title[:text].present? || @left_items.present?
-    .flex
-      - if @title[:text].present?
-        = link_to @title[:link] do
-          .text-xl.text-white.font-bold
-            = @title[:text]
-      - if @left_items.present?
-        %ul.flex.items-center.space-x-4
-          - @left_items.each do |item|
-            = item
+%nav.py-4.px-4.sm:px-8.flex.justify-between.items-center.dark:bg-gray-800{ class: "bg-#{@color}" }
+  .flex.justify-between.w-full
+    - if @title[:text].present? || @left_items.present?
+      .flex.items-center
+        - if @title[:text].present?
+          = link_to @title[:link] do
+            .text-xl.text-white.font-bold
+              = @title[:text]
+        - if @left_items.present?
+          %ul.hidden.sm:flex.items-center.space-x-4.ml-4
+            - @left_items.each do |item|
+              = item
+
+    .block.sm:hidden
+      %button#mobile-menu-button.text-white.focus:outline-none
+        ☰
+
+  - if @right_items.present?
+    %ul.hidden.sm:flex.items-center.space-x-4
+      - @right_items.each do |item|
+        = item
+
+#mobile-menu.hidden.flex-col.sm:hidden.dark:bg-gray-800
+  - if @left_items.present?
+    %ul.flex.flex-col.space-y-2
+      - @left_items.each do |item|
+        = item
 
   - if @right_items.present?
-    %ul.flex.items-center.space-x-4
+    %ul.flex.flex-col.space-y-2
       - @right_items.each do |item|
         = item
+
+:javascript
+  document.getElementById('mobile-menu-button').addEventListener('click', function() {
+    var menu = document.getElementById('mobile-menu');
+    menu.classList.toggle('hidden');
+  });

data/app/components/tailwinds/pagination/base.rb

@@ -0,0 +1,22 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Pagination
+    # Base component for rendering a Kaminari pagination
+    class Base < Tramway::Component::Base
+      option :current_page
+      option :url
+      option :remote
+
+      # :reek:UtilityFunction { enabled: false }
+      def pagination_classes(klass: nil)
+        default_classes = ['cursor-pointer', 'px-3', 'py-2', 'font-medium', 'text-purple-700', 'bg-white',
+                           'rounded-md', 'hover:bg-purple-100', 'dark:text-white', 'dark:bg-gray-800',
+                           'dark:hover:bg-gray-700']
+
+        (default_classes + [klass]).join(' ')
+      end
+      # :reek:UtilityFunction { enabled: true }
+    end
+  end
+end

data/app/components/tailwinds/pagination/first_page_component.html.haml

@@ -0,0 +1,3 @@
+- unless current_page.first?
+  = link_to helpers.t('views.pagination.first').html_safe, url, remote:, class: pagination_classes(klass: 'first hidden sm:flex')
+  = link_to '⭰', url, remote:, class: pagination_classes(klass: 'first sm:hidden font-bold')

data/app/components/tailwinds/pagination/first_page_component.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Pagination
+    # Kaminari first page component for rendering a first page button in a pagination
+    class FirstPageComponent < Tailwinds::Pagination::Base
+    end
+  end
+end

data/app/components/tailwinds/pagination/gap_component.html.haml

@@ -0,0 +1,2 @@
+%span.page.gap.px-3.py-2.text-sm.font-medium.text-purple-700.dark:text-white.sm:flex.hidden
+  = helpers.t('views.pagination.truncate').html_safe

data/app/components/tailwinds/pagination/gap_component.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Pagination
+    # Kaminari gap component for rendering a gap in a pagination
+    class GapComponent < Tramway::Component::Base
+    end
+  end
+end

data/app/components/tailwinds/pagination/last_page_component.html.haml

@@ -0,0 +1,3 @@
+- unless current_page.last?
+  = link_to helpers.t('views.pagination.last').html_safe, url, remote:, class: pagination_classes(klass: 'last hidden sm:flex')
+  = link_to '⭲', url, remote:, class: pagination_classes(klass: 'last sm:hidden font-bold')

data/app/components/tailwinds/pagination/last_page_component.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Pagination
+    # Kaminari next page component for rendering a last page button in a pagination
+    class LastPageComponent < Tailwinds::Pagination::Base
+    end
+  end
+end

data/app/components/tailwinds/pagination/next_page_component.html.haml

@@ -0,0 +1,3 @@
+- unless current_page.last?
+  = link_to helpers.t('views.pagination.next').html_safe, url, rel: 'next', remote:, class: pagination_classes(klass: 'next hidden sm:flex')
+  = link_to '🠖', url, rel: 'next', remote:, class: pagination_classes(klass: 'next sm:hidden font-bold')

data/app/components/tailwinds/pagination/next_page_component.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Pagination
+    # Kaminari next page component for rendering a next page button in a pagination
+    class NextPageComponent < Tailwinds::Pagination::Base
+    end
+  end
+end

data/app/components/tailwinds/pagination/page_component.html.haml

@@ -0,0 +1,5 @@
+- if page.current?
+  %span.px-3.py-2.font-medium.rounded-md.bg-purple-500.text-white.dark:text-gray-800.dark:bg-white
+    = page
+- else
+  = link_to page, url, remote:, rel: page.rel, class: pagination_classes(klass: 'hidden sm:flex')

data/app/components/tailwinds/pagination/page_component.rb

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Pagination
+    # Kaminari page component for rendering a page button in a pagination
+    class PageComponent < Tailwinds::Pagination::Base
+      option :page
+    end
+  end
+end

data/app/components/tailwinds/pagination/prev_page_component.html.haml

@@ -0,0 +1,3 @@
+- unless current_page.first?
+  = link_to helpers.t('views.pagination.previous').html_safe, url, rel: 'prev', remote:, class: pagination_classes(klass: 'prev hidden sm:flex')
+  = link_to '🠔', url, rel: 'prev', remote:, class: pagination_classes(klass: 'prev sm:hidden font-bold')

data/app/components/tailwinds/pagination/prev_page_component.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Pagination
+    # Kaminari prev page component for rendering a prev page button in a pagination
+    class PrevPageComponent < Tailwinds::Pagination::Base
+    end
+  end
+end

data/app/components/tailwinds/table/cell_component.html.haml

@@ -0,0 +1,2 @@
+.div-table-cell.px-6.py-4.font-medium.text-gray-900.whitespace-nowrap.dark:bg-gray-800.dark:text-white.text-xs.sm:text-base
+  = content

data/app/components/tailwinds/table/cell_component.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Table
+    # Component for rendering a cell in a table
+    class CellComponent < Tramway::Component::Base
+    end
+  end
+end

data/app/components/tailwinds/table/header_component.html.haml

@@ -0,0 +1,6 @@
+- cols = headers.map { |item| "1fr" }.join(",")
+
+.div-table-row.hidden.md:grid.text-white.text-small.gap-4.bg-purple-700.dark:bg-gray-700.dark:text-gray-400{ class: "grid-cols-[#{cols}]" }
+  - headers.each do |header|
+    .div-table-cell.py-4.px-6
+      = header

data/app/components/tailwinds/table/header_component.rb

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Table
+    # Component for rendering a header in a table
+    class HeaderComponent < Tramway::Component::Base
+      option :headers
+    end
+  end
+end

data/app/components/tailwinds/table/row/preview_component.html.haml

@@ -0,0 +1,18 @@
+:css
+  @keyframes roll-up {
+    0% {
+      transform: translateY(100%);
+    }
+
+    100% {
+      transform: translateY(0%);
+    }
+  }
+
+  .animate-roll-up {
+    animation: roll-up 0.5s ease-in-out;
+  }
+
+#roll-up.fixed.hidden.inset-x-0.bottom-0.bg-purple-700.shadow-lg.z-50.dark:bg-gray-800.animate-roll-up{ class: 'h-1/2' }
+  %button.absolute.top-4.text-white.right-4.hover:text-gray-700.dark:text-gray-400.dark:hover:text-gray-200{ "data-action" => "click->preview#close", "data-controller" => "preview" }
+    ✕

data/app/components/tailwinds/table/row/preview_component.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Table
+    module Row
+      # Row component for rendering a row in a table
+      class PreviewComponent < Tramway::Component::Base
+      end
+    end
+  end
+end

data/app/components/tailwinds/table/row_component.html.haml

@@ -0,0 +1,24 @@
+
+- if cells.any?
+  - cols = cells.count.times.map { |item| "1fr" }.join(",")
+
+  = row_tag class: "div-table-row hidden md:grid gap-4 bg-white border-b dark:bg-gray-800 dark:border-gray-700 grid-cols-[#{cols}]" do
+    - cells.each do |(_, value)|
+      .div-table-cell.px-6.py-4.font-medium.text-gray-900.whitespace-nowrap.dark:text-white.text-xs.sm:text-base
+        = value
+
+  .div-table-row.border-b.dark:bg-gray-800.dark:border-gray-700.md:hidden.mb-2{ "data-action" => "click->preview#toggle", "data-controller" => "preview", "data-items" => cells.to_json }
+    .w-full.p-4.bg-purple-100.text-gray-700.dark:bg-gray-700.dark:text-gray-400
+      = cells.values.first
+
+    .flex.overflow-x-auto.whitespace-nowrap
+      - cells.each_with_index do |(_, value), index|
+        - next if index == 0
+
+        .text-gray-900.dark:text-white.p-4.text-xs.sm:text-base.inline-block.w-auto
+          = value
+- else
+  - cols = Nokogiri::HTML.fragment(content).children.css('> div').count.times.map { |item| "1fr" }.join(",")
+
+  %div{ class: "div-table-row hidden md:grid gap-4 bg-white border-b dark:bg-gray-800 dark:border-gray-700 grid-cols-[#{cols}]" }
+    = content

data/app/components/tailwinds/table/row_component.rb

@@ -0,0 +1,25 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  module Table
+    # Component for rendering a row in a table
+    class RowComponent < Tramway::Component::Base
+      option :cells, optional: true, default: -> { [] }
+      option :href, optional: true
+
+      def row_tag(**options, &)
+        if href.present?
+          klass = "#{options[:class] || ''} cursor-pointer hover:bg-gray-700"
+
+          link_to(href, options.merge(class: klass)) do
+            yield if block_given?
+          end
+        else
+          tag.div(**options) do
+            yield if block_given?
+          end
+        end
+      end
+    end
+  end
+end

data/app/components/tailwinds/table_component.html.haml

@@ -0,0 +1,4 @@
+= helpers.component 'tailwinds/table/row/preview'
+
+.div-table.w-full.text-left.rtl:text-right.text-gray-500.dark:text-gray-400.mt-4
+  = content

data/app/components/tailwinds/table_component.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+module Tailwinds
+  # Table component for rendering a table
+  class TableComponent < Tramway::Component::Base
+  end
+end

data/app/components/tramway/component/base.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module Tramway
+  module Component
+    # You can use this class as a base for all your components
+    class Base < ViewComponent::Base
+      extend Dry::Initializer[undefined: false]
+      include Tramway::Helpers::ComponentHelper
+    end
+  end
+end

data/app/controllers/tramway/entities_controller.rb

@@ -0,0 +1,19 @@
+# frozen_string_literal: true
+
+module Tramway
+  # Main controller for entities pages
+  class EntitiesController < Tramway.config.application_controller.constantize
+    helper Tramway::ApplicationHelper
+    include Rails.application.routes.url_helpers
+
+    def index
+      @entities = model_class.page(params[:page])
+    end
+
+    private
+
+    def model_class
+      @model_class ||= params[:entity].classify.constantize
+    end
+  end
+end

data/app/helpers/tramway/application_helper.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+require 'tramway/helpers/component_helper'
+
+module Tramway
+  # Main helper module for Tramway entities pages
+  module ApplicationHelper
+    include Tramway::Decorators::ClassHelper
+    include Tramway::Helpers::ComponentHelper
+
+    def page_title
+      @model_class.model_name.human.pluralize
+    end
+  end
+end

data/app/views/kaminari/_first_page.html.haml

@@ -1,9 +1 @@
--#  Link to the "First" page
--#  available local variables
--#    url:           url to the first page
--#    current_page:  a page object for the currently displayed page
--#    total_pages:   total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%span.first{ class: 'px-3 py-2 text-sm font-medium text-purple-700 bg-white rounded-md hover:bg-purple-100' }
-  = link_to_unless current_page.first?, t('views.pagination.first').html_safe, url, remote: remote
+= component 'tailwinds/pagination/first_page', current_page:, url:, remote:

data/app/views/kaminari/_gap.html.haml

@@ -1,8 +1 @@
--#  Non-link tag that stands for skipped pages...
--#  available local variables
--#    current_page:  a page object for the currently displayed page
--#    total_pages:   total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%span.page.gap{ class: 'px-3 py-2 text-sm font-medium text-purple-700' }
-  = t('views.pagination.truncate').html_safe
+= component 'tailwinds/pagination/gap'

data/app/views/kaminari/_last_page.html.haml

@@ -1,9 +1 @@
--#  Link to the "Last" page
--#  available local variables
--#    url:           url to the last page
--#    current_page:  a page object for the currently displayed page
--#    total_pages:   total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%span.last{ class: 'px-3 py-2 text-sm font-medium text-purple-700 bg-white rounded-md hover:bg-purple-100' }
-  = link_to_unless current_page.last?, t('views.pagination.last').html_safe, url, remote: remote
+= component 'tailwinds/pagination/last_page', current_page:, url:, remote:

data/app/views/kaminari/_next_page.html.haml

@@ -1,9 +1 @@
--#  Link to the "Next" page
--#  available local variables
--#    url:           url to the next page
--#    current_page:  a page object for the currently displayed page
--#    total_pages:   total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%span.next{ class: 'px-3 py-2 text-sm font-medium text-purple-700 bg-white rounded-md hover:bg-purple-100' }
-  = link_to_unless current_page.last?, t('views.pagination.next').html_safe, url, rel: 'next', remote: remote
+= component 'tailwinds/pagination/next_page', current_page:, url:, remote:

data/app/views/kaminari/_page.html.haml

@@ -1,14 +1 @@
--#  Link showing page number
--#  available local variables
--#    page:          a page object for "this" page
--#    url:           url to this page
--#    current_page:  a page object for the currently displayed page
--#    total_pages:   total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-- if page.current?
-  %span{class: "px-3 py-2 font-medium rounded-md bg-purple-500 text-white" }
-    = page
-- else
-  %span{class: "cursor px-3 py-2 font-medium text-purple-700 bg-white rounded-md hover:bg-purple-100"}
-    = link_to_unless page.current?, page, url, {remote: remote, rel: page.rel}
+= component 'tailwinds/pagination/page', current_page:, url:, remote:, page:

data/app/views/kaminari/_prev_page.html.haml

@@ -1,9 +1 @@
--#  Link to the "Previous" page
--#  available local variables
--#    url:           url to the previous page
--#    current_page:  a page object for the currently displayed page
--#    total_pages:   total number of pages
--#    per_page:      number of items to fetch per page
--#    remote:        data-remote
-%span.prev{ class: 'px-3 py-2 text-sm font-medium text-purple-700 bg-white rounded-md hover:bg-purple-100' }
-  = link_to_unless current_page.first?, t('views.pagination.previous').html_safe, url, rel: 'prev', remote: remote
+= component 'tailwinds/pagination/prev_page', current_page:, url:, remote:

data/app/views/tramway/entities/_entity.html.haml

@@ -0,0 +1,2 @@
+- decorator = decorator_class(entity)
+= component 'tailwinds/table/row', cells: decorator.list_attributes.reduce({}) { |hash, attribute| hash.merge! attribute => entity.public_send(attribute) }, href: decorator.decorate(entity).show_path

data/app/views/tramway/entities/index.html.haml

@@ -0,0 +1,22 @@
+.w-full
+  - content_for :title, page_title
+
+  .flex.justify-between.items-center.md:mt-4.mt-2
+    %h1.font-bold.text-4xl.dark:text-white
+      = page_title
+
+    - if Tramway.config.pagination[:enabled]
+      = paginate @entities
+
+  - if decorator_class(@entities).list_attributes.empty?
+    %p.text-center.mt-10
+      You should fill class-level method `self.list_attributes` inside your
+      = decorator_class_name(@entities)
+
+= component 'tailwinds/table' do
+  = component 'tailwinds/table/header', headers: decorator_class(@entities).list_attributes.map { |attribute| @model_class.human_attribute_name(attribute) }
+  - @entities.each do |item|
+    = render 'entity', entity: item
+
+  .flex.mt-4
+    = paginate @entities

data/config/routes.rb

@@ -1,6 +1,7 @@
 # frozen_string_literal: true
 
-# rubocop:disable Lint/EmptyBlock
 Tramway::Engine.routes.draw do
+  Tramway.config.entities.each do |entity|
+    resources entity.name.pluralize.to_sym, only: entity.pages, controller: :entities, defaults: { entity: entity.name }
+  end
 end
-# rubocop:enable Lint/EmptyBlock

data/lib/tramway/base_decorator.rb

@@ -43,6 +43,10 @@ module Tramway
         end
       end
 
+      def list_attributes
+        []
+      end
+
       include Tramway::Decorators::AssociationClassMethods
     end
 
@@ -51,5 +55,7 @@ module Tramway
 
       "#{underscored_class_name.pluralize}/#{underscored_class_name}"
     end
+
+    def show_path = nil
   end
 end

data/lib/tramway/config.rb

@@ -12,7 +12,8 @@ module Tramway
 
     attr_config(
       pagination: { enabled: false },
-      entities: []
+      entities: [],
+      application_controller: 'ActionController::Base'
     )
 
     def entities=(collection)

data/lib/tramway/configs/entity.rb

@@ -7,6 +7,7 @@ module Tramway
     # Tramway is an entity-based framework
     class Entity < Dry::Struct
       attribute :name, Types::Coercible::String
+      attribute? :pages, Types::Array.of(Types::Symbol).default([].freeze)
       attribute? :route, Tramway::Configs::Entities::Route
 
       # Route Struct contains implemented in Tramway CRUD and helpful routes for the entity
@@ -16,13 +17,13 @@ module Tramway
       HumanNameStruct = Struct.new(:single, :plural)
 
       def routes
-        RouteStruct.new(Rails.application.routes.url_helpers.public_send(route_helper_method))
+        RouteStruct.new(route_helper_method)
       end
 
       def human_name
         single, plural = if model_class.present?
                            model_name = model_class.model_name.human
-                           [model_name, model_name.pluralize]
+                           [model_name, pluralized(model_name)]
                          else
                            [name.capitalize, name.pluralize.capitalize]
                          end
@@ -32,8 +33,14 @@ module Tramway
 
       private
 
+      def pluralized(model_name)
+        local_plural = I18n.t("#{name}.many", scope: 'activerecord.plural.models', default: nil)
+
+        local_plural.present? ? local_plural : model_name.pluralize
+      end
+
       def model_class
-        name.camelize.constantize
+        name.classify.constantize
       rescue StandardError
         nil
       end
@@ -41,11 +48,17 @@ module Tramway
       def route_helper_method
         underscored_name = name.parameterize.pluralize.underscore
 
-        if route.present?
-          route.helper_method_by(underscored_name)
-        else
-          "#{underscored_name}_path"
-        end
+        method_name = if pages.include?(:index) || route.blank?
+                        "#{underscored_name}_path"
+                      else
+                        route.helper_method_by(underscored_name)
+                      end
+
+        route_helper_engine.routes.url_helpers.public_send(method_name)
+      end
+
+      def route_helper_engine
+        pages.include?(:index) ? Tramway::Engine : Rails.application
       end
     end
   end

data/lib/tramway/decorators/class_helper.rb

@@ -6,19 +6,28 @@ module Tramway
     module ClassHelper
       module_function
 
-      def decorator_class(object_or_array, decorator)
+      def decorator_class(object_or_array, decorator = nil)
         if decorator.present?
           decorator
         else
-          klass = if Tramway::Decorators::CollectionDecorators.collection?(object_or_array)
-                    object_or_array.first.class
-                  else
-                    object_or_array.class
-                  end
-
-          Tramway::Decorators::NameBuilder.default_decorator_class_name(klass).constantize
+          begin
+            class_name = decorator_class_name(object_or_array)
+            class_name.constantize
+          rescue NameError
+            raise NameError, "You should define #{class_name} decorator class."
+          end
         end
       end
+
+      def decorator_class_name(object_or_array)
+        klass = if Tramway::Decorators::CollectionDecorators.collection?(object_or_array)
+                  object_or_array.first.class
+                else
+                  object_or_array.class
+                end
+
+        Tramway::Decorators::NameBuilder.default_decorator_class_name(klass)
+      end
     end
   end
 end

data/lib/tramway/helpers/component_helper.rb

@@ -0,0 +1,12 @@
+# frozen_string_literal: true
+
+module Tramway
+  module Helpers
+    # Provides a helper method `component` that allows to render components conveniently
+    module ComponentHelper
+      def component(name, *, **, &)
+        render("#{name}_component".classify.constantize.new(*, **), &)
+      end
+    end
+  end
+end

data/lib/tramway/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Tramway
-  VERSION = '0.4.9.3'
+  VERSION = '0.5'
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: tramway
 version: !ruby/object:Gem::Version
-  version: 0.4.9.3
+  version: '0.5'
 platform: ruby
 authors:
 - kalashnikovisme
@@ -9,8 +9,22 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-11-19 00:00:00.000000000 Z
+date: 2024-12-09 00:00:00.000000000 Z
 dependencies:
+- !ruby/object:Gem::Dependency
+  name: anyway_config
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - ">="
+      - !ruby/object:Gem::Version
+        version: '0'
 - !ruby/object:Gem::Dependency
   name: dry-initializer
   requirement: !ruby/object:Gem::Requirement
@@ -98,11 +112,14 @@ files:
 - README.md
 - Rakefile
 - app/assets/javascripts/tramway/multiselect_controller.js
+- app/assets/javascripts/tramway/table_row_preview_controller.js
 - app/components/tailwind_component.html.haml
 - app/components/tailwind_component.rb
 - app/components/tailwinds/form/builder.rb
 - app/components/tailwinds/form/file_field_component.html.haml
 - app/components/tailwinds/form/file_field_component.rb
+- app/components/tailwinds/form/label_component.html.haml
+- app/components/tailwinds/form/label_component.rb
 - app/components/tailwinds/form/multiselect/dropdown_container.html.haml
 - app/components/tailwinds/form/multiselect/dropdown_container.rb
 - app/components/tailwinds/form/multiselect/item_container.html.haml
@@ -125,6 +142,32 @@ files:
 - app/components/tailwinds/nav/item/link_component.rb
 - app/components/tailwinds/navbar_component.html.haml
 - app/components/tailwinds/navbar_component.rb
+- app/components/tailwinds/pagination/base.rb
+- app/components/tailwinds/pagination/first_page_component.html.haml
+- app/components/tailwinds/pagination/first_page_component.rb
+- app/components/tailwinds/pagination/gap_component.html.haml
+- app/components/tailwinds/pagination/gap_component.rb
+- app/components/tailwinds/pagination/last_page_component.html.haml
+- app/components/tailwinds/pagination/last_page_component.rb
+- app/components/tailwinds/pagination/next_page_component.html.haml
+- app/components/tailwinds/pagination/next_page_component.rb
+- app/components/tailwinds/pagination/page_component.html.haml
+- app/components/tailwinds/pagination/page_component.rb
+- app/components/tailwinds/pagination/prev_page_component.html.haml
+- app/components/tailwinds/pagination/prev_page_component.rb
+- app/components/tailwinds/table/cell_component.html.haml
+- app/components/tailwinds/table/cell_component.rb
+- app/components/tailwinds/table/header_component.html.haml
+- app/components/tailwinds/table/header_component.rb
+- app/components/tailwinds/table/row/preview_component.html.haml
+- app/components/tailwinds/table/row/preview_component.rb
+- app/components/tailwinds/table/row_component.html.haml
+- app/components/tailwinds/table/row_component.rb
+- app/components/tailwinds/table_component.html.haml
+- app/components/tailwinds/table_component.rb
+- app/components/tramway/component/base.rb
+- app/controllers/tramway/entities_controller.rb
+- app/helpers/tramway/application_helper.rb
 - app/views/kaminari/_first_page.html.haml
 - app/views/kaminari/_gap.html.haml
 - app/views/kaminari/_last_page.html.haml
@@ -132,6 +175,8 @@ files:
 - app/views/kaminari/_page.html.haml
 - app/views/kaminari/_paginator.html.haml
 - app/views/kaminari/_prev_page.html.haml
+- app/views/tramway/entities/_entity.html.haml
+- app/views/tramway/entities/index.html.haml
 - config/routes.rb
 - lib/rules/turbo_html_attributes_rules.rb
 - lib/tasks/tramway_tasks.rake
@@ -151,6 +196,7 @@ files:
 - lib/tramway/forms/class_helper.rb
 - lib/tramway/forms/normalizations.rb
 - lib/tramway/forms/properties.rb
+- lib/tramway/helpers/component_helper.rb
 - lib/tramway/helpers/decorate_helper.rb
 - lib/tramway/helpers/form_helper.rb
 - lib/tramway/helpers/navbar_helper.rb