shakapacker out, jsbundling-rails in

Gemfile

@@ -14,8 +14,8 @@ gem 'rexml'
 gem 'matrix'
 
 gem 'propshaft'
+gem 'jsbundling-rails'
 gem 'cssbundling-rails'
-gem 'shakapacker', '~> 6.6'
 
 gem 'honeybadger', '~> 6.1'
 

Gemfile.lock

@@ -217,6 +217,8 @@ GEM
       rdoc (>= 4.0.0)
       reline (>= 0.4.2)
     jmespath (1.6.2)
+    jsbundling-rails (1.3.1)
+      railties (>= 6.0.0)
     json (2.17.1)
     jsonapi-renderer (0.2.2)
     jwt (2.7.0)
@@ -327,8 +329,6 @@ GEM
       base64 (>= 0.1.0)
       logger (>= 1.6.0)
       rack (>= 3.0.0, < 4)
-    rack-proxy (0.7.7)
-      rack
     rack-session (2.1.1)
       base64 (>= 0.1.0)
       rack (>= 3.0.0)
@@ -418,14 +418,8 @@ GEM
       rexml (~> 3.2, >= 3.2.5)
       rubyzip (>= 1.2.2, < 4.0)
       websocket (~> 1.0)
-    semantic_range (3.1.0)
     sendgrid-ruby (6.7.0)
       ruby_http_client (~> 3.4)
-    shakapacker (6.6.0)
-      activesupport (>= 5.2)
-      rack-proxy (>= 0.6.1)
-      railties (>= 5.2)
-      semantic_range (>= 2.3.0)
     sidekiq (8.0.10)
       connection_pool (>= 2.5.0)
       json (>= 2.9.0)
@@ -495,6 +489,7 @@ DEPENDENCIES
   haml-rails
   honeybadger (~> 6.1)
   image_processing (~> 1.14)
+  jsbundling-rails
   launchy
   matrix
   mime-types
@@ -518,7 +513,6 @@ DEPENDENCIES
   rspec-rails
   selenium-webdriver
   sendgrid-ruby
-  shakapacker (~> 6.6)
   sidekiq
   simple_form
   turbo-rails

Procfile.dev

@@ -1,2 +1,3 @@
 web: env RUBY_DEBUG_OPEN=true bin/rails server
 css: yarn build:css --watch
+js: yarn build --watch

app/assets/stylesheets/application.postcss.css

@@ -1,6 +1,8 @@
 /* Entry point for your PostCSS build */
 
 @import "bootstrap/dist/css/bootstrap.css";
+@import "bootstrap-icons/font/bootstrap-icons.css";
+@import "codemirror/lib/codemirror.css";
 @import "tributejs/dist/tribute.css";
 @import "datatables.net-bs5/css/dataTables.bootstrap5.css";
 @import "tom-select/dist/css/tom-select.bootstrap5.css";
@@ -43,3 +45,5 @@
 @import "./modules/widgets.css";
 @import "./modules/teammates.css";
 @import "./modules/staff-website-page.css";
+
+@import "tailwindcss/utilities";

app/assets/stylesheets/modules/proposal.css

@@ -72,7 +72,7 @@
 }
 
 .proposal-list {
-  .actions { width: 180px; }
+  .actions { white-space: nowrap; }
   .date_range_filter, .text_filter { width: 100px !important; }
 }
 

app/assets/stylesheets/modules/schedule.css

@@ -111,6 +111,12 @@
   max-height: 200vh;
   overflow-y: scroll;
   min-height: 100vh;
+  padding: 1em;
+
+  &.draggable-hover {
+    background-color: #e0e0e0;
+    border: 2px dashed #999;
+  }
 
   .draggable-session-card {
     margin: 1em auto;
@@ -349,7 +355,8 @@ body .custom-session-card {
     border-width: 1px .5px .5px 0;
 
     &.draggable-hover {
-      background: var(--beige);
+      background: #e0e0e0;
+      border: 2px dashed #999;
     }
 
     &.preview {

app/javascript/application.js

@@ -0,0 +1,19 @@
+// Entry point for the build script in your package.json
+
+import * as Popper from "@popperjs/core"
+import * as bootstrap from "bootstrap"
+
+// Initialize Bootstrap dropdowns
+document.addEventListener('DOMContentLoaded', () => {
+  document.querySelectorAll('[data-bs-toggle="dropdown"]').forEach(el => {
+    new bootstrap.Dropdown(el)
+  })
+})
+
+import "@hotwired/turbo-rails"
+import { Turbo } from "@hotwired/turbo-rails"
+
+// Disable Turbo Drive globally - opt-in instead of opt-out for existing app
+Turbo.session.drive = false
+
+import "./controllers"

app/javascript/controllers/alert_controller.js

@@ -1,4 +1,4 @@
-import { Controller } from 'stimulus'
+import { Controller } from '@hotwired/stimulus'
 
 export default class extends Controller {
   static targets = ['message']

app/javascript/controllers/banner_ads_controller.js

@@ -1,4 +1,4 @@
-import { Controller } from 'stimulus'
+import { Controller } from '@hotwired/stimulus'
 
 export default class extends Controller {
   static targets = [ 'ad' ]

app/javascript/controllers/content_controller.js

@@ -1,4 +1,4 @@
-import { Controller } from 'stimulus'
+import { Controller } from '@hotwired/stimulus'
 import CodeMirror from 'codemirror/lib/codemirror.js'
 import 'codemirror/mode/htmlmixed/htmlmixed.js'
 

app/javascript/controllers/draggable_sessions_controller.js

@@ -1,4 +1,4 @@
-import { Controller } from 'stimulus'
+import { Controller } from '@hotwired/stimulus'
 import palette from 'google-palette'
 
 export default class extends Controller {
@@ -86,8 +86,19 @@ export default class extends Controller {
   setupDropZone() {
     if (!this.hasWidgetTarget) return
 
-    this.widgetTarget.addEventListener('dragover', this.handleDragOver.bind(this))
-    this.widgetTarget.addEventListener('drop', this.handleDrop.bind(this))
+    const widget = this.widgetTarget
+
+    widget.addEventListener('dragover', this.handleDragOver.bind(this))
+    widget.addEventListener('dragenter', (e) => {
+      e.preventDefault()
+      widget.classList.add('draggable-hover')
+    })
+    widget.addEventListener('dragleave', (e) => {
+      if (e.target === widget || !widget.contains(e.relatedTarget)) {
+        widget.classList.remove('draggable-hover')
+      }
+    })
+    widget.addEventListener('drop', this.handleDrop.bind(this))
   }
 
   handleDragOver(e) {
@@ -99,23 +110,30 @@ export default class extends Controller {
   }
 
   handleDrop(e) {
-    if (e.stopPropagation) {
-      e.stopPropagation()
-    }
+    e.stopPropagation()
     e.preventDefault()
 
+    this.widgetTarget.classList.remove('draggable-hover')
+
     const sessionId = e.dataTransfer.getData('text/plain')
-    const sessionCard = document.querySelector(`[data-id="${sessionId}"].draggable-session-card`)
+    if (!sessionId) {
+      console.warn('No session ID in dataTransfer')
+      return false
+    }
 
-    if (sessionCard) {
-      // Remove inline styles and move to widget
-      sessionCard.removeAttribute('style')
-      sessionCard.classList.remove('small', 'medium', 'large')
-      this.widgetTarget.prepend(sessionCard)
+    const sessionCard = document.querySelector(`.draggable-session-card[data-id="${sessionId}"]`)
+    if (!sessionCard) {
+      console.warn('Session card not found:', sessionId)
+      return false
+    }
 
-      if (sessionCard.dataset.scheduled) {
-        this.unschedule(sessionCard)
-      }
+    // Remove inline styles and move to widget
+    sessionCard.removeAttribute('style')
+    sessionCard.classList.remove('small', 'medium', 'large')
+    this.widgetTarget.prepend(sessionCard)
+
+    if (sessionCard.dataset.scheduled) {
+      this.unschedule(sessionCard)
     }
 
     return false

app/javascript/controllers/editor_controller.js

@@ -1,4 +1,4 @@
-import { Controller } from 'stimulus'
+import { Controller } from '@hotwired/stimulus'
 import CodeMirror from 'codemirror/lib/codemirror.js'
 import 'codemirror/mode/htmlmixed/htmlmixed.js'
 

app/javascript/controllers/filter_controller.js

@@ -1,5 +1,5 @@
-import { Controller } from 'stimulus'
-import FilterContainer from '../packs/filter_container'
+import { Controller } from '@hotwired/stimulus'
+import FilterContainer from '../filter_container'
 
 export default class extends Controller {
   static values = { type: String }

app/javascript/controllers/fly_out_controller.js

@@ -1,4 +1,4 @@
-import { Controller } from 'stimulus'
+import { Controller } from '@hotwired/stimulus'
 
 export default class extends Controller {
   static targets = [ 'sidePanel', 'listItem', 'filterWrapper' ]

app/javascript/controllers/index.js

@@ -1,12 +1,112 @@
 // Load all the controllers within this directory and all subdirectories.
 // Controller files must be named *_controller.js.
 
-import { Application } from "stimulus"
-import { definitionsFromContext } from "stimulus/webpack-helpers"
+import { Application } from "@hotwired/stimulus"
 
 const application = Application.start()
-const context = require.context("controllers", true, /_controller\.js$/)
-application.load(definitionsFromContext(context))
 
 // Make Stimulus application available globally for accessing controllers from legacy JS
 window.Stimulus = application
+
+// Import all controllers
+import AlertAutodismissController from "./alert_autodismiss_controller"
+import AlertController from "./alert_controller"
+import BannerAdsController from "./banner_ads_controller"
+import BulkDialogController from "./bulk_dialog_controller"
+import BulkDialogShowController from "./bulk_dialog_show_controller"
+import CfpDatatableController from "./cfp_datatable_controller"
+import ContentController from "./content_controller"
+import CopySpeakerEmailsController from "./copy_speaker_emails_controller"
+import DatatableController from "./datatable_controller"
+import DraggableSessionsController from "./draggable_sessions_controller"
+import EditorController from "./editor_controller"
+import FilterController from "./filter_controller"
+import FixedSubnavController from "./fixed_subnav_controller"
+import FlyOutController from "./fly_out_controller"
+import GridDayRefreshController from "./grid_day_refresh_controller"
+import GridShowModalController from "./grid_show_modal_controller"
+import GridTimeSlotRefreshController from "./grid_time_slot_refresh_controller"
+import HighlightController from "./highlight_controller"
+import InlineEditController from "./inline_edit_controller"
+import MaxlengthAlertController from "./maxlength_alert_controller"
+import MentionController from "./mention_controller"
+import ModalAutofocusController from "./modal_autofocus_controller"
+import ModalFormController from "./modal_form_controller"
+import MultiselectController from "./multiselect_controller"
+import NestedFormController from "./nested_form_controller"
+import NextProposalController from "./next_proposal_controller"
+import NotificationsChannelController from "./notifications_channel_controller"
+import PopoverController from "./popover_controller"
+import ProgramSessionsController from "./program_sessions_controller"
+import ProposalPreviewController from "./proposal_preview_controller"
+import ProposalSelectController from "./proposal_select_controller"
+import ProposalsTableController from "./proposals_table_controller"
+import RatingController from "./rating_controller"
+import RemoteModalController from "./remote_modal_controller"
+import ReviewTagsController from "./review_tags_controller"
+import ReviewerTagsController from "./reviewer_tags_controller"
+import ScheduleGridController from "./schedule_grid_controller"
+import ScheduleTabsController from "./schedule_tabs_controller"
+import SponsorsFooterController from "./sponsors_footer_controller"
+import StatusToggleController from "./status_toggle_controller"
+import SubNavController from "./sub_nav_controller"
+import TimeSelectController from "./time_select_controller"
+import TimeSlotDialogController from "./time_slot_dialog_controller"
+import TimeSlotErrorController from "./time_slot_error_controller"
+import TimeSlotFormResetController from "./time_slot_form_reset_controller"
+import TimeSlotsController from "./time_slots_controller"
+import ToggleVisibilityController from "./toggle_visibility_controller"
+import TomSelectController from "./tom_select_controller"
+import TooltipController from "./tooltip_controller"
+import TrackFilterController from "./track_filter_controller"
+
+application.register("alert-autodismiss", AlertAutodismissController)
+application.register("alert", AlertController)
+application.register("banner-ads", BannerAdsController)
+application.register("bulk-dialog", BulkDialogController)
+application.register("bulk-dialog-show", BulkDialogShowController)
+application.register("cfp-datatable", CfpDatatableController)
+application.register("content", ContentController)
+application.register("copy-speaker-emails", CopySpeakerEmailsController)
+application.register("datatable", DatatableController)
+application.register("draggable-sessions", DraggableSessionsController)
+application.register("editor", EditorController)
+application.register("filter", FilterController)
+application.register("fixed-subnav", FixedSubnavController)
+application.register("fly-out", FlyOutController)
+application.register("grid-day-refresh", GridDayRefreshController)
+application.register("grid-show-modal", GridShowModalController)
+application.register("grid-time-slot-refresh", GridTimeSlotRefreshController)
+application.register("highlight", HighlightController)
+application.register("inline-edit", InlineEditController)
+application.register("maxlength-alert", MaxlengthAlertController)
+application.register("mention", MentionController)
+application.register("modal-autofocus", ModalAutofocusController)
+application.register("modal-form", ModalFormController)
+application.register("multiselect", MultiselectController)
+application.register("nested-form", NestedFormController)
+application.register("next-proposal", NextProposalController)
+application.register("notifications-channel", NotificationsChannelController)
+application.register("popover", PopoverController)
+application.register("program-sessions", ProgramSessionsController)
+application.register("proposal-preview", ProposalPreviewController)
+application.register("proposal-select", ProposalSelectController)
+application.register("proposals-table", ProposalsTableController)
+application.register("rating", RatingController)
+application.register("remote-modal", RemoteModalController)
+application.register("review-tags", ReviewTagsController)
+application.register("reviewer-tags", ReviewerTagsController)
+application.register("schedule-grid", ScheduleGridController)
+application.register("schedule-tabs", ScheduleTabsController)
+application.register("sponsors-footer", SponsorsFooterController)
+application.register("status-toggle", StatusToggleController)
+application.register("sub-nav", SubNavController)
+application.register("time-select", TimeSelectController)
+application.register("time-slot-dialog", TimeSlotDialogController)
+application.register("time-slot-error", TimeSlotErrorController)
+application.register("time-slot-form-reset", TimeSlotFormResetController)
+application.register("time-slots", TimeSlotsController)
+application.register("toggle-visibility", ToggleVisibilityController)
+application.register("tom-select", TomSelectController)
+application.register("tooltip", TooltipController)
+application.register("track-filter", TrackFilterController)