From ee582856cb38029896692d37813ad3521f773e0f Mon Sep 17 00:00:00 2001 From: timDeHof Date: Tue, 10 Oct 2023 23:01:57 -0400 Subject: [PATCH 01/24] chore(eslintrc.cjs): update eslint configuration feat(eslintrc.cjs): add support for YAML files chore(commitlint.config.js): add commitlint configuration chore(package.json): add commit script chore(App.jsx): refactor App component to use Nav component chore(posts.js): add getPost function to fetch individual post details chore(main.jsx): remove unused imports feat(Home.jsx): create Home component feat(PostDetail.jsx): create PostDetail component feat(Posts.jsx): create Posts component feat(index.jsx): create Nav component to handle routing The eslint configuration has been updated to include support for the latest ECMAScript version and module syntax. The ignore patterns have been modified to exclude additional files and directories. The rules for YAML files have been added to the eslint configuration. A commitlint configuration file has been added to enforce conventional commit messages. A commit script has been added to the package.json file to --- .eslintrc.cjs | 35 +++++++++------- commitlint.config.js | 1 + package-lock.json | 2 +- package.json | 7 ++-- src/App.jsx | 88 ++-------------------------------------- src/api/posts.js | 14 +++++++ src/main.jsx | 1 + src/pages/Home.jsx | 41 +++++++++++++++++++ src/pages/PostDetail.jsx | 25 ++++++++++++ src/pages/Posts.jsx | 51 +++++++++++++++++++++++ src/routes/index.jsx | 22 ++++++++++ 11 files changed, 184 insertions(+), 103 deletions(-) create mode 100644 commitlint.config.js create mode 100644 src/pages/Home.jsx create mode 100644 src/pages/PostDetail.jsx create mode 100644 src/pages/Posts.jsx create mode 100644 src/routes/index.jsx diff --git a/.eslintrc.cjs b/.eslintrc.cjs index d062928..9cd13c6 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -1,6 +1,13 @@ module.exports = { root: true, env: { browser: true, es2020: true }, + parserOptions: { ecmaVersion: "latest", sourceType: "module" }, + ignorePatterns: [ + "dist", + ".eslintrc.cjs", + ".pnpm-lock.yaml", + "node_modules/*", + ], extends: [ "eslint:recommended", "plugin:react/recommended", @@ -9,27 +16,25 @@ module.exports = { "plugin:@tanstack/eslint-plugin-query/recommended", "prettier", ], - ignorePatterns: ["dist", ".eslintrc.cjs", ".pnpm-lock.yaml"], - parserOptions: { ecmaVersion: "latest", sourceType: "module" }, - settings: { react: { version: "18.2" } }, plugins: ["react-refresh", "prettier", "@tanstack/query"], - rules: { - "react-refresh/only-export-components": [ - "warn", - { allowConstantExport: true }, - ], - "prettier/prettier": "error", - "@tanstack/query/exhaustive-deps": "error", - "@tanstack/query/prefer-query-object-syntax": "error", - "@tanstack/query/stable-query-client": "error", - "react/prop-types": "off", - "linebreak-style": off, - }, + settings: { react: { version: "18.2" } }, overrides: [ { files: ["*.yaml", "*.yml"], plugins: ["yaml"], extends: ["plugin:yaml/recommended"], + rules: { + "react-refresh/only-export-components": [ + "warn", + { allowConstantExport: true }, + ], + "prettier/prettier": ["error", {}, { usePrettierrc: true }], + "@tanstack/query/exhaustive-deps": "error", + "@tanstack/query/prefer-query-object-syntax": "error", + "@tanstack/query/stable-query-client": "error", + "react/prop-types": "off", + "linebreak-style": "off", + }, }, ], }; diff --git a/commitlint.config.js b/commitlint.config.js new file mode 100644 index 0000000..28fe5c5 --- /dev/null +++ b/commitlint.config.js @@ -0,0 +1 @@ +module.exports = {extends: ['@commitlint/config-conventional']} diff --git a/package-lock.json b/package-lock.json index ee3f775..b569176 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,7 +15,7 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-query": "^3.39.3", - "react-router-dom": "^6.16.0" + "react-router-dom": "^6.4.3" }, "devDependencies": { "@playwright/test": "^1.38.1", diff --git a/package.json b/package.json index 0a5a0a3..34963d7 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "type": "module", "scripts": { "dev": "vite", + "commit": "commit", "build": "vite build", "lint": "eslint . --fix", "test": "npx playwright test", @@ -21,14 +22,14 @@ ] }, "dependencies": { - "@tanstack/react-query": "^4.35.7", - "@tanstack/react-query-devtools": "^4.35.7", + "@tanstack/react-query": "^4.36.1", + "@tanstack/react-query-devtools": "^4.36.1", "axios": "^1.5.1", "dotenv": "^16.3.1", "react": "^18.2.0", "react-dom": "^18.2.0", "react-query": "^3.39.3", - "react-router-dom": "^6.16.0" + "react-router-dom": "^6.4.3" }, "devDependencies": { "@playwright/test": "^1.38.1", diff --git a/src/App.jsx b/src/App.jsx index 0dc3b6a..827f35f 100644 --- a/src/App.jsx +++ b/src/App.jsx @@ -1,90 +1,10 @@ -import { useState } from "react"; -import reactLogo from "./assets/react.svg"; -import viteLogo from "/vite.svg"; -import { useQueryClient } from "@tanstack/react-query"; -import { usePosts } from "./api/posts"; +import Nav from "./routes"; function App() { - const [count, setCount] = useState(0); - const [postId, setPostId] = useState(-1); - return ( -
-
-
- - Vite logo - - - React logo - -
-

Vite + React

-
- -

- Edit{" "} - - src/App.jsx - {" "} - and save to test HMR -

-
-

- Click on the Vite and React logos to learn more -

- {postId > -1 ? "" : } -
-
+ <> +