From 976d95c4578eb0958ce60452868b9c97329233fd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Antti=20M=C3=A4ki?= Date: Thu, 2 Dec 2021 14:07:08 +0200 Subject: [PATCH 1/4] Remove line breaks from markdown Markdown uses double trailing spaces as a line break. Pre-commit will want to remove these. Remove the lines manually. This will make the elements be rendered next to each other in the Storybook, but figuring out how to keep the trailing whitespace in this one file doesn't seem worith it. --- apps/storybook/stories/components/Markdown.stories.tsx | 6 ------ 1 file changed, 6 deletions(-) diff --git a/apps/storybook/stories/components/Markdown.stories.tsx b/apps/storybook/stories/components/Markdown.stories.tsx index f84023f18..89c4e1afa 100644 --- a/apps/storybook/stories/components/Markdown.stories.tsx +++ b/apps/storybook/stories/components/Markdown.stories.tsx @@ -19,8 +19,6 @@ ${"```"}js console.log("Hello, World!"); ${"```"} - - ${"```"}python print('Hello, World!') ${"```"} @@ -33,16 +31,12 @@ const listContent = ` * Subitem * Yet another item - - 1. First item 2. Second item 1. Subitem 2. Subitem 3. Last item - - - [x] Read ticket thoroughly - [ ] Design implementation - [ ] Write code and tests From 898e06c5b07b81ea05ddbdd32e192d3ed8bd7f8e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Antti=20M=C3=A4ki?= Date: Thu, 2 Dec 2021 14:14:23 +0200 Subject: [PATCH 2/4] Run pre-commit to fix code style Config was changed so that: - trailing new lines are not required in svg files - prettier doesn't mess with indentation in yaml files - prettier doesn't mess with line lengths in yaml files --- .github/actions/get-node-version/src/main.ts | 2 +- .../actions/get-node-version/tsconfig.json | 4 +-- .pre-commit-config.yaml | 2 ++ apps/storybook/.babelrc.json | 2 +- apps/storybook/.storybook/main.js | 14 ++++---- apps/storybook/.storybook/preview.js | 2 +- .../stories/Introduction.stories.mdx | 32 ++++++++++++------- 7 files changed, 34 insertions(+), 24 deletions(-) diff --git a/.github/actions/get-node-version/src/main.ts b/.github/actions/get-node-version/src/main.ts index 469d64c61..2bf96a08b 100644 --- a/.github/actions/get-node-version/src/main.ts +++ b/.github/actions/get-node-version/src/main.ts @@ -1,6 +1,6 @@ import { setOutput, setFailed, getInput } from "@actions/core"; import semver from "semver"; -import {readFileSync} from "fs"; +import { readFileSync } from "fs"; (() => { const inputPath = getInput("package-json"); diff --git a/.github/actions/get-node-version/tsconfig.json b/.github/actions/get-node-version/tsconfig.json index b6c380fab..0e68516d1 100644 --- a/.github/actions/get-node-version/tsconfig.json +++ b/.github/actions/get-node-version/tsconfig.json @@ -40,7 +40,7 @@ "composite": true, - "skipLibCheck": false, + "skipLibCheck": false }, - "include": ["./src/**/*.ts"], + "include": ["./src/**/*.ts"] } diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml index 3dd57c27e..d943b725b 100644 --- a/.pre-commit-config.yaml +++ b/.pre-commit-config.yaml @@ -4,6 +4,7 @@ repos: hooks: - id: trailing-whitespace - id: end-of-file-fixer + exclude_types: [svg] - id: check-yaml - id: mixed-line-ending args: [--fix=lf] @@ -11,3 +12,4 @@ repos: rev: "v2.3.1" hooks: - id: prettier + exclude_types: [markdown, yaml] diff --git a/apps/storybook/.babelrc.json b/apps/storybook/.babelrc.json index 1568807c2..4d4dd1af9 100644 --- a/apps/storybook/.babelrc.json +++ b/apps/storybook/.babelrc.json @@ -58,4 +58,4 @@ } ] ] -} \ No newline at end of file +} diff --git a/apps/storybook/.storybook/main.js b/apps/storybook/.storybook/main.js index 972a94726..9378eba0c 100644 --- a/apps/storybook/.storybook/main.js +++ b/apps/storybook/.storybook/main.js @@ -1,17 +1,17 @@ module.exports = { - "stories": [ + stories: [ "../stories/**/*.stories.mdx", { - "directory": "../stories/components", - "files": "*.stories.*", - "titlePrefix": "@thunderstore/components" + directory: "../stories/components", + files: "*.stories.*", + titlePrefix: "@thunderstore/components", }, ], - "addons": [ + addons: [ "@storybook/addon-links", "@storybook/addon-essentials", "@storybook/addon-interactions", - "@snek-at/storybook-addon-chakra-ui", // Must come after @storybook addons + "@snek-at/storybook-addon-chakra-ui", // Must come after @storybook addons ], - "framework": "@storybook/react", + framework: "@storybook/react", }; diff --git a/apps/storybook/.storybook/preview.js b/apps/storybook/.storybook/preview.js index 8a8268cef..a5ff48751 100644 --- a/apps/storybook/.storybook/preview.js +++ b/apps/storybook/.storybook/preview.js @@ -14,4 +14,4 @@ export const parameters = { { name: "dark", value: "#333" }, ], }, -} +}; diff --git a/apps/storybook/stories/Introduction.stories.mdx b/apps/storybook/stories/Introduction.stories.mdx index 3709cbeab..b31136bf9 100644 --- a/apps/storybook/stories/Introduction.stories.mdx +++ b/apps/storybook/stories/Introduction.stories.mdx @@ -1,12 +1,12 @@ -import { Meta } from '@storybook/addon-docs'; -import Code from './assets/code-brackets.svg'; -import Colors from './assets/colors.svg'; -import Comments from './assets/comments.svg'; -import Direction from './assets/direction.svg'; -import Flow from './assets/flow.svg'; -import Plugin from './assets/plugin.svg'; -import Repo from './assets/repo.svg'; -import StackAlt from './assets/stackalt.svg'; +import { Meta } from "@storybook/addon-docs"; +import Code from "./assets/code-brackets.svg"; +import Colors from "./assets/colors.svg"; +import Comments from "./assets/comments.svg"; +import Direction from "./assets/direction.svg"; +import Flow from "./assets/flow.svg"; +import Plugin from "./assets/plugin.svg"; +import Repo from "./assets/repo.svg"; +import StackAlt from "./assets/stackalt.svg"; @@ -180,14 +180,22 @@ We recommend building UIs with a [**component-driven**](https://componentdriven. Configure, customize, and extend - + direction In-depth guides Best practices from leading teams - + code GitHub project @@ -204,6 +212,6 @@ We recommend building UIs with a [**component-driven**](https://componentdriven.
- TipEdit the Markdown in{' '} + TipEdit the Markdown in{" "} src/stories/Introduction.stories.mdx
From af6738931c876c0e500a26a02c9d58a4b10d81f5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Antti=20M=C3=A4ki?= Date: Thu, 2 Dec 2021 14:19:43 +0200 Subject: [PATCH 3/4] Run pre-commit via GitHub actions on push and pull requests --- .github/workflows/test.yml | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml index 46ebf66f4..f6071eee6 100644 --- a/.github/workflows/test.yml +++ b/.github/workflows/test.yml @@ -25,6 +25,19 @@ jobs: id: get-node-version uses: ./.github/actions/get-node-version + pre-commit: + name: Code style check + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v2 + - uses: actions/setup-python@v2 + with: + python-version: '3.8' + - name: Install pre-commit + run: curl https://pre-commit.com/install-local.py | python - + - name: Run pre-commit + run: ~/bin/pre-commit run --show-diff-on-failure --color=always --all-files + test: name: Test runs-on: ubuntu-latest From bf99c0b86fea33d4f3553a88033922e044837ef7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Antti=20M=C3=A4ki?= Date: Thu, 2 Dec 2021 14:38:16 +0200 Subject: [PATCH 4/4] Update README with information about pre-commit --- README.md | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/README.md b/README.md index bc4c6e227..c595dfbd4 100644 --- a/README.md +++ b/README.md @@ -97,3 +97,16 @@ files. To upgrade Storybook when it informs you about new version being available, run the given `npx sb@latest upgrade` command in `apps/storybook` directory. + +## pre-commit + +[Pre-commit](https://pre-commit.com/) enforces code style practices in this +project. Choose your preferred +[installation method](https://pre-commit.com/#install) and then run `pre-commit +install` to enable Git hook scripts. Pre-commit will now automatically cancel +your commits if any problems are detected, and autofix them. Stage the changed +files to your commit and re-run the commit command. + +Pre-commit can be disabled for a single commit with `--no-verify` option, but +note that CI also runs pre-commit and will fail if any problems are encountered +at this stage.