madmin 1.0.2 → 1.2.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 19d2f645bfcae060a5a925b945892a2a196790a2d6c3b296ec0fe5118aeaf186
-  data.tar.gz: 4310e5b0fb00744f6098032799d6df7368890b736382a9bad466d328662f4da4
+  metadata.gz: '05151328dcf6fdd8c23755a1b1f3f14b9dcceadc8215e6f102e133d915e95be6'
+  data.tar.gz: 305bf51253018fa0c871d0314e9ecd69339c510160cdacf1439c2fd361a95a97
 SHA512:
-  metadata.gz: c4d157858da05695020064ef9aa636079298cdc7bb1937bc3a4cb13faf71087d31ac0df3d1f3027414112aae61e97f9bfd099a1cf8bbf6bf8380532e654fe844
-  data.tar.gz: 2969bdf7c7e419290cff1db31f1d22befdb2eb7b0591cc60a00a328dd7e024991825547cae8404a98abdfd309c3308bc7c46332bf154fd6765f48372785baddd
+  metadata.gz: 625d77d1c5ee5bd30462c2609a8b53b7c5d321fb97e0951a95b852eca019189d468c596fcda77e170ed996bd25707feea787a3668faf318a542a65f03d75e488
+  data.tar.gz: b594b3c324289e44dbdeb3f0acc70a532b391f8c46faa4854ea5654e9dfe648c88062e24c29433bb476165134a0d79fdbbca526000bbf6c148e9c2c28777f0ed

data/README.md

@@ -7,9 +7,12 @@
 Why another Ruby on Rails admin? We wanted an admin that was:
 
 * Familiar and customizable like Rails scaffolds (less DSL)
-* Supports all the Rails features out of the box (ActionText, ActionMailbox, etc)
+* Supports all the Rails features out of the box (ActionText, ActionMailbox, has_secure_password, etc)
 * Stimulus / Turbolinks / Hotwire ready
 
+![Madmin Screenshot](docs/images/screenshot.png)
+_We're still working on the design!_
+
 ## Installation
 Add `madmin` to your application's Gemfile:
 
@@ -76,6 +79,31 @@ rails generate madmin:views:index Book
  # -> app/views/madmin/books/index.html.erb
 ```
 
+## Custom Fields
+
+You can generate a custom field with:
+
+```bash
+rails g madmin:field Custom
+```
+
+This will create a `CustomField` class in `app/madmin/fields/custom_field.rb`
+And the related views:
+
+```bash
+# -> app/views/madmin/fields/custom_field/_form.html.erb
+# -> app/views/madmin/fields/custom_field/_index.html.erb
+# -> app/views/madmin/fields/custom_field/_show.html.erb
+```
+
+You can then use this field on our resource:
+
+```ruby
+class PostResource < Madmin::Resource
+  attribute :title, field: CustomField
+end
+```
+
 ## Authentication
 
 You can use a couple of strategies to authenticate users who are trying to

data/app/controllers/madmin/base_controller.rb

@@ -3,10 +3,5 @@ module Madmin
     include Pagy::Backend
 
     protect_from_forgery with: :exception
-
-    # Loads all the models for the sidebar
-    before_action do
-      Rails.application.eager_load!
-    end
   end
 end

data/app/controllers/madmin/resource_controller.rb

@@ -1,9 +1,24 @@
 module Madmin
   class ResourceController < ApplicationController
+    include SortHelper
+
     before_action :set_record, except: [:index, :new, :create]
 
+    # Assign current_user for paper_trail gem
+    before_action :set_paper_trail_whodunnit, if: -> { respond_to?(:set_paper_trail_whodunnit, true) }
+
     def index
       @pagy, @records = pagy(scoped_resources)
+
+      respond_to do |format|
+        format.html
+        format.json {
+          render json: @records.map { |r| {name: @resource.display_name(r), id: r.id} }
+        }
+      end
+    rescue Pagy::OverflowError
+      params[:page] = 1
+      retry
     end
 
     def show
@@ -41,7 +56,7 @@ module Madmin
     private
 
     def set_record
-      @record = resource.model.find(params[:id])
+      @record = resource.model_find(params[:id])
     end
 
     def resource
@@ -54,7 +69,9 @@ module Madmin
     end
 
     def scoped_resources
-      resource.model.send(valid_scope)
+      resources = resource.model.send(valid_scope)
+      resources = Madmin::Search.new(resources, resource, search_term).run
+      resources.reorder(sort_column => sort_direction)
     end
 
     def valid_scope
@@ -77,5 +94,9 @@ module Madmin
         raise "Unrecognised param data: #{data.inspect}"
       end
     end
+
+    def search_term
+      @search_term ||= params[:q].to_s.strip
+    end
   end
 end

data/app/helpers/madmin/application_helper.rb

@@ -13,5 +13,9 @@ module Madmin
       version += "-#{Rails::VERSION::PRE}" if Rails::VERSION::PRE
       version
     end
+
+    def clear_search_params
+      params.except(:q, :_page).permit(:page, :sort, :direction)
+    end
   end
 end

data/app/helpers/madmin/nav_helper.rb

@@ -0,0 +1,30 @@
+module Madmin::NavHelper
+  def nav_link_to(name = nil, options = {}, html_options = {}, &block)
+    if block
+      html_options = options
+      options = name
+      name = block
+    end
+
+    url = url_for(options)
+    starts_with = html_options.delete(:starts_with)
+    html_options[:class] = Array.wrap(html_options[:class])
+    active_class = html_options.delete(:active_class) || "active"
+    inactive_class = html_options.delete(:inactive_class) || ""
+
+    active = if (paths = Array.wrap(starts_with)) && paths.present?
+      paths.any? { |path| request.path.start_with?(path) }
+    else
+      request.path == url
+    end
+
+    classes = active ? active_class : inactive_class
+    html_options[:class] << classes unless classes.empty?
+
+    html_options.except!(:class) if html_options[:class].empty?
+
+    return link_to url, html_options, &block if block
+
+    link_to name, url, html_options
+  end
+end

data/app/helpers/madmin/sort_helper.rb

@@ -0,0 +1,32 @@
+module Madmin
+  module SortHelper
+    def sortable(column, title, options = {})
+      matching_column = (column.to_s == sort_column)
+      direction = sort_direction == "asc" ? "desc" : "asc"
+
+      link_to request.params.merge(sort: column, direction: direction), options do
+        concat title
+        if matching_column
+          concat " "
+          concat tag.i(sort_direction == "asc" ? "▲" : "▼")
+        end
+      end
+    end
+
+    def sort_column
+      resource.sortable_columns.include?(params[:sort]) ? params[:sort] : default_sort_column
+    end
+
+    def sort_direction
+      ["asc", "desc"].include?(params[:direction]) ? params[:direction] : default_sort_direction
+    end
+
+    def default_sort_column
+      resource.try(:default_sort_column) || (["created_at", "id", "uuid"] & resource.model.column_names).first
+    end
+
+    def default_sort_direction
+      resource.try(:default_sort_direction) || "desc"
+    end
+  end
+end

data/app/views/layouts/madmin/application.html.erb

@@ -7,19 +7,19 @@
     <title>
       Madmin: <%= Rails.application.class %>
     </title>
-    <link href="https://unpkg.com/tailwindcss@^2.0/dist/tailwind.min.css" rel="stylesheet" />
     <link href="https://unpkg.com/@tailwindcss/forms/dist/forms.min.css" rel="stylesheet" />
+    <link href="https://unpkg.com/tailwindcss@^2.0/dist/tailwind.min.css" rel="stylesheet" />
     <link href="https://unpkg.com/@tailwindcss/typography/dist/typography.min.css" rel="stylesheet" />
     <%= csrf_meta_tags %>
 
     <%= render "javascript" %>
   </head>
-  <body class="prose" style="max-width:none">
-    <div class="flex w-full p-4">
-      <div id="sidebar" class="w-64 flex-shrink-0">
+  <body class="min-h-screen">
+    <div class="md:flex w-full min-h-screen">
+      <div id="sidebar" class="md:w-64 p-4 flex-shrink-0 border-r">
         <%= render "navigation" -%>
       </div>
-      <main class="w-full" role="main">
+      <main class="flex-grow p-4 overflow-x-scroll" role="main">
         <%#= render "flashes" -%>
         <%= yield %>
       </main>

data/app/views/madmin/application/_form.html.erb

@@ -9,15 +9,13 @@
     </div>
   <% end %>
 
-  <% resource.attributes.each do |attribute| %>
-    <% next if attribute[:field].nil? %>
-    <% next unless attribute[:field].visible?(action_name) %>
-    <% next unless attribute[:field].visible?(:form) %>
+  <% resource.attributes.values.each do |attribute| %>
+    <% next if attribute.field.nil? %>
+    <% next unless attribute.field.visible?(action_name) %>
+    <% next unless attribute.field.visible?(:form) %>
 
-    <% field = attribute[:field] %>
-
-    <div class="mb-4 flex">
-      <%= render partial: field.to_partial_path("form"), locals: { field: field, record: record, form: form, resource: resource } %>
+    <div class="mb-4 md:flex">
+      <%= render partial: attribute.field.to_partial_path("form"), locals: { field: attribute.field, record: record, form: form, resource: resource } %>
     </div>
   <% end %>
 

data/app/views/madmin/application/_javascript.html.erb

@@ -1,16 +1,18 @@
 <%= stylesheet_link_tag "https://unpkg.com/flatpickr/dist/flatpickr.min.css", "data-turbo-track": "reload" %>
 <%= stylesheet_link_tag "https://unpkg.com/trix/dist/trix.css", "data-turbo-track": "reload" %>
-<%= stylesheet_link_tag "https://unpkg.com/slim-select@1.27.0/dist/slimselect.min.css", "data-turbo-track": "reload" %>
+<%= stylesheet_link_tag "https://unpkg.com/tom-select/dist/css/tom-select.min.css", "data-turbo-track": "reload" %>
 
 <script type="module">
-  import { Application } from 'https://cdn.skypack.dev/stimulus'
+  import { Application, Controller } from 'https://cdn.skypack.dev/stimulus'
   const application = Application.start()
 
+  import { Dropdown } from "https://cdn.skypack.dev/tailwindcss-stimulus-components"
+  application.register("dropdown", Dropdown)
+
   import stimulusFlatpickr from 'https://cdn.skypack.dev/stimulus-flatpickr'
   application.register("flatpickr", stimulusFlatpickr)
 
-  import stimulusSlimselect from 'https://cdn.skypack.dev/stimulus-slimselect'
-  application.register("slimselect", stimulusSlimselect)
+  import TomSelect from 'https://cdn.skypack.dev/tom-select'
 
   import Rails from 'https://cdn.skypack.dev/@rails/ujs@<%= npm_rails_version %>'
   import * as ActiveStorage from 'https://cdn.skypack.dev/@rails/activestorage@<%= npm_rails_version %>'
@@ -21,4 +23,68 @@
   ActiveStorage.start()
 
   import * as Turbo from "https://cdn.skypack.dev/@hotwired/turbo"
+
+  (() => {
+    application.register('select', class extends Controller {
+      static values = {
+        options: Object,
+        url: String
+      }
+
+      connect() {
+        this.select = new TomSelect(this.element, {
+          plugins: ['remove_button'],
+          valueField: 'id',
+          labelField: 'name',
+          searchField: 'name',
+          load: (search, callback) => {
+            fetch(this.urlValue)
+              .then(response => response.json())
+              .then(json => {
+                callback(json);
+              }).catch(() => {
+                callback();
+              });
+          }
+        })
+      }
+
+      disconnect() {
+        this.select.destroy()
+      }
+    })
+
+    application.register('nested-form', class extends Controller {
+      static get targets() {
+        return [ "links", "template" ]
+      }
+
+      connect() {
+        this.wrapperClass = this.data.get("wrapperClass") || "nested-fields"
+      }
+
+      add_association(event) {
+        event.preventDefault()
+
+        var content = this.templateTarget.innerHTML.replace(/NEW_RECORD/g, new Date().getTime())
+        this.linksTarget.insertAdjacentHTML('beforebegin', content)
+      }
+
+      remove_association(event) {
+        event.preventDefault()
+
+        let wrapper = event.target.closest("." + this.wrapperClass)
+
+        // New records are simply removed from the page
+        if (wrapper.dataset.newRecord == "true") {
+          wrapper.remove()
+
+        // Existing records are hidden and flagged for deletion
+        } else {
+          wrapper.querySelector("input[name*='_destroy']").value = 1
+          wrapper.style.display = 'none'
+        }
+      }
+    })
+  })()
 </script>

data/app/views/madmin/application/_navigation.html.erb

@@ -1,6 +1,32 @@
-<div class="text-sm">
-  <%= link_to "← Back to App", main_app.root_url, class: "block p-1", data: { turbo: false } if main_app.respond_to?(:root_url) %>
-  <% Madmin.resources.each do |resource| %>
-    <%= link_to resource.friendly_name.pluralize, resource.index_path, class: "block p-1" %>
-  <% end %>
+<div class="flex flex-col h-full text-sm" data-controller="dropdown">
+  <div class="flex md:block justify-between items-center">
+    <div class="flex md:block items-center">
+      <h1 class="mr-2 md:p-2 text-xl font-semibold">Madmin</h1>
+      <% if main_app.respond_to?(:root_url) %>
+        <%= link_to main_app.root_url, class: "block p-2 rounded hover:bg-gray-200", data: { turbo: false } do %>
+          ← Back <span class="hidden md:inline">to App</span>
+        <% end %>
+      <% end %>
+    </div>
+
+    <div class="-mr-2 flex items-center md:hidden">
+      <button data-action="click->dropdown#toggle touch->dropdown#toggle click@window->dropdown#hide touch@window#dropdown->hide" type="button" class="bg-white rounded-md p-2 inline-flex items-center justify-center text-gray-400 hover:bg-gray-200 focus:outline-none focus:ring-2 focus-ring-inset focus:ring-white" id="main-menu" aria-haspopup="true">
+        <span class="sr-only">Open main menu</span>
+        <!-- Heroicon name: outline/menu -->
+        <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path>
+        </svg>
+      </button>
+    </div>
+  </div>
+
+  <div class="hidden md:flex flex-col flex-grow justify-between" data-dropdown-target="menu">
+    <% Madmin.resources.each do |resource| %>
+      <%= nav_link_to resource.friendly_name.pluralize, resource.index_path, class: "block p-2 rounded hover:bg-gray-100", starts_with: resource.index_path, active_class: "font-bold text-black" %>
+    <% end %>
+
+    <div class="mt-auto">
+      <%= link_to "View Madmin on GitHub", "https://github.com/excid3/madmin", target: :_blank, class: "block p-2 rounded text-gray-500 hover:bg-gray-100" %>
+    </div>
+  </div>
 </div>

data/app/views/madmin/application/edit.html.erb

@@ -1,3 +1,7 @@
-<h1><%= link_to resource.friendly_name.pluralize, resource.index_path %> / Edit <%= resource.friendly_name %> #<%= @record.id %></h1>
+<h1 class="text-xl mb-4">
+  <%= link_to resource.friendly_name.pluralize, resource.index_path, class: "text-indigo-500" %>
+  /
+  <strong>Edit <%= link_to resource.display_name(@record), resource.show_path(@record), class: "text-indigo-500" %></strong>
+</h1>
 
 <%= render partial: "form", locals: { record: @record, resource: resource } %>

data/app/views/madmin/application/index.html.erb

@@ -1,44 +1,56 @@
-<div class="flex justify-between">
-  <h1><%= resource.friendly_name.pluralize %></h1>
-  <%= link_to "New #{resource.friendly_name}", resource.new_path %>
+<div class="md:flex justify-between items-center space-y-4 md:space-y-0">
+  <h1 class="text-xl font-semibold"><%= resource.friendly_name.pluralize %></h1>
+
+  <div class="flex-grow flex md:justify-end gap-4">
+    <form class="flex items-center gap-2 relative">
+      <%= hidden_field_tag :page, params[:page], value: 1, class: "hidden" %>
+      <%= search_field_tag :q, params[:q], placeholder: "Search", class: "rounded-full px-4 focus:bg-white focus:border-indigo-500" %>
+      <%= link_to clear_search_params, class: "absolute top-1/2 right-3 text-gray-500 bg-white transform -translate-y-1/2" do %>
+        <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
+          <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd" />
+        </svg>
+      <% end %>
+    </form>
+
+    <%= link_to resource.new_path, class: "bg-white hover:bg-gray-100 text-gray-800 font-semibold py-2 px-4 border border-gray-400 rounded shadow" do %>
+      New <span class="hidden md:inline"><%= resource.friendly_name %></span>
+    <% end %>
+  </div>
 </div>
 
-<div>
+<div class="mb-4">
   <% if resource.scopes.any? %>
-    <%= link_to "All", resource.index_path %>
+    <%= link_to "All", resource.index_path, class: class_names("p-2 rounded", {"bg-gray-100" =>  params[:scope].blank?}) %>
   <% end %>
 
   <% resource.scopes.each do |scope| %>
-    <%= link_to scope.to_s.humanize, resource.index_path(scope: scope) %>
+    <%= link_to scope.to_s.humanize, resource.index_path(scope: scope), class: class_names("p-2 rounded", {"bg-gray-100" => params[:scope] == scope.to_s}) %>
   <% end %>
 </div>
 
-<table class="table-auto">
+<table class="min-w-full divide-y divide-gray-200">
   <thead>
-    <tr>
-      <% resource.attributes.each do |attribute| %>
-        <% next if attribute[:field].nil? %>
-        <% next unless attribute[:field].visible?(action_name) %>
+    <tr class="border-b border-gray-200">
+      <% resource.attributes.values.each do |attribute| %>
+        <% next if attribute.field.nil? %>
+        <% next unless attribute.field.visible?(action_name) %>
 
-        <th><%= attribute[:name].to_s.titleize %></th>
+        <th class="py-2 px-4 text-left text-xs text-gray-500 font-medium uppercase whitespace-nowrap"><%= sortable attribute.name, attribute.name.to_s.titleize %></th>
       <% end %>
-      <th>Actions</th>
+      <th class="py-2 px-4 text-left text-xs text-gray-500 font-medium uppercase">Actions</th>
     </tr>
   </thead>
 
-  <tbody>
+  <tbody class="text-sm divide-y">
     <% @records.each do |record| %>
       <tr>
-        <% resource.attributes.each do |attribute| %>
-          <% next if attribute[:field].nil? %>
-          <% next unless attribute[:field].visible?(action_name) %>
-
-          <% field = attribute[:field] %>
-
-          <td><%= render partial: field.to_partial_path("index"), locals: { field: field, record: record } %></td>
+        <% resource.attributes.values.each do |attribute| %>
+          <% next if attribute.field.nil? %>
+          <% next unless attribute.field.visible?(action_name) %>
+          <td class="px-4 py-2"><%= render partial: attribute.field.to_partial_path("index"), locals: { field: attribute.field, record: record } %></td>
         <% end %>
 
-        <td><%= link_to "View", resource.show_path(record) %></td>
+        <td class="px-4 py-2 text-center"><%= link_to "View", resource.show_path(record), class: "text-indigo-500" %></td>
       </tr>
     <% end %>
   </tbody>

data/app/views/madmin/application/new.html.erb

@@ -1,3 +1,7 @@
-<h1><%= link_to resource.friendly_name.pluralize, resource.index_path %> / New <%= resource.friendly_name %></h1>
+<h1 class="text-xl mb-4">
+  <%= link_to resource.friendly_name.pluralize, resource.index_path, class: "text-indigo-500" %>
+  /
+  <strong>New <%= resource.friendly_name %></strong>
+</h1>
 
 <%= render partial: "form", locals: { record: @record, resource: resource } %>

data/app/views/madmin/application/show.html.erb

@@ -1,24 +1,31 @@
-<div class="flex justify-between">
-  <h1><%= link_to resource.friendly_name.pluralize, resource.index_path %> / <%= resource.model.name.singularize %> #<%= @record.id %></h1>
+<div class="md:flex items-center justify-between mb-4">
+  <h1 class="text-xl">
+    <%= link_to resource.friendly_name.pluralize, resource.index_path, class: "text-indigo-500" %>
+    /
+    <%= link_to resource.display_name(@record), resource.show_path(@record), class: "text-indigo-500 font-bold" %>
+  </h1>
 
-  <div class="flex px-4">
-    <%= link_to "Edit", resource.edit_path(@record), class: "mr-2" %>
-    <%= button_to "Delete", resource.show_path(@record), method: :delete, data: { confirm: "Are you sure?" }, class: "inline-block" %>
+  <div class="flex items-center px-4">
+    <div class="mr-2">
+      <%= link_to "Edit", resource.edit_path(@record), class: "block bg-white hover:bg-gray-100 text-gray-800 font-semibold py-2 px-4 border border-gray-400 rounded shadow" %>
+    </div>
+    <%= button_to "Delete", resource.show_path(@record), method: :delete, data: { confirm: "Are you sure?" }, class: "bg-white hover:bg-gray-100 text-red-500 font-semibold py-2 px-4 border border-red-500 rounded shadow pointer-cursor" %>
   </div>
 </div>
 
-<% resource.attributes.each do |attribute| %>
-  <% next if attribute[:field].nil? %>
-  <% next unless attribute[:field].visible?(action_name) %>
-  <% field = attribute[:field] %>
+<div class="divide-y">
+  <% resource.attributes.values.each do |attribute| %>
+    <% next if attribute.field.nil? %>
+    <% next unless attribute.field.visible?(action_name) %>
 
-  <div class="flex py-2">
-    <div class="w-32 flex-shrink-0 text-gray-700 uppercase tracking-wide text-sm">
-      <%= field.attribute_name.to_s.titleize %>
-    </div>
+    <div class="px-4 py-3 md:grid md:grid-cols-4 md:gap-4 md:px-6">
+      <div class="text-sm font-medium text-gray-500">
+        <%= attribute.field.attribute_name.to_s.titleize %>
+      </div>
 
-    <div>
-      <%= render partial: field.to_partial_path("show"), locals: { field: field, record: @record } %>
+      <div class="md:col-span-3">
+        <%= render partial: attribute.field.to_partial_path("show"), locals: { field: attribute.field, record: @record } %>
+      </div>
     </div>
-  </div>
-<% end %>
+  <% end %>
+</div>

data/app/views/madmin/fields/attachment/_form.html.erb

@@ -1,2 +1,4 @@
-<%= form.label field.attribute_name, class: "inline-block w-32 flex-shrink-0" %>
+<div class="block md:inline-block md:w-32 flex-shrink-0 text-gray-700">
+  <%= render "madmin/shared/label", form: form, field: field %>
+</div>
 <%= form.file_field field.to_param %>

data/app/views/madmin/fields/attachment/_show.html.erb

@@ -1,3 +1,9 @@
 <% if (attachment = field.value(record)) && attachment.attached? %>
-  <%= link_to attachment.filename, attachment, target: :_blank %>
+  <% if attachment.variable? %>
+    <%= link_to attachment, target: :_blank do %>
+      <%= image_tag attachment, class: "max-h-32" %>
+    <% end %>
+  <% else %>
+    <%= link_to attachment.filename, attachment, target: :_blank, class: "text-indigo-500 underline" %>
+  <% end %>
 <% end %>

data/app/views/madmin/fields/attachments/_form.html.erb

@@ -1,2 +1,4 @@
-<%= form.label field.attribute_name, class: "inline-block w-32 flex-shrink-0" %>
+<div class="block md:inline-block md:w-32 flex-shrink-0 text-gray-700">
+  <%= render "madmin/shared/label", form: form, field: field %>
+</div>
 <%= form.file_field field.attribute_name, multiple: true %>

data/app/views/madmin/fields/attachments/_show.html.erb

@@ -1,7 +1,11 @@
 <% if (attachments = field.value(record)) && attachments.attached? %>
   <% attachments.each do |attachment| %>
-    <div>
-      <%= link_to attachment.filename, attachment, target: :_blank %>
-    </div>
+    <% if attachment.variable? %>
+      <%= link_to attachment, target: :_blank do %>
+        <%= image_tag attachment, class: "max-h-32" %>
+      <% end %>
+    <% else %>
+      <%= link_to attachment.filename, attachment, target: :_blank, class: "text-indigo-500 underline" %>
+    <% end %>
   <% end %>
 <% end %>

data/app/views/madmin/fields/belongs_to/_form.html.erb

@@ -1,2 +1,4 @@
-<%= form.label field.attribute_name, class: "inline-block w-32 flex-shrink-0" %>
-<%= form.select field.to_param, field.options_for_select(record), { prompt: true }, { class: "form-select", data: { controller: "slimselect", data: { controller: "slimselect" } } } %>
+<div class="block md:inline-block md:w-32 flex-shrink-0 text-gray-700">
+  <%= render "madmin/shared/label", form: form, field: field %>
+</div>
+<%= form.select field.to_param, field.options_for_select(record), { prompt: true }, { class: "form-select", data: { controller: "select", select_url_value: field.index_path } } %>

data/app/views/madmin/fields/belongs_to/_show.html.erb

@@ -1,3 +1,3 @@
 <% if (object = field.value(record)) %>
-  <%= link_to Madmin.resource_for(object).display_name(object), Madmin.resource_for(object).show_path(object) %>
+  <%= link_to Madmin.resource_for(object).display_name(object), Madmin.resource_for(object).show_path(object), class: "text-indigo-500 underline" %>
 <% end %>

data/app/views/madmin/fields/boolean/_form.html.erb

@@ -1,2 +1,4 @@
-<%= form.label field.attribute_name, class: "inline-block w-32 flex-shrink-0" %>
+<div class="block md:inline-block md:w-32 flex-shrink-0 text-gray-700">
+  <%= render "madmin/shared/label", form: form, field: field %>
+</div>
 <%= form.check_box field.attribute_name, class: "form-input" %>

data/app/views/madmin/fields/date/_form.html.erb

@@ -1,2 +1,4 @@
-<%= form.label field.attribute_name, class: "inline-block w-32 flex-shrink-0" %>
+<div class="block md:inline-block md:w-32 flex-shrink-0 text-gray-700">
+  <%= render "madmin/shared/label", form: form, field: field %>
+</div>
 <%= form.text_field field.attribute_name, { class: "form-select", data: { controller: "flatpickr" } } %>

data/app/views/madmin/fields/date_time/_form.html.erb

@@ -1,2 +1,4 @@
-<%= form.label field.attribute_name, class: "inline-block w-32 flex-shrink-0" %>
+<div class="block md:inline-block md:w-32 flex-shrink-0 text-gray-700">
+  <%= render "madmin/shared/label", form: form, field: field %>
+</div>
 <%= form.text_field field.attribute_name, data: { controller: "flatpickr", flatpickr_enable_time: true } %>

data/app/views/madmin/fields/decimal/_form.html.erb

@@ -1,2 +1,4 @@
-<%= form.label field.attribute_name, class: "inline-block w-32 flex-shrink-0" %>
+<div class="block md:inline-block md:w-32 flex-shrink-0 text-gray-700">
+  <%= render "madmin/shared/label", form: form, field: field %>
+</div>
 <%= form.number_field field.attribute_name, step: :any, class: "form-input" %>

data/app/views/madmin/fields/enum/_form.html.erb

@@ -1,2 +1,4 @@
-<%= form.label field.attribute_name, class: "inline-block w-32 flex-shrink-0" %>
-<%= form.select field.attribute_name, field.options_for_select(record), { prompt: true }, { class: "form-select" } %>
+<div class="block md:inline-block md:w-32 flex-shrink-0 text-gray-700">
+  <%= render "madmin/shared/label", form: form, field: field %>
+</div>
+<%= form.select field.attribute_name, field.options_for_select(record), { prompt: true }, { class: "form-select", data: { controller: "select" } } %>

data/app/views/madmin/fields/float/_form.html.erb

@@ -1,2 +1,4 @@
-<%= form.label field.attribute_name, class: "inline-block w-32 flex-shrink-0" %>
+<div class="block md:inline-block md:w-32 flex-shrink-0 text-gray-700">
+  <%= render "madmin/shared/label", form: form, field: field %>
+</div>
 <%= form.number_field field.attribute_name, step: :any, class: "form-input" %>