Skip to content

Commit b9bf2ae

Browse files
BakiVernesdixpac
BakiVernes
and
dixpac
authored
Add Tailwind styled scaffold templates (rails#71)
* Add Tailwind styled scaffold templates Co-authored-by: Dino Marić <dino.onex@gmail.com> * Match templates to rails main branch * Support Rails 6 Add custom scaffold generator that is same as the one inside the Rails 7 in order to make this work with Rails 6. * Remove commented out code from engine.rb Co-authored-by: Dino Marić <dino.onex@gmail.com>
1 parent 811ba40 commit b9bf2ae

File tree

12 files changed

+174
-3
lines changed

12 files changed

+174
-3
lines changed

‎.gitignore

+2-1
Original file line numberDiff line numberDiff line change
@@ -11,4 +11,5 @@
1111
/node_modules
1212
.byebug_history
1313
*.gem
14-
.idea/
14+
.idea/
15+
**/tmp/

‎lib/generators/tailwindcss/scaffold/scaffold_generator.rb

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
require 'rails/generators/erb/scaffold/scaffold_generator'
2+
require "rails/generators/resource_helpers"
3+
4+
module Tailwindcss
5+
module Generators
6+
class ScaffoldGenerator < Erb::Generators::ScaffoldGenerator
7+
include Rails::Generators::ResourceHelpers
8+
9+
source_root File.expand_path("../templates", __FILE__)
10+
11+
argument :attributes, type: :array, default: [], banner: "field:type field:type"
12+
13+
def create_root_folder
14+
empty_directory File.join("app/views", controller_file_path)
15+
end
16+
17+
def copy_view_files
18+
available_views.each do |view|
19+
formats.each do |format|
20+
filename = filename_with_extensions(view, format)
21+
template filename, File.join("app/views", controller_file_path, filename)
22+
end
23+
end
24+
25+
template "partial.html.erb", File.join("app/views", controller_file_path, "_#{singular_table_name}.html.erb")
26+
end
27+
28+
private
29+
def available_views
30+
%w(index edit show new _form)
31+
end
32+
end
33+
end
34+
end

‎lib/generators/tailwindcss/scaffold/templates/_form.html.erb.tt

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<%%= form_with(model: <%= model_resource_name %>, class: "contents") do |form| %>
2+
<%% if <%= singular_table_name %>.errors.any? %>
3+
<div id="error_explanation" class="bg-red-50 text-red-500 px-3 py-2 font-medium rounded-lg mt-3">
4+
<h2><%%= pluralize(<%= singular_table_name %>.errors.count, "error") %> prohibited this <%= singular_table_name %> from being saved:</h2>
5+
6+
<ul>
7+
<%% <%= singular_table_name %>.errors.each do |error| %>
8+
<li><%%= error.full_message %></li>
9+
<%% end %>
10+
</ul>
11+
</div>
12+
<%% end %>
13+
14+
<% attributes.each do |attribute| -%>
15+
<div class="my-5">
16+
<% if attribute.password_digest? -%>
17+
<%%= form.label :password %>
18+
<%%= form.password_field :password %>
19+
</div>
20+
21+
<div class="my-5">
22+
<%%= form.label :password_confirmation %>
23+
<%%= form.password_field :password_confirmation, class: "block shadow rounded-md border border-gray-200 outline-none px-3 py-2 mt-2 w-full" %>
24+
<% elsif attribute.attachments? -%>
25+
<%%= form.label :<%= attribute.column_name %> %>
26+
<%%= form.<%= attribute.field_type %> :<%= attribute.column_name %>, multiple: true, class: "block shadow rounded-md border border-gray-200 outline-none px-3 py-2 mt-2 w-full" %>
27+
<% else -%>
28+
<%%= form.label :<%= attribute.column_name %> %>
29+
<% if attribute.field_type == :text_area -%>
30+
<%%= form.<%= attribute.field_type %> :<%= attribute.column_name %>, rows: 4, class: "block shadow rounded-md border border-gray-200 outline-none px-3 py-2 mt-2 w-full" %>
31+
<% elsif attribute.field_type == :check_box -%>
32+
<%%= form.<%= attribute.field_type %> :<%= attribute.column_name %>, class: "block mt-2 h-5 w-5" %>
33+
<% else -%>
34+
<%%= form.<%= attribute.field_type %> :<%= attribute.column_name %>, class: "block shadow rounded-md border border-gray-200 outline-none px-3 py-2 mt-2 w-full" %>
35+
<% end -%>
36+
<% end -%>
37+
</div>
38+
39+
<% end -%>
40+
<div class="inline">
41+
<%%= form.submit class: "rounded-lg py-3 px-5 bg-blue-600 text-white inline-block font-medium" %>
42+
</div>
43+
<%% end %>

‎lib/generators/tailwindcss/scaffold/templates/edit.html.erb.tt

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<div class="mx-auto md:w-2/3 w-full">
2+
<h1 class="font-bold text-4xl">Editing <%= human_name.downcase %></h1>
3+
4+
<%%= render "form", <%= singular_table_name %>: @<%= singular_table_name %> %>
5+
6+
<%%= link_to "Show this <%= human_name.downcase %>", @<%= singular_table_name %>, class: "ml-2 rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
7+
<%%= link_to "Back to <%= human_name.pluralize.downcase %>", <%= index_helper %>_path, class: "ml-2 rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
8+
</div>

‎lib/generators/tailwindcss/scaffold/templates/index.html.erb.tt

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
<div class="w-full">
2+
<%% if notice.present? %>
3+
<p class="py-2 px-3 bg-green-50 mb-5 text-green-500 font-medium rounded-lg inline-block" id="notice"><%%= notice %></p>
4+
<%% end %>
5+
6+
<div class="flex justify-between items-center">
7+
<h1 class="text-lg font-bold text-4xl"><%= human_name.pluralize %></h1>
8+
<%%= link_to 'New <%= human_name.downcase %>', new_<%= singular_route_name %>_path, class: "rounded-lg py-3 px-5 bg-blue-600 text-white block font-medium" %>
9+
</div>
10+
11+
<div id="<%= plural_table_name %>" class="min-w-full">
12+
<%%= render @<%= plural_table_name %> %>
13+
</div>
14+
</div>

‎lib/generators/tailwindcss/scaffold/templates/new.html.erb.tt

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<div class="mx-auto md:w-2/3 w-full">
2+
<h1 class="text-lg font-bold text-4xl">New <%= human_name.downcase %></h1>
3+
4+
<%%= render "form", <%= singular_table_name %>: @<%= singular_table_name %> %>
5+
6+
<%%= link_to 'Back to <%= human_name.pluralize.downcase %>', <%= index_helper %>_path, class: "ml-2 rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
7+
</div>

‎lib/generators/tailwindcss/scaffold/templates/partial.html.erb.tt

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<div id="<%%= dom_id <%= singular_table_name %> %>">
2+
<% attributes.reject(&:password_digest?).each do |attribute| -%>
3+
<p class="my-5">
4+
<strong class="block font-medium mb-1"><%= attribute.human_name %>:</strong>
5+
<% if attribute.attachment? -%>
6+
<%%= link_to <%= singular_table_name %>.<%= attribute.column_name %>.filename, <%= singular_table_name %>.<%= attribute.column_name %> if <%= singular_table_name %>.<%= attribute.column_name %>.attached? %>
7+
<% elsif attribute.attachments? -%>
8+
<%% <%= singular_table_name %>.<%= attribute.column_name %>.each do |<%= attribute.singular_name %>| %>
9+
<div><%%= link_to <%= attribute.singular_name %>.filename, <%= attribute.singular_name %> %></div>
10+
<%% end %>
11+
<% else -%>
12+
<%%= <%= singular_table_name %>.<%= attribute.column_name %> %>
13+
<% end -%>
14+
</p>
15+
16+
<% end -%>
17+
<%% if action_name != "show" %>
18+
<%%= link_to "Show this <%= human_name.downcase %>", <%= singular_table_name %>, class: "rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
19+
<%%= link_to 'Edit this <%= human_name.downcase %>', edit_<%= singular_table_name %>_path(<%= singular_table_name %>), class: "rounded-lg py-3 ml-2 px-5 bg-gray-100 inline-block font-medium" %>
20+
<hr class="mt-6">
21+
<%% end %>
22+
</div>

‎lib/generators/tailwindcss/scaffold/templates/show.html.erb.tt

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<div class="mx-auto md:w-2/3 w-full flex">
2+
<div class="mx-auto">
3+
<%% if notice.present? %>
4+
<p class="py-2 px-3 bg-green-50 mb-5 text-green-500 font-medium rounded-lg inline-block" id="notice"><%%= notice %></p>
5+
<%% end %>
6+
7+
<%%= render @<%= singular_table_name %> %>
8+
9+
<%%= link_to 'Edit this <%= singular_table_name %>', edit_<%= singular_table_name %>_path(@<%= singular_table_name %>), class: "mt-2 rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
10+
<div class="inline-block ml-2">
11+
<%%= button_to 'Delete this <%= singular_table_name %>', <%= singular_table_name %>_path(@<%= singular_table_name %>), method: :delete, data: { confirm: "Are you sure you want to delete this <%= singular_table_name %>?" }, class: "mt-2 rounded-lg py-3 px-5 bg-gray-100 font-medium" %>
12+
</div>
13+
<%%= link_to 'Back to <%= plural_table_name %>', <%= index_helper %>_path, class: "ml-2 rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium" %>
14+
</div>
15+
</div>

‎lib/install/tailwindcss.rb

+3-1
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
APPLICATION_LAYOUT_PATH = Rails.root.join("app/views/layouts/application.html.erb")
22

33
if APPLICATION_LAYOUT_PATH.exist?
4-
say "Add Tailwindcss include tags in application layout"
4+
say "Add Tailwindcss include tags and container element in application layout"
55
insert_into_file APPLICATION_LAYOUT_PATH.to_s, <<~ERB.indent(4), before: /^\s*<%= stylesheet_link_tag/
66
<%= stylesheet_link_tag "inter-font", "data-turbo-track": "reload" %>
77
<%= stylesheet_link_tag "tailwind", "data-turbo-track": "reload" %>
88
ERB
9+
insert_into_file APPLICATION_LAYOUT_PATH.to_s, %( <main class="container mx-auto mt-28 px-5 flex">\n ), before: /^\s*<%= yield/
10+
insert_into_file APPLICATION_LAYOUT_PATH.to_s, %(\n </main>), after: /^\s*<%= yield %>/
911
else
1012
say "Default application.html.erb is missing!", :red
1113
say %( Add <%= stylesheet_link_tag "inter-font", "data-turbo-track": "reload" %> and <%= stylesheet_link_tag "tailwind", "data-turbo-track": "reload" %> within the <head> tag in your custom layout.)

‎lib/tailwindcss/engine.rb

+4
Original file line numberDiff line numberDiff line change
@@ -19,5 +19,9 @@ class Engine < ::Rails::Engine
1919
env.cache = ActiveSupport::Cache.lookup_store(:null_store)
2020
end if Rails.env.production?
2121
end
22+
23+
config.app_generators do |g|
24+
g.template_engine :tailwindcss
25+
end
2226
end
2327
end

‎test/lib/generators/tailwindcss/scaffold_generator_test.rb

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
require "test_helper"
2+
require "generators/tailwindcss/scaffold/scaffold_generator"
3+
4+
class Tailwindcss::Generators::ScaffoldGeneratorTest < Rails::Generators::TestCase
5+
GENERATION_PATH = File.expand_path("../tmp", File.dirname(__FILE__))
6+
7+
tests Tailwindcss::Generators::ScaffoldGenerator
8+
destination GENERATION_PATH
9+
10+
arguments %w(message title:string content:text)
11+
12+
Minitest.after_run do
13+
FileUtils.rm_rf GENERATION_PATH
14+
end
15+
16+
test "generates correct view templates" do
17+
run_generator
18+
19+
%w(index edit new show _form _message).each { |view| assert_file "app/views/messages/#{view}.html.erb" }
20+
end
21+
end

‎test/test_helper.rb

+1-1
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
require_relative "../lib/tailwindcss-rails"
88

99
require "rails/test_unit/reporter"
10-
Rails::TestUnitReporter.executable = 'bin/test'
10+
Rails::TestUnitReporter.executable = "bin/test"
1111

1212
class ActiveSupport::TestCase
1313
self.file_fixture_path = File.expand_path("fixtures/files", __dir__)

0 commit comments

Comments
 (0)