pages_core 3.10.2 → 3.11.0

data/app/helpers/pages_core/admin/admin_helper.rb

@@ -6,6 +6,7 @@ module PagesCore
       include PagesCore::Admin::ContentTabsHelper
       include PagesCore::Admin::DateRangeHelper
       include PagesCore::Admin::ImageUploadsHelper
+      include PagesCore::Admin::LocalesHelper
       include PagesCore::Admin::PageJsonHelper
       include PagesCore::Admin::LabelledFieldHelper
       include PagesCore::Admin::TagEditorHelper

data/app/helpers/pages_core/admin/form_builder.rb

@@ -4,12 +4,13 @@ module PagesCore
   module Admin
     class FormBuilder < PagesCore::FormBuilder
       include DynamicImage::Helper
+      include PagesCore::Admin::LocalizedFormBuilder
 
       def rich_text_area(attr, options = {})
         @template.rich_text_area_tag(
           "#{object_name}[#{attr}]",
           object.send(attr),
-          options
+          localized_form_field_options(attr).merge(options)
         )
       end
 

data/app/helpers/pages_core/admin/image_uploads_helper.rb

@@ -39,7 +39,7 @@ module PagesCore
           width: width,
           caption: caption,
           locale: locale || I18n.default_locale,
-          locales: PagesCore.config.locales
+          locales: locales_with_dir
         )
       end
     end

data/app/helpers/pages_core/admin/locales_helper.rb

@@ -0,0 +1,26 @@
+# frozen_string_literal: true
+
+module PagesCore
+  module Admin
+    module LocalesHelper
+      def locales_with_dir
+        locales = PagesCore.config.locales || {}
+        locales.each_with_object({}) do |(key, name), hash|
+          hash[key] = { name: name, dir: locale_direction(key) }
+        end
+      end
+
+      def locale_direction(locale)
+        rtl_locale?(locale) ? "rtl" : "ltr"
+      end
+
+      def rtl_locale?(locale)
+        rtl_locales.include?(locale.to_s)
+      end
+
+      def rtl_locales
+        %w[ar arc dv fa ha he khw ks ku ps ur yi]
+      end
+    end
+  end
+end

data/app/helpers/pages_core/admin/localized_form_builder.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+module PagesCore
+  module Admin
+    module LocalizedFormBuilder
+      include PagesCore::Admin::LocalesHelper
+
+      def text_area(method, options = {})
+        super(method, localized_form_field_options(method).merge(options))
+      end
+
+      def text_field(method, options = {})
+        super(method, localized_form_field_options(method).merge(options))
+      end
+
+      private
+
+      def localized_form_field_options(method)
+        unless object.is_a?(LocalizableModel::InstanceMethods) &&
+               object.class.localized_attributes.include?(method.to_sym)
+          return {}
+        end
+
+        { dir: rtl_locale?(object.locale) ? "rtl" : "ltr",
+          lang: object.locale }
+      end
+    end
+  end
+end

data/app/helpers/pages_core/form_builder.rb

@@ -3,12 +3,7 @@
 module PagesCore
   class FormBuilder < ActionView::Helpers::FormBuilder
     include ActionView::Helpers::TagHelper
-
-    def field_with_label(attr, str, label = nil, class_name = nil)
-      classes = ["field", class_name]
-      classes << "field-with-errors" if object.errors[attr].any?
-      tag.div(label_for(attr, label) + str, class: classes.compact.join(" "))
-    end
+    include PagesCore::LabelledFormBuilder
 
     def image_file_preview(attribute)
       return "" unless object.send(attribute) &&
@@ -22,103 +17,5 @@ module PagesCore
     def image_file_field(attribute, options = {})
       safe_join [image_file_preview(attribute), file_field(attribute, options)]
     end
-
-    def label_and_errors(attribute, label_text)
-      return label_text unless object.errors[attribute].any?
-
-      error = tag.span(object.errors[attribute].first, class: "error")
-      safe_join([label_text, error], " ")
-    end
-
-    def label_for(attribute, label_text = nil)
-      label_text ||= object.class.human_attribute_name(attribute)
-      tag.label(label_and_errors(attribute, label_text),
-                for: [object.class.to_s.underscore, attribute].join("_"))
-    end
-
-    def labelled_check_box(
-      attr, label = nil, options = {}, checked = "1", unchecked = "0"
-    )
-      labelled_field(attr, label, options) do |opts|
-        check_box(attr, opts, checked, unchecked)
-      end
-    end
-
-    def labelled_country_select(
-      attr, label = nil, priority = {}, opts = {}, html_opts = {}
-    )
-      if priority.is_a?(Hash)
-        return labelled_field(attr, label, priority) do |options|
-          country_select(attr, options, opts, html_opts)
-        end
-      end
-      labelled_field(attr, label, opts) do |options|
-        country_select(attr, priority, options, html_opts)
-      end
-    end
-
-    def labelled_date_select(attribute, label_text = nil, options = {})
-      labelled_field(attribute, label_text, options) do |opts|
-        date_select(attribute, opts)
-      end
-    end
-
-    def labelled_datetime_select(attribute, label_text = nil, options = {})
-      labelled_field(attribute, label_text, options) do |opts|
-        datetime_select(attribute, opts)
-      end
-    end
-
-    def labelled_file_field(attribute, label_text = nil, options = {})
-      labelled_field(attribute, label_text, options) do |opts|
-        file_field(attribute, opts)
-      end
-    end
-
-    def labelled_image_file_field(attribute, label_text = nil, options = {})
-      labelled_field(attribute, label_text, options) do |opts|
-        image_file_field(attribute, opts)
-      end
-    end
-
-    def labelled_password_field(attribute, label_text = nil, options = {})
-      labelled_field(attribute, label_text, options, "text-field") do |opts|
-        password_field(attribute, opts)
-      end
-    end
-
-    def labelled_select(attribute, choices, label_text = nil, options = {})
-      labelled_field(attribute, label_text, options) do |opts|
-        select(attribute, choices, opts)
-      end
-    end
-
-    def labelled_text_area(attribute, label_text = nil, options = {})
-      labelled_field(attribute, label_text, options, "text-area") do |opts|
-        text_area(attribute, opts)
-      end
-    end
-
-    def labelled_text_field(attribute, label_text = nil, options = {})
-      labelled_field(attribute, label_text, options, "text-field") do |opts|
-        text_field(attribute, opts)
-      end
-    end
-
-    def labelled_time_select(attribute, label_text = nil, options = {})
-      labelled_field(attribute, label_text, options) do |opts|
-        time_select(attribute, opts)
-      end
-    end
-
-    protected
-
-    def labelled_field(attr, label_text = nil, options = {}, class_name = nil)
-      if label_text.is_a?(Hash) && options == {}
-        options = label_text
-        label_text = nil
-      end
-      field_with_label(attr, yield(options), label_text, class_name)
-    end
   end
 end

data/app/helpers/pages_core/labelled_form_builder.rb

@@ -0,0 +1,109 @@
+# frozen_string_literal: true
+
+module PagesCore
+  module LabelledFormBuilder
+    def field_with_label(attr, str, label = nil, class_name = nil)
+      classes = ["field", class_name]
+      classes << "field-with-errors" if object.errors[attr].any?
+      tag.div(label_for(attr, label) + str, class: classes.compact.join(" "))
+    end
+
+    def label_and_errors(attribute, label_text)
+      return label_text unless object.errors[attribute].any?
+
+      error = tag.span(object.errors[attribute].first, class: "error")
+      safe_join([label_text, error], " ")
+    end
+
+    def label_for(attribute, label_text = nil)
+      label_text ||= object.class.human_attribute_name(attribute)
+      tag.label(label_and_errors(attribute, label_text),
+                for: [object.class.to_s.underscore, attribute].join("_"))
+    end
+
+    def labelled_check_box(
+      attr, label = nil, options = {}, checked = "1", unchecked = "0"
+    )
+      labelled_field(attr, label, options) do |opts|
+        check_box(attr, opts, checked, unchecked)
+      end
+    end
+
+    def labelled_country_select(
+      attr, label = nil, priority = {}, opts = {}, html_opts = {}
+    )
+      if priority.is_a?(Hash)
+        return labelled_field(attr, label, priority) do |options|
+          country_select(attr, options, opts, html_opts)
+        end
+      end
+      labelled_field(attr, label, opts) do |options|
+        country_select(attr, priority, options, html_opts)
+      end
+    end
+
+    def labelled_date_select(attribute, label_text = nil, options = {})
+      labelled_field(attribute, label_text, options) do |opts|
+        date_select(attribute, opts)
+      end
+    end
+
+    def labelled_datetime_select(attribute, label_text = nil, options = {})
+      labelled_field(attribute, label_text, options) do |opts|
+        datetime_select(attribute, opts)
+      end
+    end
+
+    def labelled_file_field(attribute, label_text = nil, options = {})
+      labelled_field(attribute, label_text, options) do |opts|
+        file_field(attribute, opts)
+      end
+    end
+
+    def labelled_image_file_field(attribute, label_text = nil, options = {})
+      labelled_field(attribute, label_text, options) do |opts|
+        image_file_field(attribute, opts)
+      end
+    end
+
+    def labelled_password_field(attribute, label_text = nil, options = {})
+      labelled_field(attribute, label_text, options, "text-field") do |opts|
+        password_field(attribute, opts)
+      end
+    end
+
+    def labelled_select(attribute, choices, label_text = nil, options = {})
+      labelled_field(attribute, label_text, options) do |opts|
+        select(attribute, choices, opts)
+      end
+    end
+
+    def labelled_text_area(attribute, label_text = nil, options = {})
+      labelled_field(attribute, label_text, options, "text-area") do |opts|
+        text_area(attribute, opts)
+      end
+    end
+
+    def labelled_text_field(attribute, label_text = nil, options = {})
+      labelled_field(attribute, label_text, options, "text-field") do |opts|
+        text_field(attribute, opts)
+      end
+    end
+
+    def labelled_time_select(attribute, label_text = nil, options = {})
+      labelled_field(attribute, label_text, options) do |opts|
+        time_select(attribute, opts)
+      end
+    end
+
+    protected
+
+    def labelled_field(attr, label_text = nil, options = {}, class_name = nil)
+      if label_text.is_a?(Hash) && options == {}
+        options = label_text
+        label_text = nil
+      end
+      field_with_label(attr, yield(options), label_text, class_name)
+    end
+  end
+end

data/app/javascript/components/ImageEditor/Form.jsx

@@ -19,6 +19,8 @@ export default function Form(props) {
     props.setLocale(evt.target.value);
   };
 
+  const inputDir = locales[locale].dir || "ltr";
+
   return (
     <form>
       <div className="field embed-code">
@@ -44,7 +46,7 @@ export default function Form(props) {
                   onChange={handleChangeLocale}>
             {Object.keys(locales).map(key => (
               <option key={`locale-${key}`} value={key}>
-                {locales[key]}
+                {locales[key].name}
               </option>
             ))}
           </select>
@@ -59,6 +61,8 @@ export default function Form(props) {
         </span>
         <textarea
           className="alternative"
+          lang={locale}
+          dir={inputDir}
           value={alternative[locale] || ""}
           onChange={e => props.updateLocalization("alternative", e.target.value)} />
       </div>
@@ -68,6 +72,8 @@ export default function Form(props) {
             Caption
           </label>
           <textarea
+            lang={locale}
+            dir={inputDir}
             onChange={e => props.updateLocalization("caption", e.target.value)}
             value={caption[locale] || ""}
             className="caption" />

data/app/javascript/components/PageTree.jsx

@@ -139,7 +139,9 @@ export default class PageTree extends React.Component {
                          movedPage={this.movedPage}
                          toggleCollapsed={this.toggleCollapsed}
                          updatePage={this.updatePage}
-                         updateTree={this.updateTree} />
+                         updateTree={this.updateTree}
+                         locale={this.props.locale}
+                         dir={this.props.dir} />
     );
   }
 
@@ -189,5 +191,6 @@ export default class PageTree extends React.Component {
 PageTree.propTypes = {
   pages: PropTypes.array,
   locale: PropTypes.string,
+  dir: PropTypes.string,
   permissions: PropTypes.array
 };

data/app/javascript/components/PageTreeDraggable.jsx

@@ -75,7 +75,7 @@ export default class PageTreeDraggable extends React.Component {
   }
 
   render() {
-    var tree = this.props.tree;
+    const { tree, dir, locale } = this.props;
     var dragging = this.state.dragging;
 
     if (!tree) {
@@ -90,16 +90,17 @@ export default class PageTreeDraggable extends React.Component {
         <div className="page-tree">
           {this.getDraggingDom()}
           <PageTreeNode
-              tree={tree}
-              index={root}
-              key={root.id}
-              paddingLeft={this.props.paddingLeft}
-              addChild={id => this.addChild(id)}
-              onDragStart={(id, dom, e) => this.dragStart(id, dom, e)}
-              onCollapse={nodeId => this.toggleCollapse(nodeId)}
-              updatePage={(idx, attrs) => this.updatePage(idx, attrs)}
-              dragging={dragging && dragging.id}
-          />
+            tree={tree}
+            index={root}
+            key={root.id}
+            paddingLeft={this.props.paddingLeft}
+            addChild={id => this.addChild(id)}
+            onDragStart={(id, dom, e) => this.dragStart(id, dom, e)}
+            onCollapse={nodeId => this.toggleCollapse(nodeId)}
+            updatePage={(idx, attrs) => this.updatePage(idx, attrs)}
+            dragging={dragging && dragging.id}
+            dir={dir}
+            locale={locale} />
         </div>
       );
     }
@@ -303,4 +304,6 @@ PageTreeDraggable.propTypes = {
   paddingLeft: PropTypes.number,
   updatePage: PropTypes.func,
   updateTree: PropTypes.func,
+  locale: PropTypes.string,
+  dir: PropTypes.string
 };

data/app/javascript/components/PageTreeNode.jsx

@@ -125,9 +125,7 @@ export default class PageTreeNode extends React.Component {
   }
 
   childNodes() {
-    let index = this.props.index;
-    let tree = this.props.tree;
-    let dragging = this.props.dragging;
+    const { index, tree, dragging, dir, locale } = this.props;
 
     if (index.children && index.children.length && !index.node.collapsed) {
       var childrenStyles = {};
@@ -139,21 +137,22 @@ export default class PageTreeNode extends React.Component {
       return (
         <div className="children" style={childrenStyles}>
           {index.children.map((child) => {
-             var childIndex = tree.getIndex(child);
-             return (
-               <PageTreeNode
-                   tree={tree}
-                   index={childIndex}
-                   key={childIndex.id}
-                   dragging={dragging}
-                   paddingLeft={this.props.paddingLeft}
-                   addChild={this.props.addChild}
-                   onCollapse={this.props.onCollapse}
-                   onDragStart={this.props.onDragStart}
-                   updatePage={this.props.updatePage}
-               />
-             );
-           })}
+            var childIndex = tree.getIndex(child);
+            return (
+              <PageTreeNode
+                tree={tree}
+                index={childIndex}
+                key={childIndex.id}
+                dragging={dragging}
+                paddingLeft={this.props.paddingLeft}
+                addChild={this.props.addChild}
+                onCollapse={this.props.onCollapse}
+                onDragStart={this.props.onDragStart}
+                updatePage={this.props.updatePage}
+                dir={dir}
+                locale={locale} />
+            );
+          })}
         </div>
       );
     }
@@ -232,11 +231,14 @@ export default class PageTreeNode extends React.Component {
   }
 
   pageName() {
-    if (this.node().name) {
-      return this.node().name;
-    } else {
-      return <i className="untitled">Untitled</i>;
-    }
+    const name = this.node().name || <i className="untitled">Untitled</i>;
+
+    return(
+      <span dir={this.props.dir}
+            lang={this.props.locale}>
+        {name}
+      </span>
+    );
   }
 
   render() {
@@ -278,6 +280,7 @@ export default class PageTreeNode extends React.Component {
   }
 
   renderEditNode() {
+    const { dir, locale } = this.props;
     let self = this;
 
     let handleNameChange = function(event) {
@@ -303,6 +306,8 @@ export default class PageTreeNode extends React.Component {
         <form onSubmit={performEdit}>
           <input type="text"
                  value={this.state.newName}
+                 dir={dir}
+                 lang={locale}
                  autoFocus
                  onChange={handleNameChange} />
           <button className="save" type="submit">
@@ -407,5 +412,7 @@ PageTreeNode.propTypes = {
   onDragStart: PropTypes.func,
   paddingLeft: PropTypes.number,
   tree: PropTypes.object,
-  updatePage: PropTypes.func
+  updatePage: PropTypes.func,
+  locale: PropTypes.string,
+  dir: PropTypes.string,
 };

data/app/javascript/components/RichTextArea.jsx

@@ -129,6 +129,20 @@ export default class RichTextArea extends React.Component {
     }
   }
 
+  localeOptions() {
+    let opts = {};
+
+    if (this.props.lang) {
+      opts.lang = this.props.lang;
+    }
+
+    if (this.props.dir) {
+      opts.dir = this.props.dir;
+    }
+
+    return opts;
+  }
+
   relativeUrl(str) {
     let url = null;
 
@@ -177,7 +191,8 @@ export default class RichTextArea extends React.Component {
           value={value}
           rows={rows}
           onChange={this.handleChange}
-          onKeyDown={this.handleKeyPress} />
+          onKeyDown={this.handleKeyPress}
+          {...this.localeOptions()} />
       </div>
     );
   }
@@ -209,5 +224,7 @@ RichTextArea.propTypes = {
   name: PropTypes.string,
   value: PropTypes.string,
   rows: PropTypes.number,
-  simple: PropTypes.bool
+  simple: PropTypes.bool,
+  lang: PropTypes.string,
+  dir: PropTypes.string
 };

data/app/models/concerns/pages_core/humanizable_param.rb

@@ -6,15 +6,21 @@ module PagesCore
     extend ActiveSupport::Concern
 
     def humanized_param(slug)
-      return id.to_s unless slug&.present?
+      safe_slug = safe_humanized_param(slug)
+      return id.to_s if safe_slug.blank?
 
-      "#{id}-" + transliterate(slug)
-                 .downcase
-                 .gsub(/[\[{]/, "(")
-                 .gsub(/}\]/, ")")
-                 .gsub(/[^[[:alnum:]]()-]+/, "-")
-                 .gsub(/-{2,}/, "-")
-                 .gsub(/(^-|-$)/, "")
+      "#{id}-#{safe_slug}"
+    end
+
+    private
+
+    def safe_humanized_param(str)
+      transliterate(str.to_s).downcase
+                             .gsub(/[\[{]/, "(")
+                             .gsub(/}\]/, ")")
+                             .gsub(/[^[[:alnum:]]()-]+/, "-")
+                             .gsub(/-{2,}/, "-")
+                             .gsub(/(^-|-$)/, "")
     end
   end
 end

data/app/models/concerns/pages_core/page_model/pathable.rb

@@ -24,7 +24,7 @@ module PagesCore
       end
 
       def ensure_path_segment
-        return if deleted? || path_segment? || !name?
+        return if deleted? || path_segment? || generated_path_segment.blank?
 
         segment = generated_path_segment
         segment = "#{segment}-#{id}" if path_collision?(segment)
@@ -59,11 +59,8 @@ module PagesCore
       end
 
       def generated_path_segment
-        transliterated_name.gsub(/[^[[:alnum:]]-_]+/, "-")
-                           .gsub(/-{2,}/, "-")
-                           .gsub(/(^-|-$)/, "")
-                           .mb_chars
-                           .downcase
+        safe_path_segment(transliterated_name).presence ||
+          safe_path_segment(unique_name)
       end
 
       def page_path_matches_routes?(page_path)
@@ -98,6 +95,15 @@ module PagesCore
         false
       end
 
+      def safe_path_segment(str)
+        str.to_s
+           .gsub(/[^[[:alnum:]]-_]+/, "-")
+           .gsub(/-{2,}/, "-")
+           .gsub(/(^-|-$)/, "")
+           .mb_chars
+           .downcase
+      end
+
       def sibling_path_segments
         siblings = if parent
                      parent.children

data/app/views/admin/pages/_edit_images.html.erb

@@ -1,4 +1,4 @@
 <%= react_component("PageImages",
                     locale: @locale,
-                    locales: PagesCore.config.locales,
+                    locales: locales_with_dir,
                     records: @page.page_images.map { |pi| Admin::PageImageResource.new(pi).to_hash }) %>

data/app/views/admin/pages/index.html.erb

@@ -16,6 +16,7 @@
       "PageTree", {
         pages: @pages.map { |p| page_json(p) },
         locale: @locale,
+        dir: locale_direction(@locale),
         permissions: [(:create if policy(Page).create?)] }
     ) %>
   <% end %>