maglevcms 2.1.0 → 3.0.0.beta2

data/app/helpers/maglev/application_helper.rb

@@ -1,33 +1,163 @@
 # frozen_string_literal: true
 
-require 'vite_rails/version'
-require 'vite_rails/tag_helpers'
-
+# rubocop:disable Metrics/ModuleLength
 module Maglev
   module ApplicationHelper
-    include ::ViteRails::TagHelpers
+    def turbo_stream
+      # we don't want to pollute the global Turbo::Streams::TagBuilder
+      Maglev::Turbo::Streams::TagBuilder.new(self)
+    end
 
-    def vite_manifest
-      use_engine_vite? ? maglev_asset_manifest : super
+    def maglev_editor_javascript_tags
+      maglev_importmap_tags(:editor, 'editor')
     end
 
-    def maglev_live_preview_client_javascript_tag
-      # no need to render the tag when the site is being visited outside the editor
+    def maglev_client_javascript_tags
       return '' unless maglev_rendering_mode == :editor
 
-      entries = maglev_asset_manifest.resolve_entries(*%w[live-preview-rails-client], type: :javascript)
+      maglev_importmap_tags(:client, 'maglev-client')
+    end
+
+    def maglev_importmap_tags(namespace, entry_point)
+      safe_join [
+        javascript_inline_importmap_tag(Maglev::Engine.importmaps[namespace].to_json(resolver: self)),
+        javascript_importmap_module_preload_tags(Maglev::Engine.importmaps[namespace]),
+        javascript_import_module_tag(entry_point)
+      ], "\n"
+    end
+
+    def maglev_editor_title
+      case maglev_config.title
+      when nil
+        'Maglev - EDITOR'
+      when String
+        maglev_config.title
+      when Proc
+        instance_exec(maglev_site, &maglev_config.title)
+      end
+    end
+
+    def maglev_editor_logo_url
+      case maglev_config.logo
+      when nil
+        asset_path('maglev/logo.svg')
+      when String
+        asset_path(maglev_config.logo)
+      when Proc
+        instance_exec(maglev_site, &maglev_config.logo)
+      end
+    end
+
+    def maglev_favicon_url
+      case maglev_config.favicon
+      when nil
+        asset_path('maglev/favicon.svg')
+      when String
+        asset_path(maglev_config.favicon)
+      when Proc
+        instance_exec(maglev_site, &maglev_config.favicon)
+      end
+    end
+
+    def maglev_primary_hex_color
+      color = maglev_config.primary_color
+      if color =~ /^\#(\d)(\d)(\d)$/
+        r_value = ''.rjust(2, Regexp.last_match(1))
+        g_value = ''.rjust(2, Regexp.last_match(2))
+        b_value = ''.rjust(2, Regexp.last_match(3))
+        "##{r_value}#{g_value}#{b_value}"
+      else
+        color
+      end
+    end
 
-      javascript_include_tag(
-        *entries.fetch(:scripts).flatten.uniq,
-        crossorigin: 'anonymous',
-        type: 'module',
-        defer: true,
-        nonce: true
-      )
+    def maglev_primary_rgb_color
+      maglev_primary_hex_color
+        .gsub('#', '')
+        .scan(/.{2}/)
+        .map { |value| value.to_i(16) }
     end
 
-    def maglev_asset_manifest
-      ::Maglev::Engine.vite_ruby.manifest
+    # UI helpers
+
+    def maglev_button_label(label, options = {})
+      options = (options || {}).with_indifferent_access
+
+      render 'maglev/editor/shared/button_label', label: label,
+                                                  pending_label: options[:pending] || label,
+                                                  success_label: options[:success] || label,
+                                                  error_label: options[:error] || label
+    end
+
+    # rubocop:disable Metrics/MethodLength
+    def maglev_button_classes(...)
+      ClassVariants.build(
+        base: %(
+        rounded-xs transition-colors transition-background duration-200 text-center cursor-pointer
+        group-[.is-success]/form:bg-green-500/95 group-[.is-success]/form:hover:bg-green-500/100
+        group-[.is-success]/form:disabled:bg-green-500/75
+        group-[.is-error]/form:bg-red-500/95 group-[.is-error]/form:hover:bg-red-500/100
+        group-[.is-error]/form:disabled:bg-red-500/75
+        ),
+        variants: {
+          color: {
+            primary: 'text-white bg-editor-primary/95 hover:bg-editor-primary/100 disabled:bg-editor-primary/75',
+            secondary: 'text-gray-800 hover:bg-gray-100'
+          },
+          size: {
+            big: 'flex items-center justify-center w-full px-6 py-4',
+            medium: 'inline-flex items-center justify-center px-4 py-2'
+          }
+        },
+        defaults: {
+          color: :primary,
+          size: :medium
+        }
+      ).render(...)
+    end
+    # rubocop:enable Metrics/MethodLength
+
+    def maglev_icon_button_classes(...)
+      ClassVariants.build(
+        base: %(h-7 w-7 flex items-center justify-center rounded-full focus:outline-none
+        transition-colors duration-200 cursor-pointer bg-gray-600/0 text-gray-800
+        hover:bg-gray-600/10 hover:text-gray-900)
+      ).render(...)
+    end
+
+    def maglev_flash_message
+      message, color, icon_name = if flash[:notice].present?
+                                    [flash[:notice], :green, 'checkbox_circle']
+                                  elsif flash[:alert].present?
+                                    [flash[:alert], :red, 'error_warning']
+                                  end
+
+      return '' if message.blank?
+
+      render Maglev::Uikit::BadgeComponent.new(color: color,
+                                               icon_name: icon_name,
+                                               disappear_after: 3.seconds).with_content(message)
+    end
+
+    def maglev_page_icon(page, size: '1.15rem')
+      icon_name = page.index? ? 'home' : 'file'
+      render Maglev::Uikit::IconComponent.new(name: icon_name, size: size, class_names: 'shrink-0')
+    end
+
+    def maglev_page_preview_reload_data
+      {
+        controller: 'dispatcher',
+        action: 'click->dispatcher#trigger',
+        dispatcher_event_name_value: 'page-preview:reload'
+      }
+    end
+
+    def maglev_live_preview_client_javascript_tag
+      # rubocop:disable Layout/LineLength
+      Rails.logger.warn '🚨 maglev_live_preview_client_javascript_tag is deprecated, use maglev_client_javascript_tags instead'
+      # rubocop:enable Layout/LineLength
+      maglev_client_javascript_tags
     end
   end
 end
+# rubocop:enable Metrics/ModuleLength

data/app/helpers/maglev/editor/pages_helper.rb

@@ -0,0 +1,23 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Editor
+    module PagesHelper
+      def maglev_edit_page_title(page)
+        if current_maglev_page == page
+          t('maglev.editor.pages.edit.current_page.title')
+        else
+          t('maglev.editor.pages.edit.title')
+        end
+      end
+
+      def maglev_page_back_path
+        if query_params.present?
+          editor_pages_path(**query_params, **maglev_editing_route_context)
+        else
+          editor_real_root_path(**maglev_editing_route_context)
+        end
+      end
+    end
+  end
+end

data/app/helpers/maglev/editor/section_blocks_helper.rb

@@ -0,0 +1,124 @@
+# frozen_string_literal: true
+
+# rubocop:disable Metrics/ModuleLength
+module Maglev
+  module Editor
+    module SectionBlocksHelper
+      def delete_section_block_button(section, section_block, maglev_editing_route_context)
+        button_to(
+          editor_section_block_path(section, section_block, **maglev_editing_route_context),
+          method: :delete,
+          class: maglev_icon_button_classes,
+          data: { turbo_confirm: t('maglev.editor.section_blocks.index.confirm_delete') },
+          form: delete_section_block_button_form_attributes(section, section_block)
+        ) do
+          render Maglev::Uikit::IconComponent.new(name: 'delete_bin', size: '1.15rem')
+        end
+      end
+
+      def delete_section_block_button_form_attributes(section, section_block)
+        {
+          data: {
+            action: 'turbo:submit-end->editor-preview-notification-center#deleteSectionBlock',
+            'editor-preview-notification-center-section-id-param': section.id,
+            'editor-preview-notification-center-section-block-id-param': section_block.id
+          }
+        }
+      end
+
+      def add_section_block_button(section, block_definitions)
+        if block_definitions.blank?
+          ''
+        elsif block_definitions.one?
+          add_section_block_no_dropdown_button(section, block_definitions.first.type)
+        else
+          add_section_block_dropdown_button(section, block_definitions)
+        end
+      end
+
+      def add_section_block_no_dropdown_button(section, block_type)
+        button_to(
+          t('maglev.editor.section_blocks.index.add_button'),
+          editor_section_blocks_path(section, block_type: block_type, lock_version: section.lock_version,
+                                              **maglev_editing_route_context),
+          class: maglev_button_classes(size: :big),
+          **section_block_button_common_attributes(section)
+        )
+      end
+
+      def add_section_block_dropdown_button(_section, block_definitions)
+        render Maglev::Uikit::DropdownComponent.new do |dropdown|
+          dropdown.with_trigger do
+            button_tag(t('maglev.editor.section_blocks.index.add_button'),
+                       class: maglev_button_classes(size: :big),
+                       **section_block_button_dropdown_attributes)
+          end
+
+          content_tag(:div, class: 'p-4 min-w-64') do
+            render 'maglev/editor/section_blocks/new', blocks: block_definitions, parent_id: nil
+          end
+        end
+      end
+
+      def add_child_section_block_button(section, section_block)
+        block_definitions = section.child_block_definitions_of(section_block.id)
+        if block_definitions.one?
+          add_child_section_block_no_dropdown_button(section, section_block.id, block_definitions.first.type)
+        elsif block_definitions.any?
+          add_child_section_block_dropdown_button(section, section_block.id, block_definitions)
+        end
+      end
+
+      def add_child_section_block_no_dropdown_button(section, parent_id, block_type)
+        button_to(
+          editor_section_blocks_path(section, block_type: block_type, parent_id: parent_id,
+                                              lock_version: section.lock_version,
+                                              **maglev_editing_route_context),
+          class: maglev_icon_button_classes,
+          name: 'add_child_section_block',
+          **section_block_button_common_attributes(section)
+        ) do
+          render Maglev::Uikit::IconComponent.new(name: 'add', size: '1.15rem')
+        end
+      end
+
+      def add_child_section_block_dropdown_button(_section, parent_id, block_definitions)
+        render Maglev::Uikit::DropdownComponent.new do |dropdown|
+          dropdown.with_trigger do
+            button_tag(class: maglev_icon_button_classes, **section_block_button_dropdown_attributes) do
+              render Maglev::Uikit::IconComponent.new(name: 'add', size: '1.15rem')
+            end
+          end
+
+          content_tag(:div, class: 'p-4 min-w-64') do
+            render 'maglev/editor/section_blocks/new', blocks: block_definitions, parent_id: parent_id
+          end
+        end
+      end
+
+      def section_block_button_common_attributes(section)
+        {
+          method: :post,
+          form: {
+            data: {
+              turbo_frame: '_top',
+              action: 'turbo:submit-end->editor-preview-notification-center#addSectionBlock',
+              'editor-preview-notification-center-section-id-param': section.id
+            }
+          }
+        }
+      end
+
+      def section_block_button_dropdown_attributes
+        {
+          type: 'button',
+          data: {
+            action: 'click->uikit-dropdown#toggle',
+            'uikit-dropdown-target': 'button'
+          }
+        }
+      end
+    end
+  end
+end
+# rubocop:enable Metrics/ModuleLength

data/app/helpers/maglev/editor/settings_helper.rb

@@ -0,0 +1,52 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Editor
+    module SettingsHelper
+      def section_form_settings(section, advanced: false)
+        render Maglev::Editor::SettingsGroupComponent.new(
+          values: section.settings,
+          definitions: advanced ? section.definition.advanced_settings : section.definition.main_settings,
+          paths: section_settings_paths,
+          scope: {
+            input: 'section',
+            i18n: "maglev.themes.#{section.theme_id}.sections.#{section.type}"
+          }
+        )
+      end
+
+      def section_block_form_settings(section, section_block, advanced: false)
+        render Maglev::Editor::SettingsGroupComponent.new(
+          values: section_block.settings,
+          definitions: advanced ? section_block.definition.advanced_settings : section_block.definition.main_settings,
+          paths: section_settings_paths,
+          scope: {
+            input: 'section_block',
+            i18n: "maglev.themes.#{section.theme_id}.sections.#{section.type}.blocks.types.#{section_block.type}"
+          }
+        )
+      end
+
+      def style_form_settings(style, theme)
+        render Maglev::Editor::SettingsGroupComponent.new(
+          values: style,
+          definitions: theme.style_settings,
+          scope: { input: 'style', i18n: 'maglev.editor' }
+        )
+      end
+
+      def section_settings_paths
+        {
+          collection_items_path: lambda { |definition, _|
+            editor_combobox_collection_items_path(collection_id: definition.options[:collection_id])
+          },
+          assets_path: ->(_, context) { editor_assets_path(source: context[:source], picker: true) },
+          edit_link_path: lambda { |_, context|
+            edit_editor_link_path(input_name: context[:input_name], link: context[:value])
+          },
+          icons_path: ->(_, context) { editor_icons_path(source: context[:source]) }
+        }
+      end
+    end
+  end
+end

data/app/helpers/maglev/page_preview_helper.rb

@@ -46,7 +46,7 @@ module Maglev
       link = links[locale.to_sym]
       return nil if link.nil?
 
-      "#{request.base_url}#{link}"
+      link.start_with?('http') ? link : "#{request.base_url}#{link}"
     end
 
     def maglev_site_link

data/app/lib/maglev/form/form_builder.rb

@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Form
+    class FormBuilder < ActionView::Helpers::FormBuilder
+      include Maglev::Form::Inputs::TextField
+      include Maglev::Form::Inputs::ImageField
+      include Maglev::Form::Inputs::CheckBox
+      include Maglev::Form::Inputs::Textarea
+      include Maglev::Form::Inputs::Combobox
+      include Maglev::Form::Inputs::Select
+
+      private
+
+      def field_attributes(method)
+        {
+          id: field_id(method),
+          name: field_name(method),
+          content: label_translation(method)
+        }
+      end
+
+      def error_messages(method)
+        return unless object.errors.any? && object.errors.messages_for(method).present?
+
+        object.errors.messages_for(method).join(', ')
+      end
+
+      def label_translation(method)
+        content = nil
+        ActionView::Helpers::Tags::Label.new(@object_name, method, @template).render do |builder|
+          content = builder.translation
+        end
+        content
+      end
+    end
+  end
+end

data/app/lib/maglev/form/inputs/check_box.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Form
+    module Inputs
+      module CheckBox
+        def check_box(method, options = {})
+          attributes = field_attributes(method)
+
+          @template.render(Maglev::Uikit::Form::CheckboxComponent.new(
+                             label: options[:label].presence || attributes[:content],
+                             name: attributes[:name],
+                             checked: object.public_send(method),
+                             placeholder: options[:placeholder]
+                           ))
+        end
+      end
+    end
+  end
+end

data/app/lib/maglev/form/inputs/combobox.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Form
+    module Inputs
+      module Combobox
+        def combobox(method, options = {})
+          attributes = field_attributes(method)
+
+          @template.render(Maglev::Uikit::Form::ComboboxComponent.new(
+                             label: options[:label].presence || attributes[:content],
+                             name: attributes[:name],
+                             search_path: options[:search_path],
+                             options: combobox_component_options(method, options),
+                             html_options: options[:html_options]
+                           ))
+        end
+
+        protected
+
+        def combobox_component_options(method, options)
+          {
+            value: options.key?(:value) ? options[:value] : object.public_send(method),
+            selected_label: options[:selected_label],
+            label_name: options[:label_name],
+            placeholder: options[:placeholder],
+            error: error_messages(method)
+          }
+        end
+      end
+    end
+  end
+end

data/app/lib/maglev/form/inputs/image_field.rb

@@ -0,0 +1,39 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Form
+    module Inputs
+      module ImageField
+        def image_field(method, options = {})
+          attributes = field_attributes(method)
+
+          @template.render(Maglev::Uikit::Form::ImageFieldComponent.new(
+                             name: attributes[:name],
+                             search_path: image_search_path(attributes, options),
+                             options: image_field_options(method, attributes, options),
+                             alt_text: options[:alt_text]
+                           ))
+        end
+
+        protected
+
+        def image_field_options(method, attributes, options)
+          {
+            label: options[:label].presence || attributes[:content],
+            value: object.public_send(method),
+            spread_fields: options[:spread_fields] || false
+          }
+        end
+
+        def image_search_path(attributes, options)
+          if options[:search_path].is_a?(Proc)
+            source = attributes[:name].to_s.parameterize.underscore # same as the dom id of the field
+            options[:search_path].call({ picker: true, source: source })
+          else
+            options[:search_path]
+          end
+        end
+      end
+    end
+  end
+end

data/app/lib/maglev/form/inputs/richtext.rb

@@ -0,0 +1,34 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Form
+    module Inputs
+      module Richtext
+        def richtext(method, options = {})
+          attributes = field_attributes(method)
+
+          @template.render(Maglev::Uikit::Form::RichtextComponent.new(
+                             label: options[:label].presence || attributes[:content],
+                             name: attributes[:name],
+                             options: richtext_component_options(method, options),
+                             html_options: richtext_component_html_options(options)
+                           ))
+        end
+
+        def richtext_component_options(method, options)
+          {
+            value: options.key?(:value) ? options[:value] : object.public_send(method),
+            placeholder: options[:placeholder],
+            line_break: options[:line_break],
+            edit_link_path: options[:edit_link_path],
+            error: error_messages(method)
+          }
+        end
+
+        def richtext_component_html_options(options)
+          options[:html_options] || {}
+        end
+      end
+    end
+  end
+end

data/app/lib/maglev/form/inputs/select.rb

@@ -0,0 +1,34 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Form
+    module Inputs
+      module Select
+        def select(method, select_options, options = {})
+          attributes = field_attributes(method)
+
+          @template.render(Maglev::Uikit::Form::SelectComponent.new(
+                             label: options[:label].presence || attributes[:content],
+                             name: attributes[:name],
+                             choices: select_options,
+                             options: select_component_options(method, options),
+                             html_options: select_component_html_options(options)
+                           ))
+        end
+
+        def select_component_options(method, options)
+          {
+            value: options.key?(:value) ? options[:value] : object.public_send(method),
+            prompt: options[:prompt],
+            include_blank: options[:include_blank],
+            error: error_messages(method)
+          }
+        end
+
+        def select_component_html_options(options)
+          options[:html_options] || {}
+        end
+      end
+    end
+  end
+end

data/app/lib/maglev/form/inputs/text_field.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Form
+    module Inputs
+      module TextField
+        def text_field(method, options = {})
+          attributes = field_attributes(method)
+
+          @template.render(Maglev::Uikit::Form::TextFieldComponent.new(
+                             label: options[:label].presence || attributes[:content],
+                             name: attributes[:name],
+                             options: text_field_component_options(method, options),
+                             html_options: text_field_component_html_options(options)
+                           ))
+        end
+
+        def text_field_component_options(method, options)
+          {
+            value: options.key?(:value) ? options[:value] : object.public_send(method),
+            placeholder: options[:placeholder],
+            error: error_messages(method)
+          }
+        end
+
+        def text_field_component_html_options(options)
+          options[:html_options] || {}
+        end
+      end
+    end
+  end
+end

data/app/lib/maglev/form/inputs/textarea.rb

@@ -0,0 +1,30 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Form
+    module Inputs
+      module Textarea
+        def textarea(method, options = {})
+          attributes = field_attributes(method)
+
+          @template.render(Maglev::Uikit::Form::TextareaComponent.new(
+                             label: options[:label].presence || attributes[:content],
+                             name: attributes[:name],
+                             options: textarea_component_options(method, options),
+                             html_options: options[:html_options] || {}
+                           ))
+        end
+
+        def textarea_component_options(method, options)
+          {
+            value: object.public_send(method),
+            rows: options[:rows],
+            max_length: options[:max_length],
+            placeholder: options[:placeholder],
+            error: error_messages(method)
+          }
+        end
+      end
+    end
+  end
+end

data/app/lib/maglev/turbo/streams/tag_builder.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+module Maglev
+  module Turbo
+    module Streams
+      class TagBuilder < ::Turbo::Streams::TagBuilder
+        def console_log(message)
+          turbo_stream_action_tag :console_log, message: message
+        end
+
+        def dispatch_event(type, payload:)
+          turbo_stream_action_tag :dispatch_event, type: type, payload: payload
+        end
+      end
+    end
+  end
+end