Merge pull request #216 from opengovsg/build/shared

build: create directory for shared client and server code

.github/workflows/ci.yml

@@ -28,8 +28,9 @@ jobs:
       - run: npm ci
       - run: npx lockfile-lint --type npm --path client/package-lock.json --validate-https --allowed-hosts npm
       - run: npx lockfile-lint --type npm --path server/package-lock.json --validate-https --allowed-hosts npm
+      - run: npx lockfile-lint --type npm --path shared/package-lock.json --validate-https --allowed-hosts npm
       - run: npm run lint-ci
-      - run: npm run --prefix server build -- --noEmit
+      - run: npm run --prefix server build
       - run: npm run --prefix client build
   test:
     name: Test

.husky/pre-commit

@@ -1,4 +1,4 @@
 #!/bin/sh
 . "$(dirname "$0")/_/husky.sh"
 
-npm run --prefix server lint-staged && npm run --prefix client lint-staged && sh secrets-check.sh
+npm run --prefix server lint-staged && npm run --prefix client lint-staged && npm run --prefix shared lint-staged && sh secrets-check.sh

Dockerfile

@@ -8,6 +8,8 @@ COPY . /app
 # Create app directory
 WORKDIR /app
 
+# Install shared dependencies
+RUN cd shared && npm ci && cd ..
 # Install backend dependencies
 RUN cd server && npm ci && cd ..
 # Install frontend dependencies

client/config-overrides.js

@@ -0,0 +1,10 @@
+const {
+  aliasDangerous,
+  configPaths,
+} = require('react-app-rewire-alias/lib/aliasDangerous')
+
+module.exports = function override(config, _env) {
+  aliasDangerous(configPaths('tsconfig.paths.json'))(config)
+
+  return config
+}

client/package.json

@@ -38,9 +38,9 @@
     "uuid": "^8.3.2"
   },
   "scripts": {
-    "start": "PORT=3000 react-scripts start",
-    "build": "INLINE_RUNTIME_CHUNK=false react-scripts build",
-    "test": "react-scripts test",
+    "start": "PORT=3000 react-app-rewired start",
+    "build": "INLINE_RUNTIME_CHUNK=false react-app-rewired build",
+    "test": "react-app-rewired test",
     "eject": "react-scripts eject",
     "lint": "eslint . --quiet --fix --ext '.ts,.js,.tsx,.jsx'",
     "lint-ci": "eslint . --quiet --ext '.ts,.js,.tsx,.jsx'",
@@ -76,6 +76,8 @@
     "eslint-plugin-react": "^7.25.1",
     "lint-staged": "^11.1.2",
     "prettier": "^2.2.1",
+    "react-app-rewire-alias": "^1.0.3",
+    "react-app-rewired": "^2.1.8",
     "typescript": "^4.4.2"
   }
 }

client/src/api/types/post.ts

@@ -1,7 +1,7 @@
 import { PostStatus } from '../../types/post-status'
 import { BaseModelParams, MessageResponse } from './common'
 import { BaseTagDto } from './tag'
-import { BaseUserDto } from './user'
+import { User as UserBaseDto } from '~shared/types'
 
 export type BasePostDto = BaseModelParams & {
   userId: number
@@ -14,7 +14,7 @@ export type BasePostDto = BaseModelParams & {
 // Backend does not select updatedAt
 export type GetSinglePostDto = Omit<BasePostDto, 'updatedAt'> & {
   tags: BaseTagDto[]
-  user: Pick<BaseUserDto, 'displayname'>
+  user: Pick<UserBaseDto, 'displayname'>
 }
 
 export type CreatePostReqDto = Pick<BasePostDto, 'title' | 'description'> & {

client/tsconfig.json

@@ -1,4 +1,5 @@
 {
+  "extends": "./tsconfig.paths.json",
   "compilerOptions": {
     "target": "es5",
     "lib": [
@@ -19,7 +20,6 @@
     "isolatedModules": true,
     "noEmit": true,
     "jsx": "react-jsx",
-    "rootDir": "./",
     "noImplicitAny": true
   },
   "include": [

client/tsconfig.paths.json

@@ -0,0 +1,8 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "~shared/*": ["../shared/*"]
+    }
+  }
+}

package.json

@@ -7,16 +7,17 @@
     "start": "npm --prefix server start",
     "build-frontend": "npm run build --prefix client",
     "build-backend": "npm run build --prefix server",
+    "build-shared": "npm run build --prefix shared",
     "build": "npm run build-frontend && npm run build-backend",
     "server": "npm run dev --prefix server",
     "client": "npm start --prefix client",
     "dev": "concurrently \"./wait-for-it.sh localhost:3306 -t 0 -- sleep 10 && npm run server\" \"npm run client\" \"docker-compose up \"",
-    "postinstall": "npm --prefix server install && npm --prefix client install",
-    "auditDep": "npm audit fix && npm --prefix server audit fix && npm --client server audit fix",
+    "postinstall": "npm --prefix server install && npm --prefix client install && npm --prefix shared install",
+    "auditDep": "npm audit fix && npm --prefix server audit fix && npm --client server audit fix && npm --shared audit fix",
     "prepare": "husky install",
     "test": "npm --prefix server test && CI=true npm --prefix client test -- --passWithNoTests",
-    "lint": "npm run --prefix server lint && npm run --prefix client lint",
-    "lint-ci": "npm run --prefix server lint-ci && npm run --prefix client lint-ci",
+    "lint": "npm run --prefix server lint && npm run --prefix client lint && npm run --prefix shared lint",
+    "lint-ci": "npm run --prefix server lint-ci && npm run --prefix client lint-ci && npm run --prefix shared lint-ci",
     "seq-cli": "npm run --prefix server seq-cli"
   },
   "author": "Open Government Products, GovTech Singapore (https://open.gov.sg)",

server/package.json

@@ -6,7 +6,7 @@
   "main": "./build/index.js",
   "scripts": {
     "start": "node ./build/index.js",
-    "build": "tsc",
+    "build": "tsc -b",
     "dev": "ts-node-dev --respawn --transpile-only --inspect -- ./src/index.ts",
     "test": "jest",
     "lint": "eslint . --quiet --fix --ext '.ts'",

server/src/models/users.model.ts

@@ -2,15 +2,12 @@ import { Sequelize, DataTypes, Model, ModelCtor } from 'sequelize'
 
 import { Tag } from './tags.model'
 import { IMinimatch } from 'minimatch'
+import { User as UserBaseDto } from '../../../shared/types'
 
 const USER_MODEL_NAME = 'user'
 
-export interface User extends Model {
-  id: string
-  username: string
-  displayname: string
-  views: number
-}
+// TODO (#225): Remove this and replace ModelCtor below with ModelDefined
+export interface User extends Model, UserBaseDto {}
 
 interface Settable {
   setDataValue(key: string, value: unknown): void

server/tsconfig.json

@@ -4,8 +4,7 @@
     "module": "commonjs",                           /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
     "lib": ["es6", "dom"],                          /* Specify library files to be included in the compilation. */
     "allowJs": true,                                /* Allow javascript files to be compiled. */
-    "outDir": "./build",                            /* Redirect output structure to the directory. */
-    "rootDir": "./src",                             /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
+    "outDir": "./build",                     /* Redirect output structure to the directory. */
     "strict": true,                                 /* Enable all strict type-checking options. */
     "noImplicitAny": true,                          /* Raise error on expressions and declarations with an implied 'any' type. */
     "esModuleInterop": true,                        /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
@@ -15,5 +14,8 @@
   },
   "include": [
     "src"
+  ],
+  "references": [
+    { "path": "../shared" }
   ]
 }

shared/.eslintrc.js

@@ -0,0 +1,16 @@
+module.exports = {
+  extends: [
+    'plugin:@typescript-eslint/recommended',
+    'plugin:prettier/recommended',
+  ],
+  rules: {
+    'no-console': 'warn',
+  },
+  parser: '@typescript-eslint/parser',
+  plugins: ['@typescript-eslint'],
+  ignorePatterns: ['node_modules/**/*'],
+  env: {
+    node: true,
+    es6: true,
+  },
+}

shared/.lintstagedrc

@@ -0,0 +1,3 @@
+{
+  "*.{js,ts}": "eslint --fix"
+}