fix pre-commit, linting and run it

.eslintrc

@@ -17,6 +17,7 @@
     "@typescript-eslint/no-non-null-assertion": "off"
   },
   "ignorePatterns": [
-    "**/dist"
+    "**/dist",
+    "**/static_shared"
   ]
 }

.pre-commit-config.yaml

@@ -11,5 +11,5 @@ repos:
           - --exclude-files
           - README.md
           - --exclude-files
-          - .yarn/releases/yarn-3.1.0.cjs
+          - .yarn/releases/yarn-3.8.3.cjs
         exclude: .*_test.*|yarn\.lock

base-theme/assets/js/clients.ts

@@ -15,8 +15,8 @@ const makeQueryClient = (): QueryClient => {
     defaultOptions: {
       queries: {
         refetchOnWindowFocus: false,
-        staleTime: Infinity,
-        onError: (error) => {
+        staleTime:            Infinity,
+        onError:              error => {
           const status = (error as MaybeHasStatus)?.response?.status
           if (THROW_ERROR_CODES.includes(status)) {
             throw error
@@ -33,10 +33,10 @@ const makeQueryClient = (): QueryClient => {
             return failureCount < MAX_RETRIES
           }
           return false
-        },
-      },
-    },
+        }
+      }
+    }
   })
 }
 
-export { makeQueryClient }
+export { makeQueryClient }

base-theme/assets/js/components/UserMenu.tsx

@@ -1,8 +1,6 @@
 import React from "react"
 
-import {
-  RiAccountCircleFill,
-} from "@remixicon/react"
+import { RiAccountCircleFill } from "@remixicon/react"
 
 import { useUserMe } from "../user"
 
@@ -26,30 +24,45 @@ export default function UserMenu() {
         <RiAccountCircleFill size={24} />
       </button>
       <ul className="dropdown-menu" aria-labelledby="userMenu">
-        {user?.is_authenticated ? (
+        {user?.isAuthenticated ? (
           <>
             <li>
               {user.first_name} {user.last_name}
             </li>
             <li>
-              <a className="dropdown-item" href={dashboardUrl} target="_blank">
+              <a
+                className="dropdown-item"
+                href={dashboardUrl}
+                target="_blank"
+                rel="noreferrer"
+              >
                 Dashboard
               </a>
             </li>
             <li>
-              <a className="dropdown-item" href={logoutUrl} target="_blank">
+              <a
+                className="dropdown-item"
+                href={logoutUrl}
+                target="_blank"
+                rel="noreferrer"
+              >
                 Logout
               </a>
             </li>
           </>
         ) : (
           <li>
-            <a className="dropdown-item" href={loginUrl} target="_blank">
+            <a
+              className="dropdown-item"
+              href={loginUrl}
+              target="_blank"
+              rel="noreferrer"
+            >
               Login
             </a>
           </li>
         )}
       </ul>
     </div>
   )
-}
+}

base-theme/assets/js/user.ts

@@ -1,36 +1,43 @@
 import { useQuery } from "@tanstack/react-query"
-import { Configuration, User as UserApi, UsersApi } from "@mitodl/open-api-axios/v0"
+import {
+  Configuration,
+  User as UserApi,
+  UsersApi
+} from "@mitodl/open-api-axios/v0"
 
 interface User extends Partial<UserApi> {
-  is_authenticated: boolean
+  isAuthenticated: boolean
 }
 
 const useUserMe = () =>
   useQuery({
     queryKey: ["userMe"],
-    queryFn: async (): Promise<User> => {
+    queryFn:  async (): Promise<User> => {
       try {
-        const config = { basePath: process.env.MIT_LEARN_API_BASEURL, baseOptions: { withCredentials: true } }
+        const config = {
+          basePath:    process.env.MIT_LEARN_API_BASEURL,
+          baseOptions: { withCredentials: true }
+        }
         const configuration = new Configuration({
-          basePath: config.basePath,
-          baseOptions: config.baseOptions,
+          basePath:    config.basePath,
+          baseOptions: config.baseOptions
         })
         const usersApi = new UsersApi(configuration)
         const response = await usersApi.usersMeRetrieve()
         return {
-          is_authenticated: true,
-          ...response.data,
+          isAuthenticated: true,
+          ...response.data
         }
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
       } catch (error: any) {
         if (error.response?.status === 403) {
           return {
-            is_authenticated: false,
+            isAuthenticated: false
           }
         }
         throw error
       }
-    },
+    }
   })
 
-export { useUserMe }
+export { useUserMe }

course-v2/assets/course-v2.tsx

@@ -35,7 +35,12 @@ $(function() {
   const userMenuContainer = document.querySelector("#user-menu-container")
   if (userMenuContainer) {
     const queryClient = makeQueryClient()
-    ReactDOM.render(<QueryClientProvider client={queryClient}><UserMenu /></QueryClientProvider>, userMenuContainer)
+    ReactDOM.render(
+      <QueryClientProvider client={queryClient}>
+        <UserMenu />
+      </QueryClientProvider>,
+      userMenuContainer
+    )
   }
 })
 
@@ -45,4 +50,4 @@ window.initNanogallery2 = () => {
   if (nanogallery2Loaded) return
   import("./nanogallery2-imports.js")
   nanogallery2Loaded = true
-}
+}

package.json

@@ -6,7 +6,7 @@
   "main": "base-theme/assets/index.js",
   "packageManager": "[email protected]",
   "scripts": {
-    "lint": "eslint $PROJECT_CWD/'**/*.{js,jsx,ts,tsx}'",
+    "lint": "eslint $PROJECT_CWD/'**/*.{js,jsx,ts,tsx}' --fix",
     "start": "NODE_ENV=development ts-node ./package_scripts/start.ts",
     "start:webpack": "yarn with-env --dev -- webpack --config ./base-theme/assets/webpack/webpack.dev.ts --stats-children",
     "start:www": "echo This command has been removed. Use `yarn start www` instead.",

www/assets/www.tsx

@@ -35,7 +35,12 @@ $(function() {
   const userMenuContainer = document.querySelector("#user-menu-container")
   if (userMenuContainer) {
     const queryClient = makeQueryClient()
-    ReactDOM.render(<QueryClientProvider client={queryClient}><UserMenu /></QueryClientProvider>, userMenuContainer)
+    ReactDOM.render(
+      <QueryClientProvider client={queryClient}>
+        <UserMenu />
+      </QueryClientProvider>,
+      userMenuContainer
+    )
   }
 
   const searchPageEl = document.querySelector("#search-page")
@@ -68,4 +73,4 @@ $(function() {
   initNotifications()
   setupEmailSignupForm()
   initSubNav()
-})
+})