feat: add a common-i18n package

apps/nextjs-app/next-i18next.config.js

@@ -8,5 +8,5 @@ module.exports = {
   react: {
     useSuspense: true,
   },
-  localePath: path.resolve('./public/locales'),
+  localePath: path.resolve('../../packages/common-i18n/src/locales'),
 };

apps/nextjs-app/package.json

@@ -121,6 +121,7 @@
     "@soluble/cache-interop": "0.9.1",
     "@soluble/cache-ioredis": "0.10.0",
     "@tsed/exceptions": "6.113.1",
+    "@your-org/common-i18n": "workspace:^",
     "@your-org/core-lib": "workspace:^",
     "@your-org/db-main-prisma": "workspace:^",
     "@your-org/ui-lib": "workspace:^",

apps/nextjs-app/src/types.d/react-i18next.d.ts

@@ -5,19 +5,16 @@
  * @link https://react.i18next.com/latest/typescript
  */
 import 'react-i18next';
-import type common from '../../public/locales/en/common.json';
-import type demo from '../../public/locales/en/demo.json';
-import type home from '../../public/locales/en/home.json';
-import type system from '../../public/locales/en/system.json';
+import type { I18nNamespaces } from '@your-org/common-i18n/index';
 
 declare module 'react-i18next' {
   interface CustomTypeOptions {
     defaultNS: 'common';
     resources: {
-      common: typeof common;
-      home: typeof home;
-      demo: typeof demo;
-      system: typeof system;
+      common: I18nNamespaces['common'];
+      home: I18nNamespaces['home'];
+      demo: I18nNamespaces['demo'];
+      system: I18nNamespaces['system'];
     };
   }
 }

apps/nextjs-app/tsconfig.json

@@ -18,6 +18,7 @@
       "@/pages/*": ["./pages/*"],
       "@/public/*": ["../public/*"],
       "@/themes/*": ["./themes/*"],
+      "@your-org/common-i18n/*": ["../../../packages/common-i18n/src/*"],
       "@your-org/ui-lib/*": ["../../../packages/ui-lib/src/*"],
       "@your-org/ui-lib": ["../../../packages/ui-lib/src/index"],
       "@your-org/core-lib/*": ["../../../packages/core-lib/src/*"],

apps/remix-app/package.json

@@ -42,6 +42,7 @@
     "@remix-run/serve": "1.4.1",
     "@remix-run/vercel": "1.4.1",
     "@vercel/node": "1.14.1",
+    "@your-org/common-i18n": "workspace:^",
     "@your-org/core-lib": "workspace:^",
     "@your-org/ui-lib": "workspace:^",
     "react": "18.0.0",

apps/vite-app/package.json

@@ -17,6 +17,7 @@
   "dependencies": {
     "@emotion/react": "11.9.0",
     "@emotion/styled": "11.8.1",
+    "@your-org/common-i18n": "workspace:^",
     "@your-org/core-lib": "workspace:^",
     "@your-org/ui-lib": "workspace:^",
     "react": "18.0.0",

packages/common-i18n/.eslintrc.js

@@ -0,0 +1,24 @@
+/**
+ * Specific eslint rules for this app/package, extends the base rules
+ * @see https://github.com/belgattitude/nextjs-monorepo-example/blob/main/docs/about-linters.md
+ */
+
+const {
+  getDefaultIgnorePatterns,
+} = require('@your-org/eslint-config-bases/helpers');
+
+module.exports = {
+  root: true,
+  ignorePatterns: [...getDefaultIgnorePatterns()],
+  extends: [
+    '@your-org/eslint-config-bases/typescript',
+    // Apply prettier and disable incompatible rules
+    '@your-org/eslint-config-bases/prettier',
+  ],
+  rules: {
+    // optional overrides per project
+  },
+  overrides: [
+    // optional overrides per project file match
+  ],
+};

packages/common-i18n/.gitignore

@@ -0,0 +1,14 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# build
+/dist
+
+# dependencies
+node_modules
+
+# testing
+/coverage
+
+# misc
+.DS_Store
+*.pem

packages/common-i18n/CHANGELOG.md

@@ -0,0 +1 @@
+# @your-org/common-i18n

packages/common-i18n/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020-2021 Sébastien Vanvelthem
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

packages/common-i18n/README.md

@@ -0,0 +1,11 @@
+# @your-org/common-i18n
+
+<p align="left">
+  <a aria-label="Build" href="https://github.com/belgattitude/nextjs-monorepo-example/actions?query=workflow%3ACI">
+    <img alt="build" src="https://img.shields.io/github/workflow/status/belgattitude/nextjs-monorepo-example/CI-web-app/main?label=CI&logo=github&style=flat-quare&labelColor=000000" />
+  </a>
+</p>
+
+## Intro
+
+WIP

packages/common-i18n/jest.config.js

@@ -0,0 +1,51 @@
+// @ts-check
+
+const { defaults: tsjPreset } = require('ts-jest/presets');
+const { pathsToModuleNameMapper } = require('ts-jest');
+
+const { getJestCachePath } = require('../../cache.config');
+
+const packageJson = require('./package.json');
+const { compilerOptions: baseTsConfig } = require('./tsconfig.json');
+
+// Take the paths from tsconfig automatically from base tsconfig.json
+// @link https://kulshekhar.github.io/ts-jest/docs/paths-mapping
+const getTsConfigBasePaths = () => {
+  return baseTsConfig.paths
+    ? pathsToModuleNameMapper(baseTsConfig.paths, {
+        prefix: '<rootDir>/',
+      })
+    : {};
+};
+
+/** @typedef {import('ts-jest/dist/types')} */
+/** @type {import('@jest/types').Config.InitialOptions} */
+const config = {
+  name: `${packageJson.name}:unit`,
+  cacheDirectory: getJestCachePath(packageJson.name),
+  testEnvironment: 'jsdom',
+  verbose: true,
+  rootDir: './src',
+  transform: {
+    ...tsjPreset.transform,
+  },
+  setupFilesAfterEnv: ['@testing-library/jest-dom/extend-expect'],
+  testMatch: ['<rootDir>/**/*.{spec,test}.{js,jsx,ts,tsx}'],
+  moduleNameMapper: {
+    // For @testing-library/react
+    '^@/test-utils$': '<rootDir>/../config/jest/test-utils',
+    ...getTsConfigBasePaths(),
+  },
+  // false by default, overrides in cli, ie: yarn test:unit --collect-coverage=true
+  collectCoverage: false,
+  coverageDirectory: '<rootDir>/../coverage',
+  collectCoverageFrom: ['<rootDir>/**/*.{ts,tsx,js,jsx}', '!**/*.test.ts'],
+  globals: {
+    'ts-jest': {
+      diagnostics: true,
+      tsconfig: './tsconfig.jest.json',
+    },
+  },
+};
+
+module.exports = config;

packages/common-i18n/lint-staged.config.js

@@ -0,0 +1,36 @@
+// @ts-check
+
+/**
+ * This files overrides the base lint-staged.config.js present in the root directory.
+ * It allows to run eslint based the package specific requirements.
+ * {@link https://github.com/okonet/lint-staged#how-to-use-lint-staged-in-a-multi-package-monorepo}
+ * {@link https://github.com/belgattitude/nextjs-monorepo-example/blob/main/docs/about-lint-staged.md}
+ */
+
+const {
+  concatFilesForPrettier,
+  getEslintFixCmd,
+} = require('../../lint-staged.common.js');
+
+/**
+ * @type {Record<string, (filenames: string[]) => string | string[] | Promise<string | string[]>>}
+ */
+const rules = {
+  '**/*.{js,jsx,ts,tsx}': (filenames) => {
+    return getEslintFixCmd({
+      cwd: __dirname,
+      fix: true,
+      cache: true,
+      // when autofixing staged-files a good tip is to disable react-hooks/exhaustive-deps, cause
+      // a change here can potentially break things without proper visibility.
+      rules: ['react-hooks/exhaustive-deps: off'],
+      maxWarnings: 25,
+      files: filenames,
+    });
+  },
+  '**/*.{json,md,mdx,css,html,yml,yaml,scss}': (filenames) => {
+    return [`prettier --write ${concatFilesForPrettier(filenames)}`];
+  },
+};
+
+module.exports = rules;

packages/common-i18n/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@your-org/common-i18n",
+  "version": "1.0.0",
+  "license": "MIT",
+  "private": true,
+  "homepage": "https://github.com/belgattitude/nextjs-monorepo-example",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/belgattitude/nextjs-monorepo-example",
+    "directory": "packages/common-i18n"
+  },
+  "author": {
+    "name": "Vanvelthem Sébastien",
+    "url": "https://github.com/belgattitude"
+  },
+  "sideEffects": false,
+  "scripts": {
+    "clean": "rimraf --no-glob ./dist ./coverage ./tsconfig.tsbuildinfo ./.eslintcache && jest --clear-cache",
+    "lint": "eslint . --ext .ts,.tsx,.js,.jsx",
+    "typecheck": "tsc --project ./tsconfig.json --noEmit"
+  },
+  "devDependencies": {
+    "@types/jest": "27.4.1",
+    "@types/node": "17.0.24",
+    "@your-org/eslint-config-bases": "workspace:^",
+    "cross-env": "7.0.3",
+    "eslint": "8.13.0",
+    "prettier": "2.6.2",
+    "rimraf": "3.0.2",
+    "typescript": "4.6.3"
+  }
+}

packages/common-i18n/src/index.ts

@@ -0,0 +1,11 @@
+import type common from './locales/en/common.json';
+import type demo from './locales/en/demo.json';
+import type home from './locales/en/home.json';
+import type system from './locales/en/system.json';
+
+export type I18nNamespaces = {
+  home: typeof home;
+  demo: typeof demo;
+  common: typeof common;
+  system: typeof system;
+};

packages/common-i18n/src/locales/en/common.json

@@ -0,0 +1,10 @@
+{
+  "actions": {
+    "save": "Save",
+    "update": "Update",
+    "delete": "Delete",
+    "cancel": "Cancel",
+    "zoomIn": "Zoom in",
+    "zoomOut": "Zoom out"
+  }
+}

packages/common-i18n/src/locales/en/demo.json

@@ -0,0 +1,5 @@
+{
+  "page": {
+    "title": "Web-app | Demo | nextjs-monorepo-example"
+  }
+}

packages/common-i18n/src/locales/en/home.json

@@ -0,0 +1,9 @@
+{
+  "page": {
+    "title": "Home | Web-app | nextjs-monorepo-example"
+  },
+  "btn": {
+    "getStarted": "Get started",
+    "liveDemo": "Live demo"
+  }
+}

packages/common-i18n/src/locales/en/system.json

@@ -0,0 +1,8 @@
+{
+  "notFound": {
+    "title": "404 - Page Not Found"
+  },
+  "links": {
+    "backToHome": "Back to home"
+  }
+}

packages/common-i18n/src/locales/fr/common.json

@@ -0,0 +1,10 @@
+{
+  "actions": {
+    "save": "Sauver",
+    "update": "Mettre à jour",
+    "delete": "Effacer",
+    "cancel": "Annuler",
+    "zoomIn": "Agrandir",
+    "zoomOut": "Réduire"
+  }
+}

packages/common-i18n/src/locales/fr/demo.json

@@ -0,0 +1,5 @@
+{
+  "page": {
+    "title": "Web-app | DAmo | nextjs-monorepo-example"
+  }
+}

packages/common-i18n/src/locales/fr/home.json

@@ -0,0 +1,9 @@
+{
+  "page": {
+    "title": "Accueil | Web-app | nextjs-monorepo-example"
+  },
+  "btn": {
+    "getStarted": "Démarrer",
+    "liveDemo": "Démo"
+  }
+}

packages/common-i18n/src/locales/fr/system.json

@@ -0,0 +1,8 @@
+{
+  "notFound": {
+    "title": "404 - Page non trouvée"
+  },
+  "links": {
+    "backToHome": "Revenir à l'accueil"
+  }
+}

packages/common-i18n/tsconfig.json

@@ -0,0 +1,14 @@
+{
+  "extends": "../../tsconfig.base.json",
+  "compilerOptions": {
+    "baseUrl": "./src",
+    "target": "esnext",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "module": "esnext",
+    "jsx": "react-jsx",
+    "noEmit": false,
+    "incremental": true,
+    "paths": {}
+  },
+  "exclude": ["**/node_modules", "**/.*/", "dist", "build"]
+}

packages/core-lib/tsconfig.json

@@ -7,7 +7,6 @@
     "module": "esnext",
     "jsx": "react-jsx",
     "noEmit": false,
-    "composite": false,
     "incremental": true,
     "paths": {}
   },

packages/ui-lib/tsconfig.json

@@ -8,7 +8,6 @@
     "jsx": "react-jsx",
     "jsxImportSource": "@emotion/react",
     "noEmit": false,
-    "composite": false,
     "incremental": true,
     "paths": {
       "@your-org/core-lib/*": ["../../../packages/core-lib/src/*"],