8 | {children}
9 |
11 | );
12 | };
13 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/features/admin/admin.config.ts:
--------------------------------------------------------------------------------
1 | import { getSortedI18nNamespaces } from '@/lib/i18n/getSortedI18nNamespaces';
2 |
3 | const i18nNamespaces = getSortedI18nNamespaces([
4 | 'admin',
5 | 'common',
6 | 'navigation',
7 | ]);
8 |
9 | export type AdminConfig = {
10 | i18nNamespaces: typeof i18nNamespaces;
11 | };
12 | export const adminConfig: AdminConfig = {
13 | i18nNamespaces,
14 | };
15 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/features/auth/auth.config.ts:
--------------------------------------------------------------------------------
1 | import { getSortedI18nNamespaces } from '@/lib/i18n/getSortedI18nNamespaces';
2 |
3 | const i18nNamespaces = getSortedI18nNamespaces([
4 | 'auth',
5 | 'common',
6 | 'navigation',
7 | ]);
8 |
9 | export type AuthConfig = {
10 | i18nNamespaces: typeof i18nNamespaces;
11 | };
12 |
13 | export const authConfig: AuthConfig = {
14 | i18nNamespaces,
15 | };
16 |
--------------------------------------------------------------------------------
/docker/docker-compose.yml:
--------------------------------------------------------------------------------
1 | name: nextjs-monorepo-example
2 | services:
3 | nextjs-app:
4 | container_name: 'nextjs-app'
5 | build:
6 | context: ../
7 | dockerfile: ./docker/Dockerfile
8 | restart: always
9 | networks:
10 | - nextjs-monorepo-example-network
11 | ports:
12 | - 3000:3000
13 |
14 | networks:
15 | nextjs-monorepo-example-network:
16 | driver: bridge
17 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/layouts/admin/AdminLayout.tsx:
--------------------------------------------------------------------------------
1 | import type { FC, ReactNode } from 'react';
2 | import { AdminSidebar } from '@/layouts/admin/AdminSidebar';
3 |
4 | export const AdminLayout: FC<{ children: ReactNode }> = (props) => {
5 | const { children } = props;
6 | return (
7 |
8 | {children}
10 |
11 | );
12 | };
13 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/pages/_monitor/preview/error-page.tsx:
--------------------------------------------------------------------------------
1 | import { ErrorPage } from '@/features/system/pages';
2 |
3 | const exampleError = new Error('ErrorPage example error');
4 |
5 | export default function ErrorPageRoute() {
6 | return (
7 | Hello
9 |
11 | 
12 |
19 | );
20 | };
21 |
--------------------------------------------------------------------------------
/packages/eslint-config-bases/src/bases/prettier-plugin.js:
--------------------------------------------------------------------------------
1 | /**
2 | * Custom config base for projects using prettier.
3 | * @see https://github.com/belgattitude/shared-dx/tree/main/packages/eslint-config-bases
4 | */
5 |
6 | const { getPrettierConfig } = require('../helpers');
7 |
8 | const { ...prettierConfig } = getPrettierConfig();
9 |
10 | module.exports = {
11 | extends: ['prettier'],
12 | plugins: ['prettier'],
13 | rules: {
14 | 'arrow-body-style': 'off',
15 | 'prefer-arrow-callback': 'off',
16 | 'prettier/prettier': ['error', prettierConfig],
17 | },
18 | };
19 |
--------------------------------------------------------------------------------
/apps/nextjs-app/turbo.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://turbo.build/schema.json",
3 | "extends": ["//"],
4 | "tasks": {
5 | "build": {
6 | "env": ["NEXT_BUILD_ENV_*", "NEXT_PUBLIC_*", "SENTRY_*"],
7 | "outputs": [".next/**", "!.next/cache/**"]
8 | },
9 | "vercel-build": {
10 | "env": ["NEXT_BUILD_ENV_*", "NEXT_PUBLIC_*", "SENTRY_*"],
11 | "outputs": [".next/**", "!.next/cache/**"]
12 | },
13 | "typecheck": {},
14 | "dev": {
15 | "cache": false,
16 | "persistent": true,
17 | "dependsOn": ["^codegen"]
18 | }
19 | }
20 | }
21 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/pages/api/_monitor/sentry.ts:
--------------------------------------------------------------------------------
1 | import { wrapApiHandlerWithSentry } from '@sentry/nextjs';
2 | import type { NextApiRequest, NextApiResponse } from 'next';
3 |
4 | // eslint-disable-next-line @typescript-eslint/require-await
5 | async function sentryMonitorApiRoute(
6 | _req: NextApiRequest,
7 | _res: NextApiResponse
8 | ): Promise
12 |
13 |
18 | 14 | John Doe 15 |
16 |{originatingAppName}
17 |
14 |
16 |
17 | );
18 | };
19 |
--------------------------------------------------------------------------------
/docker-compose.yml:
--------------------------------------------------------------------------------
1 | name: nextjs-monorepo-example-db
2 |
3 | services:
4 | main-db:
5 | container_name: nextjs-monorepo-example-db
6 | image: postgres:16.3-alpine3.18
7 | ports:
8 | - target: 5432
9 | published: 5432
10 | protocol: tcp
11 | environment:
12 | - POSTGRES_DB=maindb
13 | - POSTGRES_PASSWORD=!ChangeMe!
14 | - POSTGRES_USER=nextjs
15 | volumes:
16 | - db_data:/var/lib/postgresql/data:rw
17 | # you may use a bind-mounted host directory instead,
18 | # so that it is harder to accidentally remove the volume and lose all your data!
19 | # - ./docker/db/data:/var/lib/postgresql/data:rw
20 |
21 | volumes:
22 | db_data:
23 |
--------------------------------------------------------------------------------
/packages/db-main-prisma/prisma/seed.ts:
--------------------------------------------------------------------------------
1 | import { PrismaClientDbMain } from '../src';
2 | import { PoemSeeds, UserSeeds } from '../src/seeds';
3 |
4 | const prisma = new PrismaClientDbMain();
5 |
6 | async function main() {
7 | console.log(`Start seeding ...`);
8 |
9 | const userSeeds = new UserSeeds(prisma);
10 | await userSeeds.execute();
11 |
12 | const companySeeds = new PoemSeeds(prisma);
13 | await companySeeds.execute();
14 |
15 | console.log(`Seeding finished.`);
16 | }
17 |
18 | try {
19 | await main();
20 | } catch (e) {
21 | console.error(e);
22 | // eslint-disable-next-line unicorn/no-process-exit
23 | process.exit(1);
24 | } finally {
25 | await prisma.$disconnect();
26 | }
27 |
--------------------------------------------------------------------------------
/packages/ui-lib/src/_stories/header.css:
--------------------------------------------------------------------------------
1 | .wrapper {
2 | font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
3 | border-bottom: 1px solid rgba(0, 0, 0, 0.1);
4 | padding: 15px 20px;
5 | display: flex;
6 | align-items: center;
7 | justify-content: space-between;
8 | }
9 |
10 | svg {
11 | display: inline-block;
12 | vertical-align: top;
13 | }
14 |
15 | h1 {
16 | font-weight: 700;
17 | font-size: 20px;
18 | line-height: 1;
19 | margin: 6px 0 6px 10px;
20 | display: inline-block;
21 | vertical-align: top;
22 | }
23 |
24 | button + button {
25 | margin-left: 10px;
26 | }
27 |
28 | .welcome {
29 | color: #333;
30 | font-size: 14px;
31 | margin-right: 10px;
32 | }
33 |
--------------------------------------------------------------------------------
/tsconfig.base.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://json.schemastore.org/tsconfig",
3 | "compilerOptions": {
4 | "moduleResolution": "node",
5 | "verbatimModuleSyntax": true,
6 | "strict": true,
7 | "useUnknownInCatchVariables": true,
8 | "noImplicitOverride": true,
9 | "noUncheckedIndexedAccess": true,
10 | "allowUnreachableCode": false,
11 | "noFallthroughCasesInSwitch": true,
12 | "forceConsistentCasingInFileNames": true,
13 | "allowJs": true,
14 | "resolveJsonModule": true,
15 | "skipLibCheck": true,
16 | "noEmit": true,
17 | "esModuleInterop": true,
18 | "incremental": true,
19 | "newLine": "lf"
20 | },
21 | "exclude": ["**/node_modules", "**/.*/"]
22 | }
23 |
--------------------------------------------------------------------------------
/docs/benchmark/jest-vs-vitest.md:
--------------------------------------------------------------------------------
1 | # Unit tests bench
2 |
3 | Vitest: 4 secs
4 | Jest: 29 secs
5 |
6 | ### Vitest
7 |
8 | - Vitest 0.12.6
9 | - Happy-dom 3+
10 | - Coverage with c8
11 |
12 | ```
13 | hyperfine "yarn vitest run --coverage"
14 | Benchmark 1: yarn vitest run --coverage
15 | Time (mean ± σ): 4.205 s ± 0.446 s [User: 11.726 s, System: 0.869 s]
16 | Range (min … max): 3.803 s … 5.236 s 10 runs
17 | ```
18 |
19 | ### Jest
20 |
21 | - Jest 28.1.0 + ts-jest
22 |
23 | ```
24 | hyperfine "yarn jest --coverage"
25 | Benchmark 1: yarn jest --coverage
26 | Time (mean ± σ): 29.022 s ± 0.897 s [User: 273.365 s, System: 8.163 s]
27 | Range (min … max): 28.096 s … 30.664 s 10 runs
28 | ```
29 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/features/demo/api/fetch-poems.api.ts:
--------------------------------------------------------------------------------
1 | import {
2 | isJsonApiSuccessResponse,
3 | type JsonApiResponse,
4 | } from '@httpx/json-api';
5 | import { apiFetcher } from '@/config/api-fetcher.config';
6 | import type { SearchPoems } from '@/server/features/poem/SearchPoems';
7 |
8 | export const fetchPoems = async (): Promise
21 |
26 | 22 | {title} 23 |
24 |{description}
25 |
19 |
25 | ),
26 | };
27 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/components/avatar/TextAvatar.tsx:
--------------------------------------------------------------------------------
1 | import type { FC } from 'react';
2 |
3 | type FullName = {
4 | firstName: string;
5 | lastName?: string;
6 | };
7 |
8 | type Props = {
9 | name: string | FullName;
10 | className?: string;
11 | };
12 |
13 | const mapToFullName = (nameOrFullName: string | FullName): FullName => {
14 | if (typeof nameOrFullName === 'string') {
15 | const [firstName = 'F', lastName = 'L'] = nameOrFullName.split(' ');
16 | return {
17 | firstName,
18 | lastName,
19 | };
20 | }
21 | return nameOrFullName;
22 | };
23 |
24 | export const TextAvatar: FC
29 | {firstName}
30 | {lastName}
31 |
32 | );
33 | };
34 |
--------------------------------------------------------------------------------
/packages/eslint-config-bases/src/bases/index.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | graphqlSchema: require('./graphql-schema'),
3 | 'import-x': require('./import-x'),
4 | jest: require('./jest'),
5 | mdx: require('./mdx'),
6 | perfectionist: require('./perfectionist'),
7 | 'perfectionist-jsx': require('./perfectionist-jsx'),
8 | playwright: require('./playwright'),
9 | 'prettier-config': require('./prettier-config'),
10 | 'prettier-plugin': require('./prettier-plugin'),
11 | performance: require('./performance'),
12 | react: require('./react'),
13 | reactQuery: require('./react-query'),
14 | reactTestingLibrary: require('./rtl'),
15 | regexp: require('./regexp'),
16 | 'simple-import-sort': require('./simple-import-sort'),
17 | sonar: require('./sonar'),
18 | storybook: require('./storybook'),
19 | tailwind: require('./tailwind'),
20 | typescript: require('./typescript'),
21 | };
22 |
--------------------------------------------------------------------------------
/apps/nextjs-app/public/images/favicon/safari-pinned-tab.svg:
--------------------------------------------------------------------------------
1 |
2 |
4 |
18 |
--------------------------------------------------------------------------------
/packages/core-lib/config/test/test-utils.ts:
--------------------------------------------------------------------------------
1 | import { cleanup, render } from '@testing-library/react';
2 | import type React from 'react';
3 |
4 | import { afterEach } from 'vitest';
5 |
6 | // The condition below is only needed to support both jest and vitest.
7 | // eslint-disable-next-line @typescript-eslint/ban-ts-comment
8 | // @ts-ignore
9 | if (afterEach) {
10 | afterEach(() => {
11 | cleanup();
12 | });
13 | }
14 |
15 | const customRender = (ui: React.ReactElement, options = {}) =>
16 | render(ui, {
17 | // wrap provider(s) here if needed
18 | wrapper: ({ children }) => children,
19 | ...options,
20 | });
21 |
22 | // eslint-disable-next-line import-x/export
23 | export * from '@testing-library/react';
24 | export { default as userEvent } from '@testing-library/user-event';
25 | // override render export
26 | // eslint-disable-next-line import-x/export
27 | export { customRender as render };
28 |
--------------------------------------------------------------------------------
/packages/ui-lib/config/test/test-utils.ts:
--------------------------------------------------------------------------------
1 | import { cleanup, render } from '@testing-library/react';
2 | import type React from 'react';
3 |
4 | import { afterEach } from 'vitest';
5 |
6 | // The condition below is only needed to support both jest and vitest.
7 | // eslint-disable-next-line @typescript-eslint/ban-ts-comment
8 | // @ts-ignore
9 | if (afterEach) {
10 | afterEach(() => {
11 | cleanup();
12 | });
13 | }
14 |
15 | const customRender = (ui: React.ReactElement, options = {}) =>
16 | render(ui, {
17 | // wrap provider(s) here if needed
18 | wrapper: ({ children }) => children,
19 | ...options,
20 | });
21 |
22 | // eslint-disable-next-line import-x/export
23 | export * from '@testing-library/react';
24 | export { default as userEvent } from '@testing-library/user-event';
25 | // override render export
26 | // eslint-disable-next-line import-x/export
27 | export { customRender as render };
28 |
--------------------------------------------------------------------------------
/apps/nextjs-app/e2e/api/_monitor/healthcheck.spec.ts:
--------------------------------------------------------------------------------
1 | import { test, expect } from '@playwright/test';
2 | import { isIsoDateString } from '@your-org/ts-utils';
3 | import type { HealthCheckApiPayload } from '@/pages/api/_monitor/healthcheck';
4 | import packageJson from '../../../package.json' assert { type: 'json' };
5 |
6 | test('should return a success payload', async ({ request }) => {
7 | const resp = await request.get('/api/_monitor/healthcheck');
8 | const headers = resp.headers();
9 | const json = (await resp.json()) as HealthCheckApiPayload;
10 | const { timestamp, ...restJson } = json;
11 | expect(headers['content-type']).toEqual('application/json');
12 | expect(isIsoDateString(timestamp)).toBeTruthy();
13 | expect(restJson).toMatchObject({
14 | status: 'ok',
15 | message: 'Health check successful for API route',
16 | appName: packageJson.name,
17 | appVersion: packageJson.version,
18 | });
19 | });
20 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/pages/api/_monitor/healthcheck.ts:
--------------------------------------------------------------------------------
1 | import type { NextApiRequest, NextApiResponse } from 'next';
2 |
3 | export type HealthCheckApiPayload = {
4 | status: 'ok' | 'error';
5 | message: string;
6 | appName: string;
7 | appVersion: string;
8 | timestamp: string;
9 | };
10 |
11 | export default function healthCheckApiRoute(
12 | req: NextApiRequest,
13 | res: NextApiResponse
14 | ) {
15 | if (req.method !== 'GET') {
16 | res.status(400).end();
17 | return;
18 | }
19 |
20 | res.setHeader('Content-Type', 'application/json');
21 |
22 | const payload: HealthCheckApiPayload = {
23 | status: 'ok',
24 | message: 'Health check successful for API route',
25 | appName: process.env.APP_NAME ?? 'unknown',
26 | appVersion: process.env.APP_VERSION ?? 'unknown',
27 | timestamp: new Date().toISOString(),
28 | };
29 |
30 | res.status(200).send(JSON.stringify(payload, undefined, 2));
31 | res.end();
32 | }
33 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/server/i18n/getServerTranslations.ts:
--------------------------------------------------------------------------------
1 | /**
2 | * Retrieve translations on server-side, wraps next-i18next.serverSideTranslations
3 | * to allow further customizations.
4 | */
5 | import type { SSRConfig, UserConfig } from 'next-i18next';
6 | import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
7 | import type {
8 | I18nActiveNamespaces,
9 | I18nNamespace,
10 | } from '@/lib/i18n/I18nNamespace.types';
11 | import nextI18nextConfig from '../../../next-i18next.config.mjs';
12 |
13 | export const getServerTranslations = async (
14 | locale: string,
15 | namespacesRequired?: I18nActiveNamespaces | I18nNamespace,
16 | configOverride?: UserConfig | null,
17 | extraLocales?: string[] | false
18 | ): PromiseThis page is protected by Middleware
14 |Only admin users can see this page.
15 |16 | To learn more about the NextAuth middleware see 17 | 18 | the docs 19 | 20 | . 21 |
22 |
21 |
31 |
32 | );
33 | };
34 |
--------------------------------------------------------------------------------
/apps/vite-app/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://json.schemastore.org/tsconfig",
3 | "extends": "../../tsconfig.base.json",
4 | "compilerOptions": {
5 | "baseUrl": "./src",
6 | "target": "esnext",
7 | "lib": ["dom", "dom.iterable", "esnext"],
8 | "module": "esnext",
9 | "jsx": "react-jsx",
10 | "jsxImportSource": "@emotion/react",
11 | "incremental": true,
12 | "paths": {
13 | "@your-org/ui-lib/*": ["../../../packages/ui-lib/src/*"],
14 | "@your-org/ui-lib": ["../../../packages/ui-lib/src/index"],
15 | "@your-org/core-lib/*": ["../../../packages/core-lib/src/*"],
16 | "@your-org/core-lib": ["../../../packages/core-lib/src/index"],
17 | "@your-org/ts-utils": ["../../../packages/ts-utils/src/index"]
18 | },
19 | "types": ["@testing-library/jest-dom/vitest"]
20 | },
21 | "exclude": ["**/node_modules", "**/.*/*"],
22 | "include": [
23 | ".eslintrc.*",
24 | "**/*.ts",
25 | "**/*.tsx",
26 | "**/*.mts",
27 | "**/*.js",
28 | "**/*.cjs",
29 | "**/*.mjs",
30 | "**/*.jsx",
31 | "**/*.json"
32 | ]
33 | }
34 |
--------------------------------------------------------------------------------
/commitlint.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | extends: ['@commitlint/config-conventional'],
3 | rules: {
4 | 'body-leading-blank': [1, 'always'],
5 | 'body-max-line-length': [2, 'always', 100],
6 | 'footer-leading-blank': [1, 'always'],
7 | 'footer-max-line-length': [2, 'always', 100],
8 | 'header-max-length': [2, 'always', 100],
9 | 'scope-case': [2, 'always', 'lower-case'],
10 | 'subject-case': [
11 | 2,
12 | 'never',
13 | ['sentence-case', 'start-case', 'pascal-case', 'upper-case'],
14 | ],
15 | 'subject-empty': [2, 'never'],
16 | 'subject-full-stop': [2, 'never', '.'],
17 | 'type-case': [2, 'always', 'lower-case'],
18 | 'type-empty': [2, 'never'],
19 | 'type-enum': [
20 | 2,
21 | 'always',
22 | [
23 | 'build',
24 | 'chore',
25 | 'ci',
26 | 'docs',
27 | 'feat',
28 | 'fix',
29 | 'perf',
30 | 'refactor',
31 | 'revert',
32 | 'style',
33 | 'test',
34 | 'translation',
35 | 'security',
36 | ],
37 | ],
38 | },
39 | };
40 |
--------------------------------------------------------------------------------
/packages/ui-lib/src/_stories/Button.stories.ts:
--------------------------------------------------------------------------------
1 | import type { Meta, StoryObj } from '@storybook/react';
2 |
3 | import { Button } from './Button';
4 |
5 | // More on how to set up stories at: https://storybook.js.org/docs/7.0/react/writing-stories/introduction
6 | const meta = {
7 | title: 'Example/Button',
8 | component: Button,
9 | tags: ['autodocs'],
10 | argTypes: {
11 | backgroundColor: { control: 'color' },
12 | },
13 | } satisfies Meta25 | {title} 26 |
27 |28 | {t('system:links.backToHome')} 29 |
30 |
9 | {poems.map((poem) => {
10 | const unsplashImg = `https://source.unsplash.com/random/640x480?${(
11 | poem.keywords ?? []
12 | )
13 | .map((keyword) => encodeURIComponent(keyword))
14 | .join(',')}`;
15 |
16 | return (
17 |
32 | );
33 | };
34 |
--------------------------------------------------------------------------------
/packages/ts-utils/.eslintrc.cjs:
--------------------------------------------------------------------------------
1 | /**
2 | * Specific eslint rules for this workspace, learn how to compose
3 | * @link https://github.com/belgattitude/nextjs-monorepo-example/tree/main/packages/eslint-config-bases
4 | */
5 |
6 | const {
7 | getDefaultIgnorePatterns,
8 | } = require('@your-org/eslint-config-bases/helpers');
9 |
10 | module.exports = {
11 | root: true,
12 | parser: '@typescript-eslint/parser',
13 | parserOptions: {
14 | tsconfigRootDir: __dirname,
15 | project: 'tsconfig.json',
16 | },
17 | ignorePatterns: [...getDefaultIgnorePatterns()],
18 | extends: [
19 | '@your-org/eslint-config-bases/typescript',
20 | '@your-org/eslint-config-bases/import-x',
21 | '@your-org/eslint-config-bases/sonar',
22 | '@your-org/eslint-config-bases/regexp',
23 | '@your-org/eslint-config-bases/jest',
24 | // Apply prettier and disable incompatible rules
25 | '@your-org/eslint-config-bases/prettier-plugin',
26 | ],
27 | rules: {
28 | // optional overrides per project
29 | },
30 | overrides: [
31 | // optional overrides per project file match
32 | ],
33 | };
34 |
--------------------------------------------------------------------------------
/apps/nextjs-app/config/tests/I18nextTestStubProvider.tsx:
--------------------------------------------------------------------------------
1 | import i18next from 'i18next';
2 | import type { FC, ReactNode } from 'react';
3 | import { initReactI18next, I18nextProvider } from 'react-i18next';
4 | import type { I18nNamespace } from '@/lib/i18n/I18nNamespace.types';
5 |
6 | /**
7 | * Fully wrapped strategy for i18next, you can use stub/mocks as well
8 | * @link {https://react.i18next.com/misc/testing}
9 | */
10 | void i18next.use(initReactI18next).init({
11 | lng: 'en',
12 | fallbackLng: 'en',
13 | ns: ['common'],
14 | defaultNS: 'common',
15 | debug: false,
16 | interpolation: {
17 | escapeValue: false, // not needed for react!!
18 | },
19 | // Let empty so you can test on translation keys rather than translated strings
20 | resources: {
21 | en: { common: {}, demo: {}, home: {}, system: {} } as Record<
22 | I18nNamespace,
23 | Record
21 |
29 | );
30 | })}
31 |
14 |
15 |
35 |
36 | );
37 | }
38 |
39 | export default App;
40 |
--------------------------------------------------------------------------------
/apps/nextjs-app/next-i18next.config.mjs:
--------------------------------------------------------------------------------
1 | const debugI18n = ['true', 1].includes(
2 | process?.env?.NEXTJS_DEBUG_I18N ?? 'false'
3 | );
4 |
5 | const localePublicFolder = undefined;
6 |
7 | export const defaultLocale = 'en';
8 |
9 | const getLocalesPath = async () => {
10 | if ('window' in globalThis) {
11 | return localePublicFolder;
12 | }
13 | // eslint-disable-next-line unicorn/prefer-node-protocol,unicorn/import-style
14 | const path = await import('path').then((mod) => mod.default);
15 | return path.resolve('../../packages/common-i18n/src/locales');
16 | };
17 |
18 | const localePath = await getLocalesPath();
19 |
20 | /**
21 | * @type {import('next-i18next').UserConfig}
22 | */
23 | export default {
24 | i18n: {
25 | defaultLocale,
26 | locales: ['en', 'fr'],
27 | },
28 | saveMissing: false,
29 | strictMode: true,
30 | serializeConfig: false,
31 | reloadOnPrerender: process?.env?.NODE_ENV === 'development',
32 | react: {
33 | useSuspense: false,
34 | },
35 | debug: debugI18n,
36 | /*
37 | interpolation: {
38 | escapeValue: false,
39 | },
40 | */
41 | localePath,
42 | };
43 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/config/api-fetcher.config.ts:
--------------------------------------------------------------------------------
1 | import { ofetch } from 'ofetch';
2 |
3 | /**
4 | * Custom fetcher to be used for ingestion api calls
5 | */
6 | export const apiFetcher = ofetch.create({
7 | // baseURL: '',
8 | headers: {
9 | Accept: 'application/json',
10 | 'Cache-Control': 'no-cache',
11 | },
12 | retry: 2,
13 | /**
14 | * By setting the FETCH_KEEP_ALIVE environment variable to true, an http/https agent will be registered that
15 | * keeps sockets around even when there are no outstanding requests, so they can be used for future requests
16 | * without having to reestablish a TCP connection.
17 | *
18 | * Note: This option can potentially introduce memory leaks.
19 | * Please check https://github.com/node-fetch/node-fetch/pull/1325 for more details.
20 | */
21 | keepalive: true,
22 |
23 | /*
24 | async onRequest({ request, options }) {
25 | // Nothing yet
26 | },
27 |
28 | async onRequestError({ request, options, error }) {
29 | // Nothing yet
30 | },
31 |
32 | async onResponseError({ request, response, options }) {
33 | // Nothing yet
34 | }, */
35 | });
36 |
--------------------------------------------------------------------------------
/packages/db-main-prisma/lint-staged.config.js:
--------------------------------------------------------------------------------
1 | // @ts-check
2 |
3 | /**
4 | * This files overrides the base lint-staged.config.js present in the root directory.
5 | * It allows to run eslint based the package specific requirements.
6 | * {@link https://github.com/okonet/lint-staged#how-to-use-lint-staged-in-a-multi-package-monorepo}
7 | * {@link https://github.com/belgattitude/nextjs-monorepo-example/blob/main/docs/about-lint-staged.md}
8 | */
9 |
10 | const {
11 | concatFilesForPrettier,
12 | getEslintFixCmd,
13 | } = require('../../lint-staged.common.js');
14 |
15 | /**
16 | * @type {Record
16 |
{`${sayHello('Hello Vite')} from @your-org/core-lib`}
26 |27 | 30 |
31 |
32 |
30 |
32 |
33 |
38 |
41 |
22 |
31 | );
32 | };
33 |
34 | export default MonitorSentryCsrRoute;
35 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/features/demo/blocks/poetry/PoetryBlock.tsx:
--------------------------------------------------------------------------------
1 | import { useQuery } from '@tanstack/react-query';
2 | import type { FC } from 'react';
3 | import { fetchPoems } from '../../api/fetch-poems.api';
4 | import { PoemGrid } from '../../components/PoemGrid';
5 |
6 | const PoemGridWithReactQuery: FC = () => {
7 | const { data, isLoading, error } = useQuery({
8 | queryKey: ['poems'],
9 | queryFn: fetchPoems,
10 | });
11 | if (isLoading) {
12 | return Unexpected error
23 |24 | If you see this message, it means that an error thrown in a static 25 | NextJs page wasn't caught by the global error handler 26 | (pages/_error.tsx). This is a bug in the application and may affect the 27 | ability to display error pages and log errors on Sentry. See the 28 | monitoring page in /pages/_monitor/sentry/csr-page.tsx. 29 |
30 |Loading...
;
13 | }
14 | if (error) {
15 | const { message } = error;
16 | return Error {message}
;
17 | }
18 | return <>{data &&
24 |
33 | );
34 | };
35 |
--------------------------------------------------------------------------------
/packages/ui-lib/src/_stories/Button.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | import './button.css';
3 |
4 | interface ButtonProps {
5 | /**
6 | * Is this the principal call to action on the page?
7 | */
8 | primary?: boolean;
9 | /**
10 | * What background color to use
11 | */
12 | backgroundColor?: string;
13 | /**
14 | * How large should the button be?
15 | */
16 | size?: 'small' | 'medium' | 'large';
17 | /**
18 | * Button contents
19 | */
20 | label: string;
21 | /**
22 | * Optional click handler
23 | */
24 | onClick?: () => void;
25 | }
26 |
27 | /**
28 | * Primary UI component for user interaction
29 | */
30 | export const Button = ({
31 | primary = false,
32 | size = 'medium',
33 | backgroundColor,
34 | label,
35 | ...props
36 | }: ButtonProps) => {
37 | const mode = primary
38 | ? 'storybook-button--primary'
39 | : 'storybook-button--secondary';
40 | return (
41 |
51 | );
52 | };
53 |
--------------------------------------------------------------------------------
/turbo.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://turbo.build/schema.json",
3 | "globalDependencies": ["**/.env.*local", "**/tsconfig*.json"],
4 | "globalPassThroughEnv": ["AWS_SECRET_KEY", "GITHUB_TOKEN"],
5 | "tasks": {
6 | "codegen": {
7 | // Codegen caching might also be disabled and enabled by workspace (see packages/db-main-prisma/turbo.json)
8 | // as generated code location might vary between toolings
9 | "cache": true,
10 | "outputs": ["src/generated/**"]
11 | },
12 | "build": {
13 | "outputs": ["dist/**"]
14 | // This repo example relies on tsconfig paths to ease starting
15 | // "dependsOn": ["^build"]
16 | },
17 | "build-force": {
18 | "outputs": ["dist/**"]
19 | },
20 | "test": {},
21 | "test-unit": {},
22 | "lint": {
23 | "env": ["TIMING"]
24 | },
25 | "lint-styles": {},
26 | "typecheck": {},
27 | "build-storybook": {},
28 | "clean": {
29 | "cache": false
30 | },
31 | "check-dist": {
32 | /** Note that build-force */
33 | "dependsOn": ["build-force", "build"]
34 | },
35 | "check-size": {
36 | "dependsOn": ["build-force", "build"]
37 | }
38 | }
39 | }
40 |
--------------------------------------------------------------------------------
/.github/workflows/clean-up-pr-caches.yml:
--------------------------------------------------------------------------------
1 | # https://docs.github.com/en/actions/using-workflows/caching-dependencies-to-speed-up-workflows#force-deleting-cache-entries
2 | name: Cleanup caches for closed branches
3 |
4 | on:
5 | pull_request:
6 | types: [closed]
7 | workflow_dispatch:
8 |
9 | jobs:
10 | cleanup:
11 | runs-on: ubuntu-latest
12 | steps:
13 | - name: Check out code
14 | uses: actions/checkout@v4
15 |
16 | - name: 🧹 Cleanup
17 | run: |
18 | gh extension install actions/gh-actions-cache
19 |
20 | REPO=${{ github.repository }}
21 | BRANCH="refs/pull/${{ github.event.pull_request.number }}/merge"
22 |
23 | echo "Fetching list of cache key"
24 | cacheKeysForPR=$(gh actions-cache list -R $REPO -B $BRANCH | cut -f 1 )
25 |
26 | ## Setting this to not fail the workflow while deleting cache keys.
27 | set +e
28 | echo "Deleting caches..."
29 | for cacheKey in $cacheKeysForPR
30 | do
31 | gh actions-cache delete $cacheKey -R $REPO -B $BRANCH --confirm
32 | done
33 | echo "Done"
34 | env:
35 | GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
36 |
--------------------------------------------------------------------------------
/.syncpackrc.cjs:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | "customTypes": {
3 | "engines": {
4 | "path": "engines",
5 | "strategy": "versionsByName"
6 | },
7 | "packageManager": {
8 | "path": "packageManager",
9 | "strategy": "name@version"
10 | }
11 | },
12 | "dependencyTypes": ["dev", "prod", "peer"],
13 | "filter": ".",
14 | "indent": " ",
15 | "semverGroups": [
16 | {
17 | "range": "",
18 | "label": "apps",
19 | "dependencyTypes": ["dev", "prod"],
20 | "dependencies": ["**"],
21 | "packages": ["*-app"]
22 | },
23 | {
24 | "range": "^",
25 | "label": "publishable-packages",
26 | "dependencyTypes": ["peer", "prod"],
27 | "dependencies": ["**"],
28 | "packages": ["@your-org/*"]
29 | },
30 | ],
31 | "sortAz": [
32 | "contributors",
33 | "dependencies",
34 | "devDependencies",
35 | "peerDependencies",
36 | "resolutions"
37 | ],
38 | "sortFirst": ["name", "version", "private", "module", "sideEffects", "type", "main", "types", "exports", "description", "keywords", "author", "license", "homepage", "repository", "scripts"],
39 | "source": ["apps/**", "packages/**", "./package.json"],
40 | "versionGroups": []
41 | }
--------------------------------------------------------------------------------
/apps/nextjs-app/src/lib/factory/ky.factory.ts:
--------------------------------------------------------------------------------
1 | import Ky, { type Options, type NormalizedOptions } from 'ky';
2 |
3 | type Props = {
4 | baseUrl?: string;
5 | onAuthFailure?: (
6 | request: Request,
7 | options: NormalizedOptions,
8 | response: Response
9 | ) => Promise
25 |
32 | Poetry on the wild.
26 |27 | Client fetch with ofetch / react-query from nextjs api, db in 28 | supabase.io, connection with prisma. Ui with tailwind 29 |
30 |
12 |
21 | );
22 | }
23 |
24 | /**
25 | * Always throws an error on purpose for monitoring
26 | */
27 | export const getServerSideProps: GetServerSidePropsUnexpected error
13 |14 | If you see this message, it means that the an error thrown in the 15 | `getServerSideProps()` function wasn't caught by the global error 16 | handler (pages/_error.tsx). This is a bug in the application and may 17 | affect the ability to display error pages and log errors on Sentry. See 18 | the monitoring page in /pages/_monitor/sentry/ssr-page.tsx. 19 |
20 |
21 |
34 |
35 | );
36 | };
37 |
--------------------------------------------------------------------------------
/packages/common-i18n/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "@your-org/common-i18n",
3 | "version": "1.2.2",
4 | "private": true,
5 | "sideEffects": false,
6 | "type": "module",
7 | "exports": {
8 | "./locales/*.json": {
9 | "require": "./src/locales/*.json",
10 | "import": "./src/locales/*.json"
11 | },
12 | "./package.json": "./package.json"
13 | },
14 | "author": {
15 | "name": "Vanvelthem Sébastien",
16 | "url": "https://github.com/belgattitude"
17 | },
18 | "license": "MIT",
19 | "homepage": "https://github.com/belgattitude/nextjs-monorepo-example",
20 | "repository": {
21 | "type": "git",
22 | "url": "https://github.com/belgattitude/nextjs-monorepo-example",
23 | "directory": "packages/common-i18n"
24 | },
25 | "scripts": {
26 | "clean": "rimraf ./dist ./coverage ./tsconfig.tsbuildinfo",
27 | "lint": "eslint . --ext .ts,.tsx,.js,.jsx,.cjs,.mjs --cache --cache-location ../../.cache/eslint/common-i18n.eslintcache",
28 | "typecheck": "tsc --project ./tsconfig.json --noEmit"
29 | },
30 | "devDependencies": {
31 | "@types/node": "22.13.5",
32 | "@your-org/eslint-config-bases": "workspace:^",
33 | "cross-env": "7.0.3",
34 | "eslint": "8.57.1",
35 | "prettier": "3.5.2",
36 | "rimraf": "6.0.1",
37 | "typescript": "5.7.3"
38 | }
39 | }
40 |
--------------------------------------------------------------------------------
/apps/nextjs-app/src/lib/env/getValidatedBuildEnv.mjs:
--------------------------------------------------------------------------------
1 | // @ts-check
2 |
3 | import { exitOrThrowError, printValidatedEnv } from './utils.mjs';
4 |
5 | /**
6 | * Return a validated / transformed environment object from a zodSchema. This is to be used to tune
7 | * the build/dev process in next.config.mjs. By convention prefer the `NEXT_BUILD_` prefix if there isn't a
8 | * good reason to do otherwise.
9 | *
10 | * Validated build envs are shown in the console by default. In case of error it will
11 | * exit/die with an error indicating missing requirements. This is particularly helpful in CI,
12 | * multiple deployments (previews, staging...) to give a clear indication a build parameters
13 | * used (or debug).
14 | *
15 | * @template { import('zod').ZodSchema } T
16 | * @param { T } zodSchema
17 | * @param {{ displayConsole?: boolean, env?: Record
22 |
27 | Woops !
23 |24 | Something went wrong. Please try again later. 25 |
26 |
28 |
33 | Code: {statusCode}
29 |Message: {message}
30 |Error id: {errorId}
31 |ErrorMessage: {error?.message}
32 |