Migrate assets to ESM-based structure

spec/dummy_app/app/javascript/packs/rails_admin.js

@@ -1,2 +1,2 @@
-import 'rails_admin/src/base'
+import 'rails_admin/src/rails_admin/base'
 import '../stylesheets/rails_admin.scss'

spec/dummy_app/app/javascript/stylesheets/rails_admin.scss

@@ -1 +1 @@
-@import "~rails_admin/src/styles/base.scss";
+@import "~rails_admin/src/rails_admin/styles/base.scss";

src/rails_admin/base.js

@@ -0,0 +1,21 @@
+import Rails from '@rails/ujs'
+import jQuery from 'jquery'
+import moment from 'moment'
+import './vendor/jquery.pjax'
+import './vendor/jquery_nested_form'
+import 'bootstrap'
+import 'moment/min/locales.js'
+import 'eonasdan-bootstrap-datetimepicker'
+
+import './filter-box'
+import './filtering-multiselect'
+import './filtering-select'
+import './nested-form-hooks'
+import './remote-form'
+import './sidescroll'
+import './ui'
+import './widgets'
+
+Rails.start();
+window.$ = window.jQuery = jQuery;
+window.moment = moment;

app/assets/javascripts/rails_admin/ra.filter-box.js → src/rails_admin/filter-box.js

@@ -1,3 +1,7 @@
+import jQuery from 'jquery';
+import moment from 'moment'
+import I18n from './i18n';
+
 (function($) {
 
   var filters;
@@ -23,13 +27,13 @@
           control = $('<select class="input-sm form-control"></select>')
             .prop('name', value_name)
             .append('<option value="_discard">...</option>')
-            .append($('<option value="true"></option>').prop('selected', field_value == "true").text(RailsAdmin.I18n.t("true")))
-            .append($('<option value="false"></option>').prop('selected', field_value == "false").text(RailsAdmin.I18n.t("false")))
+            .append($('<option value="true"></option>').prop('selected', field_value == "true").text(I18n.t("true")))
+            .append($('<option value="false"></option>').prop('selected', field_value == "false").text(I18n.t("false")))
             if (!required) {
               control.append([
                 '<option disabled="disabled">---------</option>',
-                $('<option value="_present"></option>').prop('selected', field_value == "_present").text(RailsAdmin.I18n.t("is_present")),
-                $('<option value="_blank"></option>').prop('selected', field_value == "_blank").text(RailsAdmin.I18n.t("is_blank"))
+                $('<option value="_present"></option>').prop('selected', field_value == "_present").text(I18n.t("is_present")),
+                $('<option value="_blank"></option>').prop('selected', field_value == "_blank").text(I18n.t("is_blank"))
               ])
             }
           break;
@@ -39,21 +43,21 @@
         case 'time':
           control = control || $('<select class="switch-additional-fieldsets input-sm form-control"></select>')
             .prop('name', operator_name)
-            .append($('<option data-additional-fieldset="default" value="default"></option>').prop('selected', field_operator == "default").text(RailsAdmin.I18n.t(field_type == "time" ? "time" : "date")))
-            .append($('<option data-additional-fieldset="between" value="between"></option>').prop('selected', field_operator == "between").text(RailsAdmin.I18n.t("between_and_")))
+            .append($('<option data-additional-fieldset="default" value="default"></option>').prop('selected', field_operator == "default").text(I18n.t(field_type == "time" ? "time" : "date")))
+            .append($('<option data-additional-fieldset="between" value="between"></option>').prop('selected', field_operator == "between").text(I18n.t("between_and_")))
           if (field_type != 'time') {
             control.append([
-              $('<option value="today"></option>').prop('selected', field_operator == "today").text(RailsAdmin.I18n.t("today")),
-              $('<option value="yesterday"></option>').prop('selected', field_operator == "yesterday").text(RailsAdmin.I18n.t("yesterday")),
-              $('<option value="this_week"></option>').prop('selected', field_operator == "this_week").text(RailsAdmin.I18n.t("this_week")),
-              $('<option value="last_week"></option>').prop('selected', field_operator == "last_week").text(RailsAdmin.I18n.t("last_week")),
+              $('<option value="today"></option>').prop('selected', field_operator == "today").text(I18n.t("today")),
+              $('<option value="yesterday"></option>').prop('selected', field_operator == "yesterday").text(I18n.t("yesterday")),
+              $('<option value="this_week"></option>').prop('selected', field_operator == "this_week").text(I18n.t("this_week")),
+              $('<option value="last_week"></option>').prop('selected', field_operator == "last_week").text(I18n.t("last_week")),
             ])
           }
           if (!required) {
             control.append([
               '<option disabled="disabled">---------</option>',
-              $('<option value="_not_null"></option>').prop('selected', field_operator == "_not_null").text(RailsAdmin.I18n.t("is_present")),
-              $('<option value="_null"></option>').prop('selected', field_operator == "_null").text(RailsAdmin.I18n.t("is_blank"))
+              $('<option value="_not_null"></option>').prop('selected', field_operator == "_not_null").text(I18n.t("is_present")),
+              $('<option value="_null"></option>').prop('selected', field_operator == "_null").text(I18n.t("is_blank"))
             ])
           }
           additional_control =
@@ -83,8 +87,8 @@
             .data('name', value_name)
             .append('<option value="_discard">...</option>')
             .append(required ? [] : [
-              $('<option value="_present"></option>').prop('selected', field_value == "_present").text(RailsAdmin.I18n.t("is_present")),
-              $('<option value="_blank"></option>').prop('selected', field_value == "_blank").text(RailsAdmin.I18n.t("is_blank")),
+              $('<option value="_present"></option>').prop('selected', field_value == "_present").text(I18n.t("is_present")),
+              $('<option value="_blank"></option>').prop('selected', field_value == "_blank").text(I18n.t("is_blank")),
               '<option disabled="disabled">---------</option>'
             ])
             .append(select_options)
@@ -107,15 +111,15 @@
             .prop('value', field_operator)
             .prop('name', operator_name)
             .append('<option value="_discard">...</option>')
-            .append($('<option data-additional-fieldset="additional-fieldset" value="like"></option>').prop('selected', field_operator == "like").text(RailsAdmin.I18n.t("contains")))
-            .append($('<option data-additional-fieldset="additional-fieldset" value="is"></option>').prop('selected', field_operator == "is").text(RailsAdmin.I18n.t("is_exactly")))
-            .append($('<option data-additional-fieldset="additional-fieldset" value="starts_with"></option>').prop('selected', field_operator == "starts_with").text(RailsAdmin.I18n.t("starts_with")))
-            .append($('<option data-additional-fieldset="additional-fieldset" value="ends_with"></option>').prop('selected', field_operator == "ends_with").text(RailsAdmin.I18n.t("ends_with")))
+            .append($('<option data-additional-fieldset="additional-fieldset" value="like"></option>').prop('selected', field_operator == "like").text(I18n.t("contains")))
+            .append($('<option data-additional-fieldset="additional-fieldset" value="is"></option>').prop('selected', field_operator == "is").text(I18n.t("is_exactly")))
+            .append($('<option data-additional-fieldset="additional-fieldset" value="starts_with"></option>').prop('selected', field_operator == "starts_with").text(I18n.t("starts_with")))
+            .append($('<option data-additional-fieldset="additional-fieldset" value="ends_with"></option>').prop('selected', field_operator == "ends_with").text(I18n.t("ends_with")))
           if (!required) {
             control.append([
               '<option disabled="disabled">---------</option>',
-              $('<option value="_present"></option>').prop('selected', field_operator == "_present").text(RailsAdmin.I18n.t("is_present")),
-              $('<option value="_blank"></option>').prop('selected', field_operator == "_blank").text(RailsAdmin.I18n.t("is_blank"))
+              $('<option value="_present"></option>').prop('selected', field_operator == "_present").text(I18n.t("is_present")),
+              $('<option value="_blank"></option>').prop('selected', field_operator == "_blank").text(I18n.t("is_blank"))
             ])
           }
           additional_control = $('<input class="additional-fieldset input-sm form-control" type="text" />')
@@ -128,13 +132,13 @@
         case 'float':
           control = $('<select class="switch-additional-fieldsets input-sm form-control"></select>')
             .prop('name', operator_name)
-            .append($('<option data-additional-fieldset="default" value="default"></option>').prop('selected', field_operator == "default").text(RailsAdmin.I18n.t("number")))
-            .append($('<option data-additional-fieldset="between" value="between"></option>').prop('selected', field_operator == "between").text(RailsAdmin.I18n.t("between_and_")))
+            .append($('<option data-additional-fieldset="default" value="default"></option>').prop('selected', field_operator == "default").text(I18n.t("number")))
+            .append($('<option data-additional-fieldset="between" value="between"></option>').prop('selected', field_operator == "between").text(I18n.t("between_and_")))
           if (!required) {
             control.append([
               '<option disabled="disabled">---------</option>',
-              $('<option value="_not_null"></option>').prop('selected', field_operator == "_not_null").text(RailsAdmin.I18n.t("is_present")),
-              $('<option value="_null"></option>').prop('selected', field_operator == "_null").text(RailsAdmin.I18n.t("is_blank"))
+              $('<option value="_not_null"></option>').prop('selected', field_operator == "_not_null").text(I18n.t("is_present")),
+              $('<option value="_null"></option>').prop('selected', field_operator == "_null").text(I18n.t("is_blank"))
             ])
           }
           additional_control =
@@ -184,7 +188,7 @@
       $content.find('.date, .datetime').each(function() {
         $(this).datetimepicker({
           date: moment($(this).siblings('[type=hidden]').val()),
-          locale: RailsAdmin.I18n.locale,
+          locale: I18n.locale,
           showTodayButton: true,
           format: options['datetimepicker_format']
         });
@@ -216,7 +220,7 @@
 
   $(document).on('click', "#filters_box .delete", function(e) {
     e.preventDefault();
-    form = $(this).parents('form');
+    var form = $(this).parents('form');
     $(this).parents('.filter').remove();
     !$("#filters_box").children().length && $("hr.filters_box:visible").hide('slow');
   });
@@ -232,7 +236,8 @@
 
   $(document).on('change', "#filters_box .switch-additional-fieldsets", function(e) {
     var selected_option = $(this).find('option:selected');
-    if(klass = $(selected_option).data('additional-fieldset')) {
+    var klass = $(selected_option).data('additional-fieldset');
+    if(klass) {
       $(this).siblings('.additional-fieldset:not(.' + klass + ')').hide('slow');
       $(this).siblings('.' + klass).show('slow');
     } else {

app/assets/javascripts/rails_admin/ra.filtering-multiselect.js → src/rails_admin/filtering-multiselect.js

@@ -1,14 +1,7 @@
-/*
- * RailsAdmin filtering multiselect @VERSION
- *
- * License
- *
- * http://www.railsadmin.org
- *
- * Depends:
- *   jquery.ui.core.js
- *   jquery.ui.widget.js
- */
+import jQuery from 'jquery';
+import 'jquery-ui/ui/widget';
+import I18n from './i18n';
+
 (function($) {
   $.widget("ra.filteringMultiselect", {
     _cache: {},
@@ -120,8 +113,8 @@
 
       this.element.css({display: "none"});
 
-      this.tooManyObjectsPlaceholder = $('<option disabled="disabled" />').text(RailsAdmin.I18n.t("too_many_objects"));
-      this.noObjectsPlaceholder = $('<option disabled="disabled" />').text(RailsAdmin.I18n.t("no_objects"))
+      this.tooManyObjectsPlaceholder = $('<option disabled="disabled" />').text(I18n.t("too_many_objects"));
+      this.noObjectsPlaceholder = $('<option disabled="disabled" />').text(I18n.t("no_objects"))
 
       if (this.options.xhr) {
         this.collection.append(this.tooManyObjectsPlaceholder);
@@ -254,7 +247,7 @@
         if (!this.options.xhr) {
           for (i in this._cache) {
             if (this._cache.hasOwnProperty(i)) {
-              option = this._cache[i];
+              var option = this._cache[i];
               matches.push({id: option.id, label: option.value});
             }
           }
@@ -282,7 +275,7 @@
 
           for (i in this._cache) {
             if (this._cache.hasOwnProperty(i) && query.test(this._cache[i]['value'])) {
-              option = this._cache[i];
+              var option = this._cache[i];
               matches.push({id: option.id, label: option.value});
             }
           }

app/assets/javascripts/rails_admin/ra.filtering-select.js → src/rails_admin/filtering-select.js

@@ -1,18 +1,8 @@
-/*
- * RailsAdmin filtering select @VERSION
- *
- * Based on the combobox example from jQuery UI documentation
- * http://jqueryui.com/demos/autocomplete/#combobox
- *
- * License
- *
- * http://www.railsadmin.org
- *
- * Depends:
- *   jquery.ui.core.js
- *   jquery.ui.widget.js
- *   jquery.ui.autocomplete.js
- */
+import jQuery from 'jquery';
+import 'jquery-ui/ui/widget';
+import 'jquery-ui/ui/widgets/autocomplete';
+import I18n from './i18n';
+
 (function($) {
   'use strict';
 
@@ -51,9 +41,9 @@
         this.button = this._buttonField();
       }
       this.clearOption = $('<span style="color: #888"></span>').append(
-          '<i class="fas fa-times"></i> ' + $('<span></span>').text(RailsAdmin.I18n.t("clear")).html()
+          '<i class="fas fa-times"></i> ' + $('<span></span>').text(I18n.t("clear")).html()
       );
-      this.noObjectsPlaceholder = $('<option disabled="disabled" />').text(RailsAdmin.I18n.t("no_objects"));
+      this.noObjectsPlaceholder = $('<option disabled="disabled" />').text(I18n.t("no_objects"));
 
       this._setOptionsSource();
       this._initAutocomplete();

src/rails_admin/i18n.js

@@ -0,0 +1,19 @@
+import moment from 'moment'
+
+export default {
+  locale: null,
+  translations: null,
+  init(locale, translations) {
+    this.locale = locale;
+    this.translations = translations;
+    moment.locale(this.locale);
+    if (typeof this.translations === "string") {
+      this.translations = JSON.parse(this.translations);
+    }
+  },
+  t(key) {
+    var humanize;
+    humanize = key.charAt(0).toUpperCase() + key.replace(/_/g, " ").slice(1);
+    return this.translations[key] || humanize;
+  }
+};

app/assets/javascripts/rails_admin/ra.nested-form-hooks.js → src/rails_admin/nested-form-hooks.js

@@ -1,3 +1,5 @@
+import jQuery from 'jquery';
+
 (function($) {
   $(document).ready(function() {
     return window.nestedFormEvents.insertFields = function(content, assoc, link) {