diff --git a/.changeset/odd-rules-accept.md b/.changeset/odd-rules-accept.md new file mode 100644 index 000000000..22f8a8435 --- /dev/null +++ b/.changeset/odd-rules-accept.md @@ -0,0 +1,8 @@ +--- +"design-system": patch +"studio-next": patch +"@asyncapi/studio": patch +"@asyncapi/studio-ui": patch +--- + +- Use PNPM instead of NPM. diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index 692fa078e..000000000 --- a/.eslintignore +++ /dev/null @@ -1,6 +0,0 @@ -node_modules -public -docs -lib -build -dist \ No newline at end of file diff --git a/.github/workflows/if-nodejs-pr-testing.yml b/.github/workflows/if-nodejs-pr-testing.yml index 66ea65528..90f43a592 100644 --- a/.github/workflows/if-nodejs-pr-testing.yml +++ b/.github/workflows/if-nodejs-pr-testing.yml @@ -44,36 +44,31 @@ jobs: name: Checkout repository uses: actions/checkout@v4 - if: steps.should_run.outputs.shouldrun == 'true' - name: Check if Node.js project and has package.json - id: packagejson - run: test -e ./package.json && echo "exists=true" >> $GITHUB_OUTPUT || echo "exists=false" >> $GITHUB_OUTPUT - shell: bash - - if: steps.packagejson.outputs.exists == 'true' - name: Check package-lock version - uses: asyncapi/.github/.github/actions/get-node-version-from-package-lock@master - id: lockversion - - if: steps.packagejson.outputs.exists == 'true' name: Setup Node.js uses: actions/setup-node@v4 with: - node-version: "${{ steps.lockversion.outputs.version }}" - - if: steps.lockversion.outputs.version == '18' && matrix.os == 'windows-latest' - #npm cli 10 is buggy because of some cache issue - name: Install npm cli 8 + node-version: 20 + - if: steps.should_run.outputs.shouldrun == 'true' + uses: pnpm/action-setup@v3 + with: + run_install: false + - if: steps.should_run.outputs.shouldrun == 'true' + name: Get pnpm store directory shell: bash - run: npm install -g npm@8.19.4 - - if: steps.packagejson.outputs.exists == 'true' + run: | + echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV + - if: steps.should_run.outputs.shouldrun == 'true' + uses: actions/cache@v4 + name: Setup pnpm cache + with: + path: ${{ env.STORE_PATH }} + key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }} + restore-keys: | + ${{ runner.os }}-pnpm-store- + - if: steps.should_run.outputs.shouldrun == 'true' name: Install dependencies shell: bash - run: npm ci - - if: steps.packagejson.outputs.exists == 'true' + run: pnpm install + - if: steps.should_run.outputs.shouldrun == 'true' name: Test - run: npm test --if-present - - if: steps.packagejson.outputs.exists == 'true' && matrix.os == 'ubuntu-latest' - #linting should run just one and not on all possible operating systems - name: Run linter - run: npm run lint --if-present - - if: steps.packagejson.outputs.exists == 'true' - name: Run release assets generation to make sure PR does not break it - shell: bash - run: npm run generate:assets --if-present + run: pnpm test diff --git a/.github/workflows/if-nodejs-version-bump.yml b/.github/workflows/if-nodejs-version-bump.yml deleted file mode 100644 index fcad0676d..000000000 --- a/.github/workflows/if-nodejs-version-bump.yml +++ /dev/null @@ -1,65 +0,0 @@ -# This action is centrally managed in https://github.com/asyncapi/.github/ -# Don't make changes to this file in this repo as they will be overwritten with changes made to the same file in above mentioned repo - -# It does magic only if there is package.json file in the root of the project -name: Version bump - if Node.js project - -on: - release: - types: - - published - -jobs: - version_bump: - name: Generate assets and bump NodeJS - runs-on: ubuntu-latest - steps: - - name: Checkout repository - uses: actions/checkout@v3 - with: - # target branch of release. More info https://docs.github.com/en/rest/reference/repos#releases - # in case release is created from release branch then we need to checkout from given branch - # if @semantic-release/github is used to publish, the minimum version is 7.2.0 for proper working - ref: ${{ github.event.release.target_commitish }} - - name: Check if Node.js project and has package.json - id: packagejson - run: test -e ./package.json && echo "::set-output name=exists::true" || echo "::set-output name=exists::false" - - if: steps.packagejson.outputs.exists == 'true' - name: Setup Node.js - uses: actions/setup-node@v3 - with: - node-version: 18 - cache: 'npm' - cache-dependency-path: '**/package-lock.json' - - if: steps.packagejson.outputs.exists == 'true' - name: Install dependencies - run: npm install - - if: steps.packagejson.outputs.exists == 'true' - name: Assets generation - run: npm run generate:assets --if-present - - if: steps.packagejson.outputs.exists == 'true' - name: Bump version in package.json - # There is no need to substract "v" from the tag as version script handles it - # When adding "bump:version" script in package.json, make sure no tags are added by default (--no-git-tag-version) as they are already added by release workflow - # When adding "bump:version" script in package.json, make sure --allow-same-version is set in case someone forgot and updated package.json manually and we want to avoide this action to fail and raise confusion - run: VERSION=${{github.event.release.tag_name}} npm run bump:version - - if: steps.packagejson.outputs.exists == 'true' - name: Create Pull Request with updated asset files including package.json - uses: peter-evans/create-pull-request@v3 - with: - token: ${{ secrets.GH_TOKEN }} - commit-message: 'chore(release): ${{github.event.release.tag_name}}' - committer: asyncapi-bot - author: asyncapi-bot - title: 'chore(release): ${{github.event.release.tag_name}}' - body: 'Version bump in package.json for release [${{github.event.release.tag_name}}](${{github.event.release.html_url}})' - branch: version-bump/${{github.event.release.tag_name}} - - if: failure() # Only, on failure, send a message on the 94_bot-failing-ci slack channel - name: Report workflow run status to Slack - uses: 8398a7/action-slack@v3 - with: - status: ${{ job.status }} - fields: repo,action,workflow - text: 'Unable to bump the version in package.json after the release' - env: - SLACK_WEBHOOK_URL: ${{ secrets.SLACK_CI_FAIL_NOTIFY }} diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml index b5dfb1799..2a1e877bc 100644 --- a/.github/workflows/release.yml +++ b/.github/workflows/release.yml @@ -20,23 +20,36 @@ jobs: run: | git config --global core.autocrlf false git config --global core.eol lf + - name: Checkout repository - uses: actions/checkout@v3 - with: - token: ${{ secrets.GH_TOKEN }} + uses: actions/checkout@v4 - name: Setup Node.js - uses: actions/setup-node@v3 + uses: actions/setup-node@v4 + with: + node-version: 20 + - name: Setup pnpm + uses: pnpm/action-setup@v3 + with: + run_install: false + - name: Get pnpm store directory + shell: bash + run: | + echo "STORE_PATH=$(pnpm store path --silent)" >> $GITHUB_ENV + - uses: actions/cache@v4 + name: Setup pnpm cache with: - node-version: 18 - cache: 'npm' - cache-dependency-path: '**/package-lock.json' + path: ${{ env.STORE_PATH }} + key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }} + restore-keys: | + ${{ runner.os }}-pnpm-store- - name: Install dependencies - run: npm install + shell: bash + run: pnpm install - name: Create Release Pull Request or Release uses: changesets/action@v1 with: - publish: npm run publish-packages - version: npm run version-packages + publish: pnpm run publish-packages + version: pnpm run version-packages commit: "version packages" title: "chore: version packages" env: diff --git a/.npmrc b/.npmrc index 521a9f7c0..2c90c08a3 100644 --- a/.npmrc +++ b/.npmrc @@ -1 +1,3 @@ legacy-peer-deps=true +public-hoist-pattern[]=@asyncapi* +public-hoist-pattern[]=nimma* diff --git a/.nvmrc b/.nvmrc new file mode 100644 index 000000000..aacb51810 --- /dev/null +++ b/.nvmrc @@ -0,0 +1 @@ +18.17 diff --git a/README.md b/README.md index 633f87c2e..b9e58a013 100644 --- a/README.md +++ b/README.md @@ -7,47 +7,47 @@ This is a monorepo containing Studio source code, design system, and all their d Clone this repo and run: ``` -npm install +pnpm install ``` -> **Note:** NPM v7+ is required. +> **Note:** PNPM v8+ and Node.js v18.17+ is required. ## Development #### Run Studio locally ``` -npm run studio +pnpm run studio ``` #### Run the Design System locally ``` -npm run ds +pnpm run ds ``` #### Run Studio and the Design System locally at the same time ``` -npm run dev +pnpm run dev ``` #### Build Studio for production ``` -npm run build:studio +pnpm run build:studio ``` #### Build the Design System for production ``` -npm run build:ds +pnpm run build:ds ``` #### Build Studio and the Design System for production ``` -npm run build +pnpm run build ``` ## Architecture decision records diff --git a/apps/design-system/.eslintignore b/apps/design-system/.eslintignore new file mode 100644 index 000000000..15758df48 --- /dev/null +++ b/apps/design-system/.eslintignore @@ -0,0 +1,2 @@ +!.storybook +storybook-static diff --git a/apps/design-system/.eslintrc b/apps/design-system/.eslintrc new file mode 100644 index 000000000..b99a3c030 --- /dev/null +++ b/apps/design-system/.eslintrc @@ -0,0 +1,10 @@ +{ + "extends": ["eslint-config-custom","plugin:storybook/recommended"], + "plugins": ["import", "sonarjs"], + "rules": { + "import/no-anonymous-default-export": ["error", { + "allowObject": true + }], + "sonarjs/no-duplicate-string": "off" + } +} diff --git a/apps/design-system/.storybook/main.js b/apps/design-system/.storybook/main.js deleted file mode 100644 index c3ffc4c6d..000000000 --- a/apps/design-system/.storybook/main.js +++ /dev/null @@ -1,21 +0,0 @@ -export default { - "stories": ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"], - "addons": [ - "@storybook/addon-links", - "@storybook/addon-essentials", - "@storybook/addon-interactions", - "@storybook/addon-mdx-gfm", - "@storybook/preset-typescript" - ], - "framework": { - name: "@storybook/react-webpack5", - options: {} - }, - typescript: { - reactDocgen: "react-docgen-typescript-plugin" - }, - docs: { - autodocs: 'tag' - }, - staticDirs: ['../public'] -}; \ No newline at end of file diff --git a/apps/design-system/.storybook/main.ts b/apps/design-system/.storybook/main.ts new file mode 100644 index 000000000..f00763278 --- /dev/null +++ b/apps/design-system/.storybook/main.ts @@ -0,0 +1,34 @@ +import remarkGfm from 'remark-gfm'; +import { StorybookConfig } from '@storybook/react-webpack5'; +const config: StorybookConfig = { + stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"], + addons: [ + "@storybook/addon-links", + "@storybook/addon-essentials", + "@storybook/addon-interactions", + { + name: '@storybook/addon-docs', + options: { + configureJSX: true, + mdxPluginOptions: { + mdxCompileOptions: { + remarkPlugins: [remarkGfm], + }, + }, + }, + }, + ], + framework: { + name: "@storybook/react-webpack5", + options: {} + }, + typescript: { + reactDocgen: "react-docgen-typescript" + }, + docs: { + autodocs: 'tag' + }, + staticDirs: ['../public'] +}; + +export default config; diff --git a/apps/design-system/.babelrc.json b/apps/design-system/babel.config.json similarity index 75% rename from apps/design-system/.babelrc.json rename to apps/design-system/babel.config.json index f756c6fe2..6a5c44cd0 100644 --- a/apps/design-system/.babelrc.json +++ b/apps/design-system/babel.config.json @@ -9,7 +9,8 @@ } } ], - "@babel/preset-react" + "@babel/preset-react", + "@babel/preset-typescript" ], "plugins": [] -} \ No newline at end of file +} diff --git a/apps/design-system/package.json b/apps/design-system/package.json index 372b547ec..46360c620 100644 --- a/apps/design-system/package.json +++ b/apps/design-system/package.json @@ -3,6 +3,7 @@ "version": "0.0.0", "private": true, "dependencies": { + "@asyncapi/studio-ui": "workspace:*", "@headlessui/react": "^1.7.13", "@mdx-js/react": "^1.6.22", "@testing-library/jest-dom": "^5.16.2", @@ -12,11 +13,10 @@ "react": "^18.2.0", "react-dom": "^18.2.0", "react-icons": "^4.8.0", - "@asyncapi/studio-ui": "*", "web-vitals": "^2.1.4" }, "scripts": { - "lint": "echo \"No linter configured yet\"", + "lint": "eslint . --ext .ts,.tsx,.js,.jsx", "generate:assets": "echo \"No assets to configure\"", "test": "echo \"No tests\"", "eject": "react-scripts eject", @@ -24,12 +24,6 @@ "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist", "build": "storybook build" }, - "eslintConfig": { - "extends": [ - "react-app", - "react-app/jest" - ] - }, "browserslist": { "production": [ ">0.2%", @@ -46,27 +40,30 @@ "@babel/core": "^7.17.4", "@babel/preset-env": "^7.22.4", "@babel/preset-react": "^7.22.3", - "@storybook/addon-actions": "^7.0.20", - "@storybook/addon-essentials": "^7.0.20", - "@storybook/addon-interactions": "^7.0.20", - "@storybook/addon-links": "^7.0.20", - "@storybook/addon-mdx-gfm": "^7.0.20", - "@storybook/addon-postcss": "^2.0.0", - "@storybook/addon-styling": "^1.1.0", - "@storybook/addons": "^7.0.20", - "@storybook/blocks": "^7.0.22", - "@storybook/preset-create-react-app": "^7.0.20", - "@storybook/preset-typescript": "^3.0.0", - "@storybook/react": "^7.0.20", - "@storybook/react-webpack5": "^7.0.20", - "@storybook/testing-library": "^0.1.0", - "@storybook/theming": "^7.0.22", + "@babel/preset-typescript": "^7.24.1", + "@storybook/addon-actions": "^7.6.18", + "@storybook/addon-docs": "^7.6.18", + "@storybook/addon-essentials": "^7.6.18", + "@storybook/addon-interactions": "^7.6.18", + "@storybook/addon-links": "^7.6.18", + "@storybook/addons": "^7.6.18", + "@storybook/blocks": "^7.6.18", + "@storybook/preset-create-react-app": "^7.6.18", + "@storybook/react": "^7.6.18", + "@storybook/react-webpack5": "^7.6.18", + "@storybook/test": "^7.6.18", + "@storybook/theming": "^7.6.18", "autoprefixer": "^10.4.14", "babel-loader": "^8.2.3", + "eslint-config-custom": "workspace:*", + "eslint-plugin-import": "^2.29.1", + "eslint-plugin-storybook": "^0.8.0", "fork-ts-checker-webpack-plugin": "^8.0.0", + "react-docgen-typescript": "^2.2.2", "react-docgen-typescript-plugin": "^1.0.5", "remark-gfm": "^3.0.1", "storybook": "^7.0.20", + "tailwind-config": "workspace:*", "ts-loader": "^9.4.3", "typescript": "^5.0.2", "webpack": "^5.69.0" diff --git a/apps/design-system/src/components/DropdownMenu.stories.tsx b/apps/design-system/src/components/DropdownMenu.stories.tsx index 0e3500859..f103a1111 100644 --- a/apps/design-system/src/components/DropdownMenu.stories.tsx +++ b/apps/design-system/src/components/DropdownMenu.stories.tsx @@ -1,4 +1,3 @@ -/* eslint-disable import/no-anonymous-default-export */ import { DropdownMenu } from '@asyncapi/studio-ui' export default { diff --git a/apps/design-system/src/components/EditorSwitch.stories.tsx b/apps/design-system/src/components/EditorSwitch.stories.tsx index ce5e5cd6a..ca613d27a 100644 --- a/apps/design-system/src/components/EditorSwitch.stories.tsx +++ b/apps/design-system/src/components/EditorSwitch.stories.tsx @@ -11,13 +11,13 @@ type Story = StoryObj export const CodeEditor: Story = { args: { isCodeEditor: true, - onSwitchChange: (value) => console.log(`onSwitchChange() called.`), + onSwitchChange: () => console.log(`onSwitchChange() called.`), }, } export const VisualEditor: Story = { args: { isCodeEditor: false, - onSwitchChange: (value) => console.log(`onSwitchChange() called.`), + onSwitchChange: () => console.log(`onSwitchChange() called.`), }, } diff --git a/apps/design-system/src/components/Toolbar.stories.tsx b/apps/design-system/src/components/Toolbar.stories.tsx index 4b67b1c2c..9588b9fe5 100644 --- a/apps/design-system/src/components/Toolbar.stories.tsx +++ b/apps/design-system/src/components/Toolbar.stories.tsx @@ -1,4 +1,3 @@ -/* eslint-disable import/no-anonymous-default-export */ import { Toolbar } from '@asyncapi/studio-ui' import { ListBulletIcon, CodeBracketSquareIcon, DocumentTextIcon, EllipsisVerticalIcon } from '@asyncapi/studio-ui/icons' diff --git a/apps/design-system/src/components/Tooltip.stories.tsx b/apps/design-system/src/components/Tooltip.stories.tsx index 72ae86211..8116091e7 100644 --- a/apps/design-system/src/components/Tooltip.stories.tsx +++ b/apps/design-system/src/components/Tooltip.stories.tsx @@ -1,4 +1,3 @@ -/* eslint-disable import/no-anonymous-default-export */ import React from 'react' import { Tooltip } from '@asyncapi/studio-ui' diff --git a/apps/design-system/src/components/VisualJsonSchemaEditor.stories.tsx b/apps/design-system/src/components/VisualJsonSchemaEditor.stories.tsx index da87e3ae4..04e59af45 100644 --- a/apps/design-system/src/components/VisualJsonSchemaEditor.stories.tsx +++ b/apps/design-system/src/components/VisualJsonSchemaEditor.stories.tsx @@ -204,7 +204,7 @@ export const Root_Array_of_Object = () => ( /> ); -export const two_property_having_same_name = () => ( +export const TwoPropertyHavingSameName = () => (