alchemy_cms 8.3.10 → 8.4.0

data/app/views/alchemy/admin/crop.html.erb

@@ -7,25 +7,25 @@
   <%= render_message do %>
     <%= simple_format Alchemy.t(:explain_cropping) %>
   <% end %>
-  <%= content_tag "alchemy-picture-thumbnail", nil,
-    src: @picture.url(flatten: true),
-    id: "imageToCrop" %>
-  <form>
-    <%= button_tag Alchemy.t(:apply), type: 'submit' %>
-    <%= button_tag Alchemy.t('Reset Imagemask'), class: 'reset_mask secondary', type: 'reset' %>
-  </form>
+  <% if @settings.present? %>
+    <alchemy-image-cropper
+      default-box="<%= @settings[:default_box].to_json %>"
+      crop-from-field-id="<%= params[:crop_from_form_field_id] %>"
+      crop-size-field-id="<%= params[:crop_size_form_field_id] %>"
+      element-id="<%= @element.id %>"
+      <% if @settings[:ratio] %>ratio="<%= @settings[:ratio] %>"<% end %>
+    >
+      <div class="thumbnail_background">
+        <%= image_tag @picture.url(flatten: true), alt: @picture.name %>
+      </div>
+      <form>
+        <%= button_tag Alchemy.t(:apply), type: 'submit' %>
+        <%= button_tag Alchemy.t('Reset Imagemask'), class: 'reset_mask secondary', type: 'reset' %>
+      </form>
+    </alchemy-image-cropper>
+  <% else %>
+    <%= content_tag "alchemy-picture-thumbnail", nil,
+      src: @picture.url(flatten: true) %>
+  <% end %>
 </div>
 <% end %>
-<% if @settings %>
-<script type="module">
-  import { ImageCropper } from "alchemy_admin/image_cropper";
-
-  const image = document.getElementById("imageToCrop")?.querySelector("img");
-
-  new ImageCropper(image, <%== @settings.merge(
-    crop_from_form_field_id: params[:crop_from_form_field_id],
-    crop_size_form_field_id: params[:crop_size_form_field_id],
-    element_id: @element.id
-  ).to_json %>);
-</script>
-<% end %>

data/app/views/alchemy/admin/dashboard/_footer.html.erb

@@ -5,9 +5,6 @@
       <li>
         <a href="https://rubyonrails.org" target="_blank">Ruby on Rails</a>
       </li>
-      <li>
-        <a href="https://jquery.com" target="_blank">jQuery</a>
-      </li>
       <li>
         <a href="https://shoelace.style" target="_blank">Shoelace</a>
       </li>

data/app/views/alchemy/admin/dashboard/_top.html.erb

@@ -1,4 +1,5 @@
 <div class="top-row">
   <%= render Alchemy::Admin::Dashboard::Widgets::Greeting.new(user: current_alchemy_user) %>
+  <%= render Alchemy::Admin::Dashboard::Widget.new(id: "NewsReader", style: "stat") %>
   <%= render Alchemy::Admin::Dashboard::Widgets::SystemInfo.new %>
 </div>

data/app/views/alchemy/admin/dashboard/help.html.erb

@@ -1,57 +1,84 @@
-<h2><%= Alchemy.t('Global shortcuts') %></h2>
-<ul class="shortcuts">
-  <li>
-    <kbd>?</kbd>
-    <%= Alchemy.t('Open help window', scope: 'help.shortcuts') %>
-  </li>
-  <li>
-    <kbd>esc</kbd>
-    <%= Alchemy.t('Close current dialog', scope: 'help.shortcuts') %>
-  </li>
-  <li>
-    <kbd>alt</kbd><kbd>q</kbd>
-    <%= Alchemy.t('Open logout dialog', scope: 'help.shortcuts') %>
-  </li>
-  <li>
-    <kbd>alt</kbd><kbd>f</kbd>
-    <%= Alchemy.t('Focus search field', scope: 'help.shortcuts') %>
-  </li>
-  <li>
-    <kbd>alt</kbd><kbd>n</kbd>
-    <%= Alchemy.t('Create a new record', scope: 'help.shortcuts') %>
-  </li>
-</ul>
-<h2><%= Alchemy.t('Page edit shortcuts') %></h2>
-<ul class="shortcuts">
-  <li>
-    <kbd>alt</kbd><kbd>i</kbd>
-    <%= Alchemy.t('Show page infos', scope: 'help.shortcuts') %>
-  </li>
-  <li>
-    <kbd>alt</kbd><kbd>n</kbd>
-    <%= Alchemy.t('Create new element', scope: 'help.shortcuts') %>
-  </li>
-  <li>
-    <kbd>alt</kbd><kbd>e</kbd>
-    <%= Alchemy.t('Edit page properties', scope: 'help.shortcuts') %>
-  </li>
-  <li>
-    <kbd>alt</kbd><kbd>r</kbd>
-    <%= Alchemy.t('Reload the preview', scope: 'help.shortcuts') %>
-  </li>
-  <li>
-    <kbd>alt</kbd><kbd>x</kbd>
-    <%= Alchemy.t('Leave the page', scope: 'help.shortcuts') %>
-  </li>
-</ul>
-<h2><%= Alchemy.t('Library shortcuts') %></h2>
-<ul class="shortcuts">
-  <li>
-    <kbd>alt</kbd><kbd>n</kbd>
-    <%= Alchemy.t('Open upload form', scope: 'help.shortcuts') %>
-  </li>
-  <li>
-    <kbd>alt</kbd><kbd>a</kbd>
-    <%= Alchemy.t('Select all pictures', scope: 'help.shortcuts') %>
-  </li>
-</ul>
+<div class="help-container">
+  <div>
+    <h2><%= Alchemy.t('Global shortcuts') %></h2>
+    <ul class="shortcuts">
+      <li>
+        <kbd>?</kbd>
+        <%= Alchemy.t('Open help window', scope: 'help.shortcuts') %>
+      </li>
+      <li>
+        <kbd>esc</kbd>
+        <%= Alchemy.t('Close current dialog', scope: 'help.shortcuts') %>
+      </li>
+      <li>
+        <kbd>alt</kbd><kbd>q</kbd>
+        <%= Alchemy.t('Open logout dialog', scope: 'help.shortcuts') %>
+      </li>
+      <li>
+        <kbd>alt</kbd><kbd>f</kbd>
+        <%= Alchemy.t('Focus search field', scope: 'help.shortcuts') %>
+      </li>
+      <li>
+        <kbd>alt</kbd><kbd>n</kbd>
+        <%= Alchemy.t('Create a new record', scope: 'help.shortcuts') %>
+      </li>
+    </ul>
+  </div>
+  <div>
+    <h2><%= Alchemy.t('Page edit shortcuts') %></h2>
+    <ul class="shortcuts">
+      <li>
+        <kbd>alt</kbd><kbd>i</kbd>
+        <%= Alchemy.t('Show page infos', scope: 'help.shortcuts') %>
+      </li>
+      <li>
+        <kbd>alt</kbd><kbd>n</kbd>
+        <%= Alchemy.t('Create new element', scope: 'help.shortcuts') %>
+      </li>
+      <li>
+        <kbd>alt</kbd><kbd>e</kbd>
+        <%= Alchemy.t('Edit page properties', scope: 'help.shortcuts') %>
+      </li>
+      <li>
+        <kbd>alt</kbd><kbd>r</kbd>
+        <%= Alchemy.t('Reload the preview', scope: 'help.shortcuts') %>
+      </li>
+      <li>
+        <kbd>alt</kbd><kbd>x</kbd>
+        <%= Alchemy.t('Leave the page', scope: 'help.shortcuts') %>
+      </li>
+    </ul>
+  </div>
+  <div>
+    <h2><%= Alchemy.t('Library shortcuts') %></h2>
+    <ul class="shortcuts">
+      <li>
+        <kbd>alt</kbd><kbd>n</kbd>
+        <%= Alchemy.t('Open upload form', scope: 'help.shortcuts') %>
+      </li>
+      <li>
+        <kbd>alt</kbd><kbd>a</kbd>
+        <%= Alchemy.t('Select all pictures', scope: 'help.shortcuts') %>
+      </li>
+    </ul>
+  </div>
+  <div>
+    <h2><%= Alchemy.t("help.resources") %></h2>
+    <div class="help-resource-links">
+      <a class="button ghost with_icon" href="https://guides.alchemy-cms.com" target="_blank" rel="noopener">
+        <alchemy-icon name="external-link"></alchemy-icon>
+        <%= Alchemy.t("help.resource_links.guidelines") %>
+      </a>
+      <a class="button ghost with_icon" href="https://www.alchemy-cms.com" target="_blank" rel="noopener">
+        <alchemy-icon name="external-link"></alchemy-icon>
+        <%= Alchemy.t("help.resource_links.homepage") %>
+      </a>
+    </div>
+  </div>
+</div>
+
+<form method="dialog">
+  <div class="submit">
+    <button type="submit"><%= Alchemy.t(:close) %></button>
+  </div>
+</form>

data/app/views/alchemy/admin/dashboard/license.html.erb

@@ -0,0 +1,6 @@
+<pre class="license-text"><%= @license %></pre>
+<form method="dialog">
+  <div class="submit">
+    <button type="submit"><%= Alchemy.t(:close) %></button>
+  </div>
+</form>

data/app/views/alchemy/admin/elements/_footer.html.erb

@@ -8,7 +8,6 @@
   <button
     form="element_<%= element.id %>_form"
     is="alchemy-button"
-    data-turbo="false"
     type="submit"
     <%= "disabled" if cannot?(:update, element) %>
   >

data/app/views/alchemy/admin/elements/_form.html.erb

@@ -4,7 +4,7 @@
   <% end %>
 <%- else -%>
   <%= turbo_frame_tag @element do %>
-    <%= alchemy_form_for [:admin, @element], remote: false do |form| %>
+    <%= alchemy_form_for [:admin, @element] do |form| %>
       <%= form.hidden_field :page_version_id %>
       <%= form.input :name, label: Alchemy.t(:element_of_type) do %>
         <%= render Alchemy::Admin::ElementSelect.new(

data/app/views/alchemy/admin/elements/_header.html.erb

@@ -14,26 +14,9 @@
   <span class="element-title">
     <span class="preview_text_element_name"><%= element.display_name %></span>
     <%= render_hint_for(element, size: "1x", fixed_width: false) %>
-    <span class="preview_text_quote">
-      <%= sanitize(element.preview_text.presence || '&nbsp;') %>
-    </span>
-  </span>
-  <span class="element-status-icons">
-    <% unless element.public? || element.scheduled? %>
-      <%= render_icon("cloud-off", size: "1x") %>
-      <span class="element-hidden-label">
-        <%= Alchemy.t(:element_hidden) %>
-      </span>
-    <% end %>
-    <sl-tooltip
-      class="element-scheduled-icon"
-      content="<%= Alchemy.t(element.public_on&.future? ? :public_on : :public_until, scope: :element_scheduled, public_on: element.public_on && l(element.public_on, format: :"alchemy.default"), public_until: element.public_until && l(element.public_until, format: :"alchemy.default")) %>"
-      <%= "hidden" if !element.scheduled? %>
-    >
-      <%= render_icon("calendar-schedule", size: "1x") %>
-      <%= element.public_on&.future? ? element.public_on && l(element.public_on, format: :"alchemy.short_datetime") : element.public_until && l(element.public_until, format: :"alchemy.short_datetime") %>
-    </sl-tooltip>
+    <%= render "alchemy/admin/elements/preview_text_quote", element: element %>
   </span>
+  <%= render Alchemy.config.admin_components.element_status_indicators.new(element:) %>
   <sl-tooltip content="<%= Alchemy.t(element.folded? ? :show_element_content : :hide_element_content) %>">
     <%= button_tag(class: "element-toggle") do %>
       <% if element.compact? %>

data/app/views/alchemy/admin/elements/_preview_text_quote.html.erb

@@ -0,0 +1,3 @@
+<span id="element_<%= element.id %>_preview_text_quote" class="preview_text_quote">
+  <%= strip_tags(element.preview_text.presence || '&nbsp;') %>
+</span>

data/app/views/alchemy/admin/elements/_schedule.html.erb

@@ -9,7 +9,7 @@
         <p><%= sanitize t(".visibility_status.public_html") %></p>
         <% if element.scheduled? && element.public_until.present? %>
           <%= sanitize t(".public_scheduled_html",
-            public_until: l(element.public_until, format: :"alchemy.element_date")) %>
+            public_until: Alchemy.l(element.public_until, format: :"alchemy.element_date")) %>
         <% else %>
           <%= t(".public_no_schedule") %>
         <% end %>
@@ -18,11 +18,11 @@
         <% if element.scheduled? %>
           <% if element.public_until.present? %>
             <%= sanitize t(".hidden_window_html",
-              public_on: element.public_on ? l(element.public_on, format: :"alchemy.element_date") : nil,
-              public_until: l(element.public_until, format: :"alchemy.element_date")) %>
+              public_on: Alchemy.l(element.public_on, format: :"alchemy.element_date"),
+              public_until: Alchemy.l(element.public_until, format: :"alchemy.element_date")) %>
           <% else %>
             <%= sanitize t(".hidden_scheduled_html",
-              public_on: element.public_on ? l(element.public_on, format: :"alchemy.element_date") : nil) %>
+              public_on: Alchemy.l(element.public_on, format: :"alchemy.element_date")) %>
           <% end %>
         <% else %>
           <%= t(".hidden_no_schedule") %>
@@ -31,13 +31,13 @@
     </alchemy-message>
   <% end %>
 
-  <%= alchemy_form_for [:publish, :admin, element], remote: false, data: {turbo: true}, class: "full_width" do |f| %>
+  <%= alchemy_form_for [:publish, :admin, element], data: {turbo: true}, class: "full_width" do |f| %>
     <%= render "alchemy/admin/elements/schedule_fields", element:, form: f %>
     <div class="submit">
       <button
         type="button"
-        class="secondary"
-        onclick="this.form.querySelectorAll('input[type=datetime-local]').forEach((i) => i.value = '')">
+        is="alchemy-clear-schedule-button"
+        class="secondary">
         <%= Alchemy.t(:clear_schedule) %>
       </button>
       <button type="submit">

data/app/views/alchemy/admin/elements/_toolbar.html.erb

@@ -43,5 +43,5 @@
       </button>
     </alchemy-delete-element-button>
   </sl-tooltip>
-  <%= render Alchemy::Admin::PublishElementButton.new(element:) %>
+  <%= render Alchemy.config.admin_components.element_publish_button.new(element:) %>
 </div>

data/app/views/alchemy/admin/elements/create.turbo_stream.erb

@@ -35,4 +35,4 @@
   <%= Alchemy.t(:successfully_added_element) %>
 </alchemy-growl>
 
-<alchemy-action name="closeCurrentDialog"></alchemy-action>
+<turbo-stream action="close_current_dialog"></turbo-stream>

data/app/views/alchemy/admin/elements/index.html.erb

@@ -1,7 +1,7 @@
 <%= turbo_frame_tag "alchemy_elements_window" do %>
   <alchemy-elements-window-handle></alchemy-elements-window-handle>
   <alchemy-elements-window>
-    <div class="elements-window-toolbar">
+    <div class="elements-window-toolbar toolbar">
       <%= render Alchemy::Admin::ToolbarButton.new(
         url: alchemy.new_admin_element_path(page_version_id: @page_version.id),
         icon: :add,

data/app/views/alchemy/admin/elements/publish.turbo_stream.erb

@@ -7,8 +7,8 @@
       <%= Alchemy.t(:successfully_scheduled_element) %>
     </alchemy-growl>
   <% end %>
-  <alchemy-action name="closeCurrentDialog"></alchemy-action>
-  <alchemy-action name="reloadPreview"></alchemy-action>
+  <turbo-stream action="close_current_dialog"></turbo-stream>
+  <turbo-stream action="reload_preview"></turbo-stream>
   <%= turbo_stream.replace "element_#{@element.id}" do %>
     <%= render Alchemy::Admin::ElementEditor.new(
       element: @element

data/app/views/alchemy/admin/elements/update.turbo_stream.erb

@@ -0,0 +1,31 @@
+<% unless @element_validated %>
+  <alchemy-growl type="warn"><%= @warning %></alchemy-growl>
+
+  <% @element.ingredients_with_errors.each do |ingredient| %>
+    <%= turbo_stream.replace ingredient do %>
+      <%= render Alchemy::Admin::IngredientEditor.new(ingredient: ingredient) %>
+    <% end %>
+  <% end %>
+<% else %>
+  <alchemy-growl><%= Alchemy.t(:element_saved) %></alchemy-growl>
+
+  <%# Re-render the preview text quote of the element and all its ancestors,
+      whose quotes are derived from their nested elements' preview text. %>
+  <% el = @element %>
+  <% while el %>
+    <%= turbo_stream.replace "element_#{el.id}_preview_text_quote" do %>
+      <%= render "alchemy/admin/elements/preview_text_quote", element: el %>
+    <% end %>
+    <% el = el.parent_element %>
+  <% end %>
+
+  <%= turbo_stream.replace "publish_page_button" do %>
+    <%= render Alchemy::Admin::PublishPageButton.new(page: @element.page) %>
+  <% end %>
+
+  <% @element.ingredients.each do |ingredient| %>
+    <% if ingredient.settings[:anchor] %>
+      <turbo-stream action="update_anchor_icon" ingredient-id="<%= ingredient.id %>" active="<%= ingredient.dom_id.present? %>"></turbo-stream>
+    <% end %>
+  <% end %>
+<% end %>

data/app/views/alchemy/admin/ingredients/update.turbo_stream.erb

@@ -1,7 +1,10 @@
-<alchemy-action name="closeCurrentDialog"></alchemy-action>
-<alchemy-action name="reloadPreview"></alchemy-action>
+<alchemy-growl>
+  <%= Alchemy.t(:updated_ingredient, ingredient: @ingredient.translated_role) %>
+</alchemy-growl>
+<turbo-stream action="close_current_dialog"></turbo-stream>
+<turbo-stream action="reload_preview"></turbo-stream>
 <% if @ingredient.settings[:anchor] %>
-<alchemy-action name="updateAnchorIcon" params="<%= [@ingredient.id, @ingredient.dom_id.present?].to_json %>"></alchemy-action>
+<turbo-stream action="update_anchor_icon" ingredient-id="<%= @ingredient.id %>" active="<%= @ingredient.dom_id.present? %>"></turbo-stream>
 <% end %>
 <% if @ingredient.type == "Alchemy::Ingredients::Picture" && @ingredient.css_class.present? %>
   <%= turbo_stream.replace @ingredient do %>

data/app/views/alchemy/admin/languages/_table.html.erb

@@ -14,5 +14,3 @@
   <% table.delete_button tooltip: Alchemy.t(:delete_language) %>
   <% table.edit_button tooltip: Alchemy.t(:edit_language), dialog_size: "430x415" %>
 <% end %>
-
-<%= render "alchemy/admin/resources/pagination", resources: @languages %>

data/app/views/alchemy/admin/languages/index.html.erb

@@ -1,45 +1,41 @@
-<% label_title = Alchemy.t("Create #{resource_name}", default: Alchemy.t('Create')) %>
-
 <% content_for :toolbar do %>
   <div class="toolbar_buttons">
     <%= render 'alchemy/admin/partials/site_select' %>
     <%= render Alchemy::Admin::ToolbarButton.new(
       icon: :plus,
-      label: label_title,
+      label: create_resource_label,
+      primary: true,
       url: new_resource_path,
-      title: label_title,
       hotkey: 'alt+n',
       dialog_options: {
-        title: label_title,
+        title: create_resource_label,
         size: "430x415"
       },
       if_permitted_to: [:create, Alchemy::Language]
-    ) if @languages.any? %>
+    ) %>
   </div>
   <%= render 'alchemy/admin/partials/search_form' %>
 <% end %>
 
-<div id="archive_all" class="resources-table-wrapper">
-  <% if @languages.any? %>
-    <%= render 'alchemy/admin/resources/table_header' %>
-    <%= render 'table' %>
-  <% elsif search_filter_params[:q].present? %>
-    <%= render_message { Alchemy.t('Nothing found') } %>
-  <% else %>
-    <div class="panel no-resource-found">
-      <%= render_message do %>
-        <%== Alchemy.t('alchemy/language', scope: :no_resource_found) %>
-      <% end %>
-      <%= render 'form', language: Alchemy::Language.new(
-          name: Alchemy.config.default_language.name,
-          code: Alchemy.config.default_language.code,
-          page_layout: Alchemy.config.default_language.page_layout,
-          frontpage_name: Alchemy.config.default_language.frontpage_name,
-          site: Alchemy::Current.site,
-          default: true,
-          public: true
-        )
-       %>
-    </div>
+<% if @languages.any? %>
+  <%= render "alchemy/admin/resources/table_header" %>
+  <div class="resources-table-wrapper">
+    <%= render "table" %>
+  </div>
+  <%= render "alchemy/admin/resources/pagination", resources: @languages %>
+<% elsif search_filter_params.present? %>
+  <%= render_message { Alchemy.t('Nothing found') } %>
+<% else %>
+  <%= render "alchemy/admin/resources/empty_state" do %>
+    <%= render "form", language: Alchemy::Language.new(
+        name: Alchemy.config.default_language.name,
+        code: Alchemy.config.default_language.code,
+        page_layout: Alchemy.config.default_language.page_layout,
+        frontpage_name: Alchemy.config.default_language.frontpage_name,
+        site: Alchemy::Current.site,
+        default: true,
+        public: true
+      )
+    %>
   <% end %>
-</div>
+<% end %>

data/app/views/alchemy/admin/layoutpages/_layoutpage.html.erb

@@ -43,14 +43,12 @@
     <%- end -%>
     <%- if can?(:copy, layoutpage) -%>
       <sl-tooltip content="<%= Alchemy.t(:copy_page) %>">
-        <%= link_to(
+        <%= button_to(
           render_icon("file-copy"),
           alchemy.insert_admin_clipboard_path(
             remarkable_type: layoutpage.class.name.demodulize.underscore.pluralize,
             remarkable_id: layoutpage.id
           ),
-          remote: true,
-          method: 'post',
           class: "icon_button"
         ) %>
       </sl-tooltip>

data/app/views/alchemy/admin/layoutpages/edit.html.erb

@@ -1,5 +1,5 @@
 <%= turbo_frame_tag @page do %>
-  <%= alchemy_form_for [:admin, @page], url: alchemy.admin_layoutpage_path(@page), class: 'edit_page', remote: false do |f| %>
+  <%= alchemy_form_for [:admin, @page], url: alchemy.admin_layoutpage_path(@page), class: 'edit_page' do |f| %>
     <%= f.input :name, autofocus: true %>
     <div class="input tags">
       <%= f.label :tag_list, class: "control-label" %>

data/app/views/alchemy/admin/layoutpages/index.html.erb

@@ -3,7 +3,7 @@
   <%= render 'alchemy/admin/partials/site_select' %>
   <%= render 'alchemy/admin/partials/language_tree_select' %>
   <%= render Alchemy::Admin::ToolbarButton.new(
-    icon: "file-add",
+    icon: "add",
     url: alchemy.new_admin_page_path(language: @current_language, layoutpage: true),
     hotkey: 'alt+n',
     dialog_options: {
@@ -12,6 +12,7 @@
       overflow: true
     },
     label: Alchemy.t('Add global page'),
+    primary: true,
     tooltip_placement: "top-start",
     if_permitted_to: [:create, Alchemy::Page]
   ) %>
@@ -19,10 +20,28 @@
 </div>
 <% end %>
 
-<h4 id="sitemap_heading">
-  <span class="page_name"><%= Alchemy::Page.human_attribute_name(:name) %></span>
-</h4>
+<% if @layout_pages.any? %>
+  <h4 id="sitemap_heading">
+    <span class="page_name"><%= Alchemy::Page.human_attribute_name(:name) %></span>
+  </h4>
 
-<ul class="list" id="layoutpages">
-  <%= render partial: "layoutpage", collection: @layout_pages %>
-</ul>
+  <ul class="list" id="layoutpages">
+    <%= render partial: "layoutpage", collection: @layout_pages %>
+  </ul>
+<% else %>
+  <%= render "alchemy/admin/resources/empty_state",
+    notice: Alchemy.t(:layoutpages, scope: :no_resource_found) do %>
+    <% if can?(:create, Alchemy::Page) %>
+      <%= link_to_dialog(
+        render_icon(:add) + Alchemy.t("Add global page"),
+        alchemy.new_admin_page_path(language: @current_language, layoutpage: true),
+        {
+          title: Alchemy.t("Add global page"),
+          size: "340x170",
+          overflow: true
+        },
+        class: "button with_icon"
+      ) %>
+    <% end %>
+  <% end %>
+<% end %>

data/app/views/alchemy/admin/nodes/_form.html.erb

@@ -1,4 +1,5 @@
-<%= alchemy_form_for([:admin, node], id: "node_form") do |f| %>
+<alchemy-node-form>
+<%= alchemy_form_for([:admin, node]) do |f| %>
   <% if node.new_record? && node.root? %>
     <%= f.input :menu_type,
       collection: Alchemy::Current.language.available_menu_names.map { |n| [I18n.t(n, scope: [:alchemy, :menu_names]), n] },
@@ -30,23 +31,4 @@
   <%= f.hidden_field :language_id %>
   <%= f.submit button_label %>
 <% end %>
-
-<script type="module">
-  const nodeName = document.getElementById("node_name")
-  const nodeUrl = document.getElementById("node_url")
-  const form = document.getElementById("node_form")
-
-  form.addEventListener("Alchemy.RemoteSelect.Change", (event) => {
-    const page = event.detail.added
-
-    if (page) {
-      nodeName.setAttribute("placeholder", page.name)
-      nodeUrl.value = page.url_path
-      nodeUrl.setAttribute("disabled", "disabled")
-    } else {
-      nodeName.removeAttribute("placeholder")
-      nodeUrl.value = ""
-      nodeUrl.removeAttribute("disabled")
-    }
-  })
-</script>
+</alchemy-node-form>