Merge pull request #1884 from thematters/stage

Release: v3.20.0

.env.dev

@@ -18,6 +18,6 @@ NEXT_PUBLIC_SENTRY_DSN=https://[email protected]
 NEXT_PUBLIC_FIREBASE_CONFIG=eyJhcGlLZXkiOiJBSXphU3lBc0twb2xwSjQ2Z0wwSmNQRUNvWmEtcTZoYlc0UTQwSDAiLCJhdXRoRG9tYWluIjoibWF0dGVycy1kZXZlbG9wLmZpcmViYXNlYXBwLmNvbSIsImRhdGFiYXNlVVJMIjoiaHR0cHM6Ly9tYXR0ZXJzLWRldmVsb3AuZmlyZWJhc2Vpby5jb20iLCJwcm9qZWN0SWQiOiJtYXR0ZXJzLWRldmVsb3AiLCJzdG9yYWdlQnVja2V0IjoibWF0dGVycy1kZXZlbG9wLmFwcHNwb3QuY29tIiwibWVzc2FnaW5nU2VuZGVySWQiOiIzMTUzOTM5MDAzNTkiLCJhcHBJZCI6IjE6MzE1MzkzOTAwMzU5OndlYjo5OTQ5MTNiMTdiNzEyY2Y0OTk5NjYyIiwibWVhc3VyZW1lbnRJZCI6IkctNjVXWlNQU0ZTWiJ9
 NEXT_PUBLIC_FCM_VAPID_KEY=BJFhGvFS2JdnYedX1PH5mkJSROcSjYUZLyI1g71lqYc7KVAL7LYzNOPDbpFBDnSQvH_ug-clSEZfoYpkdqkNqsY
 NEXT_PUBLIC_RECAPTCHA_KEY=6Lfn4fsUAAAAACKsig4Mr54UP0Vn4ombv4zmOWJk
-NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_test_fNnNwZzGOueky052baNJzC7l
+NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_test_51GrOGRCE0HD6LY9Uo7rK3pSmiIG4KTjWO1rOrJavFFJob3zQlSjZg6uavIhcGbp8o1wZGcEuph2MgUfHhsB48vx000z2S0FiUx
 NEXT_PUBLIC_BUILD_TYPE=dynamic
 NEXT_PUBLIC_PROGRAMMABLE_SEARCH_ENGINE_ID=004538121411474993797:xkl3sdy-9su

.env.local.example

@@ -17,6 +17,6 @@ NEXT_PUBLIC_SENTRY_DSN=
 NEXT_PUBLIC_FIREBASE_CONFIG=eyJhcGlLZXkiOiJBSXphU3lBc0twb2xwSjQ2Z0wwSmNQRUNvWmEtcTZoYlc0UTQwSDAiLCJhdXRoRG9tYWluIjoibWF0dGVycy1kZXZlbG9wLmZpcmViYXNlYXBwLmNvbSIsImRhdGFiYXNlVVJMIjoiaHR0cHM6Ly9tYXR0ZXJzLWRldmVsb3AuZmlyZWJhc2Vpby5jb20iLCJwcm9qZWN0SWQiOiJtYXR0ZXJzLWRldmVsb3AiLCJzdG9yYWdlQnVja2V0IjoibWF0dGVycy1kZXZlbG9wLmFwcHNwb3QuY29tIiwibWVzc2FnaW5nU2VuZGVySWQiOiIzMTUzOTM5MDAzNTkiLCJhcHBJZCI6IjE6MzE1MzkzOTAwMzU5OndlYjo5OTQ5MTNiMTdiNzEyY2Y0OTk5NjYyIiwibWVhc3VyZW1lbnRJZCI6IkctU1NGOUs3OEgxMyJ9
 NEXT_PUBLIC_FCM_VAPID_KEY=BJFhGvFS2JdnYedX1PH5mkJSROcSjYUZLyI1g71lqYc7KVAL7LYzNOPDbpFBDnSQvH_ug-clSEZfoYpkdqkNqsY
 NEXT_PUBLIC_RECAPTCHA_KEY=6Lfn4fsUAAAAACKsig4Mr54UP0Vn4ombv4zmOWJk
-NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_test_fNnNwZzGOueky052baNJzC7l
+NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_test_51GrOGRCE0HD6LY9Uo7rK3pSmiIG4KTjWO1rOrJavFFJob3zQlSjZg6uavIhcGbp8o1wZGcEuph2MgUfHhsB48vx000z2S0FiUx
 NEXT_PUBLIC_BUILD_TYPE=dynamic
 NEXT_PUBLIC_PROGRAMMABLE_SEARCH_ENGINE_ID=004538121411474993797:xkl3sdy-9su

.env.prod

@@ -18,6 +18,6 @@ NEXT_PUBLIC_SENTRY_DSN=https://[email protected]
 NEXT_PUBLIC_FIREBASE_CONFIG=eyJhcGlLZXkiOiJBSXphU3lEajFCV2tNa2tpaXdYYkpOQUFtSFVWX3hjVGZrRnQxWGciLCJhdXRoRG9tYWluIjoibWF0dGVycy0yZGQ3OC5maXJlYmFzZWFwcC5jb20iLCJkYXRhYmFzZVVSTCI6Imh0dHBzOi8vbWF0dGVycy0yZGQ3OC5maXJlYmFzZWlvLmNvbSIsInByb2plY3RJZCI6Im1hdHRlcnMtMmRkNzgiLCJzdG9yYWdlQnVja2V0IjoibWF0dGVycy0yZGQ3OC5hcHBzcG90LmNvbSIsIm1lc3NhZ2luZ1NlbmRlcklkIjoiNzE3MTM1MDcyNTcwIiwiYXBwSWQiOiIxOjcxNzEzNTA3MjU3MDp3ZWI6ODJjNWYwNjk0MmMwMjBkYThkZDQwMyIsIm1lYXN1cmVtZW50SWQiOiJHLU05VDM2MTRRSzEifQ
 NEXT_PUBLIC_FCM_VAPID_KEY=BOcOEvNIbT_50QfTrxJt6gTUk1KRxb2eNUGUs6D362OLNUllntBu2q0cTxfpmRLAyfKw9VA08nfL2qvtOPXz7pE
 NEXT_PUBLIC_RECAPTCHA_KEY=6LfZ6uAUAAAAAAQ6m0I2hY62sRQgNQz2J9ba-5Ys
-NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_live_aL7txQvgNd3PRFxHiBak1RXu
+NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_live_NfdCmUIPzQxKEMjLkInsjULK00W7AXBBrG
 NEXT_PUBLIC_BUILD_TYPE=dynamic
 NEXT_PUBLIC_PROGRAMMABLE_SEARCH_ENGINE_ID=004538121411474993797:xkl3sdy-9su

.env.stage

@@ -18,6 +18,6 @@ NEXT_PUBLIC_SENTRY_DSN=https://[email protected]
 NEXT_PUBLIC_FIREBASE_CONFIG=eyJhcGlLZXkiOiJBSXphU3lBc0twb2xwSjQ2Z0wwSmNQRUNvWmEtcTZoYlc0UTQwSDAiLCJhdXRoRG9tYWluIjoibWF0dGVycy1kZXZlbG9wLmZpcmViYXNlYXBwLmNvbSIsImRhdGFiYXNlVVJMIjoiaHR0cHM6Ly9tYXR0ZXJzLWRldmVsb3AuZmlyZWJhc2Vpby5jb20iLCJwcm9qZWN0SWQiOiJtYXR0ZXJzLWRldmVsb3AiLCJzdG9yYWdlQnVja2V0IjoibWF0dGVycy1kZXZlbG9wLmFwcHNwb3QuY29tIiwibWVzc2FnaW5nU2VuZGVySWQiOiIzMTUzOTM5MDAzNTkiLCJhcHBJZCI6IjE6MzE1MzkzOTAwMzU5OndlYjo5OTQ5MTNiMTdiNzEyY2Y0OTk5NjYyIiwibWVhc3VyZW1lbnRJZCI6IkctNjVXWlNQU0ZTWiJ9
 NEXT_PUBLIC_FCM_VAPID_KEY=BJFhGvFS2JdnYedX1PH5mkJSROcSjYUZLyI1g71lqYc7KVAL7LYzNOPDbpFBDnSQvH_ug-clSEZfoYpkdqkNqsY
 NEXT_PUBLIC_RECAPTCHA_KEY=6Lfn4fsUAAAAACKsig4Mr54UP0Vn4ombv4zmOWJk
-NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_test_51HSaJiBOcjFRL3qUSCuP5KGzqVIOdy5RH2zVYMjShh2EEW2xYMS9CtBaOOoYQq2BpYKktaM8Y9f8LyyTQSGLbnN400AzuT83pr
+NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_test_51ITI0rKY3RzN3G1SN3FGU2jdw7Przd8qpdlMXlw1Vx796tqp7zdS4in6Yql7xgs08fCO6x0bZR1QMtZVaoM5uI7S00Hwo1ruoN
 NEXT_PUBLIC_BUILD_TYPE=dynamic
 NEXT_PUBLIC_PROGRAMMABLE_SEARCH_ENGINE_ID=004538121411474993797:xkl3sdy-9su

.github/workflows/deploy.yml

@@ -21,13 +21,13 @@ jobs:
         uses: actions/checkout@master
 
       - name: Setup Node.js
-        uses: actions/[email protected].4
+        uses: actions/[email protected].5
         with:
           node-version: '12.16'
 
       - name: Cache Dependencies
         id: cache
-        uses: actions/cache@v2
+        uses: actions/cache@v2.1.4
         with:
           path: ~/.npm
           key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
@@ -104,7 +104,7 @@ jobs:
 
       - name: Deploy to EB (develop)
         if: github.ref == 'refs/heads/develop'
-        uses: einaregilsson/beanstalk-deploy@v14
+        uses: einaregilsson/beanstalk-deploy@v16
         with:
           aws_access_key: ${{ secrets.AWS_ACCESS_KEY_ID }}
           aws_secret_key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
@@ -125,7 +125,7 @@ jobs:
 
       - name: Deploy to EB (stage)
         if: github.ref == 'refs/heads/stage'
-        uses: einaregilsson/beanstalk-deploy@v14
+        uses: einaregilsson/beanstalk-deploy@v16
         with:
           aws_access_key: ${{ secrets.AWS_ACCESS_KEY_ID }}
           aws_secret_key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
@@ -146,7 +146,7 @@ jobs:
 
       - name: Deploy to EB (production)
         if: github.ref == 'refs/heads/master'
-        uses: einaregilsson/beanstalk-deploy@v14
+        uses: einaregilsson/beanstalk-deploy@v16
         with:
           aws_access_key: ${{ secrets.AWS_ACCESS_KEY_ID }}
           aws_secret_key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}

.github/workflows/storybook.yml

@@ -0,0 +1,88 @@
+name: Build and Deploy Storybook
+
+on:
+  pull_request:
+    branches:
+      - '*'
+
+jobs:
+  build-and-deploy-storybook:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@master
+
+      - name: Setup Node.js
+        uses: actions/[email protected]
+        with:
+          node-version: '12.16'
+
+      - name: Cache Dependencies
+        id: cache
+        uses: actions/[email protected]
+        with:
+          path: ~/.npm
+          key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}
+          restore-keys: |
+            ${{ runner.os }}-node-
+
+      - name: Install Dependencies
+        run: npm ci
+
+      - name: Generate Types
+        if: github.ref == 'refs/heads/develop' || github.base_ref == 'develop'
+        run: |
+          npm run gen:clean \
+          && npm run gen:type
+
+      - name: Generate Types
+        if: github.ref == 'refs/heads/stage' || github.base_ref == 'stage'
+        run: |
+          npm run gen:clean \
+          && npm run gen:type
+
+      - name: Generate Types (production)
+        if: github.ref == 'refs/heads/master' || github.base_ref == 'master'
+        run: |
+          npm run gen:clean \
+          && npm run gen:type:prod
+
+      - name: Build
+        run: npm run build-storybook
+
+      - name: Deploy
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./storybook-static
+          destination_dir: ./storybook/${{ github.head_ref }}
+          keep_files: true
+
+      - name: Find Comment
+        uses: peter-evans/find-comment@v1
+        id: fc
+        with:
+          issue-number: ${{ github.event.pull_request.number }}
+          comment-author: 'github-actions[bot]'
+          body-includes: Storybook
+
+      - name: Create Comment
+        if: ${{ steps.fc.outputs.comment-id == 0 }}
+        uses: peter-evans/create-or-update-comment@v1
+        with:
+          issue-number: ${{ github.event.pull_request.number }}
+          body: |
+            🚀 Storybook has been deployed to GitHub Pages!
+
+            **URL**: https://thematters.github.io/matters-web/storybook/${{ github.head_ref }}
+
+      - name: Update comment
+        if: ${{ steps.fc.outputs.comment-id != 0 }}
+        uses: peter-evans/create-or-update-comment@v1
+        with:
+          comment-id: ${{ steps.fc.outputs.comment-id }}
+          body: |
+            🚀 Storybook has been deployed to GitHub Pages!
+
+            **URL**: https://thematters.github.io/matters-web/storybook/${{ github.head_ref }}
+          edit-mode: replace

.github/workflows/test.yml

@@ -13,13 +13,13 @@ jobs:
         uses: actions/checkout@master
 
       - name: Setup Node.js
-        uses: actions/[email protected].4
+        uses: actions/[email protected].5
         with:
           node-version: '12.16'
 
       - name: Cache Dependencies
         id: cache
-        uses: actions/cache@v2
+        uses: actions/cache@v2.1.4
         with:
           path: ~/.npm
           key: ${{ runner.os }}-node-${{ hashFiles('**/package-lock.json') }}

.storybook/.babelrc

@@ -0,0 +1,3 @@
+{
+  "extends": "../.babelrc"
+}

.storybook/main.js

@@ -4,7 +4,11 @@ const { mergeWithCustomize } = require('webpack-merge')
 
 module.exports = {
   stories: ['../src/**/*.stories.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
-  addons: ['@storybook/addon-links', '@storybook/addon-essentials'],
+  addons: [
+    '@storybook/addon-links',
+    '@storybook/addon-essentials',
+    '@storybook/addon-a11y',
+  ],
   /*
     Next.js automatically supports the tsconfig.json "paths" and "baseUrl"
     options but the webpack configuration of Storybook doesn't yet.

.storybook/preview.js

@@ -1,10 +1,15 @@
 import React from 'react'
 import { RouterContext } from 'next/dist/next-server/lib/router-context'
+import { INITIAL_VIEWPORTS } from '@storybook/addon-viewport'
 
 import { GlobalStyles } from '../src/components/GlobalStyles'
 
 export const parameters = {
   actions: { argTypesRegex: '^on[A-Z].*' },
+  viewport: {
+    viewports: INITIAL_VIEWPORTS,
+    defaultViewport: 'iphonex',
+  },
 }
 
 export const decorators = [