katalyst-navigation 1.4.0 → 1.5.0

data/app/controllers/katalyst/navigation/items_controller.rb

@@ -2,24 +2,27 @@
 
 module Katalyst
   module Navigation
-    class ItemsController < BaseController
-      before_action :set_menu
+    class ItemsController < ApplicationController
+      before_action :set_menu, only: %i[new create]
       before_action :set_item, except: %i[new create]
 
+      attr_reader :menu, :item, :editor
+
+      layout nil
+
       def new
-        render locals: { item: @menu.items.build(type: new_item_params) }
+        render_editor
       end
 
       def edit
-        render locals: { item: @item }
+        render_editor
       end
 
       def create
-        item = @menu.items.build(item_params)
         if item.save
-          render :update, locals: { item: item, previous: @menu.items.build(type: item.type) }
+          render :update, locals: { editor:, item:, previous: @menu.items.build(type: item.type) }
         else
-          render :new, status: :unprocessable_entity, locals: { item: item }
+          render_editor status: :unprocessable_entity
         end
       end
 
@@ -29,16 +32,17 @@ module Katalyst
         if @item.valid?
           previous = @item
           @item    = @item.dup.tap(&:save!)
-          render locals: { item: @item, previous: previous }
+
+          render locals: { editor:, item:, previous: }
         else
-          render :edit, status: :unprocessable_entity, locals: { item: @item }
+          render_editor status: :unprocessable_entity
         end
       end
 
       private
 
       def new_item_params
-        params[:type] || Link.name
+        { type: params[:type] || Link.name }
       end
 
       def item_params_type
@@ -55,11 +59,19 @@ module Katalyst
       end
 
       def set_menu
-        @menu = Menu.find(params[:menu_id])
+        @menu   = Menu.find(params[:menu_id])
+        @item   = @menu.items.build(item_params)
+        @editor = Katalyst::Navigation::EditorComponent.new(menu:, item:)
       end
 
       def set_item
-        @item = @menu.items.find(params[:id])
+        @item = Item.find(params[:id])
+        @menu = @item.menu
+        @editor = Katalyst::Navigation::EditorComponent.new(menu:, item:)
+      end
+
+      def render_editor(**)
+        render(:edit, locals: { item_editor: editor.item_editor(item:) }, **)
       end
     end
   end

data/app/controllers/katalyst/navigation/menus_controller.rb

@@ -2,55 +2,67 @@
 
 module Katalyst
   module Navigation
-    class MenusController < BaseController
+    class MenusController < Katalyst::Navigation.config.base_controller.constantize
+      include Katalyst::Tables::Backend
+
       def index
         collection = Katalyst::Tables::Collection::Base.new(sorting: :title).with_params(params).apply(Menu.all)
-        table      = Katalyst::Turbo::TableComponent.new(collection: collection,
+        table      = Katalyst::Turbo::TableComponent.new(collection:,
                                                          id:         "index-table",
                                                          class:      "index-table",
                                                          caption:    true)
 
         respond_to do |format|
           format.turbo_stream { render(table) } if self_referred?
-          format.html { render :index, locals: { table: table } }
+          format.html { render :index, locals: { table: } }
         end
       end
 
       def show
-        menu = Menu.find(params[:id])
+        menu   = Menu.find(params[:id])
+        editor = Katalyst::Navigation::EditorComponent.new(menu:)
 
-        render locals: { menu: menu }
+        render locals: { menu:, editor: }
       end
 
       def new
-        render locals: { menu: Menu.new }
+        menu   = Menu.new
+        editor = Katalyst::Navigation::EditorComponent.new(menu:)
+
+        render locals: { menu:, editor: }
       end
 
       def edit
-        menu = Menu.find(params[:id])
+        menu   = Menu.find(params[:id])
+        editor = Katalyst::Navigation::EditorComponent.new(menu:)
 
-        render locals: { menu: menu }
+        render locals: { menu:, editor: }
       end
 
       def create
         @menu = Menu.new(menu_params)
+        editor = Katalyst::Navigation::EditorComponent.new(menu: @menu)
 
         if @menu.save
-          redirect_to @menu
+          @menu.build_draft_version
+          @menu.save!
+          redirect_to @menu, status: :see_other
         else
-          render :new, locals: { menu: @menu }, status: :unprocessable_entity
+          render :new, locals: { menu: @menu, editor: }, status: :unprocessable_entity
         end
       end
 
       # PATCH /admins/navigation_menus/:slug
       def update
         menu = Menu.find(params[:id])
+        editor = Katalyst::Navigation::EditorComponent.new(menu:)
 
         menu.attributes = menu_params
 
         unless menu.valid?
-          return render turbo_stream: helpers.navigation_editor_errors(menu: menu),
-                        status:       :unprocessable_entity
+          return respond_to do |format|
+            format.turbo_stream { render editor.errors, status: :unprocessable_entity }
+          end
         end
 
         case params[:commit]
@@ -62,7 +74,7 @@ module Katalyst
         when "revert"
           menu.revert!
         end
-        redirect_to menu
+        redirect_to menu, status: :see_other
       end
 
       def destroy

data/app/helpers/katalyst/navigation/frontend_helper.rb

@@ -11,14 +11,14 @@ module Katalyst
       #
       # @param(menu: Katalyst::Navigation::Menu)
       # @return Structured HTML containing top level + nested navigation links
-      def navigation_menu_with(menu:, **options)
-        builder = navigation_builder(**options)
+      def navigation_menu_with(menu:, **)
+        builder = navigation_builder(**)
         menu    = navigation_menu_for(menu) if menu.is_a?(Symbol)
 
-        return if menu&.published_version.blank?
+        return if menu.blank?
 
-        cache menu.published_version do
-          concat builder.render(menu.published_tree)
+        cache menu do
+          concat builder.render(menu.published_tree) if menu.published_version.present?
         end
       end
 
@@ -26,8 +26,8 @@ module Katalyst
       #
       # @param(items: [Katalyst::Navigation::Item])
       # @return Structured HTML containing top level + nested navigation links
-      def navigation_items_with(items:, **options)
-        builder = navigation_builder(**options)
+      def navigation_items_with(items:, **)
+        builder = navigation_builder(**)
 
         capture do
           items.each do |item|

data/app/javascript/navigation/application.js

@@ -0,0 +1,30 @@
+import MenuController from "./editor/menu_controller";
+import ItemController from "./editor/item_controller";
+import ListController from "./editor/list_controller";
+import NewItemController from "./editor/new_item_controller";
+import StatusBarController from "./editor/status_bar_controller";
+
+const Definitions = [
+  {
+    identifier: "navigation--editor--menu",
+    controllerConstructor: MenuController,
+  },
+  {
+    identifier: "navigation--editor--item",
+    controllerConstructor: ItemController,
+  },
+  {
+    identifier: "navigation--editor--list",
+    controllerConstructor: ListController,
+  },
+  {
+    identifier: "navigation--editor--new-item",
+    controllerConstructor: NewItemController,
+  },
+  {
+    identifier: "navigation--editor--status-bar",
+    controllerConstructor: StatusBarController,
+  },
+];
+
+export { Definitions as default };

data/app/{assets/javascripts/controllers → javascript}/navigation/editor/item_controller.js

@@ -1,5 +1,5 @@
 import { Controller } from "@hotwired/stimulus";
-import Item from "utils/navigation/editor/item";
+import Item from "./item";
 
 export default class ItemController extends Controller {
   get item() {

data/app/{assets/javascripts/utils → javascript}/navigation/editor/menu.js

@@ -1,4 +1,4 @@
-import Item from "utils/navigation/editor/item";
+import Item from "./item";
 
 /**
  * @param nodes {NodeList}

data/app/{assets/javascripts/controllers → javascript}/navigation/editor/menu_controller.js

@@ -1,8 +1,8 @@
 import { Controller } from "@hotwired/stimulus";
 
-import Item from "utils/navigation/editor/item";
-import Menu from "utils/navigation/editor/menu";
-import RulesEngine from "utils/navigation/editor/rules-engine";
+import Item from "./item";
+import Menu from "./menu";
+import RulesEngine from "./rules-engine";
 
 export default class MenuController extends Controller {
   static targets = ["menu"];

data/app/models/katalyst/navigation/menu.rb

@@ -43,6 +43,8 @@ module Katalyst
                inverse_of: :menu,
                validate:   true
 
+      scope :published, -> { where.not(published_version_id: nil) }
+
       validates :title, :slug, presence: true
       validates :slug, uniqueness: true
       validates :depth, numericality: { greater_than: 0, only_integer: true, allow_nil: true }

data/app/models/katalyst/navigation/types/nodes_type.rb

@@ -27,13 +27,13 @@ module Katalyst
         # Deserialize a params-style array, e.g. "0" => { ... }
         def deserialize_params(value)
           value.map do |index, attributes|
-            Node.new(index: index, **attributes)
+            Node.new(index:, **attributes)
           end.select(&:id).sort_by(&:index)
         end
 
         def deserialize_array(value)
           value.map.with_index do |attributes, index|
-            Node.new(index: index, **attributes)
+            Node.new(index:, **attributes)
           end.select(&:id).sort_by(&:index)
         end
       end

data/app/views/katalyst/navigation/items/_button.html.erb

@@ -1,5 +1,6 @@
 <%= form_with model: item, scope: :item, url: path do |form| %>
   <%= form.hidden_field :type %>
+  <%= render "form_errors", form: %>
 
   <div class="input">
     <%= form.label :title %>
@@ -16,6 +17,11 @@
     <%= form.select :http_method, Katalyst::Navigation::Button::HTTP_METHODS %>
   </div>
 
+  <div class="field">
+    <%= form.label :target %>
+    <%= form.select :target, Katalyst::Navigation::Button::TARGETS %>
+  </div>
+
   <div class="input">
     <%= form.check_box :visible %>
     <%= form.label :visible %>

data/app/views/katalyst/navigation/items/_form_errors.html.erb

@@ -0,0 +1,5 @@
+<%= tag.ul class: "errors" do %>
+  <% form.object.errors.full_messages.each do |error| %>
+    <li class="error"><%= error %></li>
+  <% end %>
+<% end if form.object.errors.any? %>

data/app/views/katalyst/navigation/items/_heading.html.erb

@@ -1,5 +1,6 @@
 <%= form_with model: item, scope: :item, url: path do |form| %>
   <%= form.hidden_field :type %>
+  <%= render "form_errors", form: %>
 
   <div class="field">
     <%= form.label :title %>

data/app/views/katalyst/navigation/items/_link.html.erb

@@ -1,5 +1,6 @@
 <%= form_with model: item, scope: :item, url: path do |form| %>
   <%= form.hidden_field :type %>
+  <%= render "form_errors", form: %>
 
   <div class="field">
     <%= form.label :title %>
@@ -11,6 +12,16 @@
     <%= form.text_field :url %>
   </div>
 
+  <div class="input">
+    <%= form.label :http_method %>
+    <%= form.select :http_method, Katalyst::Navigation::Link::HTTP_METHODS %>
+  </div>
+
+  <div class="field">
+    <%= form.label :target %>
+    <%= form.select :target, Katalyst::Navigation::Link::TARGETS %>
+  </div>
+
   <div class="field">
     <%= form.label :visible %>
     <%= form.check_box :visible %>

data/app/views/katalyst/navigation/items/edit.html.erb

@@ -1,4 +1,5 @@
-<%= turbo_frame_tag "navigation--editor--item-frame" do %>
-  <h3 class="heading-three">Edit <%= item.model_name.human.downcase %></h3>
-  <%= render item.model_name.param_key, item: item, path: menu_item_path(item.menu, item) %>
+<%= render Kpop::FrameComponent.new do %>
+  <%= render Kpop::ModalComponent.new(title: item_editor.title, layout: "side-panel") do %>
+    <%= render item_editor %>
+  <% end %>
 <% end %>

data/app/views/katalyst/navigation/items/edit.turbo_stream.erb

@@ -0,0 +1,3 @@
+<%= turbo_stream.replace item_editor.id do %>
+  <%= render item_editor %>
+<% end %>

data/app/views/katalyst/navigation/items/new.html.erb

@@ -1,4 +1,4 @@
 <%= turbo_frame_tag "navigation--editor--item-frame" do %>
   <h3 class="heading-three">New <%= item.model_name.human.downcase %></h3>
-  <%= render item.model_name.param_key, item: item, path: menu_items_path(item.menu) %>
+  <%= render item.model_name.param_key, item:, path: menu_items_path(item.menu) %>
 <% end %>

data/app/views/katalyst/navigation/items/update.turbo_stream.erb

@@ -1,7 +1,4 @@
-<%= turbo_stream.replace "navigation--editor--item-frame" do %>
-  <%= render "katalyst/navigation/menus/new_items", menu: item.menu %>
-<% end %>
-
+<%= turbo_stream.kpop.dismiss %>
 <%= turbo_stream.replace dom_id(previous) do %>
-  <%= render "katalyst/navigation/menus/item", item: item %>
+  <%= render editor.item(item:) %>
 <% end %>

data/app/views/katalyst/navigation/menus/edit.html.erb

@@ -20,6 +20,6 @@
     <%= form.submit :save %>
     <%= link_to "Delete", url_for(action: :show),
                 class: "button button-secondary",
-                data: { turbo_method: :delete, turbo_confirm: "Are you sure?" } %>
+                data:  { turbo_method: :delete, turbo_confirm: "Are you sure?" } %>
   </div>
 <% end %>

data/app/views/katalyst/navigation/menus/index.html.erb

@@ -2,7 +2,7 @@
 
 <nav class="index-table-actions">
   <div class="item-actions">
-    <%= link_to "Add", [:new, :menu], class: "button button--primary" %>
+    <%= link_to "Add", %i[new menu], class: "button button--primary" %>
   </div>
 </nav>
 

data/app/views/katalyst/navigation/menus/show.html.erb

@@ -1,15 +1,5 @@
 <% content_for :title, menu.title %>
 
-<%= navigation_editor_status_bar menu: menu %>
-
-<%= navigation_editor_menu menu: menu do |form| %>
-  <div role="rowheader">
-    <h4>Title</h4>
-    <h4>Url</h4>
-    <h4>Actions</h4>
-  </div>
-
-  <%= navigation_editor_list menu: menu %>
-<% end %>
-
-<%= render "katalyst/navigation/menus/new_items", menu: menu %>
+<%= render editor.status_bar %>
+<%= render editor %>
+<%= render editor.new_items %>

data/config/importmap.rb

@@ -1,5 +1,2 @@
 # frozen_string_literal: true
-
-pin_all_from Katalyst::Navigation::Engine.root.join("app/assets/javascripts"),
-             # preload in tests so that we don't start clicking before controllers load
-             preload: Rails.env.test?
+pin "@katalyst/navigation", to: "katalyst/navigation.js"

data/db/migrate/20230727025052_update_target_syntax.rb

@@ -3,7 +3,7 @@
 # Ensures that all navigation items have a valid target and http_method.
 class UpdateTargetSyntax < ActiveRecord::Migration[7.0]
   def change
-    Katalyst::Navigation::Item.where(http_method: nil).update_all(target: "get")
+    Katalyst::Navigation::Item.where(http_method: nil).update_all(http_method: "get")
     Katalyst::Navigation::Item.where(target: nil).update_all(target: "self")
     Katalyst::Navigation::Item.where(target: "_blank").update_all(target: "blank")
     Katalyst::Navigation::Item.where(target: "_top").update_all(target: "top")

data/lib/katalyst/navigation/config.rb

@@ -14,6 +14,10 @@ module Katalyst
           Katalyst::Navigation::Button
         ]
       end
+
+      config_accessor(:errors_component) { "Katalyst::Navigation::Editor::ErrorsComponent" }
+
+      config_accessor(:base_controller) { "ApplicationController" }
     end
   end
 end

data/lib/katalyst/navigation/engine.rb

@@ -18,7 +18,7 @@ module Katalyst
       initializer "katalyst-navigation.importmap", before: "importmap" do |app|
         if app.config.respond_to?(:importmap)
           app.config.importmap.paths << root.join("config/importmap.rb")
-          app.config.importmap.cache_sweepers << root.join("app/assets/javascripts")
+          app.config.importmap.cache_sweepers << root.join("app/assets/builds")
         end
       end
 

data/lib/katalyst/navigation.rb

@@ -1,8 +1,13 @@
 # frozen_string_literal: true
 
+require "active_support"
+require "katalyst/html_attributes"
+require "katalyst/kpop"
+require "katalyst/tables"
+require "view_component"
+
 require "katalyst/navigation/config"
 require "katalyst/navigation/engine"
-require "katalyst/navigation/version"
 
 module Katalyst
   module Navigation # :nodoc:

data/spec/factories/katalyst/navigation/menus.rb

@@ -10,7 +10,7 @@ FactoryBot.define do
     end
 
     after(:create) do |menu, _context|
-      menu.items_attributes = menu.items.map.with_index { |item, index| { id: item.id, index: index, depth: 0 } }
+      menu.items_attributes = menu.items.map.with_index { |item, index| { id: item.id, index:, depth: 0 } }
       menu.publish!
     end
   end