From 63093d8f41a794d147c150668468a0eba33a709c Mon Sep 17 00:00:00 2001 From: Armin Kirchner Date: Thu, 17 Jul 2025 17:59:22 +0200 Subject: [PATCH 1/4] refactor: Move Sprocket JS files to Webpack (Part 1) JavaScript for RfCs, Flashes and the color mode can be moved without modifications. Relates to #3021 --- app/assets/javascripts/application.js | 4 ---- app/javascript/application.js | 4 ++++ .../javascript/sprocket_asset_import}/color_mode_picker.js | 0 .../javascript/sprocket_asset_import}/flash.js | 0 app/javascript/sprocket_asset_import/index.js | 4 ++++ .../sprocket_asset_import}/request_for_comments.js | 0 6 files changed, 8 insertions(+), 4 deletions(-) rename {lib/assets/javascripts => app/javascript/sprocket_asset_import}/color_mode_picker.js (100%) rename {lib/assets/javascripts => app/javascript/sprocket_asset_import}/flash.js (100%) create mode 100644 app/javascript/sprocket_asset_import/index.js rename app/{assets/javascripts => javascript/sprocket_asset_import}/request_for_comments.js (100%) diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index d58279b98..6c6f0f301 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -13,10 +13,6 @@ //= require rails-timeago //= require locales/jquery.timeago.de.js // -// lib/assets -//= require flash -//= require color_mode_picker -// // app/assets // --> Include some assets first, as they are used by other assets. // --> Hence, the order specified here is important. diff --git a/app/javascript/application.js b/app/javascript/application.js index daaf6b697..7b2e9f1b6 100644 --- a/app/javascript/application.js +++ b/app/javascript/application.js @@ -88,3 +88,7 @@ window.ace = ace; // Publish ace in global namespace // Turbo import '@hotwired/turbo-rails'; import './turbo-migration'; + +// Import of Rails sprocket assets with minimal changes. After the initial migration these files should +// be moved to an appropriate place after some adjustments to fit modern Rails JS. +import 'sprocket_asset_import'; diff --git a/lib/assets/javascripts/color_mode_picker.js b/app/javascript/sprocket_asset_import/color_mode_picker.js similarity index 100% rename from lib/assets/javascripts/color_mode_picker.js rename to app/javascript/sprocket_asset_import/color_mode_picker.js diff --git a/lib/assets/javascripts/flash.js b/app/javascript/sprocket_asset_import/flash.js similarity index 100% rename from lib/assets/javascripts/flash.js rename to app/javascript/sprocket_asset_import/flash.js diff --git a/app/javascript/sprocket_asset_import/index.js b/app/javascript/sprocket_asset_import/index.js new file mode 100644 index 000000000..c5c240fee --- /dev/null +++ b/app/javascript/sprocket_asset_import/index.js @@ -0,0 +1,4 @@ +import './flash'; +import './color_mode_picker'; + +import './request_for_comments'; diff --git a/app/assets/javascripts/request_for_comments.js b/app/javascript/sprocket_asset_import/request_for_comments.js similarity index 100% rename from app/assets/javascripts/request_for_comments.js rename to app/javascript/sprocket_asset_import/request_for_comments.js From 448b6d94d319969e5a17a234d51baf02d304e0a9 Mon Sep 17 00:00:00 2001 From: Armin Kirchner Date: Mon, 28 Jul 2025 09:51:48 +0200 Subject: [PATCH 2/4] kebab case --- app/javascript/application.js | 2 +- .../color-mode-picker.js} | 0 .../{sprocket_asset_import => sprocket-asset-import}/flash.js | 0 app/javascript/sprocket-asset-import/index.js | 4 ++++ .../request-for-comments.js} | 0 app/javascript/sprocket_asset_import/index.js | 4 ---- 6 files changed, 5 insertions(+), 5 deletions(-) rename app/javascript/{sprocket_asset_import/color_mode_picker.js => sprocket-asset-import/color-mode-picker.js} (100%) rename app/javascript/{sprocket_asset_import => sprocket-asset-import}/flash.js (100%) create mode 100644 app/javascript/sprocket-asset-import/index.js rename app/javascript/{sprocket_asset_import/request_for_comments.js => sprocket-asset-import/request-for-comments.js} (100%) delete mode 100644 app/javascript/sprocket_asset_import/index.js diff --git a/app/javascript/application.js b/app/javascript/application.js index 7b2e9f1b6..535705280 100644 --- a/app/javascript/application.js +++ b/app/javascript/application.js @@ -91,4 +91,4 @@ import './turbo-migration'; // Import of Rails sprocket assets with minimal changes. After the initial migration these files should // be moved to an appropriate place after some adjustments to fit modern Rails JS. -import 'sprocket_asset_import'; +import 'sprocket-asset-import'; diff --git a/app/javascript/sprocket_asset_import/color_mode_picker.js b/app/javascript/sprocket-asset-import/color-mode-picker.js similarity index 100% rename from app/javascript/sprocket_asset_import/color_mode_picker.js rename to app/javascript/sprocket-asset-import/color-mode-picker.js diff --git a/app/javascript/sprocket_asset_import/flash.js b/app/javascript/sprocket-asset-import/flash.js similarity index 100% rename from app/javascript/sprocket_asset_import/flash.js rename to app/javascript/sprocket-asset-import/flash.js diff --git a/app/javascript/sprocket-asset-import/index.js b/app/javascript/sprocket-asset-import/index.js new file mode 100644 index 000000000..4841d256b --- /dev/null +++ b/app/javascript/sprocket-asset-import/index.js @@ -0,0 +1,4 @@ +import './flash'; +import './color-mode-picker'; + +import './request-for-comments'; diff --git a/app/javascript/sprocket_asset_import/request_for_comments.js b/app/javascript/sprocket-asset-import/request-for-comments.js similarity index 100% rename from app/javascript/sprocket_asset_import/request_for_comments.js rename to app/javascript/sprocket-asset-import/request-for-comments.js diff --git a/app/javascript/sprocket_asset_import/index.js b/app/javascript/sprocket_asset_import/index.js deleted file mode 100644 index c5c240fee..000000000 --- a/app/javascript/sprocket_asset_import/index.js +++ /dev/null @@ -1,4 +0,0 @@ -import './flash'; -import './color_mode_picker'; - -import './request_for_comments'; From 721f80eb2e444231e146d7bc4c305390904b7860 Mon Sep 17 00:00:00 2001 From: Armin Kirchner Date: Wed, 30 Jul 2025 13:49:43 +0200 Subject: [PATCH 3/4] Move flash messages CSS to app. --- app/assets/stylesheets/application.css | 4 ---- {lib => app}/assets/stylesheets/flash.css.scss | 0 2 files changed, 4 deletions(-) rename {lib => app}/assets/stylesheets/flash.css.scss (100%) diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index f828f9cd9..288b9ab71 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -10,10 +10,6 @@ * files in this directory. Styles in this file should be added after the last require_* statement. * It is generally better to create a new file per style scope. * - * lib/assets - *= require flash - * - * app/assets *= require_tree . *= require_self */ diff --git a/lib/assets/stylesheets/flash.css.scss b/app/assets/stylesheets/flash.css.scss similarity index 100% rename from lib/assets/stylesheets/flash.css.scss rename to app/assets/stylesheets/flash.css.scss From 95f91bac27446ef7b9e99850f0b54f6a25baed76 Mon Sep 17 00:00:00 2001 From: Armin Kirchner Date: Wed, 30 Jul 2025 15:43:21 +0200 Subject: [PATCH 4/4] Use require avoiding hoisted imports --- app/javascript/application.js | 2 +- app/javascript/sprocket-asset-import/index.js | 6 +++--- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/app/javascript/application.js b/app/javascript/application.js index 535705280..9fb99abf5 100644 --- a/app/javascript/application.js +++ b/app/javascript/application.js @@ -91,4 +91,4 @@ import './turbo-migration'; // Import of Rails sprocket assets with minimal changes. After the initial migration these files should // be moved to an appropriate place after some adjustments to fit modern Rails JS. -import 'sprocket-asset-import'; +require('sprocket-asset-import'); diff --git a/app/javascript/sprocket-asset-import/index.js b/app/javascript/sprocket-asset-import/index.js index 4841d256b..89aaa6870 100644 --- a/app/javascript/sprocket-asset-import/index.js +++ b/app/javascript/sprocket-asset-import/index.js @@ -1,4 +1,4 @@ -import './flash'; -import './color-mode-picker'; +require('./flash'); +require('./color-mode-picker'); -import './request-for-comments'; +require('./request-for-comments');