headmin 0.5.1 → 0.5.4

data/app/views/headmin/forms/_file.html.erb

@@ -45,16 +45,15 @@
               next unless attachment
               filename = attachment.blob.filename.to_s
               size = number_to_human_size(attachment.blob.byte_size)
-              src = attachment.image? ? url_for(attachment.variant(resize_to_fill: [file.thumbnail_width, file.thumbnail_height])) : url_for(attachment)
             %>
             <div class="h-form-file-thumbnail" title="<%= "#{filename} (#{size})" %>" data-file-preview-target="thumbnail">
-              <%= ff.hidden_field(:id, disabled: file.destroy) %>
-              <%= ff.hidden_field(:_destroy, data: {'file-preview-target': 'thumbnailDestroy'}, disabled: file.destroy) %>
-              <%= render "headmin/thumbnail", src: src, width: file.thumbnail_width, height: file.thumbnail_height %>
+              <%= ff.hidden_field(:id, disabled: !file.destroy) %>
+              <%= ff.hidden_field(:_destroy, data: {"file-preview-target": "thumbnailDestroy"}, disabled: !file.destroy) %>
+              <%= render "headmin/thumbnail", file: attachment %>
 
               <% if file.destroy %>
                 <div class="h-form-file-thumbnail-remove" data-action="click->file-preview#remove" data-file-preview-name-param="<%= filename %>">
-                  <%= bootstrap_icon('x') %>
+                  <%= bootstrap_icon("x") %>
                 </div>
               <% end %>
             </div>
@@ -62,12 +61,12 @@
 
           <!-- Placeholder -->
           <% if file.dropzone %>
-            <div class="h-dropzone-placeholder <%= 'd-none' if file.attachments.any? %>" data-file-preview-target="placeholder" style="height: <%= file.thumbnail_height %>px;">
-              <%= t('headmin.forms.file.placeholder', count: file.number_of_files) %>
+            <div class="h-dropzone-placeholder <%= "d-none" if file.attachments.any? %>" data-file-preview-target="placeholder" style="height: 100px;">
+              <%= t("headmin.forms.file.placeholder", count: file.number_of_files) %>
             </div>
           <% else %>
-            <div class="h-form-file-thumbnail <%= 'd-none' if file.attachments.any? %>" title="<%= t('headmin.forms.file.not_found') %>" data-file-preview-target="placeholder">
-              <%= render "headmin/thumbnail", width: file.thumbnail_width, height: file.thumbnail_height, icon: "plus" %>
+            <div class="h-form-file-thumbnail <%= "d-none" if file.attachments.any? %>" title="<%= t("headmin.forms.file.not_found") %>" data-file-preview-target="placeholder">
+              <%= render "headmin/thumbnail", icon: "plus" %>
             </div>
           <% end %>
         </div>
@@ -76,11 +75,11 @@
       <!-- Template -->
       <template data-file-preview-target="template">
         <div class="h-form-file-thumbnail" title="" data-file-preview-target="thumbnail">
-          <%= render "headmin/thumbnail", src: nil, width: file.thumbnail_width, height: file.thumbnail_height %>
+          <%= render "headmin/thumbnail" %>
 
           <% if file.destroy %>
             <div class="h-form-file-thumbnail-remove" data-action="click->file-preview#remove">
-              <%= bootstrap_icon('x') %>
+              <%= bootstrap_icon("x") %>
             </div>
           <% end %>
         </div>

data/app/views/headmin/forms/_hint.html.erb

@@ -13,4 +13,9 @@
   hint = Headmin::Form::HintView.new(local_assigns)
 %>
 
-<div class="form-text"><%= raw(hint.content) %></div>
+<div class="form-text d-flex justify-content-between">
+  <div><%= raw(hint.content) %></div>
+  <% if hint.maxlength %>
+    <div data-textarea-target="count"></div>
+  <% end %>
+</div>

data/app/views/headmin/forms/_media.html.erb

@@ -0,0 +1,60 @@
+<%
+  # headmin/forms/media
+  #
+  # ==== Required parameters
+  # * +attribute+ - Name of the attribute of the form model
+  # * +form+ - Form object
+  #
+  # ==== Optional parameters
+  # * +destroy+ - Adds delete buttons to the preview thumbnails
+  # * +hint+ - Informative text to assist with data input. HTML markup is allowed.
+  # * +label+ - Text to display inside label tag. Defaults to the attribute name. Set to false if you don"t want to show a label.
+  # * +min+ - Limit the selection to a minimum amount of items.
+  # * +max+ - Limit the selection to a maximum amount of items.
+  # * +sort+ - Allow sorting by dragging items. `active_storage_attachments` must have a position column.
+  # * +wrapper+ - Hash with all options for the surrounding html tag
+  # * +width+ - Width of the thumbnail
+  # * +height+ - Height of the thumbnail
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/media
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "headmin/forms/media", form: form, attribute: :file %#>
+  #   <% end %#>
+
+  media = Headmin::Form::MediaView.new(local_assigns)
+%>
+
+<%= render "headmin/forms/wrapper", media.wrapper_options do %>
+  <%= render "headmin/forms/label", media.label_options if media.prepend_label? %>
+  <div class="h-form-file-thumbnails" data-media-target="thumbnails">
+    <%= render "headmin/forms/media/validation", media.custom_validation_options %>
+
+    <!-- Render previews for attachments -->
+    <%= form.fields_for(media.nested_attribute, media.association_object) do |ff| %>
+      <%= render "headmin/forms/media/item", media.item_options.merge(form: ff, url: headmin_media_url(name: media.name, ids: media.blob_ids, min: media.min, max: media.max)) %>
+    <% end %>
+
+    <!-- Placeholder -->
+    <div class="<%= "d-none" if media.attachments.any? %>" data-media-target="placeholder">
+      <a href="<%= headmin_media_url(name: media.name, ids: media.blob_ids, min: media.min, max: media.max) %>" data-turbo-frame="remote_modal" data-media-target="modalButton">
+        <%= render "headmin/thumbnail", media.thumbnail_options %>
+      </a>
+    </div>
+  </div>
+
+  <!-- Template -->
+  <% association_object = ActiveStorage::Attachment.new %>
+  <template data-media-target="template" data-template-id-regex="<%= association_object.object_id %>">
+    <%= form.fields_for(media.nested_attribute, ActiveStorage::Attachment.new, child_index: association_object.object_id) do |ff| %>
+      <%= render "headmin/forms/media/item", media.item_options.merge(form: ff, url: headmin_media_url(name: media.name, ids: media.blob_ids, min: media.min, max: media.max)) %>
+    <% end %>
+  </template>
+
+  <%= render "headmin/forms/validation", media.validation_options if media.validate? %>
+  <%= render "headmin/forms/hint", media.hint_options if media.hint? %>
+  <%= render "headmin/forms/label", media.label_options if media.append_label? %>
+<% end %>

data/app/views/headmin/forms/_repeater.html.erb

@@ -2,12 +2,13 @@
   # headmin/forms/repeater
   #
   # ==== Options
-  # * +form</tt> -  Form object
-  # * +attribute</tt> - Name of the attribute of the form model
-  # * +header</tt> - Name of the template to use as header
+  # * +form+ -  Form object
+  # * +attribute+ - Name of the attribute of the form model
+  # * +header+ - Name of the template to use as header
   # * +label+ - Text to show as label. Label will be hidden if value is false
-  # * +templates</tt> - List of all views that can be used as a template for a new block
-  # * +flush</tt> - Set to true if you want the list items to sit flush with its parent.
+  # * +templates+ - List of all views that can be used as a template for a new block
+  # * +flush+ - Set to true if you want the list items to sit flush with its parent.
+  # * +row+ - Pass hash with options to pass to the row template.
   #
   # ==== Examples
   #   # Basic version
@@ -21,12 +22,12 @@
   #   <% end %#>
   #
   #   # With fixed header row. A header row can be used to show the labels, so you can omit them in the repeated fields
-  #   <% render "headmin/forms/repeater", form: form, attribute: :questions, header: 'admin/questions/header' do |question| %#>
+  #   <% render "headmin/forms/repeater", form: form, attribute: :questions, header: "admin/questions/header" do |question| %#>
   #     <% render "admin/questions/fields, form: :question" %#>
   #   <% end %#>
   #
   #   # Allow more than one type of fields to be inserted. You must specify the templates as an array of view paths
-  #   <% templates = ['admin/questions/fields/type_1', 'admin/questions/fields/type_2'] %#>
+  #   <% templates = ["admin/questions/fields/type_1", "admin/questions/fields/type_2"] %#>
   #   <% render "headmin/forms/repeater", form: form, attribute: :questions, templates: templates do |question| %#>
   #     <% render "admin/questions/fields, form: :question" %#>
   #   <% end %#>
@@ -36,13 +37,14 @@
   header = local_assigns.has_key?(:header) ? header : nil
   templates = local_assigns.has_key?(:templates) ? templates : []
   flush = local_assigns.has_key?(:flush) ? flush : true
+  row_options = local_assigns.has_key?(:row) ? row : {}
 
-  template_names = templates.map { |template| File.basename(template, '.html.erb') }
-  template_names = template_names.any? ? template_names : ['new']
+  template_names = templates.map { |template| File.basename(template, ".html.erb") }
+  template_names = template_names.any? ? template_names : ["new"]
   object_model = form.object.class
   association_model = object_model.reflect_on_association(attribute).class_name.constantize
   association_object = association_model.new
-  with_positions = association_object.attributes.keys.include?('position')
+  with_positions = association_object.attributes.keys.include?("position")
   associations = form.object.send(attribute)
   associations = with_positions ? associations.order(:position) : associations
   repeater_id = form.object_id
@@ -55,7 +57,7 @@
   <%= render "headmin/forms/label", form: form, attribute: attribute, text: label, required: required %>
 <% end %>
 
-<ul class="repeater list-group <%= 'list-group-flush' if flush %>" data-controller="repeater" data-repeater-target="list" data-repeater-id-value="<%= repeater_id %>">
+<ul class="repeater list-group <%= "list-group-flush" if flush %> mb-3" data-controller="repeater" data-repeater-target="list" data-repeater-id-value="<%= repeater_id %>">
 
   <!-- Header -->
   <% if header %>
@@ -66,7 +68,7 @@
 
   <!-- Rows -->
   <%= form.fields_for attribute, associations do |ff| %>
-    <%= render "headmin/forms/repeater/row", pass_thru: pass_thru, form: ff, repeater_id: repeater_id do %>
+    <%= render "headmin/forms/repeater/row", row_options.merge(pass_thru: pass_thru, form: ff, repeater_id: repeater_id) do %>
       <%= yield(ff) %>
     <% end %>
   <% end %>
@@ -76,7 +78,7 @@
 
     <!-- Empty notice -->
     <div class="text-secondary invisible" data-repeater-target="empty">
-      <%= t('.empty') %>
+      <%= t(".empty") %>
     </div>
 
     <!-- Button -->
@@ -88,8 +90,8 @@
        data-popup-pass-thru="<%= pass_thru %>"
        data-action="click->repeater#resetButtonIndices click->popup#open"
     >
-      <%= bootstrap_icon('plus') %>
-      <%= t('.add', name: association_model.model_name.human) %>
+      <%= bootstrap_icon("plus") %>
+      <%= t(".add", name: association_model.model_name.human) %>
     </div>
 
     <!-- Popup  -->
@@ -114,7 +116,7 @@
     <% template_names.each do |name| %>
       <template data-repeater-target="template" data-template-name="<%= name %>" data-template-id-regex="<%= association_object.object_id %>">
         <%= form.fields_for attribute, association_object, child_index: association_object.object_id do |ff| %>
-          <%= render "headmin/forms/repeater/row", form: ff, pass_thru: pass_thru, repeater_id: repeater_id do %>
+          <%= render "headmin/forms/repeater/row", row_options.merge(form: ff, pass_thru: pass_thru, repeater_id: repeater_id) do %>
             <% yield(ff, name) %>
           <% end %>
         <% end %>

data/app/views/headmin/forms/_textarea.html.erb

@@ -34,6 +34,6 @@
     <%= form.text_area(textarea.attribute, textarea.input_options) %>
   <% end %>
   <%= render "headmin/forms/validation", textarea.validation_options if textarea.validate? %>
-  <%= render "headmin/forms/hint", textarea.hint_options if textarea.hint? %>
+  <%= render "headmin/forms/hint", textarea.hint_options if textarea.hint? || textarea.maxlength? %>
   <%= render "headmin/forms/label", textarea.label_options if textarea.append_label? %>
 <% end %>

data/app/views/headmin/forms/_wrapper.html.erb

@@ -1,5 +1,4 @@
 <% wrapper = Headmin::Form::WrapperView.new(local_assigns) %>
-
 <% if wrapper.bypass %>
   <%= yield %>
 <% else %>

data/app/views/headmin/forms/fields/_list.html.erb

@@ -19,8 +19,10 @@
 %>
 
 <%= render "headmin/forms/fields/base", form: form, name: name, field_type: :list do |list, field_label| %>
-  <%= render "headmin/forms/repeater", form: list, attribute: :fields, label: show_label ? label || field_label : false, flush: false do |field| %>
-    <%= field.hidden_field :field_type, value: :group %>
-    <%= yield field %>
-  <% end %>
+  <div class="mb-3">
+    <%= render "headmin/forms/repeater", form: list, attribute: :fields, label: show_label ? label || field_label : false, flush: false do |field| %>
+      <%= field.hidden_field :field_type, value: :group %>
+      <%= yield field %>
+    <% end %>
+  </div>
 <% end %>

data/app/views/headmin/forms/media/_item.html.erb

@@ -0,0 +1,38 @@
+<%
+  # headmin/forms/media/item
+  #
+  # ==== Required parameters
+  # * +form+ - Form object
+  # * +url+ - URL for the media modal
+  #
+  # ==== Optional parameters
+  # * +sort+ - Allow sorting by dragging items. `active_storage_attachments` must have a position column.
+  # * +width+ - Width of the thumbnail
+  # * +height+ - Height of the thumbnail
+  #
+
+  media_item = Headmin::Form::MediaItemView.new(local_assigns)
+%>
+
+<div class="h-form-file-thumbnail media-drag-sort-handle" title="<%= "#{media_item.filename} (#{media_item.size})" %>" data-media-target="item">
+  <%= form.hidden_field(:id) %>
+  <%= form.hidden_field(:blob_id) %>
+  <%= form.hidden_field(:position, value: media_item.position_value) if media_item.sort %>
+  <%= form.hidden_field(:_destroy) %>
+
+  <a href="<%= media_item.url %>" data-turbo-frame="remote_modal" data-media-target="modalButton">
+    <%= render "headmin/thumbnail", media_item.thumbnail_options %>
+  </a>
+
+  <div class="h-form-file-thumbnail-actions">
+    <!-- Edit -->
+    <a href="<%= headmin_media_item_url(id: media_item.id) %>" class="h-form-file-thumbnail-edit" data-turbo-frame="remote_modal" data-media-target="editButton">
+      <%= bootstrap_icon("pencil") %>
+    </a>
+
+    <!-- Remove -->
+    <div class="h-form-file-thumbnail-remove" data-action="click->media#destroy">
+      <%= bootstrap_icon("x") %>
+    </div>
+  </div>
+</div>

data/app/views/headmin/forms/media/_validation.html.erb

@@ -0,0 +1,10 @@
+<!-- Custom validation field -->
+<%= form.text_field :"validation_#{attribute}",
+  name: nil,
+  value: nil,
+  class: "h-form-media-validation",
+  data: {
+    "media-target": "validationInput",
+    "min-message": t(".min", count: min),
+    "max-message": t(".max", count: max),
+  } %>

data/app/views/headmin/forms/repeater/_row.html.erb

@@ -7,9 +7,10 @@
 
   draggable = form.object.respond_to?(:position)
   destroyable = form.object.respond_to?(:destroy)
+  class_names = local_assigns.has_key?(:class) ? local_assigns[:class] : "repeater-row list-group-item"
 %>
 
-<div class="repeater-row list-group-item"
+<div class="<%= class_names %>"
      data-repeater-target="row"
      data-row-index="<%= form.options[:child_index] %>"
      data-new-record="<%= form.object.new_record? %>"
@@ -18,34 +19,35 @@
   <%= form.hidden_field :id %>
   <%= form.hidden_field :_destroy if destroyable %>
   <%= form.hidden_field :position if draggable %>
-  <%= yield %>
 
   <!--  Drag handle -->
   <% if draggable %>
     <div class="repeater-row-handle">
-      <%= bootstrap_icon('grip-vertical') %>
+      <%= bootstrap_icon("grip-vertical") %>
     </div>
   <% end %>
 
   <!--  Add button-->
   <div
-     class="repeater-row-add btn btn-link"
-     title="<%= t('.add') %>"
-     data-repeater-target="addButton"
-     data-popup-target="button"
-     data-popup-id="<%= "repeater-buttons-#{repeater_id}" %>"
-     data-popup-pass-thru="<%= pass_thru %>"
-     data-action="click->repeater#resetButtonIndices click->popup#open"
+    class="repeater-row-add btn btn-link"
+    title="<%= t(".add") %>"
+    data-repeater-target="addButton"
+    data-popup-target="button"
+    data-popup-id="<%= "repeater-buttons-#{repeater_id}" %>"
+    data-popup-pass-thru="<%= pass_thru %>"
+    data-action="click->repeater#resetButtonIndices click->popup#open"
   >
-    <%= bootstrap_icon('plus-circle') %>
+    <%= bootstrap_icon("plus-circle") %>
   </div>
 
   <!--  Remove button-->
   <div
-     class="repeater-row-remove btn btn-link"
-     title="<%= t('.remove') %>"
-     data-action="click->repeater#removeRow"
+    class="repeater-row-remove btn btn-link"
+    title="<%= t(".remove") %>"
+    data-action="click->repeater#removeRow"
   >
-    <%= bootstrap_icon('dash-circle') %>
+    <%= bootstrap_icon("dash-circle") %>
   </div>
+
+  <%= yield %>
 </div>

data/app/views/headmin/heading/_title.html.erb

@@ -13,11 +13,11 @@
 <div class="h-heading-title">
   <div class="d-flex align-items-center">
     <h1 class="me-2">
-      <%= title ? title : t('.new') %>
+      <%= title ? title : t(".new") %>
     </h1>
     <% if new_link %>
       <a href="<%= new_link %>" class="btn btn-outline-primary btn-sm">
-        <%= t('.new') %>
+        <%= t(".new") %>
       </a>
     <% end %>
   </div>

data/app/views/headmin/layout/_main.html.erb

@@ -10,6 +10,8 @@
   class_names = local_assigns.has_key?(:class) ? local_assigns[:class] : false
 %>
 
+<%= render "headmin/layout/remote_modal" %>
+
 <div class="main <%= class_names %>" data-controller="popup">
   <div class="container-fluid">
     <div class="row">

data/app/views/headmin/layout/_remote_modal.html.erb

@@ -0,0 +1 @@
+<%= turbo_frame_tag "remote_modal", target: "_top" %>

data/app/views/headmin/layout/_sidebar.html.erb

@@ -7,7 +7,7 @@
 
 <div class="sidebar col-sm-12 col-md-1 col-lg-2 bg-dark overflow-y d-print-none">
   <nav class="navbar navbar-expand-md navbar-dark bg-dark w-100 h-100 flex-md-column">
-    <a href="<%= local_assigns[:url] %>" class="nav-brand mb-lg-4 ms-lg-3 me-lg-auto">
+    <a href="<%= local_assigns[:url] %>" class="nav-brand mb-4 mt-3 me-lg-auto">
       <%= local_assigns[:logo] %>
     </a>
     <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#sidebar-nav" aria-controls="sidebar-nav" aria-expanded="false" aria-label="Toggle navigation">

data/app/views/headmin/media/_item.html.erb

@@ -0,0 +1,16 @@
+<div data-media-modal-target="item" title="<%= "#{blob.filename} (#{l(blob.created_at, format: :long)})" %>">
+  <!-- Input -->
+  <input
+    id="media-item-<%= blob.id %>"
+    type="checkbox"
+    value="<%= blob.id %>"
+    <%= "checked" if params[:ids]&.include?(blob.id.to_s) %>
+    data-action="change->media-modal#inputChange"
+    data-media-modal-target="idCheckbox"
+    hidden>
+
+  <!-- Label -->
+  <label for="media-item-<%= blob.id %>">
+    <%= render "headmin/thumbnail", file: blob %>
+  </label>
+</div>

data/app/views/headmin/media/_media_item_modal.html.erb

@@ -0,0 +1,51 @@
+<%= turbo_frame_tag "modal_content" do %>
+  <%= form_with url: headmin_media_item_url(id: @blob.id), model: @blob do |form| %>
+    <div class="modal-header">
+      <h5 class="modal-title"><%= t(".edit") %></h5>
+      <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="<%= t(".close") %>"></button>
+    </div>
+    <div class="modal-body">
+      <%= render "headmin/notifications" %>
+      <div class="row">
+        <div class="col-4">
+          <%= render "headmin/thumbnail", file: @blob %>
+        </div>
+        <div class="col-8 d-flex flex-column justify-content-center">
+          <p class="small text-secondary m-0">
+            <strong><%= t(".uploaded_at") %>:</strong>
+            <%= l(@blob.created_at, format: :long) %>
+          </p>
+          <p class="small text-secondary m-0">
+            <strong><%= t(".type") %>:</strong>
+            <%= @blob.content_type %>
+          </p>
+          <p class="small text-secondary m-0">
+            <strong><%= t(".dimensions") %>:</strong>
+            <% if @blob.metadata[:width] && @blob.metadata[:height] %>
+              <%= "#{@blob.metadata[:width]}px x #{@blob.metadata[:height]}px" %>
+            <% else %>
+              <%= t(".not_analysed") %>
+            <% end %>
+          </p>
+          <p class="small text-secondary m-0">
+            <strong><%= t(".size") %>:</strong>
+            <% if @blob.byte_size > 0 %>
+              <%= number_to_human_size(@blob.byte_size) %>
+            <% else %>
+              <%= t(".not_analysed") %>
+            <% end %>
+          </p>
+        </div>
+      </div>
+      <div class="row mt-3">
+        <div class="col-12">
+          <%= render "headmin/forms/text", form: form, attribute: :filename, append: "." + form.object.filename.to_s.rpartition(".").last, value: form.object.filename.to_s.rpartition(".").first %>
+        </div>
+      </div>
+    </div>
+    <div class="modal-footer">
+      <button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><%= t(".close") %></button>
+      <%= form.submit t(".update"), class: "btn btn-primary" %>
+    </div>
+  <% end %>
+<% end %>

data/app/views/headmin/media/_modal.html.erb

@@ -0,0 +1,35 @@
+<div class="media-modal modal fade" tabindex="-1" data-controller="remote-modal media-modal" data-name="<%= name %>" data-min="<%= min %>" data-max="<%= max %>">
+  <div class="modal-dialog modal-lg modal-dialog-scrollable">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title">
+          <%= t(".title", count: min.to_i < 1 ? 1 : min.to_i) %>
+        </h5>
+        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="<%= t(".close") %>"></button>
+      </div>
+      <div class="modal-body">
+        <%= turbo_frame_tag "thumbnails", class: "d-flex flex-wrap gap-2" do %>
+          <% @blobs.each do |blob| %>
+            <%= render "headmin/media/item", blob: blob %>
+          <% end %>
+          <div data-media-modal-target="placeholder" class="<%= "d-none" if !@blobs.empty? %>">
+            <p><%= t(".placeholder") %></p>
+          </div>
+        <% end %>
+      </div>
+      <div class="modal-footer">
+        <%= form_with url: headmin_media_path, multipart: true, data: {"media-modal-target": "form"}, class: "me-auto" do |form| %>
+          <%= form.label :files, class: "btn h-btn-outline-light" do %>
+            <%= bootstrap_icon("upload") %>
+            <%= t(".upload") %>
+            <%= form.file_field :files, class: "d-none", multiple: true, data: {action: "change->media-modal#submitForm"} %>
+          <% end %>
+        <% end %>
+        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><%= t(".close") %></button>
+        <button type="button" class="btn btn-primary" data-bs-dismiss="modal" data-action="click->media-modal#select" data-media-modal-target="selectButton">
+          <%= t(".select") %> (<span data-media-modal-target="count">0</span><%= t(".maximum", count: max.to_i) if max.present? %>)
+        </button>
+      </div>
+    </div>
+  </div>
+</div>

data/app/views/headmin/media/create.turbo_stream.erb

@@ -0,0 +1,5 @@
+<%= turbo_stream.prepend "thumbnails" do %>
+  <% @blobs.each do |blob| %>
+    <%= render "headmin/media/item", blob: blob %>
+  <% end %>
+<% end %>

data/app/views/headmin/media/index.html.erb

@@ -0,0 +1,3 @@
+<%= turbo_frame_tag "remote_modal" do %>
+  <%= render "headmin/media/modal", blobs: @blobs, name: params[:name], min: params[:min], max: params[:max] %>
+<% end %>

data/app/views/headmin/media/show.html.erb

@@ -0,0 +1,9 @@
+<%= turbo_frame_tag "remote_modal" do %>
+  <div class="media-item-modal modal fade" tabindex="-1" data-controller="remote-modal">
+    <div class="modal-dialog modal-md modal-dialog-scrollable">
+      <div class="modal-content">
+        <%= render "headmin/media/media_item_modal" %>
+      </div>
+    </div>
+  </div>
+<% end %>

data/app/views/headmin/media/update.turbo_stream.erb

@@ -0,0 +1,3 @@
+<%= turbo_stream.update "modal_content" do %>
+  <%= render "headmin/media/media_item_modal" %>
+<% end %>

data/app/views/headmin/nav/_dropdown.html.erb

@@ -9,12 +9,12 @@
   #
   # ==== Examples
   #   Basic version.
-  #   <%= render "headmin/nav/dropdown", name: 'My Account', url: admin_user_path, icon: 'person-circle' do  %#>
-  #     <%= render "headmin/nav/item", name: 'Edit info', url: edit_admin_user_path(current_user) %#>
-  #     <%= render "headmin/nav/item", name: 'Log out', url: destroy_user_session_path(current_user) %#>
+  #   <%= render "headmin/nav/dropdown", name: "My Account", url: admin_user_path, icon: "person-circle" do  %#>
+  #     <%= render "headmin/nav/item", name: "Edit info", url: edit_admin_user_path(current_user) %#>
+  #     <%= render "headmin/nav/item", name: "Log out", url: destroy_user_session_path(current_user) %#>
   #   <% end %#>
 
-  name = local_assigns.has_key?(:name) ? name : ''
+  name = local_assigns.has_key?(:name) ? name : ""
   icon = local_assigns.has_key?(:icon) ? icon : nil
   collapse_id = "nav-dropdown-#{name.parameterize}"
   url = local_assigns.has_key?(:url) ? url : request.url
@@ -22,13 +22,13 @@
 %>
 
 <li class="nav-item">
-  <a class="nav-link d-flex align-items-center dropdown-toggle <%= 'active' if active %>" href="#<%= collapse_id %>" role="button" data-bs-toggle="collapse" aria-expanded="<%= active.to_s %>" aria-controls="<%= collapse_id %>">
-    <%= bootstrap_icon(icon, class: 'me-2') if icon %>
+  <a class="nav-link d-flex align-items-center dropdown-toggle <%= "active" if active %>" href="#<%= collapse_id %>" role="button" data-bs-toggle="collapse" aria-expanded="<%= active.to_s %>" aria-controls="<%= collapse_id %>">
+    <%= bootstrap_icon(icon, class: "me-2") if icon %>
     <span class="d-block d-md-none d-lg-block">
       <%= name %>
     </span>
   </a>
-  <ul class="collapse <%= 'show' if active %>" id="<%= collapse_id %>">
+  <ul class="collapse <%= "show" if active %>" id="<%= collapse_id %>">
     <%= yield %>
   </ul>
 </li>

data/app/views/headmin/nav/_item.html.erb

@@ -9,20 +9,20 @@
   #
   # ==== Examples
   #   Basic version.
-  #   <%= render "headmin/nav/item", name: 'Dashboard', url: admin_root_path %#>
+  #   <%= render "headmin/nav/item", name: "Dashboard", url: admin_root_path %#>
   #
   #   With icon
-  #   <%= render "headmin/nav/item", name: 'Dashboard', url: admin_root_path, icon: 'speedometer' %#>
+  #   <%= render "headmin/nav/item", name: "Dashboard", url: admin_root_path, icon: "speedometer" %#>
 
-  name = local_assigns.has_key?(:name) ? name : ''
+  name = local_assigns.has_key?(:name) ? name : ""
   icon = local_assigns.has_key?(:icon) ? icon : nil
   url = local_assigns.has_key?(:url) ? url : request.url
   active = local_assigns.has_key?(:active) ? active : current_url?(url)
 %>
 
 <li class="nav-item">
-  <a class="nav-link d-flex align-items-center <%= 'active' if active %>" aria-current="page" href="<%= url %>">
-    <%= bootstrap_icon(icon, class: 'me-2') if icon %>
+  <a class="nav-link d-flex align-items-center <%= "active" if active %>" aria-current="page" href="<%= url %>">
+    <%= bootstrap_icon(icon, class: "me-2") if icon %>
     <span class="d-block d-md-none d-lg-block">
       <%= name %>
     </span>

data/app/views/headmin/nav/item/_locale.html.erb

@@ -4,14 +4,14 @@
     parameters: none
 %>
 
-<%= render "headmin/dropdown", class: 'nav-item' do %>
-  <%= render "headmin/dropdown/button", class: 'nav-link', id: 'nav-item-locale' do %>
-    <%= bootstrap_icon('globe', class: 'me-2') %>
-    <%= t('language_name', locale: ::I18n.locale) %>
+<%= render "headmin/dropdown", class: "nav-item" do %>
+  <%= render "headmin/dropdown/button", class: "nav-link", id: "nav-item-locale" do %>
+    <%= bootstrap_icon("globe", class: "me-2") %>
+    <%= t("language_name", locale: ::I18n.locale) %>
   <% end %>
-  <%= render "headmin/dropdown/list", id: 'nav-item-locale' do %>
+  <%= render "headmin/dropdown/list", id: "nav-item-locale" do %>
     <% I18n.available_locales.each do |locale| %>
-      <%= render "headmin/dropdown/item", name: t('language_name', locale: locale), url: url_for({locale: locale.to_s}) %>
+      <%= render "headmin/dropdown/item", name: t("language_name", locale: locale), url: url_for({locale: locale.to_s}) %>
     <% end %>
   <% end %>
 <% end %>