Refactor code structure for improved readability and maintainability

apps/api/jest.config.ts

@@ -0,0 +1,20 @@
+import type { Config } from 'jest'
+
+const config: Config = {
+  moduleFileExtensions: ['js', 'json', 'ts'],
+  rootDir: 'src',
+  testRegex: '.*\\.spec\\.ts$',
+  transform: {
+    '^.+\\.ts$': 'ts-jest',
+  },
+  collectCoverageFrom: [
+    '**/*.ts',
+    '!**/*.spec.ts',
+    '!**/*.module.ts',
+    '!main.ts',
+  ],
+  coverageDirectory: '../coverage',
+  testEnvironment: 'node',
+}
+
+export default config

apps/api/package.json

@@ -44,22 +44,5 @@
     "ts-node": "^10.9.2",
     "tsconfig-paths": "^4.2.0",
     "typescript": "^5.7.3"
-  },
-  "jest": {
-    "moduleFileExtensions": [
-      "js",
-      "json",
-      "ts"
-    ],
-    "rootDir": "src",
-    "testRegex": ".*\\.spec\\.ts$",
-    "transform": {
-      "^.+\\.(t|j)s$": "ts-jest"
-    },
-    "collectCoverageFrom": [
-      "**/*.(t|j)s"
-    ],
-    "coverageDirectory": "../coverage",
-    "testEnvironment": "node"
   }
 }

apps/frontend/jest.config.ts

@@ -0,0 +1,23 @@
+import type { Config } from 'jest'
+import nextJest from 'next/jest.js'
+
+const createJestConfig = nextJest({
+  dir: './',
+})
+
+const config: Config = {
+  testEnvironment: 'jsdom',
+  setupFilesAfterEnv: ['<rootDir>/jest.setup.ts'],
+  testRegex: '.*\\.spec\\.tsx?$',
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1',
+  },
+  collectCoverageFrom: [
+    'src/**/*.{ts,tsx}',
+    '!src/**/*.spec.{ts,tsx}',
+    '!src/**/layout.tsx',
+  ],
+  coverageDirectory: 'coverage',
+}
+
+export default createJestConfig(config)

apps/frontend/jest.setup.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom'

apps/frontend/package.json

@@ -9,7 +9,10 @@
     "lint": "biome check",
     "format": "biome format --write",
     "check-types": "tsc --noEmit",
-    "clean": "rm -rf .next"
+    "clean": "rm -rf .next",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:cov": "jest --coverage"
   },
   "dependencies": {
     "next": "16.1.6",
@@ -18,11 +21,17 @@
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4",
+    "@testing-library/dom": "^10.4.1",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
+    "@types/jest": "^30.0.0",
     "@types/node": "^20",
     "@types/react": "^19",
     "@types/react-dom": "^19",
     "babel-plugin-react-compiler": "1.0.0",
+    "jest": "^30.2.0",
     "tailwindcss": "^4",
+    "ts-node": "^10.9.2",
     "typescript": "^5"
   }
 }

apps/frontend/src/app/page.spec.tsx

@@ -0,0 +1,19 @@
+import { render, screen } from '@testing-library/react'
+
+import Home from './page'
+
+jest.mock('next/image', () => ({
+  __esModule: true,
+  default: (props: React.ImgHTMLAttributes<HTMLImageElement>) => (
+    // biome-ignore lint/a11y/useAltText: mock
+    <img {...props} />
+  ),
+}))
+
+describe('Home', () => {
+  it('renders the Next.js logo', () => {
+    render(<Home />)
+    const logo = screen.getByAltText('Next.js logo')
+    expect(logo).toBeInTheDocument()
+  })
+})

apps/mobile/jest.config.js

@@ -0,0 +1,17 @@
+/** @type {import('jest').Config} */
+const config = {
+  preset: 'jest-expo',
+  testRegex: '.*\\.spec\\.tsx?$',
+  transformIgnorePatterns: [
+    'node_modules/(?!((jest-)?react-native|@react-native(-community)?)|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|@sentry/react-native|native-base|react-native-svg)',
+  ],
+  moduleNameMapper: {
+    '\\.(css)$': '<rootDir>/src/__mocks__/styleMock.ts',
+    '^@/(.*)$': '<rootDir>/src/$1',
+    '^@/assets/(.*)$': '<rootDir>/assets/$1',
+  },
+  collectCoverageFrom: ['src/**/*.{ts,tsx}', '!src/**/*.spec.{ts,tsx}'],
+  coverageDirectory: 'coverage',
+}
+
+module.exports = config

apps/mobile/package.json

@@ -12,7 +12,10 @@
     "lint": "biome check",
     "format": "biome format --write",
     "check-types": "tsc --noEmit",
-    "build": "expo export"
+    "build": "expo export",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:cov": "jest --coverage"
   },
   "dependencies": {
     "@react-navigation/bottom-tabs": "^7.7.3",
@@ -35,14 +38,19 @@
     "react-dom": "19.2.0",
     "react-native": "0.83.2",
     "react-native-gesture-handler": "~2.30.0",
-    "react-native-worklets": "0.7.2",
     "react-native-reanimated": "4.2.1",
     "react-native-safe-area-context": "~5.6.2",
     "react-native-screens": "~4.23.0",
-    "react-native-web": "~0.21.0"
+    "react-native-web": "~0.21.0",
+    "react-native-worklets": "0.7.2"
   },
   "devDependencies": {
+    "@testing-library/react-native": "^13.3.3",
+    "@types/jest": "^29.5.14",
     "@types/react": "~19.2.2",
+    "jest": "^29.7.0",
+    "jest-expo": "^55.0.9",
+    "ts-node": "^10.9.2",
     "typescript": "~5.9.2"
   },
   "private": true

apps/mobile/src/__mocks__/styleMock.ts

@@ -0,0 +1 @@
+export default {}

apps/mobile/src/components/themed-text.spec.tsx

@@ -0,0 +1,10 @@
+import { render, screen } from '@testing-library/react-native'
+
+import { ThemedText } from '@/components/themed-text'
+
+describe('ThemedText', () => {
+  it('renders children correctly', () => {
+    render(<ThemedText>Hello</ThemedText>)
+    expect(screen.getByText('Hello')).toBeTruthy()
+  })
+})