From 9a6102a04f323ca437936b13e42b1fdf882fb4ca Mon Sep 17 00:00:00 2001 From: prusekj Date: Thu, 4 Dec 2025 17:10:31 +0100 Subject: [PATCH 1/2] refactor(console): ui/warning_ribbon cell -> component --- CHANGELOG.md | 1 + .../folio/console/publishable_inputs/item/show.slim | 5 ++--- app/cells/folio/console/ui/warning_ribbon_cell.rb | 4 ---- .../folio/console/ui/warning_ribbon_component.rb | 8 ++++++++ .../folio/console/ui/warning_ribbon_component.sass} | 0 .../folio/console/ui/warning_ribbon_component.slim} | 4 ++-- app/views/folio/console/ui/warning_ribbons.slim | 2 +- .../cells/folio/console/ui/warning_ribbon_cell_test.rb | 10 ---------- .../folio/console/ui/warning_ribbon_component_test.rb | 10 ++++++++++ 9 files changed, 24 insertions(+), 20 deletions(-) delete mode 100644 app/cells/folio/console/ui/warning_ribbon_cell.rb create mode 100644 app/components/folio/console/ui/warning_ribbon_component.rb rename app/{cells/folio/console/ui/warning_ribbon/warning_ribbon.sass => components/folio/console/ui/warning_ribbon_component.sass} (100%) rename app/{cells/folio/console/ui/warning_ribbon/show.slim => components/folio/console/ui/warning_ribbon_component.slim} (62%) delete mode 100644 test/cells/folio/console/ui/warning_ribbon_cell_test.rb create mode 100644 test/components/folio/console/ui/warning_ribbon_component_test.rb diff --git a/CHANGELOG.md b/CHANGELOG.md index 90e763ecff..8a22ca2577 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -38,6 +38,7 @@ All notable changes to this project will be documented in this file. - Cells -> ViewComponents refactoring: - Folio::Console::Form::HeaderCell -> Folio::Console::Form::HeaderComponent - Folio::PublishableHintCell -> Folio::Publishable::HintComponent + - Folio::Console::Ui::WarningRibbonCell -> Folio::Console::Ui::WarningRibbonComponent - generalized tiptap_config.use_as_single_image_in_toolbar -> tiptap_config.toolbar with icon and slot names ### Fixed diff --git a/app/cells/folio/console/publishable_inputs/item/show.slim b/app/cells/folio/console/publishable_inputs/item/show.slim index c6023884ca..cd0ddd965e 100644 --- a/app/cells/folio/console/publishable_inputs/item/show.slim +++ b/app/cells/folio/console/publishable_inputs/item/show.slim @@ -37,6 +37,5 @@ div class=class_name data=data atom_setting: model[:atom_setting] == false ? nil : "#{field}_until" - if field == :published - == cell('folio/console/ui/warning_ribbon', - t('.unpublished'), - class: "f-c-publishable-inputs-item__warning-ribbon") + == render_view_component(Folio::Console::Ui::WarningRibbonComponent.new(text: t('.unpublished'), + class_name: "f-c-publishable-inputs-item__warning-ribbon")) diff --git a/app/cells/folio/console/ui/warning_ribbon_cell.rb b/app/cells/folio/console/ui/warning_ribbon_cell.rb deleted file mode 100644 index fc5d339dfc..0000000000 --- a/app/cells/folio/console/ui/warning_ribbon_cell.rb +++ /dev/null @@ -1,4 +0,0 @@ -# frozen_string_literal: true - -class Folio::Console::Ui::WarningRibbonCell < Folio::ConsoleCell -end diff --git a/app/components/folio/console/ui/warning_ribbon_component.rb b/app/components/folio/console/ui/warning_ribbon_component.rb new file mode 100644 index 0000000000..8d5b3c3d4f --- /dev/null +++ b/app/components/folio/console/ui/warning_ribbon_component.rb @@ -0,0 +1,8 @@ +# frozen_string_literal: true + +class Folio::Console::Ui::WarningRibbonComponent < Folio::Console::ApplicationComponent + def initialize(text:, class_name: nil) + @text = text + @class_name = class_name + end +end diff --git a/app/cells/folio/console/ui/warning_ribbon/warning_ribbon.sass b/app/components/folio/console/ui/warning_ribbon_component.sass similarity index 100% rename from app/cells/folio/console/ui/warning_ribbon/warning_ribbon.sass rename to app/components/folio/console/ui/warning_ribbon_component.sass diff --git a/app/cells/folio/console/ui/warning_ribbon/show.slim b/app/components/folio/console/ui/warning_ribbon_component.slim similarity index 62% rename from app/cells/folio/console/ui/warning_ribbon/show.slim rename to app/components/folio/console/ui/warning_ribbon_component.slim index 437731d109..4ffb4c9a3f 100644 --- a/app/cells/folio/console/ui/warning_ribbon/show.slim +++ b/app/components/folio/console/ui/warning_ribbon_component.slim @@ -1,5 +1,5 @@ -.f-c-ui-warning-ribbon class=options[:class] +.f-c-ui-warning-ribbon class=@class_name == cell('folio/console/ui/with_icon', - model, + @text, icon: :alert, icon_options: { width: 16 }) diff --git a/app/views/folio/console/ui/warning_ribbons.slim b/app/views/folio/console/ui/warning_ribbons.slim index 52a2cf4871..abd63d6d21 100644 --- a/app/views/folio/console/ui/warning_ribbons.slim +++ b/app/views/folio/console/ui/warning_ribbons.slim @@ -4,7 +4,7 @@ h2 Warning ribbon h3 Standalone -== cell('folio/console/ui/warning_ribbon', 'Warning text') += render(Folio::Console::Ui::WarningRibbonComponent.new(text: 'Warning text')) h3 Publishable inputs diff --git a/test/cells/folio/console/ui/warning_ribbon_cell_test.rb b/test/cells/folio/console/ui/warning_ribbon_cell_test.rb deleted file mode 100644 index 5ef5598bf6..0000000000 --- a/test/cells/folio/console/ui/warning_ribbon_cell_test.rb +++ /dev/null @@ -1,10 +0,0 @@ -# frozen_string_literal: true - -require "test_helper" - -class Folio::Console::Ui::WarningRibbonCellTest < Folio::Console::CellTest - test "show" do - html = cell("folio/console/ui/warning_ribbon", "foo").(:show) - assert html.has_css?(".f-c-ui-warning-ribbon") - end -end diff --git a/test/components/folio/console/ui/warning_ribbon_component_test.rb b/test/components/folio/console/ui/warning_ribbon_component_test.rb new file mode 100644 index 0000000000..726ee3094c --- /dev/null +++ b/test/components/folio/console/ui/warning_ribbon_component_test.rb @@ -0,0 +1,10 @@ +# frozen_string_literal: true + +require "test_helper" + +class Folio::Console::Ui::WarningRibbonComponentTest < Folio::Console::ComponentTest + test "show" do + render_inline(Folio::Console::Ui::WarningRibbonComponent.new(text: "foo")) + assert_selector(".f-c-ui-warning-ribbon") + end +end From eb12f68f33e852bb3bb916e56a551ab69c4f1832 Mon Sep 17 00:00:00 2001 From: prusekj Date: Fri, 5 Dec 2025 10:46:05 +0100 Subject: [PATCH 2/2] refactor(console): CatalogueSortArrowsCell -> CatalogueSortArrowsComponent - Refactored CatalogueSortArrowsCell to ViewComponent - Used bem_class_name helper for CSS classes - Moved logic to before_render callback - Updated usage in catalogue_cell.rb - Updated I18n keys with _component suffix - Updated CHANGELOG.md --- CHANGELOG.md | 3 + app/cells/folio/console/catalogue_cell.rb | 6 +- .../console/catalogue_sort_arrows_cell.rb | 54 ---------------- .../catalogue_sort_arrows_component.rb | 64 +++++++++++++++++++ .../catalogue_sort_arrows_component.sass} | 1 + .../catalogue_sort_arrows_component.slim} | 2 +- config/locales/console.cs.yml | 2 +- config/locales/console.en.yml | 2 +- .../catalogue_sort_arrows_cell_test.rb | 18 ------ .../catalogue_sort_arrows_component_test.rb | 34 ++++++++++ 10 files changed, 108 insertions(+), 78 deletions(-) delete mode 100644 app/cells/folio/console/catalogue_sort_arrows_cell.rb create mode 100644 app/components/folio/console/catalogue_sort_arrows_component.rb rename app/{cells/folio/console/catalogue_sort_arrows/catalogue_sort_arrows.sass => components/folio/console/catalogue_sort_arrows_component.sass} (99%) rename app/{cells/folio/console/catalogue_sort_arrows/show.slim => components/folio/console/catalogue_sort_arrows_component.slim} (85%) delete mode 100644 test/cells/folio/console/catalogue_sort_arrows_cell_test.rb create mode 100644 test/components/folio/console/catalogue_sort_arrows_component_test.rb diff --git a/CHANGELOG.md b/CHANGELOG.md index 8a22ca2577..9502e8c702 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -38,7 +38,10 @@ All notable changes to this project will be documented in this file. - Cells -> ViewComponents refactoring: - Folio::Console::Form::HeaderCell -> Folio::Console::Form::HeaderComponent - Folio::PublishableHintCell -> Folio::Publishable::HintComponent + - Folio::Console::Ui::FlagCell -> Folio::Console::Ui::FlagComponent - Folio::Console::Ui::WarningRibbonCell -> Folio::Console::Ui::WarningRibbonComponent + - Folio::Console::ConsoleNotes::CatalogueTooltipCell -> Folio::Console::ConsoleNotes::CatalogueTooltipComponent + - Folio::Console::CatalogueSortArrowsCell -> Folio::Console::CatalogueSortArrowsComponent - generalized tiptap_config.use_as_single_image_in_toolbar -> tiptap_config.toolbar with icon and slot names ### Fixed diff --git a/app/cells/folio/console/catalogue_cell.rb b/app/cells/folio/console/catalogue_cell.rb index de8f09db06..ae682e52f4 100644 --- a/app/cells/folio/console/catalogue_cell.rb +++ b/app/cells/folio/console/catalogue_cell.rb @@ -428,9 +428,9 @@ def label_for(attr = nil, skip_desktop_header: false, allow_sorting: false) else base = klass.human_attribute_name(attr) - if allow_sorting && arrows = cell("folio/console/catalogue_sort_arrows", - klass:, - attr:).show + component = Folio::Console::CatalogueSortArrowsComponent.new(klass:, attr:) + if allow_sorting && component.render? + arrows = render_view_component(component) content_tag(:span, "#{base} #{arrows}", class: "f-c-catalogue__label-with-arrows") else base diff --git a/app/cells/folio/console/catalogue_sort_arrows_cell.rb b/app/cells/folio/console/catalogue_sort_arrows_cell.rb deleted file mode 100644 index fb4515d2e7..0000000000 --- a/app/cells/folio/console/catalogue_sort_arrows_cell.rb +++ /dev/null @@ -1,54 +0,0 @@ -# frozen_string_literal: true - -class Folio::Console::CatalogueSortArrowsCell < Folio::ConsoleCell - class_name "f-c-catalogue-sort-arrows", :active?, :desc? - - def show - if model.present? - if model[:klass].respond_to?("sort_by_#{asc_key}") && model[:klass].respond_to?("sort_by_#{desc_key}") - render - end - end - end - - def asc_key - @asc_key ||= "#{model[:attr]}_asc" - end - - def desc_key - @desc_key ||= "#{model[:attr]}_desc" - end - - def url - h = request.query_parameters.dup - h.delete("page") - - if asc? - h["sort"] = desc_key - else - h["sort"] = asc_key - end - - "#{request.path}?#{h.to_query}" - end - - def active? - asc? || desc? - end - - def asc? - params[:sort] == asc_key - end - - def desc? - params[:sort] == desc_key - end - - def title - if active? - t(".sort_desc") - else - t(".sort_asc") - end - end -end diff --git a/app/components/folio/console/catalogue_sort_arrows_component.rb b/app/components/folio/console/catalogue_sort_arrows_component.rb new file mode 100644 index 0000000000..f16586f0a4 --- /dev/null +++ b/app/components/folio/console/catalogue_sort_arrows_component.rb @@ -0,0 +1,64 @@ +# frozen_string_literal: true + +class Folio::Console::CatalogueSortArrowsComponent < Folio::Console::ApplicationComponent + bem_class_name :active, :desc + + def initialize(klass:, attr:) + @klass = klass + @attr = attr + end + + def render? + return false unless @klass.present? + + @klass.respond_to?("sort_by_#{asc_key}") && @klass.respond_to?("sort_by_#{desc_key}") + end + + def url + h = request.query_parameters.dup + h.delete("page") + + if asc? + h["sort"] = desc_key + else + h["sort"] = asc_key + end + + "#{request.path}?#{h.to_query}" + end + + def active? + @active + end + + def asc? + @asc + end + + def desc? + @desc + end + + def title + if active? + t(".sort_desc") + else + t(".sort_asc") + end + end + + private + def before_render + @asc = controller.params[:sort] == asc_key + @desc = controller.params[:sort] == desc_key + @active = @asc || @desc + end + + def asc_key + @asc_key ||= "#{@attr}_asc" + end + + def desc_key + @desc_key ||= "#{@attr}_desc" + end +end diff --git a/app/cells/folio/console/catalogue_sort_arrows/catalogue_sort_arrows.sass b/app/components/folio/console/catalogue_sort_arrows_component.sass similarity index 99% rename from app/cells/folio/console/catalogue_sort_arrows/catalogue_sort_arrows.sass rename to app/components/folio/console/catalogue_sort_arrows_component.sass index a7648bf3be..5464e50c0b 100644 --- a/app/cells/folio/console/catalogue_sort_arrows/catalogue_sort_arrows.sass +++ b/app/components/folio/console/catalogue_sort_arrows_component.sass @@ -38,3 +38,4 @@ &--desc &__inner transform: rotate(180deg) + diff --git a/app/cells/folio/console/catalogue_sort_arrows/show.slim b/app/components/folio/console/catalogue_sort_arrows_component.slim similarity index 85% rename from app/cells/folio/console/catalogue_sort_arrows/show.slim rename to app/components/folio/console/catalogue_sort_arrows_component.slim index a500a09aac..f69c49b44a 100644 --- a/app/cells/folio/console/catalogue_sort_arrows/show.slim +++ b/app/components/folio/console/catalogue_sort_arrows_component.slim @@ -1,5 +1,5 @@ a[ - class=class_name + class=bem_class_name href=url title=title ] diff --git a/config/locales/console.cs.yml b/config/locales/console.cs.yml index 086b0c3cff..4954e2553b 100644 --- a/config/locales/console.cs.yml +++ b/config/locales/console.cs.yml @@ -350,7 +350,7 @@ cs: in: Nahradit z YAML out: Uložit do YAML in_new: Vytvořit nový z YAML - catalogue_sort_arrows: + catalogue_sort_arrows_component: sort_asc: Řadit vzestupně sort_desc: Řadit sestupně catalogue: diff --git a/config/locales/console.en.yml b/config/locales/console.en.yml index 9e109e2744..fbdb38ba25 100644 --- a/config/locales/console.en.yml +++ b/config/locales/console.en.yml @@ -346,7 +346,7 @@ en: in: Replace from YAML out: Save to YAML in_new: Create new from YAML - catalogue_sort_arrows: + catalogue_sort_arrows_component: sort_asc: Ascending sort sort_desc: Descending sort catalogue: diff --git a/test/cells/folio/console/catalogue_sort_arrows_cell_test.rb b/test/cells/folio/console/catalogue_sort_arrows_cell_test.rb deleted file mode 100644 index 2ce7ecd004..0000000000 --- a/test/cells/folio/console/catalogue_sort_arrows_cell_test.rb +++ /dev/null @@ -1,18 +0,0 @@ -# frozen_string_literal: true - -require "test_helper" - -class Folio::Console::CatalogueSortArrowsCellTest < Folio::Console::CellTest - class SortablePage < Folio::Page - scope :sort_by_title_asc, -> { order(title: :asc) } - scope :sort_by_title_desc, -> { order(title: :desc) } - end - - test "show" do - html = cell("folio/console/catalogue_sort_arrows", klass: Folio::Page, attr: :title).(:show) - assert_not html.has_css?(".f-c-catalogue-sort-arrows") - - html = cell("folio/console/catalogue_sort_arrows", klass: SortablePage, attr: :title).(:show) - assert html.has_css?(".f-c-catalogue-sort-arrows") - end -end diff --git a/test/components/folio/console/catalogue_sort_arrows_component_test.rb b/test/components/folio/console/catalogue_sort_arrows_component_test.rb new file mode 100644 index 0000000000..05dfde7c37 --- /dev/null +++ b/test/components/folio/console/catalogue_sort_arrows_component_test.rb @@ -0,0 +1,34 @@ +# frozen_string_literal: true + +require "test_helper" + +class Folio::Console::CatalogueSortArrowsComponentTest < Folio::Console::ComponentTest + class SortablePage < Folio::Page + scope :sort_by_title_asc, -> { order(title: :asc) } + scope :sort_by_title_desc, -> { order(title: :desc) } + end + + test "render? returns false when klass does not have sort scopes" do + component = Folio::Console::CatalogueSortArrowsComponent.new(klass: Folio::Page, attr: :title) + + assert_not component.render? + end + + test "render? returns true when klass has sort scopes" do + component = Folio::Console::CatalogueSortArrowsComponent.new(klass: SortablePage, attr: :title) + + assert component.render? + end + + test "render" do + with_controller_class(Folio::Console::BaseController) do + with_request_url "/console" do + component = Folio::Console::CatalogueSortArrowsComponent.new(klass: SortablePage, attr: :title) + + render_inline(component) + + assert_selector(".f-c-catalogue-sort-arrows") + end + end + end +end