Skip to content

Commit c9e3cfd

Browse files
DanielGiljamDanielGiljam
committed
chore: add typical chat app with React Query boilerplate with Tailwind CSS
1 parent 7c7ec9c commit c9e3cfd

28 files changed

+621
-13
lines changed

‎.prettierrc

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
{
22
"tabWidth": 4,
33
"trailingComma": "all",
4-
"bracketSpacing": false
4+
"bracketSpacing": false,
5+
"plugins": ["prettier-plugin-tailwindcss"]
56
}

‎apps/typical-chat-app-with-react-query-e2e/.eslintrc.json

+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
{
2+
"extends": ["plugin:cypress/recommended", "../../.eslintrc.json"],
3+
"ignorePatterns": ["!**/*"],
4+
"overrides": [
5+
{
6+
"files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
7+
"parserOptions": {
8+
"project": [
9+
"apps/typical-chat-app-with-react-query-e2e/tsconfig.json"
10+
]
11+
},
12+
"rules": {}
13+
},
14+
{
15+
"files": ["src/plugins/index.js"],
16+
"rules": {
17+
"@typescript-eslint/no-var-requires": "off",
18+
"no-undef": "off"
19+
}
20+
}
21+
]
22+
}

‎apps/typical-chat-app-with-react-query-e2e/cypress.config.ts

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import {nxE2EPreset} from "@nrwl/cypress/plugins/cypress-preset";
2+
import {defineConfig} from "cypress";
3+
4+
export default defineConfig({
5+
e2e: nxE2EPreset(__dirname),
6+
});

‎apps/typical-chat-app-with-react-query-e2e/project.json

+38
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
{
2+
"name": "typical-chat-app-with-react-query-e2e",
3+
"$schema": "../../node_modules/nx/schemas/project-schema.json",
4+
"sourceRoot": "apps/typical-chat-app-with-react-query-e2e/src",
5+
"projectType": "application",
6+
"targets": {
7+
"e2e": {
8+
"executor": "@nrwl/cypress:cypress",
9+
"options": {
10+
"cypressConfig": "apps/typical-chat-app-with-react-query-e2e/cypress.config.ts",
11+
"devServerTarget": "typical-chat-app-with-react-query:serve:development",
12+
"testingType": "e2e"
13+
},
14+
"configurations": {
15+
"production": {
16+
"devServerTarget": "typical-chat-app-with-react-query:serve:production"
17+
}
18+
}
19+
},
20+
"type-check": {
21+
"executor": "@nrwl/workspace:run-commands",
22+
"options": {
23+
"command": "tsc --build apps/typical-chat-app-with-react-query-e2e/tsconfig.json --incremental"
24+
}
25+
},
26+
"lint": {
27+
"executor": "@nrwl/linter:eslint",
28+
"outputs": ["{options.outputFile}"],
29+
"options": {
30+
"lintFilePatterns": [
31+
"apps/typical-chat-app-with-react-query-e2e/**/*.{js,ts}"
32+
]
33+
}
34+
}
35+
},
36+
"tags": [],
37+
"implicitDependencies": ["typical-chat-app-with-react-query"]
38+
}

‎apps/typical-chat-app-with-react-query-e2e/src/e2e/app.cy.ts

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import {getGreeting} from "../support/app.po";
2+
3+
describe("typical-chat-app-with-react-query", () => {
4+
beforeEach(() => cy.visit("/"));
5+
6+
it("should display welcome message", () => {
7+
// Custom command example, see `../support/commands.ts` file
8+
cy.login("[email protected]", "myPassword");
9+
10+
// Function helper example, see `../support/app.po.ts` file
11+
getGreeting().contains("Welcome typical-chat-app-with-react-query");
12+
});
13+
});

‎apps/typical-chat-app-with-react-query-e2e/src/fixtures/example.json

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"name": "Using fixtures to represent data",
3+
"email": "[email protected]"
4+
}

‎apps/typical-chat-app-with-react-query-e2e/src/support/app.po.ts

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export const getGreeting = () => cy.get("h1");

‎apps/typical-chat-app-with-react-query-e2e/src/support/commands.ts

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
// ***********************************************
2+
// This example commands.js shows you how to
3+
// create various custom commands and overwrite
4+
// existing commands.
5+
//
6+
// For more comprehensive examples of custom
7+
// commands please read more here:
8+
// https://on.cypress.io/custom-commands
9+
// ***********************************************
10+
11+
// eslint-disable-next-line @typescript-eslint/no-namespace
12+
declare namespace Cypress {
13+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
14+
interface Chainable<Subject> {
15+
login: (email: string, password: string) => void;
16+
}
17+
}
18+
//
19+
// -- This is a parent command --
20+
Cypress.Commands.add("login", (email, password) => {
21+
console.log("Custom command example: Login", email, password);
22+
});
23+
//
24+
// -- This is a child command --
25+
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
26+
//
27+
//
28+
// -- This is a dual command --
29+
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
30+
//
31+
//
32+
// -- This will overwrite an existing command --
33+
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })

‎apps/typical-chat-app-with-react-query-e2e/src/support/e2e.ts

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
// ***********************************************************
2+
// This example support/index.js is processed and
3+
// loaded automatically before your test files.
4+
//
5+
// This is a great place to put global configuration and
6+
// behavior that modifies Cypress.
7+
//
8+
// You can change the location of this file or turn off
9+
// automatically serving support files with the
10+
// 'supportFile' configuration option.
11+
//
12+
// You can read more here:
13+
// https://on.cypress.io/configuration
14+
// ***********************************************************
15+
16+
// Import commands.js using ES2015 syntax:
17+
import "./commands";

‎apps/typical-chat-app-with-react-query-e2e/tsconfig.json

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"extends": "../../tsconfig.base.json",
3+
"compilerOptions": {
4+
"sourceMap": false,
5+
"outDir": "../../dist/out-tsc",
6+
"allowJs": true,
7+
"types": ["cypress", "node"],
8+
"strict": true
9+
},
10+
"include": ["src/**/*.ts", "src/**/*.js", "cypress.config.ts"]
11+
}

‎apps/typical-chat-app-with-react-query/.eslintrc.json

+43
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
{
2+
"extends": [
3+
"plugin:@nrwl/nx/react-typescript",
4+
"next",
5+
"next/core-web-vitals",
6+
"../../.eslintrc.json"
7+
],
8+
"ignorePatterns": ["!**/*", ".next/**/*", "next-env.d.ts"],
9+
"overrides": [
10+
{
11+
"files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
12+
"parserOptions": {
13+
"project": [
14+
"apps/typical-chat-app-with-react-query/tsconfig(.*)?.json"
15+
]
16+
},
17+
"rules": {
18+
"@next/next/no-html-link-for-pages": [
19+
"error",
20+
"apps/typical-chat-app-with-react-query/src/pages"
21+
]
22+
}
23+
},
24+
{
25+
"files": ["*.ts", "*.tsx"],
26+
"rules": {}
27+
},
28+
{
29+
"files": ["*.js", "*.jsx"],
30+
"rules": {}
31+
},
32+
{
33+
"files": ["*.tsx", "*.jsx"],
34+
"extends": ["@offline-full-text-search-in-web-app/jsx"]
35+
}
36+
],
37+
"rules": {
38+
"@next/next/no-html-link-for-pages": "off"
39+
},
40+
"env": {
41+
"jest": true
42+
}
43+
}

‎apps/typical-chat-app-with-react-query/index.d.ts

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
/* eslint-disable @typescript-eslint/no-explicit-any */
2+
declare module "*.svg" {
3+
const content: any;
4+
export const ReactComponent: any;
5+
export default content;
6+
}

‎apps/typical-chat-app-with-react-query/jest.config.ts

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/* eslint-disable */
2+
export default {
3+
displayName: "typical-chat-app-with-react-query",
4+
preset: "../../jest.preset.js",
5+
transform: {
6+
"^(?!.*\\.(js|jsx|ts|tsx|css|json)$)": "@nrwl/react/plugins/jest",
7+
"^.+\\.[tj]sx?$": ["babel-jest", {presets: ["@nrwl/next/babel"]}],
8+
},
9+
moduleFileExtensions: ["ts", "tsx", "js", "jsx"],
10+
coverageDirectory: "../../coverage/apps/typical-chat-app-with-react-query",
11+
};

‎apps/typical-chat-app-with-react-query/next-env.d.ts

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
/// <reference types="next" />
2+
/// <reference types="next/image-types/global" />
3+
4+
// NOTE: This file should not be edited
5+
// see https://nextjs.org/docs/basic-features/typescript for more information.

‎apps/typical-chat-app-with-react-query/next.config.js

+28
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
// @ts-check
2+
3+
// eslint-disable-next-line @typescript-eslint/no-var-requires
4+
const withBundleAnalyzer = require("@next/bundle-analyzer")({
5+
enabled: process.env.ANALYZE === "true",
6+
});
7+
const {withNx} = require("@nrwl/next/plugins/with-nx");
8+
9+
/**
10+
* @type {import('@nrwl/next/plugins/with-nx').WithNxOptions}
11+
**/
12+
const nextConfig = {
13+
eslint: {
14+
ignoreDuringBuilds: true,
15+
},
16+
nx: {
17+
// Set this to true if you would like to to use SVGR
18+
// See: https://github.com/gregberge/svgr
19+
svgr: true,
20+
},
21+
productionBrowserSourceMaps: true,
22+
reactStrictMode: true,
23+
typescript: {
24+
ignoreBuildErrors: true,
25+
},
26+
};
27+
28+
module.exports = withBundleAnalyzer(withNx(nextConfig));

‎apps/typical-chat-app-with-react-query/postcss.config.js

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
const {join} = require("path");
2+
3+
module.exports = {
4+
plugins: {
5+
tailwindcss: {
6+
config: join(__dirname, "tailwind.config.js"),
7+
},
8+
autoprefixer: {},
9+
},
10+
};

‎apps/typical-chat-app-with-react-query/project.json

+71
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
{
2+
"name": "typical-chat-app-with-react-query",
3+
"$schema": "../../node_modules/nx/schemas/project-schema.json",
4+
"sourceRoot": "apps/typical-chat-app-with-react-query",
5+
"projectType": "application",
6+
"targets": {
7+
"build": {
8+
"executor": "@nrwl/next:build",
9+
"outputs": ["{options.outputPath}"],
10+
"defaultConfiguration": "production",
11+
"options": {
12+
"root": "apps/typical-chat-app-with-react-query",
13+
"outputPath": "dist/apps/typical-chat-app-with-react-query"
14+
},
15+
"configurations": {
16+
"development": {
17+
"outputPath": "apps/typical-chat-app-with-react-query"
18+
},
19+
"production": {}
20+
}
21+
},
22+
"serve": {
23+
"executor": "@nrwl/next:server",
24+
"defaultConfiguration": "development",
25+
"options": {
26+
"buildTarget": "typical-chat-app-with-react-query:build",
27+
"dev": true
28+
},
29+
"configurations": {
30+
"development": {
31+
"buildTarget": "typical-chat-app-with-react-query:build:development",
32+
"dev": true
33+
},
34+
"production": {
35+
"buildTarget": "typical-chat-app-with-react-query:build:production",
36+
"dev": false
37+
}
38+
}
39+
},
40+
"export": {
41+
"executor": "@nrwl/next:export",
42+
"options": {
43+
"buildTarget": "typical-chat-app-with-react-query:build:production"
44+
}
45+
},
46+
"test": {
47+
"executor": "@nrwl/jest:jest",
48+
"outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
49+
"options": {
50+
"jestConfig": "apps/typical-chat-app-with-react-query/jest.config.ts",
51+
"passWithNoTests": true
52+
}
53+
},
54+
"type-check": {
55+
"executor": "@nrwl/workspace:run-commands",
56+
"options": {
57+
"command": "tsc --build apps/typical-chat-app-with-react-query/tsconfig.json --incremental"
58+
}
59+
},
60+
"lint": {
61+
"executor": "@nrwl/linter:eslint",
62+
"outputs": ["{options.outputFile}"],
63+
"options": {
64+
"lintFilePatterns": [
65+
"apps/typical-chat-app-with-react-query/**/*.{ts,tsx,js,jsx}"
66+
]
67+
}
68+
}
69+
},
70+
"tags": []
71+
}

‎apps/typical-chat-app-with-react-query/specs/index.spec.tsx

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import {render} from "@testing-library/react";
2+
import React from "react";
3+
4+
import Index from "../src/pages/index";
5+
6+
describe("Index", () => {
7+
it("should render successfully", () => {
8+
const {baseElement} = render(<Index />);
9+
expect(baseElement).toBeTruthy();
10+
});
11+
});

‎apps/typical-chat-app-with-react-query/src/components/App.tsx

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export const App = () => {
2+
return (
3+
<div>
4+
<h1>Hello world!</h1>
5+
</div>
6+
);
7+
};

‎apps/typical-chat-app-with-react-query/src/components/index.ts

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export {App} from "./App";

‎apps/typical-chat-app-with-react-query/src/pages/_app.tsx

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import type {AppProps} from "next/app";
2+
3+
import "../styles/global.css";
4+
5+
const App = ({Component, pageProps}: AppProps) => <Component {...pageProps} />;
6+
7+
export default App;

‎apps/typical-chat-app-with-react-query/src/pages/index.tsx

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export {App as default} from "../components";

‎apps/typical-chat-app-with-react-query/src/styles/global.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;

‎apps/typical-chat-app-with-react-query/tailwind.config.js

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
const {join} = require("path");
2+
3+
const {createGlobPatternsForDependencies} = require("@nrwl/react/tailwind");
4+
5+
module.exports = {
6+
content: [
7+
join(__dirname, "src/**/*!(*.stories|*.spec).{ts,tsx,html}"),
8+
...createGlobPatternsForDependencies(__dirname),
9+
],
10+
theme: {
11+
extend: {},
12+
},
13+
plugins: [],
14+
};

0 commit comments

Comments
 (0)