Update eslint configuration and error handling

Refactored the ESLint configurations for cleaner, more maintainable rule management across different modules. Additionally, enhanced the handling of errors in API calls in the chat application, providing clear return messages and reducing the risk of unhandled exceptions.

apps/learnbefore-bff/.eslintrc.js

@@ -0,0 +1,9 @@
+/** @type {import("eslint").Linter.Config} */
+module.exports = {
+  root: true,
+  extends: ["@repo/eslint-config/library.js"],
+  parser: "@typescript-eslint/parser",
+  rules: {
+    "no-redeclare": "off",
+  },
+}

apps/learnbefore-bff/api/chat.ts

@@ -1,7 +1,7 @@
 import OpenAI from "openai"
 import { startExpress } from "../src/start-express"
 import { getWords } from "../src/get-words"
-import { Message, User, Word } from "../types"
+import { Message, User } from "../types"
 import { ClerkExpressRequireAuth } from "@clerk/clerk-sdk-node"
 import { Store } from "../src/store"
 import { splitText } from "../src/split-text"
@@ -10,7 +10,9 @@ import expressAsyncHandler from "express-async-handler"
 import { retryableGenerator } from "../src/retryable-generator"
 
 declare global {
+  // eslint-disable-next-line no-unused-vars
   namespace Express {
+    // eslint-disable-next-line no-unused-vars
     interface Request {
       auth: { userId: string }
     }
@@ -21,7 +23,7 @@ const openai = new OpenAI({
   apiKey: process.env.OPENAI_API_KEY,
 })
 
-const app = startExpress(parseInt(process.env.PORT || "3000"))
+const app = startExpress(parseInt(process.env.EXPRESS_PORT || "3000"))
 
 const store = new Store(process.env.MONGO_CONNECTION_STRING!!)
 

apps/learnbefore-bff/package.json

@@ -5,6 +5,7 @@
   "main": "dist/api/chat.js",
   "scripts": {
     "build": "npx tsc",
+    "lint": "eslint . --max-warnings 0",
     "preview": "node dist/api/chat.js",
     "dev": "nodemon api/chat.ts"
   },

apps/learnbefore-bff/src/start-express.ts

@@ -24,6 +24,7 @@ export function startExpress(
       err: { stack: unknown },
       req: Request,
       res: Response,
+      // eslint-disable-next-line no-unused-vars
       next: NextFunction,
     ) => {
       console.error(err.stack)

apps/learnbefore-bff/src/store.ts

@@ -4,6 +4,7 @@ import { Message, User, Word } from "../types"
 export class Store {
   private db: Db | undefined
 
+  // eslint-disable-next-line no-unused-vars
   constructor(private connectionString: string) {}
 
   public async getUserMessages(userId: string, limit = 10): Promise<Message[]> {

apps/learnbefore/.eslintrc.cjs

@@ -1,18 +1,9 @@
+/** @type {import("eslint").Linter.Config} */
 module.exports = {
   root: true,
-  env: { browser: true, es2020: true },
-  extends: [
-    'eslint:recommended',
-    'plugin:@typescript-eslint/recommended',
-    'plugin:react-hooks/recommended',
-  ],
-  ignorePatterns: ['dist', '.eslintrc.cjs'],
-  parser: '@typescript-eslint/parser',
-  plugins: ['react-refresh'],
+  extends: ["@repo/eslint-config/vite-react.js"],
+  parser: "@typescript-eslint/parser",
   rules: {
-    'react-refresh/only-export-components': [
-      'warn',
-      { allowConstantExport: true },
-    ],
-  },
+    "no-redeclare": "off"
+  }
 }

apps/learnbefore/package.json

@@ -6,7 +6,7 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc && vite build",
-    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "lint": "eslint . --max-warnings 0",
     "preview": "vite preview"
   },
   "dependencies": {
@@ -26,8 +26,10 @@
   },
   "devDependencies": {
     "@repo/types": "workspace:*",
+    "@repo/typescript-config": "workspace:*",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
+    "@repo/eslint-config": "workspace:*",
     "@typescript-eslint/eslint-plugin": "^7.8.0",
     "@typescript-eslint/parser": "^7.8.0",
     "@vitejs/plugin-react": "^4.3.0",

apps/learnbefore/src/helpers/fetch-json.ts

@@ -0,0 +1,23 @@
+type ApiError = {
+  message: string
+}
+
+// TODO: experimental
+export async function fetchJson(url: string, init: RequestInit = {}) {
+  const response = await fetch(url, init)
+  if (!response.ok) {
+    throw {
+      message: experimentalErrorMessage,
+    } as ApiError
+  }
+
+  try {
+    return await response.json()
+  } catch (error) {
+    throw {
+      message: experimentalErrorMessage,
+    } as ApiError
+  }
+}
+
+const experimentalErrorMessage = "An error occurred, please try again later."

apps/learnbefore/src/main.tsx

@@ -16,6 +16,5 @@ ReactDOM.createRoot(document.getElementById("root")!).render(
     <ClerkProvider publishableKey={PUBLISHABLE_KEY}>
       <App />
     </ClerkProvider>
-    ,
   </React.StrictMode>,
 )

apps/learnbefore/src/pages/chat-page.tsx

@@ -14,6 +14,7 @@ import { PaperclipIcon } from "../icons/paperclip-icon.tsx"
 import { getTextFromFile } from "../helpers/get-text-from-file.ts"
 import { createMessageFetcher } from "../helpers/fetchers.ts"
 import { useTranslation } from "react-i18next"
+import { fetchJson } from "../helpers/fetch-json.ts"
 
 export const ChatPage: React.FC = () => {
   const [messages, setMessages] = useState<Message[] | null>(null)
@@ -43,10 +44,7 @@ export const ChatPage: React.FC = () => {
     expandedMessages.includes(message.id)
 
   useEffect(() => {
-    fetch("/api/chat")
-      .then((res) => res.json())
-      .then(setMessages)
-      .catch(setError)
+    fetchJson("/api/chat").then(setMessages).catch(setError)
   }, [])
 
   const handleSend = async (e: React.FormEvent) => {
@@ -104,7 +102,7 @@ export const ChatPage: React.FC = () => {
 
     setInputValue("")
   }
-  if (error) return <div>Error occurred: {error}</div>
+  if (error) return <span>{JSON.stringify(error)}</span>
 
   return (
     <AppShell>

packages/eslint-config/vite-react.js

@@ -0,0 +1,18 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:react-hooks/recommended",
+  ],
+  ignorePatterns: ["dist", ".eslintrc.cjs"],
+  parser: "@typescript-eslint/parser",
+  plugins: ["react-refresh"],
+  rules: {
+    "react-refresh/only-export-components": [
+      "warn",
+      { allowConstantExport: true },
+    ],
+  },
+}

packages/types/.eslintrc.js

@@ -0,0 +1,9 @@
+/** @type {import("eslint").Linter.Config} */
+module.exports = {
+  root: true,
+  extends: ["@repo/eslint-config/library.js"],
+  parser: "@typescript-eslint/parser",
+  rules: {
+    "no-redeclare": "off",
+  },
+}

packages/types/package.json

@@ -2,6 +2,9 @@
   "name": "@repo/types",
   "version": "0.0.0",
   "private": true,
+  "scripts": {
+    "lint": "eslint . --max-warnings 0"
+  },
   "devDependencies": {
     "@repo/eslint-config": "workspace:*",
     "@repo/typescript-config": "workspace:*",

turbo.json

@@ -3,6 +3,11 @@
   "globalDependencies": [
     "**/.env.*local"
   ],
+  "globalEnv": [
+    "OPENAI_API_KEY",
+    "MONGO_CONNECTION_STRING",
+    "EXPRESS_PORT"
+  ],
   "tasks": {
     "build": {
       "dependsOn": [