DEV: Update linting config and run gjs-codemod (#81)

* DEV: Update linting config and run gjs-codemod

* fixup

* DEV: Update linting config and run gjs-codemod

Author: CvX

.discourse-compatibility

@@ -1,3 +1,4 @@
+< 3.5.0.beta5-dev: f3a9b47f838be2cfdc8dbfd8de919d64ea3895d2
 < 3.5.0.beta3-dev: 03fc59b9814897ab39aa6a6963381b6bd09bf83e
 < 3.5.0.beta1-dev: 83e2797ceb40d9832a40ee8c4bc32c7127e9dcda
 < 3.4.0.beta4-dev: a5ff3374335f17b46654c4ae1e5be7b539c2da1a

Gemfile.lock

@@ -14,42 +14,44 @@ GEM
       securerandom (>= 0.3)
       tzinfo (~> 2.0, >= 2.0.5)
       uri (>= 0.13.1)
-    ast (2.4.2)
-    base64 (0.2.0)
-    benchmark (0.4.0)
-    bigdecimal (3.1.9)
+    ast (2.4.3)
+    base64 (0.3.0)
+    benchmark (0.4.1)
+    bigdecimal (3.2.1)
     concurrent-ruby (1.3.5)
-    connection_pool (2.5.0)
-    drb (2.2.1)
+    connection_pool (2.5.3)
+    drb (2.2.3)
     i18n (1.14.7)
       concurrent-ruby (~> 1.0)
-    json (2.10.2)
-    language_server-protocol (3.17.0.4)
+    json (2.12.2)
+    language_server-protocol (3.17.0.5)
     lint_roller (1.1.0)
-    logger (1.6.6)
+    logger (1.7.0)
     minitest (5.25.5)
-    parallel (1.26.3)
-    parser (3.3.7.1)
+    parallel (1.27.0)
+    parser (3.3.8.0)
       ast (~> 2.4.1)
       racc
     prettier_print (1.2.1)
+    prism (1.4.0)
     racc (1.8.1)
-    rack (3.1.12)
+    rack (3.1.15)
     rainbow (3.1.1)
     regexp_parser (2.10.0)
-    rubocop (1.74.0)
+    rubocop (1.76.0)
       json (~> 2.3)
       language_server-protocol (~> 3.17.0.2)
       lint_roller (~> 1.1.0)
       parallel (~> 1.10)
       parser (>= 3.3.0.2)
       rainbow (>= 2.2.2, < 4.0)
       regexp_parser (>= 2.9.3, < 3.0)
-      rubocop-ast (>= 1.38.0, < 2.0)
+      rubocop-ast (>= 1.45.0, < 2.0)
       ruby-progressbar (~> 1.7)
       unicode-display_width (>= 2.4.0, < 4.0)
-    rubocop-ast (1.39.0)
-      parser (>= 3.3.1.0)
+    rubocop-ast (1.45.0)
+      parser (>= 3.3.7.2)
+      prism (~> 1.4)
     rubocop-capybara (2.22.1)
       lint_roller (~> 1.1)
       rubocop (~> 1.72, >= 1.72.1)
@@ -65,13 +67,13 @@ GEM
     rubocop-factory_bot (2.27.1)
       lint_roller (~> 1.1)
       rubocop (~> 1.72, >= 1.72.1)
-    rubocop-rails (2.30.3)
+    rubocop-rails (2.32.0)
       activesupport (>= 4.2.0)
       lint_roller (~> 1.1)
       rack (>= 1.1)
-      rubocop (>= 1.72.1, < 2.0)
-      rubocop-ast (>= 1.38.0, < 2.0)
-    rubocop-rspec (3.5.0)
+      rubocop (>= 1.75.0, < 2.0)
+      rubocop-ast (>= 1.44.0, < 2.0)
+    rubocop-rspec (3.6.0)
       lint_roller (~> 1.1)
       rubocop (~> 1.72, >= 1.72.1)
     rubocop-rspec_rails (2.31.0)
@@ -98,4 +100,4 @@ DEPENDENCIES
   syntax_tree
 
 BUNDLED WITH
-   2.6.6
+   2.6.9

common/common.scss

@@ -1,3 +1,5 @@
+@use "lib/viewport";
+
 // custom search banner customizations
 .custom-search-banner-wrap {
   margin: 0 auto !important;
@@ -7,7 +9,7 @@
   h1 {
     line-height: var(--line-height-small);
 
-    @include breakpoint("large", min-width) {
+    @include viewport.from(lg) {
       font-size: 4em;
     }
   }
@@ -16,7 +18,7 @@
     margin-top: 0.5em;
     margin-bottom: 2em;
 
-    @include breakpoint("large", min-width) {
+    @include viewport.from(lg) {
       font-size: var(--font-up-1);
     }
   }
@@ -31,15 +33,15 @@
     min-height: 40px;
 
     &:focus {
-      outline: 3px solid rgba(var(--primary-rgb), 0.35);
+      outline: 3px solid rgb(var(--primary-rgb), 0.35);
     }
   }
 
   .widget-link.show-help {
-    color: rgba(var(--primary-rgb), 0.75);
+    color: rgb(var(--primary-rgb), 0.75);
     border-radius: 0.5em;
     padding: 0.5em;
-    background-color: rgba(var(--secondary-rgb), 0.25);
+    background-color: rgb(var(--secondary-rgb), 0.25);
 
     &:hover {
       color: var(--primary);
@@ -199,7 +201,7 @@ div.ac-wrap {
 }
 
 .d-header {
-  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.06);
+  box-shadow: 0 2px 4px 0 rgb(0, 0, 0, 0.06);
 }
 
 .d-header-icons .d-icon {
@@ -242,7 +244,7 @@ div.ac-wrap {
 .menu-panel .widget-link:focus,
 .menu-panel .categories-link:hover,
 .menu-panel .categories-link:focus {
-  background-color: rgba(var(--tertiary-rgb), 0.5);
+  background-color: rgb(var(--tertiary-rgb), 0.5);
 }
 
 .btn:not(.themes-tab, .components-tab),
@@ -274,8 +276,8 @@ html {
     background:
       linear-gradient(
         0deg,
-        rgba(var(--primary-rgb), 0.075) 0%,
-        rgba(var(--primary-rgb), 0.075) 100%
+        rgb(var(--primary-rgb), 0.075) 0%,
+        rgb(var(--primary-rgb), 0.075) 100%
       ),
       linear-gradient(0deg, var(--secondary) 100%, var(--secondary) 100%);
   }
@@ -308,21 +310,21 @@ html body #main-outlet {
   max-width: 1150px;
   padding-bottom: 5% !important; // overriding inline style
   box-shadow:
-    0 24px 40px rgba(0, 0, 0, 0.07),
-    0 10.8529px 24.1177px rgba(0, 0, 0, 0.0456112),
-    0 4.50776px 10.0172px rgba(0, 0, 0, 0.035),
-    0 1.63037px 3.62304px rgba(0, 0, 0, 0.0243888);
+    0 24px 40px rgb(0, 0, 0, 0.07),
+    0 10.8529px 24.1177px rgb(0, 0, 0, 0.0456112),
+    0 4.50776px 10.0172px rgb(0, 0, 0, 0.035),
+    0 1.63037px 3.62304px rgb(0, 0, 0, 0.0243888);
 
-  @media screen and (max-width: 700px) {
+  @media screen and (width <= 700px) {
     padding: 1.5em;
     margin-top: 0;
   }
 
-  @media screen and (max-width: 1120px) {
+  @media screen and (width <= 1120px) {
     width: 80%;
   }
 
-  @media screen and (max-width: 1075px) {
+  @media screen and (width <= 1075px) {
     width: 85%;
   }
 
@@ -411,22 +413,22 @@ html body #main-outlet {
       display: flex;
       margin-bottom: 0.5em;
       background-color: var(--secondary);
-      border: 1px solid rgba(var(--primary-rgb), 0.2);
+      border: 1px solid rgb(var(--primary-rgb), 0.2);
       border-radius: 1em;
       position: relative;
       transition: box-shadow 100ms ease-in-out;
-      box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);
+      box-shadow: 0 0 8px rgb(0, 0, 0, 0.05);
       overflow: hidden;
 
       &.visited {
-        border: 1px solid rgba(var(--primary-rgb), 0.1);
+        border: 1px solid rgb(var(--primary-rgb), 0.1);
 
         .discourse-tag {
           opacity: 0.75;
         }
 
         &:hover {
-          border: 1px solid rgba(var(--primary-rgb), 0.25);
+          border: 1px solid rgb(var(--primary-rgb), 0.25);
 
           .discourse-tag {
             opacity: 1;
@@ -436,8 +438,8 @@ html body #main-outlet {
 
       &:hover {
         background-color: var(--secondary);
-        box-shadow: 0 0 12px rgba(0, 0, 0, 0.1);
-        border: 1px solid rgba(var(--primary-rgb), 0.3);
+        box-shadow: 0 0 12px rgb(0, 0, 0, 0.1);
+        border: 1px solid rgb(var(--primary-rgb), 0.3);
 
         a.title:not(.badge-notification),
         a.topic-excerpt {
@@ -590,10 +592,10 @@ html body #main-outlet {
   border-radius: 1em;
   padding: 3em 3em 5%;
   box-shadow:
-    0 24px 40px rgba(0, 0, 0, 0.07),
-    0 10.8529px 24.1177px rgba(0, 0, 0, 0.0456112),
-    0 4.50776px 10.0172px rgba(0, 0, 0, 0.035),
-    0 1.63037px 3.62304px rgba(0, 0, 0, 0.0243888);
+    0 24px 40px rgb(0, 0, 0, 0.07),
+    0 10.8529px 24.1177px rgb(0, 0, 0, 0.0456112),
+    0 4.50776px 10.0172px rgb(0, 0, 0, 0.035),
+    0 1.63037px 3.62304px rgb(0, 0, 0, 0.0243888);
   z-index: 1;
   position: relative;
 }

mobile/mobile.scss

@@ -120,7 +120,7 @@ ol.category-breadcrumb {
   .drop {
     top: calc(100% + 0.5em);
     border-radius: 8px;
-    box-shadow: 0 0 12px rgba(0, 0, 0, 0.25);
+    box-shadow: 0 0 12px rgb(0, 0, 0, 0.25);
   }
 }
 
@@ -163,8 +163,8 @@ ol.category-breadcrumb {
   background: var(--secondary);
   padding: 1em;
   border-radius: 8px;
-  box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);
-  border: 1px solid rgba(var(--primary-rgb), 0.1);
+  box-shadow: 0 0 8px rgb(0, 0, 0, 0.05);
+  border: 1px solid rgb(var(--primary-rgb), 0.1);
   margin-bottom: 0.5em;
 }
 
@@ -183,8 +183,8 @@ ol.category-breadcrumb {
 .full-width .contents .topic-list .topic-list-header tr {
   background-color: var(--secondary);
   border-radius: 8px;
-  box-shadow: 0 0 8px rgba(0, 0, 0, 0.05);
-  border: 1px solid rgba(var(--primary-rgb), 0.1);
+  box-shadow: 0 0 8px rgb(0, 0, 0, 0.05);
+  border: 1px solid rgb(var(--primary-rgb), 0.1);
   margin-bottom: 1em;
 }
 

package.json

@@ -1,11 +1,11 @@
 {
   "private": true,
   "devDependencies": {
-    "@discourse/lint-configs": "2.11.1",
-    "ember-template-lint": "7.0.1",
-    "eslint": "9.22.0",
+    "@discourse/lint-configs": "2.25.0",
+    "ember-template-lint": "7.8.1",
+    "eslint": "9.28.0",
     "prettier": "3.5.3",
-    "stylelint": "16.16.0"
+    "stylelint": "16.20.0"
   },
   "engines": {
     "node": ">= 22",