Fixed javascript errors

app/helpers/application_helper.rb

@@ -81,8 +81,9 @@ def links(links_list)
     links_list.each do |item|
       concat(
         content_tag(:li) do
-          link_to(item[:name], item[:path], method: item[:method], class: 'item', data: item[:data],
-          style: "#{'background-color: #4BB90B;' if current_page?(item[:path])}")
+          link_to(item[:name], item[:path], method: item[:method],
+                                            class: "item #{'active' if current_page?(item[:path])}",
+                                            data: item[:data])
         end
       )
     end

app/packs/entrypoints/application.js

@@ -9,17 +9,9 @@
 
 // Default Rails javascript and turbolinks
 import Rails from 'rails-ujs';
-
-require("chartkick").use(require("highcharts"))
-
-// import Turbolinks from 'turbolinks';
-
 Rails.start();
-// Turbolinks.start();
-
-// import { Turbo } from "@hotwired/turbo-rails"
-// Turbo.session.drive = true
 
+require("chartkick").use(require("highcharts"))
 import "@hotwired/turbo-rails"
 import "./controllers"
 // import "controllers"
@@ -37,7 +29,11 @@ import '../src/semantic/semantic.less';
 // Fonts
 import 'typeface-raleway';
 
-$(document).on('turbolinks:load', function() {
+import '../entrypoints/users.js';
+import '../entrypoints/wishlist_items.js'
+import '../entrypoints/payment_orders.js'
+
+$(document).on('turbo:load', function() {
     $('.ui.dropdown').dropdown();
     $('.ui.accordion').accordion();
 

app/packs/entrypoints/controllers/application.js

@@ -1,12 +1,11 @@
 import { Application } from "@hotwired/stimulus"
 
-const application = Application.start()
-
 import { Turbo } from "@hotwired/turbo-rails"
 
-
 Turbo.session.drive = true
 
+const application = Application.start()
+
 // Configure Stimulus development experience1
 application.debug = false
 window.Stimulus   = application

app/packs/entrypoints/payment_orders.js

@@ -1,6 +1,8 @@
-document.addEventListener('turbolinks:load', function() {
+document.addEventListener('turbo:load', function() {
     setTimeout(function() {
         const form = document.getElementById('payment-order-form');
-        form.submit();
+        if (form) {
+            form.submit();
+        }
     }, 1000);
 });

app/packs/entrypoints/stylesheets/application.scss

@@ -115,4 +115,17 @@
   .hide-table-header {
       display: none;
   }
+}
+
+.ui.right.sidebar.visible a.item:hover {
+  color: rgb(11, 79, 11);
+}
+
+.ui.right.sidebar.visible a.item.active {
+  background-color: #DCDCDC;
+  font-weight: bold;
+}
+
+.menu-main a.item.active {
+  background-color: green;
 }

app/packs/entrypoints/users.js

@@ -44,10 +44,15 @@ function formHandler() {
     }
 }
 
-document.addEventListener('turbolinks:load', function() {
+document.addEventListener('turbo:load', function() {
     const form = document.getElementById('user_form');
     const button = document.getElementById('user_form_commit');
 
-    form.addEventListener('change', formHandler);
-    button.addEventListener('click', formHandler);
+    if (form) {
+        form.addEventListener('change', formHandler);
+    }
+
+    if (button) {
+        button.addEventListener('click', formHandler);
+    }
 });

app/packs/entrypoints/wishlist_items.js

@@ -46,10 +46,15 @@ document.addEventListener('ajax:beforeSend', (event) => {
     clearErrors();
 });
 
-document.addEventListener('turbolinks:load', (event) => {
+document.addEventListener('turbo:load', (event) => {
     const form = document.getElementById('wishlist_item_form');
     const button = document.getElementById('wishlist_item_form_commit');
 
-    form.addEventListener('change', formHandler);
-    button.addEventListener('click', formHandler);
+    if (form) {
+        form.addEventListener('change', formHandler);
+    }
+
+    if (button) {
+        button.addEventListener('click', formHandler);
+    }
 });

app/views/admin/users/new.html.erb

@@ -22,6 +22,4 @@
 
         <%= render 'form', user: @user, url: admin_users_path %>
     </div>
-</div>
-
-<%= javascript_pack_tag 'users', 'data-turbolinks-track': 'reload' %>
+</div>

app/views/layouts/application.html.erb

@@ -7,8 +7,6 @@
     <%= csp_meta_tag %>
     <%= javascript_pack_tag 'application', 'data-turbo-track': 'reload' %>
     <%= stylesheet_pack_tag 'application', "data-turbo-track": 'reload' %>
-
-    <script src="https://code.jquery.com/jquery-3.6.0.slim.js" integrity="sha256-HwWONEZrpuoh951cQD1ov2HUK5zA5DwJ1DNUXaM6FsY=" crossorigin="anonymous"></script>
     <style>
       table thead {
           background-color: black !important;
@@ -80,6 +78,5 @@
 
 
     </div>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/components/transition.js"></script>
   </body>
 </html>

app/views/payment_orders/show.html.erb

@@ -28,6 +28,3 @@
         </div>
     </div>
 </div>
-
-<%#= stylesheet_pack_tag 'stylesheets/payment_orders', media: 'all', 'data-turbolinks-track': 'reload' %>
-<%= javascript_pack_tag 'payment_orders', 'data-turbolinks-track': 'reload' %>

app/views/users/new.html.erb

@@ -21,7 +21,4 @@
 
         <%= render 'form', user: @user, url: users_path %>
     </div>
-</div>
-
-<%#= stylesheet_pack_tag 'stylesheets/users', media: 'all', 'data-turbolinks-track': 'reload' %>
-<%= javascript_pack_tag 'users', 'data-turbolinks-track': 'reload' %>
+</div>

app/views/wishlist_items/index.html.erb

@@ -122,5 +122,3 @@
         </div>
     </div>
 </div>
-
-<%= javascript_pack_tag 'wishlist_items', 'data-turbolinks-track': 'reload' %>

config/webpacker.yml

@@ -64,7 +64,8 @@ development:
     hmr: false
     # Inline should be set to true if using HMR
     inline: true
-    overlay: true
+    client:
+      overlay: false
     compress: true
     disable_host_check: true
     use_local_ip: false