FEATURE: Discover Flashcards Page

client2/.gitignore

@@ -22,3 +22,6 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+
+# Bundle Analyzer
+analyzer.html

client2/jest.config.ts

@@ -0,0 +1,22 @@
+/** @type {import('ts-jest').JestConfigWithTsJest} */
+import type { Config } from "jest";
+
+const config: Config = {
+  verbose: true,
+  roots: ["src"],
+  preset: "ts-jest",
+  moduleFileExtensions: ["js", "ts", "tsx", "json", "node"],
+  setupFilesAfterEnv: ["./jest.setup.ts"],
+  testMatch: [
+    "<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}",
+    "<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}",
+  ],
+  testEnvironment: "jest-environment-jsdom",
+  moduleNameMapper: {
+    "\\.(css|sass|scss)$": "identity-obj-proxy",
+    "src/(.*)": "<rootDir>/src/$1",
+  },
+  moduleDirectories: ["node_modules", "src"],
+};
+
+export default config;

client2/jest.setup.ts

@@ -0,0 +1,24 @@
+// jest-dom adds custom jest matchers for asserting on DOM nodes.
+// allows you to do things like:
+// expect(element).toHaveTextContent(/react/i)
+// learn more: https://github.com/testing-library/jest-dom
+import "whatwg-fetch";
+import "@testing-library/jest-dom";
+
+/*
+ * Uncomment this code below if you want Mock Service Worker to mock api calls in Jest tests.
+ * However, we want to put the stubs in our own test harnesses.
+ */
+// import { server } from "./src/tests/mocks/server";
+
+// beforeAll(() => {
+//   server.listen();
+// });
+
+// afterEach(() => {
+//   server.resetHandlers();
+// });
+
+// afterAll(() => {
+//   server.close();
+// });

client2/package.json

@@ -26,25 +26,56 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
+    "test": "jest --watchAll",
     "build": "tsc && vite build",
     "lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
     "preview": "vite preview"
   },
   "dependencies": {
+    "@reduxjs/toolkit": "^1.9.5",
+    "bootstrap": "^5.3.2",
+    "bootstrap-icons": "^1.11.1",
+    "magic-regexp": "^0.7.0",
+    "match-sorter": "^6.3.1",
     "million": "^2.4.6-beta.0",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "react-bootstrap": "^2.8.0",
+    "react-dom": "^18.2.0",
+    "react-hook-form": "^7.48.2",
+    "react-redux": "^8.1.1",
+    "react-router-dom": "^6.13.0",
+    "redux": "^4.2.1",
+    "redux-thunk": "^2.4.2"
   },
   "devDependencies": {
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^14.0.0",
+    "@testing-library/user-event": "^14.4.3",
+    "@types/jest": "^29.5.2",
+    "@types/jsdom": "^21.1.1",
+    "@types/node": "^20.3.1",
     "@types/react": "^18.0.37",
     "@types/react-dom": "^18.0.11",
+    "@types/testing-library__jest-dom": "^5.14.6",
     "@typescript-eslint/eslint-plugin": "^5.59.0",
     "@typescript-eslint/parser": "^5.59.0",
     "@vitejs/plugin-react": "^4.0.0",
     "eslint": "^8.38.0",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-react-refresh": "^0.3.4",
+    "identity-obj-proxy": "^3.0.0",
+    "jest": "^29.5.0",
+    "jest-environment-jsdom": "^29.5.0",
+    "jsdom": "^22.1.0",
+    "msw": "^1.3.1",
+    "rollup-plugin-visualizer": "^5.9.2",
+    "ts-jest": "^29.1.0",
+    "ts-node": "^10.9.1",
     "typescript": "^5.0.2",
-    "vite": "^4.3.9"
+    "vite": "^4.3.9",
+    "whatwg-fetch": "^3.6.2"
+  },
+  "msw": {
+    "workerDirectory": "public"
   }
 }