Merge pull request #1188 from dradis/importmaps

Implement importmaps
dradis · Nov 2, 2023 · 73933f7 · 73933f7
2 parents fe3a568 + 56e0f04
commit 73933f7
Show file tree

Hide file tree

Showing 14 changed files with 38 additions and 18 deletions.
diff --git a/CHANGELOG b/CHANGELOG
@@ -1,5 +1,6 @@
 [v#.#.#] ([month] [YYYY])
   - Upgrade to Rails 7.0.8
+  - Add importmap-rails to handle js libraries
   - Upgraded gems:
     - [gem]
   - Bugs fixes:

diff --git a/Gemfile b/Gemfile
@@ -69,6 +69,10 @@ gem 'time', '>= 0.2.2'
 
 gem 'font-awesome-sass', '~> 6.4.0'
 
+gem 'importmap-rails', '~> 1.2'
+
+gem 'sprockets-rails', '>= 3.0.0'
+
 # ------------------------------------------------------ With native extensions
 # These require native extensions.
 # Ensure Traveling Ruby provides an appropriate version before bumping.

diff --git a/Gemfile.lock b/Gemfile.lock
@@ -230,6 +230,9 @@ GEM
     i18n (1.14.1)
       concurrent-ruby (~> 1.0)
     image_size (1.3.1)
+    importmap-rails (1.2.1)
+      actionpack (>= 6.0.0)
+      railties (>= 6.0.0)
     jbuilder (2.10.0)
       activesupport (>= 5.0.0)
     jquery-fileupload-rails (0.3.5)
@@ -564,6 +567,7 @@ DEPENDENCIES
   guard-rspec
   html-pipeline
   image_size (~> 1.3.0)
+  importmap-rails (~> 1.2)
   jbuilder (~> 2.7)
   jquery-fileupload-rails (~> 0.3.4)
   jquery-hotkeys-rails
@@ -604,6 +608,7 @@ DEPENDENCIES
   simple_form
   sinatra (~> 2.2.3)
   spring
+  sprockets-rails (>= 3.0.0)
   sqlite3
   terser (~> 1.1)
   thor (~> 1.2.1)

diff --git a/app/assets/config/manifest.js b/app/assets/config/manifest.js
@@ -1,3 +1,13 @@
+//= link application.css
+//= link setup/setup.css
+//= link tylium.css
+
+//= link legacy.application.js
+//= link tylium.js
+
+//= link_tree ../../javascript .js
+//= link_tree ../../../vendor/javascript .js
+
 //= link_tree ../images
-//= link_directory ../javascripts .js
-//= link_directory ../stylesheets .css
+
+//= link_tree ../../../vendor/assets
diff --git a/app/assets/javascripts/application.js → app/assets/javascripts/legacy.application.js b/app/assets/javascripts/application.js → app/assets/javascripts/legacy.application.js
diff --git a/app/assets/javascripts/tylium.js b/app/assets/javascripts/tylium.js
@@ -15,9 +15,6 @@
 //= require popper
 //= require bootstrap
 
-//= require vendor/datatables.min
-//= require vendor/stupidtable
-
 //= require cable
 
 //= require shared/auto_save/local

diff --git a/app/javascript/application.js b/app/javascript/application.js
@@ -0,0 +1,3 @@
+// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
+import 'datatables'
+import 'stupidtable'
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -3,10 +3,11 @@
   <head>
     <title><%= [content_for(:title), 'Dradis Community Edition'].compact.join(' | ') %></title>
     <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
-    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
+    <%= javascript_include_tag 'legacy.application', 'data-turbolinks-track' => true %>
     <%= favicon_link_tag %>
     <%= csrf_meta_tags %>
     <%= csp_meta_tag %>
+    <%= javascript_importmap_tags %>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
   </head>

diff --git a/app/views/layouts/tylium.html.erb b/app/views/layouts/tylium.html.erb
@@ -25,6 +25,7 @@
     <%= javascript_include_tag 'tylium', 'data-turbolinks-track' => true %>
     <%= csrf_meta_tag %>
     <%= csp_meta_tag %>
+    <%= javascript_importmap_tags %>
   </head>
 
   <body class="<%= controller_name %> <%= action_name %>">

diff --git a/bin/importmap b/bin/importmap
@@ -0,0 +1,4 @@
+#!/usr/bin/env ruby
+
+require_relative '../config/application'
+require 'importmap/commands'
diff --git a/config/importmap.rb b/config/importmap.rb
@@ -0,0 +1,6 @@
+# Pin npm packages by running ./bin/importmap
+
+pin 'application', preload: true
+
+pin 'datatables'
+pin 'stupidtable'
diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb
@@ -6,18 +6,6 @@
 # Add additional assets to the asset load path.
 # Rails.application.config.assets.paths << Emoji.images_path
 
-# Add Yarn node_modules folder to the asset load path.
-Rails.application.config.assets.paths << Rails.root.join('node_modules')
-
 # Precompile additional assets.
 # application.js, application.css, and all non-JS/CSS in the app/assets
 # folder are already added.
-
-# Setup
-Rails.application.config.assets.precompile += %w( setup/setup.css )
-
-# Tylium
-Rails.application.config.assets.precompile += %w( tylium.js tylium.css )
-
-# Include font files
-Rails.application.config.assets.precompile << ["*.svg", "*.eot", "*.woff", "*.ttf"]
diff --git a/...sets/javascripts/vendor/datatables.min.js → vendor/javascript/datatables.js b/...sets/javascripts/vendor/datatables.min.js → vendor/javascript/datatables.js
diff --git a/app/assets/javascripts/vendor/stupidtable.js → vendor/javascript/stupidtable.js b/app/assets/javascripts/vendor/stupidtable.js → vendor/javascript/stupidtable.js