From 7cd376e4e53d800b5e7a8ae39f0fc52d74b9ed90 Mon Sep 17 00:00:00 2001 From: Justin Baker Date: Tue, 10 Oct 2023 15:46:29 -0600 Subject: [PATCH] Upgrade to view_component 3 and lookbook 2 (#60) * Bump view_component from 2.63 to 3.6.0 * Refactor components/tests for v3 * Bump lookbook from 1.5.5 to 2.1.1 --- Gemfile | 4 +-- Gemfile.lock | 30 +++++++------------ app/components/flash_component.html.erb | 4 +-- app/components/flash_component.rb | 8 +---- app/views/layouts/application.html.erb | 2 +- test/components/card_component_test.rb | 8 ++--- .../previews/navbar_component_preview.rb | 4 +-- 7 files changed, 23 insertions(+), 37 deletions(-) diff --git a/Gemfile b/Gemfile index 3bf90c1..f145623 100644 --- a/Gemfile +++ b/Gemfile @@ -74,6 +74,6 @@ group :test do end gem "honeybadger" -gem "lookbook", "~> 1.5.5" +gem "lookbook" gem "standard", group: [:development, :test] -gem "view_component", "~> 2.63" +gem "view_component" diff --git a/Gemfile.lock b/Gemfile.lock index e3d3619..7be1991 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -66,7 +66,7 @@ GEM i18n (>= 1.6, < 2) minitest (>= 5.1) tzinfo (~> 2.0) - addressable (2.8.4) + addressable (2.8.5) public_suffix (>= 2.0.2, < 6.0) ast (2.4.2) base64 (0.1.1) @@ -86,14 +86,13 @@ GEM xpath (~> 3.2) concurrent-ruby (1.2.2) crass (1.0.6) - css_parser (1.14.0) + css_parser (1.16.0) addressable date (3.3.3) debug (1.8.0) irb (>= 1.5.0) reline (>= 0.3.1) erubi (1.12.0) - ffi (1.15.5) globalid (1.1.0) activesupport (>= 5.0) honeybadger (5.2.1) @@ -113,23 +112,19 @@ GEM json (2.6.3) language_server-protocol (3.17.0.3) lint_roller (1.1.0) - listen (3.8.0) - rb-fsevent (~> 0.10, >= 0.10.3) - rb-inotify (~> 0.9, >= 0.9.10) - loofah (2.21.3) + loofah (2.21.4) crass (~> 1.0.2) nokogiri (>= 1.12.0) - lookbook (1.5.5) - actioncable + lookbook (2.1.1) activemodel css_parser htmlbeautifier (~> 1.3) htmlentities (~> 4.3.4) - listen (~> 3.0) + marcel (~> 1.0) railties (>= 5.0) redcarpet (~> 3.5) rouge (>= 3.26, < 5.0) - view_component (> 2.0, < 4) + view_component (>= 2.0) yard (~> 0.9.25) zeitwerk (~> 2.5) mail (2.8.1) @@ -199,16 +194,13 @@ GEM zeitwerk (~> 2.5) rainbow (3.1.1) rake (13.0.6) - rb-fsevent (0.11.2) - rb-inotify (0.10.1) - ffi (~> 1.0) redcarpet (3.6.0) redis (4.8.0) regexp_parser (2.8.1) reline (0.3.6) io-console (~> 0.5) rexml (3.2.6) - rouge (4.1.0) + rouge (4.1.3) rubocop (1.56.4) base64 (~> 0.1.1) json (~> 2.3) @@ -266,7 +258,7 @@ GEM tzinfo (2.0.6) concurrent-ruby (~> 1.0) unicode-display_width (2.5.0) - view_component (2.82.0) + view_component (3.6.0) activesupport (>= 5.2.0, < 8.0) concurrent-ruby (~> 1.0) method_source (~> 1.0) @@ -276,7 +268,7 @@ GEM bindex (>= 0.4.0) railties (>= 6.0.0) websocket (1.2.10) - websocket-driver (0.7.5) + websocket-driver (0.7.6) websocket-extensions (>= 0.1.0) websocket-extensions (0.1.5) xpath (3.2.0) @@ -297,7 +289,7 @@ DEPENDENCIES honeybadger importmap-rails jbuilder - lookbook (~> 1.5.5) + lookbook pg (~> 1.1) puma (~> 5.6) rails (~> 7.0) @@ -309,7 +301,7 @@ DEPENDENCIES tailwindcss-rails turbo-rails tzinfo-data - view_component (~> 2.63) + view_component web-console RUBY VERSION diff --git a/app/components/flash_component.html.erb b/app/components/flash_component.html.erb index f2fb301..8af0a85 100644 --- a/app/components/flash_component.html.erb +++ b/app/components/flash_component.html.erb @@ -3,7 +3,7 @@
- <%= icon %> + <%= render IconComponent.new(name: @icon_name) %>
@@ -14,4 +14,4 @@
- \ No newline at end of file + diff --git a/app/components/flash_component.rb b/app/components/flash_component.rb index abb2b2c..39f8794 100644 --- a/app/components/flash_component.rb +++ b/app/components/flash_component.rb @@ -1,9 +1,7 @@ # frozen_string_literal: true class FlashComponent < ViewComponent::Base - renders_one :icon, ->(scheme:, name:) do - IconComponent.new(scheme: :solid, name: @icon_name) - end + renders_one :icon, IconComponent DEFAULT_SCHEME = :notice SCHEME_MAPPINGS = { @@ -22,10 +20,6 @@ def initialize(scheme: DEFAULT_SCHEME) @icon_name = ICON_MAPPINGS[scheme] end - def before_render - icon(scheme: "", name: "") unless icon - end - def render? content.present? end diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index a175ad4..9ab61be 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -22,7 +22,7 @@ <% end %> <%= render NavbarComponent.new do |c| %> - <% c.link(name: "Lookbook", url: lookbook_path, target: :_blank) %> + <% c.with_link(name: "Lookbook", url: lookbook_path, target: :_blank) %> <% end %>
diff --git a/test/components/card_component_test.rb b/test/components/card_component_test.rb index 6ba8db2..8e4e774 100644 --- a/test/components/card_component_test.rb +++ b/test/components/card_component_test.rb @@ -13,7 +13,7 @@ class CardComponentTest < ViewComponent::TestCase test "renders card with header" do render_inline CardComponent.new do |c| - c.header "Has a header" + c.with_header { "Has a header" } end assert_selector "h3", class: %w[text-lg leading-6 font-medium text-gray-900] @@ -21,8 +21,8 @@ class CardComponentTest < ViewComponent::TestCase test "renders card with header and footer" do render_inline CardComponent.new do |c| - c.header "Has a header" - c.footer "Has a footer" + c.with_header { "Has a header" } + c.with_footer { "Has a footer" } end assert_selector "h3", class: %w[text-lg leading-6 font-medium text-gray-900] @@ -31,7 +31,7 @@ class CardComponentTest < ViewComponent::TestCase test "renders card with footer" do render_inline CardComponent.new do |c| - c.footer "Has a footer" + c.with_footer { "Has a footer" } end assert_selector "div", class: %w[px-4 py-4 sm:px-6] diff --git a/test/components/previews/navbar_component_preview.rb b/test/components/previews/navbar_component_preview.rb index 5ddaa4e..97b0a1c 100644 --- a/test/components/previews/navbar_component_preview.rb +++ b/test/components/previews/navbar_component_preview.rb @@ -6,8 +6,8 @@ class NavbarComponentPreview < ViewComponent::Preview # @label Default def default render NavbarComponent.new do |c| - c.link(name: "Link", url: "") - c.link(name: "Link (new window)", url: "", target: :_blank) + c.with_link(name: "Link", url: "") + c.with_link(name: "Link (new window)", url: "", target: :_blank) end end end