tramway 3.1.2.8 → 4.0.1.1

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

@@ -6,6 +6,21 @@ module Tramway
     class HeaderComponent < Tramway::BaseComponent
       include ContentCells
 
+      SIZE_CLASSES = {
+        small: {
+          row: 'div-table-row grid grid-cols-1 gap-2 rounded-t-xl border-b border-zinc-800 bg-zinc-900 text-zinc-400',
+          cell: 'div-table-cell hidden px-4 py-2 first:block md:block'
+        },
+        medium: {
+          row: 'div-table-row grid grid-cols-1 gap-4 rounded-t-xl border-b border-zinc-800 bg-zinc-900 text-zinc-400',
+          cell: 'div-table-cell hidden px-6 py-4 first:block md:block'
+        },
+        large: {
+          row: 'div-table-row grid grid-cols-1 gap-6 rounded-t-xl border-b border-zinc-800 bg-zinc-900 text-zinc-400',
+          cell: 'div-table-cell hidden px-6 py-6 first:block md:block'
+        }
+      }.freeze
+
       option :headers, optional: true, default: -> { [] }
       option :columns, optional: true, default: -> { 3 }
       option :options, optional: true, default: -> { {} }
@@ -19,11 +34,17 @@ module Tramway
       end
 
       def header_row_classes
-        'div-table-row grid grid-cols-1 gap-4 rounded-t-xl border-b border-zinc-800 bg-zinc-900 text-zinc-400'
+        size_classes.fetch(:row)
       end
 
       def header_cell_classes
-        'div-table-cell hidden px-6 py-4 first:block md:block'
+        size_classes.fetch(:cell)
+      end
+
+      private
+
+      def size_classes
+        SIZE_CLASSES.fetch(tramway_table_size) { SIZE_CLASSES[:medium] }
       end
     end
   end

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

@@ -6,9 +6,20 @@ module Tramway
     class RowComponent < Tramway::BaseComponent
       include ContentCells
 
-      DESKTOP_ROW_CLASSES = %w[
-        div-table-row grid grid-cols-1 gap-4 border-b border-zinc-800 bg-zinc-950 last:border-b-0
-      ].freeze
+      SIZE_CLASSES = {
+        small: {
+          row: 'div-table-row grid grid-cols-1 gap-2 border-b border-zinc-800 bg-transparent last:border-b-0',
+          cell: 'div-table-cell bg-transparent px-4 py-2 text-sm font-medium text-zinc-100 sm:text-sm'
+        },
+        medium: {
+          row: 'div-table-row grid grid-cols-1 gap-4 border-b border-zinc-800 bg-transparent last:border-b-0',
+          cell: 'div-table-cell bg-transparent px-6 py-4 text-xs font-medium text-zinc-100 sm:text-base'
+        },
+        large: {
+          row: 'div-table-row grid grid-cols-1 gap-6 border-b border-zinc-800 bg-transparent last:border-b-0',
+          cell: 'div-table-cell bg-transparent px-6 py-6 text-lg font-medium text-zinc-100'
+        }
+      }.freeze
 
       option :cells, optional: true, default: -> { [] }
       option :href, optional: true
@@ -32,7 +43,7 @@ module Tramway
       end
 
       def desktop_row_classes(cells_count)
-        (DESKTOP_ROW_CLASSES + ["md:grid-cols-#{cells_count}"]).join(' ')
+        "#{size_classes.fetch(:row)} md:grid-cols-#{cells_count}"
       end
 
       def link_row_classes
@@ -40,25 +51,31 @@ module Tramway
       end
 
       def cell_classes
-        'div-table-cell px-6 py-4 text-xs font-medium text-zinc-100 sm:text-base'
+        size_classes.fetch(:cell)
       end
 
       def around_render
         ensure_view_context_accessor
-        previous_flag = view_context.tramway_inside_cell
-        view_context.tramway_inside_cell = href.present?
+        context = tramway_table_context
+        previous_flag = context.tramway_inside_cell
+        context.tramway_inside_cell = href.present?
 
         yield
       ensure
-        view_context.tramway_inside_cell = previous_flag
+        context.tramway_inside_cell = previous_flag if context.respond_to?(:tramway_inside_cell=)
       end
 
       private
 
       def ensure_view_context_accessor
-        return if view_context.respond_to?(:tramway_inside_cell=)
+        context = tramway_table_context
+        return if context.respond_to?(:tramway_inside_cell=)
 
-        view_context.singleton_class.attr_accessor :tramway_inside_cell
+        context.singleton_class.attr_accessor :tramway_inside_cell
+      end
+
+      def size_classes
+        SIZE_CLASSES.fetch(tramway_table_size) { SIZE_CLASSES[:medium] }
       end
     end
   end

data/app/components/tramway/table_component.rb

@@ -3,10 +3,37 @@
 module Tramway
   # Table component for rendering a table
   class TableComponent < Tramway::BaseComponent
+    TABLE_SIZES = %i[small medium large].freeze
+
+    option :size, default: -> { :medium }
     option :options, optional: true, default: -> { {} }
 
     def table_classes
-      'div-table w-full text-left rtl:text-right text-zinc-100'
+      'div-table w-full bg-zinc-950 text-left rtl:text-right text-zinc-100'
+    end
+
+    def around_render
+      ensure_view_context_accessor
+      context = tramway_table_context
+      previous_size = context.tramway_table_size
+      context.tramway_table_size = normalized_size
+
+      yield
+    ensure
+      context.tramway_table_size = previous_size if context.respond_to?(:tramway_table_size=)
+    end
+
+    private
+
+    def normalized_size
+      TABLE_SIZES.include?(size) ? size : :medium
+    end
+
+    def ensure_view_context_accessor
+      context = tramway_table_context
+      return if context.respond_to?(:tramway_table_size=)
+
+      context.singleton_class.attr_accessor :tramway_table_size
     end
   end
 end

data/app/controllers/tramway/entities_controller.rb

@@ -19,6 +19,7 @@ module Tramway
         model_class.order(id: :desc)
       end => entities
 
+      entities = preload(entities)
       entities = search(entities)
       entities = entities.page(params[:page])
       @entities = entities
@@ -28,7 +29,7 @@ module Tramway
 
     def show
       @record = tramway_decorate(
-        model_class.find(params[:id]),
+        model_class.find(params.expect(:id)),
         namespace: entity.namespace
       ).with(view_context:)
 
@@ -40,14 +41,14 @@ module Tramway
     end
 
     def edit
-      @record = tramway_form model_class.find(params[:id]), namespace: entity.namespace
+      @record = tramway_form model_class.find(params.expect(:id)), namespace: entity.namespace
     end
 
     # rubocop:disable Metrics/AbcSize
     def create
       @record = tramway_form model_class.new, namespace: entity.namespace
 
-      if @record.submit params[model_class.model_name.param_key]
+      if @record.submit params.require(model_class.model_name.param_key).permit!
         redirect_to Tramway::Engine.routes.url_helpers.public_send(entity.show_helper_method, @record.id),
                     notice: t('tramway.notices.created')
       else
@@ -56,9 +57,9 @@ module Tramway
     end
 
     def update
-      @record = tramway_form model_class.find(params[:id]), namespace: entity.namespace
+      @record = tramway_form model_class.find(params.expect(:id)), namespace: entity.namespace
 
-      if @record.submit params[model_class.model_name.param_key]
+      if @record.submit params.require(model_class.model_name.param_key).permit!
         redirect_to Tramway::Engine.routes.url_helpers.public_send(entity.show_helper_method, @record.id),
                     notice: t('tramway.notices.updated')
       else
@@ -68,7 +69,7 @@ module Tramway
     # rubocop:enable Metrics/AbcSize
 
     def destroy
-      @record = model_class.find(params[:id])
+      @record = model_class.find(params.expect(:id))
 
       @record.destroy
 
@@ -90,6 +91,12 @@ module Tramway
       entity.page(:index).scope
     end
 
+    def preload(entities)
+      includes = entity.page(:index).includes
+
+      includes.present? ? entities.includes(includes) : entities
+    end
+
     def set_associations
       @associations = @record.send(:__show_associations, params[:page])
     end

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

@@ -22,7 +22,8 @@
     - if @entity.page(:index).search
       = form_with url: public_send(custom_path_method), method: :get, local: true, builder: Tramway::Form::Builder, horizontal: true do |f|
         = f.text_field :query, label: false, value: params[:query], placeholder: t('tramway.actions.search')
-        = f.submit t('tramway.actions.search')
+        = f.submit nil, 'aria-label' => t('tramway.actions.search') do
+          %i.fa.fa-search{ 'aria-hidden' => 'true' }
 
     = paginate @entities, custom_path_method:
 

data/app/views/tramway/layouts/application.html.haml

@@ -14,6 +14,7 @@
     %link{rel: "apple-touch-icon", href: "/icon.png"}
 
     = stylesheet_link_tag "tailwind", "data-turbo-track": "reload"
+    = stylesheet_link_tag "font-awesome", "data-turbo-track": "reload"
     = stylesheet_link_tag "trix", "data-turbo-track": "reload"
     = javascript_include_tag "trix", "data-turbo-track": "reload", defer: true
     = javascript_importmap_tags
@@ -21,10 +22,11 @@
   %body.bg-zinc-950.text-zinc-50
     = tramway_navbar title: 'Tramway'
 
-    - if flash.any?
-      = tramway_flash text: flash[:notice].presence || flash[:alert],
-        type: flash[:notice].present? ? :will : :rage,
-        id: 'flash-container'
+    = tramway_main_container id: 'tramway-main-container', class: 'md:pl-72 transition-[padding-left] duration-300 ease-in-out-strong motion-reduce:duration-0' do
+      - if flash.any?
+        = tramway_flash text: flash[:notice].presence || flash[:alert],
+          type: flash[:notice].present? ? :will : :rage,
+          id: 'flash-container'
 
-    .container.mx-auto.p-4.flex.align-center.justify-center
-      = yield
+      .container.mx-auto.p-4.flex.align-center.justify-center
+        = yield

data/config/routes.rb

@@ -2,7 +2,7 @@
 
 require 'tramway/helpers/routes_helper'
 
-# rubocop:disable Metrics/BlockLength
+# rubocop:disable-next Metrics/BlockLength
 Tramway::Engine.routes.draw do
   Tramway.config.entities.each do |entity|
     if entity.namespace.present?
@@ -55,7 +55,6 @@ Tramway::Engine.routes.draw do
     end
   end
 end
-# rubocop:enable Metrics/BlockLength
 
 Tramway::Engine.routes.routes.map(&:name).compact.each do |route_name|
   %w[path url].each do |suffix|

data/config/tailwind.config.js

@@ -1,5 +1,8 @@
 const defaultTheme = require("tailwindcss/defaultTheme")
 
+const buildUtilities = (prefix, start, end) =>
+  Array.from({ length: end - start + 1 }, (_, index) => `${prefix}${start + index}`)
+
 module.exports = {
   safelist: [
     // === Navbar ===
@@ -13,17 +16,52 @@ module.exports = {
     'md:translate-x-0',
     'border-white',
     'h-screen',
+    'h-dvh',
     'w-screen',
+    'w-72',
     'z-50',
     'inset-0',
+    'top-0',
     'top-4',
     'right-6',
+    'right-0',
     'text-4xl',
     'transition-transform',
     '-translate-x-full',
     'duration-300',
     'space-y-3',
     'md:justify-between',
+    'hidden',
+    'md:fixed',
+    'md:left-0',
+    'md:top-0',
+    'md:z-40',
+    'md:h-dvh',
+    'md:w-72',
+    'md:w-24',
+    'md:flex-col',
+    'md:hidden',
+    'md:border-r',
+    'md:border-zinc-800',
+    'md:bg-zinc-950',
+    'md:px-4',
+    'md:py-3',
+    'md:shadow-sm',
+    'md:backdrop-blur',
+    'md:overflow-hidden',
+    'md:pl-72',
+    'md:pl-24',
+    'transition-all',
+    'ease-in-out',
+    'md:transition-[width]',
+    'transition-[padding-left]',
+    'ease-in-out-strong',
+    'md:ease-in-out-strong',
+    'ease-out-strong',
+    'md:motion-reduce:duration-0',
+    'motion-reduce:duration-0',
+    'duration-200',
+    'rotate-180',
     'pt-16',
     'min-h-8',
     'bg-zinc-950',
@@ -55,6 +93,7 @@ module.exports = {
     'shadow-lg',
     'shadow-sm',
     'w-fit',
+    'text-xs',
     'text-base',
     'text-sm',
     'text-lg',
@@ -64,11 +103,23 @@ module.exports = {
     'border-r',
     'border-t',
     'border',
+    'border-dotted',
+    'border-zinc-700/50',
+    'border-zinc-100/60',
+    'box-border',
     'gap-4',
+    'gap-6',
     'gap-1',
     'gap-2',
     'grid-cols-1',
     'grid',
+    'overflow-auto',
+    'inset-x-0',
+    'inset-y-0',
+    ...buildUtilities('md:grid-cols-', 1, 12),
+    ...buildUtilities('md:grid-rows-', 1, 12),
+    ...buildUtilities('md:col-span-', 1, 12),
+    ...buildUtilities('md:row-span-', 1, 12),
     'px-4',
     'px-3',
     'py-3',
@@ -79,6 +130,7 @@ module.exports = {
     'inset-0',
     'top-4',
     'right-4',
+    'z-10',
     'flex-col',
     'items-center',
     'justify-between',
@@ -173,6 +225,7 @@ module.exports = {
     'sm:px-3',
     'sm:py-2',
     'sm:text-sm',
+    'sm:text-base',
     'md:gap-1',
     'md:space-y-4',
     'space-y-2',
@@ -651,6 +704,10 @@ module.exports = {
       fontFamily: {
         sans: ["Inter var", ...defaultTheme.fontFamily.sans],
       },
+      transitionTimingFunction: {
+        "out-strong": "cubic-bezier(0.23, 1, 0.32, 1)",
+        "in-out-strong": "cubic-bezier(0.77, 0, 0.175, 1)",
+      },
       keyframes: {
         "accordion-down": {
           from: { height: 0 },

data/lib/generators/tramway/install/font_awesome_helpers.rb

@@ -0,0 +1,39 @@
+# frozen_string_literal: true
+
+module Tramway
+  module Generators
+    # nodoc
+    module InstallGeneratorFontAwesomeHelpers
+      private
+
+      def font_awesome_already_present?(content)
+        content.include?('stylesheet_link_tag "font-awesome"') ||
+          content.include?("stylesheet_link_tag 'font-awesome'")
+      end
+
+      def ensure_font_awesome_in_haml_layout
+        content = File.read(application_layout_haml_path)
+        return if font_awesome_already_present?(content)
+        return unless content.match?(/^\s+= stylesheet_link_tag "tailwind", "data-turbo-track": "reload"/)
+
+        updated = content.sub(
+          /^(\s+= stylesheet_link_tag "tailwind", "data-turbo-track": "reload"\n)/,
+          "\\1    = stylesheet_link_tag \"font-awesome\", \"data-turbo-track\": \"reload\"\n"
+        )
+        File.write(application_layout_haml_path, updated)
+      end
+
+      def ensure_font_awesome_in_erb_layout
+        content = File.read(application_layout_erb_path)
+        return if font_awesome_already_present?(content)
+        return unless content.include?('</head>')
+
+        updated = content.sub(
+          /(\s+<%= stylesheet_link_tag "tailwind", "data-turbo-track": "reload" %>\n)/,
+          "\\1    <%= stylesheet_link_tag \"font-awesome\", \"data-turbo-track\": \"reload\" %>\n"
+        )
+        File.write(application_layout_erb_path, updated)
+      end
+    end
+  end
+end