ci: disable auto deploy vercel (#58)

* ci: disable auto deploy vercel

* ci: add client CI

* ci: update server CI

* ci: fix client CI

* fix: prettier

* ci: add PR helper

* ci: add deploy CI

* ci: update deploy version

* ci: fix deploy

* ci: move deploy to frontend and backend

* ci: add renovate

* ci: change renovate

* ci: test backend CI

.github/workflows/canmerge.yml

@@ -0,0 +1,29 @@
+name: PR helper is working 👷⚒️
+run-name: PR helper is working ⚒️
+
+on: [pull_request, pull_request_review, issue_comment]
+
+jobs:
+  automerge:
+    permissions:
+      contents: write
+      issues: write
+      pull-requests: write
+
+    runs-on: ubuntu-latest
+    steps:
+      - name: PR Helper
+        uses: Matticusau/[email protected]
+        with:
+          repo-token: ${{ secrets.GITHUB_TOKEN }}
+          enable-prmerge-automation: true
+          enable-prcomment-automation: true
+          enable-prlabel-automation: true
+          prmerge-requireallchecks: true
+          prmerge-requirereviewcount: 1
+          prmerge-method: 'squash'
+          prlabel-default: 'pr-onhold'
+          prlabel-ready: 'pr-ready'
+          prlabel-onhold: 'pr-onhold'
+          prlabel-reviewrequired: 'review-required'
+          prlabel-automerge: 'auto-merge'

.github/workflows/client.yml

@@ -0,0 +1,87 @@
+name: Frontend checker, will punish for bad code 🪓😵‍💫
+run-name: ${{ github.actor }} is starting sueta at the frontend code ☺️
+
+on:
+  push:
+    branches:
+      - dev-nextjs
+    paths:
+      - "client/**"
+  pull_request:
+    branches:
+      - dev-nextjs
+    paths:
+      - "client/**"
+
+jobs:
+  pipeline:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [18.x]
+    steps:
+      - uses: actions/checkout@v3
+      - name: Set up Node.JS ${{matrix.node-version}}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{matrix.node-version}}
+
+      - name: Cache Yarn dependencies
+        uses: actions/[email protected]
+        with:
+          path: ./client/node_modules
+          key: ${{ runner.os }}-yarn-${{ hashFiles('./client/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+
+      - name: Install yarn and dependencies
+        working-directory: ./client
+        run: |
+          npm install --global yarn
+          yarn install --frozen-lockfile
+
+      - name: Lint and Format
+        working-directory: ./client
+        run: |
+          yarn lint:ts:check
+          yarn prettier:check
+
+      - name: Build project
+        working-directory: ./client
+        run: yarn build
+
+  deploy:
+    needs: pipeline
+    if: success()
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+
+      - name: Set Vercel Args
+        id: vercel_args
+        run: |
+          if [[ "${{ github.event_name }}" == "push" ]]; then
+            echo "::set-output name=args::--prod"
+          else
+            echo "::set-output name=args::"
+          fi
+
+      - name: Deploy Frontend
+        uses: amondnet/vercel-action@v25
+        with:
+          vercel-token: ${{ secrets.VERCEL_TOKEN }}
+          vercel-org-id: ${{ secrets.ORG_ID }}
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          vercel-project-id: ${{ secrets.PROJECT_ID }}
+          vercel-args: ${{ steps.vercel_args.outputs.args }}
+
+      - name: Deploy Storybook
+        uses: amondnet/vercel-action@v25
+        with:
+          vercel-token: ${{ secrets.VERCEL_TOKEN }}
+          vercel-org-id: ${{ secrets.ORG_ID }}
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          vercel-project-id: ${{ secrets.PROJECT_ID_STORYBOOK }}
+          vercel-args: ${{ steps.vercel_args.outputs.args }}

.github/workflows/nextjs_bundle_analysis.yml

@@ -0,0 +1,146 @@
+# Copyright (c) HashiCorp, Inc.
+# SPDX-License-Identifier: MPL-2.0
+
+name: 'Next.js Bundle Analysis'
+
+on:
+  pull_request:
+    branches:
+      - dev-nextjs
+    paths:
+      - "client/**"
+  push:
+    branches:
+      - dev-nextjs # change this if your default branch is named differently
+    paths:
+      - "client/**"
+  workflow_dispatch:
+
+defaults:
+  run:
+    # change this if your nextjs app does not live at the root of the repo
+    working-directory: ./client
+
+permissions:
+  contents: read # for checkout repository
+  actions: read # for fetching base branch bundle stats
+  pull-requests: write # for comments
+
+jobs:
+  analyze:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+
+      - name: Cache Yarn dependencies
+        uses: actions/[email protected]
+        with:
+          path: ./client/node_modules
+          key: ${{ runner.os }}-yarn-${{ hashFiles('./client/yarn.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-yarn-
+
+      - name: Install yarn and dependencies
+        working-directory: ./client
+        run: |
+          npm install --global yarn
+          yarn install --frozen-lockfile
+
+      # If pnpm is used, you need to switch the previous step with the following one. pnpm does not create a package-lock.json
+      # so the step above will fail to pull dependencies
+      # - uses: pnpm/action-setup@v2
+      #   name: Install pnpm
+      #   id: pnpm-install
+      #   with:
+      #     version: 7
+      #     run_install: true
+
+      - name: Restore next build
+        uses: actions/cache@v3
+        id: restore-build-cache
+        env:
+          cache-name: cache-next-build
+        with:
+          # if you use a custom build directory, replace all instances of `.next` in this file with your build directory
+          # ex: if your app builds to `dist`, replace `.next` with `dist`
+          path: ./client/.next/cache
+          # change this if you prefer a more strict cache
+          key: ${{ runner.os }}-build-${{ env.cache-name }}
+
+      - name: Build next.js app
+        # change this if your site requires a custom build command
+        run: yarn build
+
+      # Here's the first place where next-bundle-analysis' own script is used
+      # This step pulls the raw bundle stats for the current bundle
+      - name: Analyze bundle
+        run: npx -p nextjs-bundle-analysis report
+
+      - name: Upload bundle
+        uses: actions/upload-artifact@v3
+        with:
+          name: bundle
+          path: ./client/.next/analyze/__bundle_analysis.json
+
+      - name: Download base branch bundle stats
+        uses: dawidd6/action-download-artifact@v2
+        if: success() && github.event.number
+        with:
+          workflow: nextjs_bundle_analysis.yml
+          branch: dev-nextjs
+          path: ./client/.next/analyze/base
+
+      # And here's the second place - this runs after we have both the current and
+      # base branch bundle stats, and will compare them to determine what changed.
+      # There are two configurable arguments that come from package.json:
+      #
+      # - budget: optional, set a budget (bytes) against which size changes are measured
+      #           it's set to 350kb here by default, as informed by the following piece:
+      #           https://infrequently.org/2021/03/the-performance-inequality-gap/
+      #
+      # - red-status-percentage: sets the percent size increase where you get a red
+      #                          status indicator, defaults to 20%
+      #
+      # Either of these arguments can be changed or removed by editing the `nextBundleAnalysis`
+      # entry in your package.json file.
+      - name: Compare with base branch bundle
+        if: success() && github.event.number
+        run: ls -laR ./client/.next/analyze/base && npx -p nextjs-bundle-analysis compare
+
+      - name: Get Comment Body
+        id: get-comment-body
+        if: success() && github.event.number
+        # https://docs.github.com/en/actions/using-workflows/workflow-commands-for-github-actions#multiline-strings
+        run: |
+          echo "body<<EOF" >> $GITHUB_OUTPUT
+          echo "$(cat ./client/.next/analyze/__bundle_analysis_comment.txt)" >> $GITHUB_OUTPUT
+          echo EOF >> $GITHUB_OUTPUT
+
+      - name: Find Comment
+        uses: peter-evans/find-comment@v2
+        if: success() && github.event.number
+        id: fc
+        with:
+          issue-number: ${{ github.event.number }}
+          body-includes: '<!-- __NEXTJS_BUNDLE -->'
+
+      - name: Create Comment
+        uses: peter-evans/create-or-update-comment@v2
+        if: success() && github.event.number && steps.fc.outputs.comment-id == 0
+        with:
+          issue-number: ${{ github.event.number }}
+          body: ${{ steps.get-comment-body.outputs.body }}
+
+      - name: Update Comment
+        uses: peter-evans/create-or-update-comment@v2
+        if: success() && github.event.number && steps.fc.outputs.comment-id != 0
+        with:
+          issue-number: ${{ github.event.number }}
+          body: ${{ steps.get-comment-body.outputs.body }}
+          comment-id: ${{ steps.fc.outputs.comment-id }}
+          edit-mode: replace

.github/workflows/github-actions-demo.yml → .github/workflows/server.yml

@@ -1,10 +1,18 @@
-name: Teameights checker, will punish for bad code 🥵
-run-name: ${{ github.actor }} is making deploy 🚀 Let's pray he will pass tests 😉
+name: Backend checker, will punish for bad code 🥲🔫
+run-name: ${{ github.actor }} is starting sueta at the backend code 🤠
+
 on:
   push:
-    branches: [dev]
+    branches:
+      - dev-nextjs
+    paths:
+        - "server/**"
   pull_request:
-    branches: [dev]
+    branches:
+        - dev-nextjs
+    paths:
+        - "server/**"
+
 jobs:
   init:
     runs-on: ubuntu-latest
@@ -34,11 +42,26 @@ jobs:
       - name: 🎧 Install modules
         working-directory: ./server
         run: npm install
+
+      - name: 🚀 Run linting
+        working-directory: ./server
+        run: npm run lint
+
+      - name: Run Prettier formatter
+        working-directory: ./server
+        run: npm run format
+
       - name: 🚀 Run unit tests
         working-directory: ./server
         run: npm run test
+
       - run: echo "🍏 This job's status is ${{ job.status }}."
       - name: 🚀 Run coverage tests
         working-directory: ./server
         run: npm run test:cov
-      - run: echo "😼 Finished! Good job."
+
+      - name: Run build
+        working-directory: ./server
+        run: npm run build
+
+      - run: echo "😼 Finished! Good job."

client/.storybook/main.ts

@@ -13,28 +13,28 @@ const config: StorybookConfig = {
       options: {
         sass: {
           // Require your Sass preprocessor here
-          implementation: require('sass'),
-        },
-      },
-    },
+          implementation: require('sass')
+        }
+      }
+    }
   ],
   framework: {
     name: '@storybook/nextjs',
     options: {
-      nextConfigPath: path.resolve(__dirname, '../next.config.js'),
-    },
+      nextConfigPath: path.resolve(__dirname, '../next.config.js')
+    }
   },
   docs: {
-    autodocs: 'tag',
+    autodocs: 'tag'
   },
   core: {
-    builder: '@storybook/builder-webpack5',
+    builder: '@storybook/builder-webpack5'
   },
   webpackFinal: async (config) => {
     if (!config.resolve?.modules) return config;
 
     config.resolve.modules.push(path.resolve(__dirname, '../src'));
     return config;
-  },
+  }
 };
 export default config;

client/.storybook/preview.ts

@@ -9,18 +9,18 @@ const preview: Preview = {
       values: [
         {
           name: 'blacked',
-          value: '#26292b',
-        },
-      ],
+          value: '#26292b'
+        }
+      ]
     },
     actions: { argTypesRegex: '^on[A-Z].*' },
     controls: {
       matchers: {
         color: /(background|color)$/i,
-        date: /Date$/,
-      },
-    },
-  },
+        date: /Date$/
+      }
+    }
+  }
 };
 
 export default preview;