GBL 4.1: working vite install, scripts from local and engine working

geobtaa · Feb 29, 2024 · f516aa6 · f516aa6
1 parent a088f2b
commit f516aa6
Show file tree

Hide file tree

Showing 18 changed files with 263 additions and 9 deletions.
diff --git a/.gitignore b/.gitignore
@@ -76,3 +76,11 @@ yarn-debug.log*
 .env.test
 test/reports/*.xml
 yarn.lock
+
+# Vite Ruby
+/public/vite*
+node_modules
+# Vite uses dotenv and suggests to ignore local-only env files. See
+# https://vitejs.dev/guide/env-and-mode.html#env-files
+*.local
+
diff --git a/Procfile.dev b/Procfile.dev
@@ -0,0 +1,3 @@
+
+vite: bin/vite dev
+web: bin/rails s
diff --git a/app/controllers/admin/advanced_search_controller.rb b/app/controllers/admin/advanced_search_controller.rb
@@ -1,6 +1,5 @@
 # frozen_string_literal: true
 
-require "blacklight/catalog"
 require "blacklight_range_limit/controller_override"
 
 module Admin

diff --git a/app/frontend/entrypoints/engine.js b/app/frontend/entrypoints/engine.js
@@ -0,0 +1,28 @@
+// To see this message, add the following to the `<head>` section in your
+// views/layouts/application.html.erb
+//
+//    <%= vite_client_tag %>
+//    <%= vite_javascript_tag 'application' %>
+console.log('Vite ⚡️ Rails - Engine')
+
+// If using a TypeScript entrypoint file:
+//     <%= vite_typescript_tag 'application' %>
+//
+// If you want to use .jsx or .tsx, add the extension:
+//     <%= vite_javascript_tag 'application.jsx' %>
+
+console.log('Visit the guide for more information: ', 'https://vite-ruby.netlify.app/guide/rails')
+
+// Example: Load Rails libraries in Vite.
+//
+// import * as Turbo from '@hotwired/turbo'
+// Turbo.start()
+//
+// import ActiveStorage from '@rails/activestorage'
+// ActiveStorage.start()
+//
+// // Import all channels.
+// const channels = import.meta.globEager('./**/*_channel.js')
+
+// Example: Import a stylesheet in app/frontend/index.css
+// import '~/index.css'
diff --git a/app/views/admin/layouts/application.html.erb b/app/views/admin/layouts/application.html.erb
@@ -8,6 +8,10 @@
     <%= stylesheet_link_tag "application", media: "all" %>
     <%= javascript_include_tag "application", "data-turbolinks-track": "reload" %>
     <%= javascript_include_tag "geoblacklight_admin", "data-turbolinks-track": "reload" %>
+
+    <!-- Vite -->
+    <%= vite_client_tag %>
+    <%= vite_javascript_tag 'application', media: 'all' %>
 
     <script src="https://unpkg.com/@popperjs/core@2"></script>
     <script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>

diff --git a/bin/vite b/bin/vite
@@ -0,0 +1,27 @@
+#!/usr/bin/env ruby
+# frozen_string_literal: true
+
+#
+# This file was generated by Bundler.
+#
+# The application 'vite' is installed as part of a gem, and
+# this file is here to facilitate running it.
+#
+
+ENV["BUNDLE_GEMFILE"] ||= File.expand_path("../Gemfile", __dir__)
+
+bundle_binstub = File.expand_path("bundle", __dir__)
+
+if File.file?(bundle_binstub)
+  if File.read(bundle_binstub, 300).include?("This file was generated by Bundler")
+    load(bundle_binstub)
+  else
+    abort("Your `bin/bundle` was not generated by Bundler, so this binstub cannot run.
+Replace `bin/bundle` by running `bundle binstubs bundler --force`, then run this command again.")
+  end
+end
+
+require "rubygems"
+require "bundler/setup"
+
+load Gem.bin_path("vite_ruby", "vite")
diff --git a/config/vite.json b/config/vite.json
@@ -0,0 +1,14 @@
+{
+  "all": {
+    "sourceCodeDir": "app/frontend",
+    "publicOutputDir": "geoblacklight-admin-vite",
+    "watchAdditionalPaths": []
+  },
+  "development": {
+    "autoBuild": true,
+    "port": 3037
+  },
+  "test": {
+    "autoBuild": true
+  }
+}
diff --git a/geoblacklight_admin.gemspec b/geoblacklight_admin.gemspec
@@ -30,7 +30,7 @@ Gem::Specification.new do |s|
   s.add_dependency "devise-bootstrap-views", "~> 1.0"
   s.add_dependency "devise_invitable", "~> 2.0"
   s.add_dependency "dotenv-rails", "~> 2.8"
-  s.add_dependency "geoblacklight", "~> 4.0"
+  s.add_dependency "geoblacklight", "4.1"
   s.add_dependency "haml", "~> 5.2"
   s.add_dependency "httparty", "~> 0.21"
   s.add_dependency "inline_svg", "~> 1.9"
@@ -46,6 +46,8 @@ Gem::Specification.new do |s|
   s.add_dependency "simple_form", "~> 5.0"
   s.add_dependency "sprockets", "< 4"
   s.add_dependency "statesman", "~> 10.0"
+  s.add_dependency "vite_rails", "~> 3.0"
+  s.add_dependency "vite_ruby", ">= 3.5"
 
   s.add_development_dependency "byebug", "~> 11.1"
   s.add_development_dependency "capybara", "~> 3.0"

diff --git a/lib/generators/geoblacklight_admin/config_generator.rb b/lib/generators/geoblacklight_admin/config_generator.rb
@@ -11,16 +11,29 @@ class ConfigGenerator < Rails::Generators::Base
        1. Copies GBL Admin initializer files to host config
        2. Copies database.yml connection to host config
        3. Copies sidekiq.yml connection to host config
-       4. Copies settings.yml to host config
        5. Copies .env.development and .env.test to host
+       4. Copies settings.yml to host config
+       create_solr_yml
        6. Copies JSON Schema to host
        7. Copies solr/* to host
        8. Sets Routes
-       9. Sets Gems
+       set_development_mailer_host
        11.Sets DB Seeds
-       11.Sets ActiveStorage
        12.Sets Pagy Backend
-
+       11.Sets ActiveStorage
+       add_api_controller
+       add_user_util_links
+       copy_catalog_index_view
+       add_show_sidebar
+       copy_app_javascript
+       copy_app_images
+       add_package_json
+       add_assets_initialier
+       add_kithe_bulk_loading_service
+       add_kithe_model_to_solr_document
+       add_search_builder_publication_state_concern
+       add_import_id_facet
+       add_vite_rails_config
     DESCRIPTION
 
     def create_gbl_admin_initializer_files
@@ -341,5 +354,25 @@ def add_import_id_facet
         "\nconfig.add_facet_field Settings.FIELDS.B1G_IMPORT_ID, label: 'Import ID', show: false\n"
       end
     end
+
+    def add_vite_rails_config
+      copy_file "base.html.erb", "app/views/layouts/blacklight/base.html.erb"
+      copy_file "vite.config.ts", "vite.config.ts", force: true
+      copy_file "config/vite.json", "config/vite.json", force: true
+      copy_file "config/vite.rb", "config/vite.rb", force: true
+      copy_file "frontend/entrypoints/application.js", "app/javascript/entrypoints/application.js", force: true
+
+      append_to_file "Gemfile" do
+        "gem \"vite_rails\", \"~> 3.0\""
+      end
+    end
+
+    # Run bundle with vite install
+    def bundle_install
+      Bundler.with_clean_env do
+        run "bundle install"
+        run "bundle exec vite install"
+      end
+    end
   end
 end
diff --git a/lib/generators/geoblacklight_admin/templates/api_controller.rb b/lib/generators/geoblacklight_admin/templates/api_controller.rb
@@ -1,7 +1,5 @@
 # frozen_string_literal: true
 
-require "blacklight/catalog"
-
 # Admin::ApiController
 module Admin
   class ApiController < ApplicationController

diff --git a/lib/generators/geoblacklight_admin/templates/base.html.erb b/lib/generators/geoblacklight_admin/templates/base.html.erb
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<%= content_tag :html, class: 'no-js', **html_tag_attributes do %>
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <meta name="geoblacklight-version" content="<%= Geoblacklight::VERSION %>">
+
+    <!-- Internet Explorer use the highest version available -->
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+
+    <title><%= render_page_title %></title>
+    <script>
+      document.querySelector('html').classList.remove('no-js');
+    </script>
+    <%= opensearch_description_tag application_name, opensearch_catalog_url(format: 'xml') %>
+    <%= favicon_link_tag %>
+    <%= stylesheet_link_tag "application", media: "all", "data-turbo-track": "reload" %>
+    <%= javascript_include_tag "application", "data-turbo-track": "reload" %>
+
+    <%= vite_client_tag %>
+    <%= vite_javascript_tag 'application' %>
+
+    <%= csrf_meta_tags %>
+    <%= content_for(:head) %>
+  </head>
+  <body class="<%= render_body_class %>">
+    <nav id="skip-link" role="navigation" aria-label="<%= t('blacklight.skip_links.label') %>">
+      <%= link_to t('blacklight.skip_links.search_field'), '#search_field', class: 'element-invisible element-focusable rounded-bottom py-2 px-3', data: { turbolinks: 'false' } %>
+      <%= link_to t('blacklight.skip_links.main_content'), '#main-container', class: 'element-invisible element-focusable rounded-bottom py-2 px-3', data: { turbolinks: 'false' } %>
+      <%= content_for(:skip_links) %>
+    </nav>
+    <%= render partial: 'shared/header_navbar' %>
+
+    <main id="main-container" class="<%= container_classes %>" role="main" aria-label="<%= t('blacklight.main.aria.main_container') %>">
+      <%= content_for(:container_header) %>
+
+      <%= render partial: 'shared/flash_msg', layout: 'shared/flash_messages' %>
+
+      <div class="row">
+        <%= content_for?(:content) ? yield(:content) : yield %>
+      </div>
+    </main>
+
+    <%= render partial: 'shared/footer' %>
+    <%= render partial: 'shared/modal' %>
+  </body>
+<% end %>
diff --git a/lib/generators/geoblacklight_admin/templates/config/vite.json b/lib/generators/geoblacklight_admin/templates/config/vite.json
@@ -0,0 +1,16 @@
+{
+  "all": {
+    "sourceCodeDir": "app/frontend",
+    "watchAdditionalPaths": []
+  },
+  "development": {
+    "autoBuild": true,
+    "publicOutputDir": "vite-dev",
+    "port": 3036
+  },
+  "test": {
+    "autoBuild": true,
+    "publicOutputDir": "vite-test",
+    "port": 3037
+  }
+}
diff --git a/lib/generators/geoblacklight_admin/templates/config/vite.rb b/lib/generators/geoblacklight_admin/templates/config/vite.rb
@@ -0,0 +1,4 @@
+# frozen_string_literal: true
+
+ViteRuby.env['GBL_ADMIN_ASSETS_PATH'] =
+  "#{ Gem.loaded_specs['geoblacklight_admin'].full_gem_path }/app/frontend"
diff --git a/lib/generators/geoblacklight_admin/templates/frontend/entrypoints/application.js b/lib/generators/geoblacklight_admin/templates/frontend/entrypoints/application.js
@@ -0,0 +1,30 @@
+// To see this message, add the following to the `<head>` section in your
+// views/layouts/application.html.erb
+//
+//    <%= vite_client_tag %>
+//    <%= vite_javascript_tag 'application' %>
+console.log('Vite ⚡️ Rails - Local')
+
+// If using a TypeScript entrypoint file:
+//     <%= vite_typescript_tag 'application' %>
+//
+// If you want to use .jsx or .tsx, add the extension:
+//     <%= vite_javascript_tag 'application.jsx' %>
+
+console.log('Visit the guide for more information: ', 'https://vite-ruby.netlify.app/guide/rails')
+
+// Example: Load Rails libraries in Vite.
+//
+// import * as Turbo from '@hotwired/turbo'
+// Turbo.start()
+//
+// import ActiveStorage from '@rails/activestorage'
+// ActiveStorage.start()
+//
+// // Import all channels.
+// const channels = import.meta.globEager('./**/*_channel.js')
+
+// Example: Import a stylesheet in app/frontend/index.css
+// import '~/index.css'
+
+import '@gbl_admin/entrypoints/engine'
diff --git a/lib/generators/geoblacklight_admin/templates/package.json b/lib/generators/geoblacklight_admin/templates/package.json
@@ -1,6 +1,10 @@
 {
   "name": "geoblacklight-admin",
+  "version": "0.1.0",
   "private": true,
+  "scripts": {
+    "dev": "vite"
+  },
   "dependencies": {
     "@nathanvda/cocoon": "^1.2.14",
     "@rails/actioncable": "^6.0.0",
@@ -23,7 +27,9 @@
     "turbolinks": "^5.2.0",
     "yargs-parser": "^13.1.2"
   },
-  "version": "0.1.0",
   "devDependencies": {
+    "vite": "^5.0.0",
+    "vite-plugin-ruby": "^5.0.0",
+    "vite-plugin-rails": "^0.5.0"
   }
 }
diff --git a/lib/generators/geoblacklight_admin/templates/vite.config.ts b/lib/generators/geoblacklight_admin/templates/vite.config.ts
@@ -0,0 +1,19 @@
+import { defineConfig } from 'vite'
+import rails from 'vite-plugin-rails'
+
+export default defineConfig({
+  plugins: [
+    rails(),
+  ],
+  // GBL Admin: Import assets from arbitrary paths.
+  resolve: {
+    alias: {
+      '@gbl_admin/': `${process.env.GBL_ADMIN_ASSETS_PATH}/`,
+    },
+  },
+  server: {
+    fs: {
+      allow: [process.env.GBL_ADMIN_ASSETS_PATH!],
+    },
+  },
+})
diff --git a/package.json b/package.json
@@ -0,0 +1,7 @@
+{
+  "devDependencies": {
+    "vite": "^5.0.0",
+    "vite-plugin-ruby": "^5.0.0",
+    "vite-plugin-rails": "^0.5.0"
+  }
+}
diff --git a/vite.config.ts b/vite.config.ts
@@ -0,0 +1,8 @@
+import { defineConfig } from 'vite'
+import RubyPlugin from 'vite-plugin-ruby'
+
+export default defineConfig({
+  plugins: [
+    RubyPlugin(),
+  ],
+})