80000Coding-Web-Client/.github/workflows/chromatic-report.yml at dev · 80000Coding/80000Coding-Web-Client · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
# original source: https://github.com/channel-io/bezier-react/blob/main/.github/workflows/chromatic-report.yml
name: Chromatic Report

on:
  workflow_run:
    workflows: ["Chromatic"]
    types:
      - completed

jobs:
  chromatic-report:
    if: github.event.workflow_run.event == 'pull_request' && github.event.workflow_run.conclusion == 'success' && github.actor != 'dependabot[bot]'
    name: Chromatic Report
    runs-on: ubuntu-latest
    steps:
      - name: Checkout Repo
        uses: actions/checkout@v3

      - name: Download artifact
        uses: actions/github-script@v6
        with:
          script: |
            const artifacts = await github.rest.actions.listWorkflowRunArtifacts({
               owner: context.repo.owner,
               repo: context.repo.repo,
               run_id: ${{ github.event.workflow_run.id }},
            });

            const matchArtifact = artifacts.data.artifacts.filter((artifact) => {
              return artifact.name == "pr"
            })[0];

            const download = await github.rest.actions.downloadArtifact({
               owner: context.repo.owner,
               repo: context.repo.repo,
               artifact_id: matchArtifact.id,
               archive_format: 'zip',
            });

            const fs = require('fs');
            fs.writeFileSync('${{ github.workspace }}/pr.zip', Buffer.from(download.data));

      - name: Unzip artifact
        run: unzip pr.zip

      - name: Get PR number
        uses: actions/github-script@v6
        id: pr-number
        with:
          script: |
            const fs = require('fs');
            return Number(fs.readFileSync('./prNumber'));
          result-encoding: string

      - name: Get Storybook URL
        uses: actions/github-script@v6
        id: storybook-url
        with:
          script: |
            const fs = require('fs');
            return fs.readFileSync('./storybookUrl');
          result-encoding: string

      - name: Get Chromatic build URL
        uses: actions/github-script@v6
        id: build-url
        with:
          script: |
            const fs = require('fs');
            return fs.readFileSync('./buildUrl');
          result-encoding: string

      - name: Render template
        id: template
        uses: chuhlomin/render-template@v1.7
        with:
          template: .github/utils/chromatic-report/comment_template.md
          vars: |
            storybookUrl: ${{ steps.storybook-url.outputs.result }}
            buildUrl: ${{ steps.build-url.outputs.result }}

      - name: Find comment
        uses: peter-evans/find-comment@v2
        id: find-comment
        with:
          issue-number: ${{ steps.pr-number.outputs.result }}
          comment-author: 'github-actions[bot]'
          body-includes: Chromatic Report

      - name: Create or update comment
        uses: peter-evans/create-or-update-comment@v2
        with:
          comment-id: ${{ steps.find-comment.outputs.comment-id }}
          issue-number: ${{ steps.pr-number.outputs.result }}
          body: ${{ steps.template.outputs.result }}
          edit-mode: replace

      - name: Discord notification
        if: github.ref == 'refs/heads/main' || github.ref == 'refs/heads/dev'
        env:
          DISCORD_WEBHOOK: ${{ secrets.DISCORD_WEBHOOK }}
        uses: Ilshidur/action-discord@master
        with:
          args: |
            🚀 Storybook build is ready for review!
            storybookUrl: ${{ steps.storybook-url.outputs.result }}
            buildUrl: ${{ steps.build-url.outputs.result }}