Merge pull request #444 from cofacts/github-actions

Add github workflow
cofacts · Aug 22, 2021 · 07c6a23 · 07c6a23
2 parents 5531367 + 21d8e60
commit 07c6a23
Show file tree

Hide file tree

Showing 8 changed files with 144 additions and 44 deletions.
diff --git a/.github/workflows/build-and-push.yml b/.github/workflows/build-and-push.yml
@@ -0,0 +1,66 @@
+name: Build and push to docker
+
+# Controls when the action will run.
+on:
+  # Triggers the workflow on push or pull request events but only for the dev branch
+  push:
+    tags:
+      - release/*
+    branches:
+      - master
+
+  # Allows you to run this workflow manually from the Actions tab
+  workflow_dispatch:
+
+# A workflow run is made up of one or more jobs that can run sequentially or in parallel
+jobs:
+  # This workflow contains a single job called "build"
+  build-and-push:
+    # The type of runner that the job will run on
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        locales:
+          - locale: en_US
+            postfix: -en
+          - locale: zh_TW
+            postfix: -tw
+          - locale: ja
+            postfix: -ja
+    env:
+      RELEASE_TAG: ${{ startsWith(github.ref, 'refs/tags/release') && 'latest' || 'dev' }}
+
+    # Steps represent a sequence of tasks that will be executed as part of the job
+    steps:
+      - name: Echo RELEASE_TAG
+        run: 'echo $RELEASE_TAG'
+
+      - name: Checkout repo
+        uses: actions/checkout@v2
+
+      - name: Login to Docker Hub
+        uses: docker/login-action@v1
+        with:
+          username: ${{ secrets.DOCKER_HUB_USERNAME }}
+          password: ${{ secrets.DOCKER_HUB_ACCESS_TOKEN }}
+
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v1
+
+      - name: Build and push
+        id: docker_build
+        uses: docker/build-push-action@v2
+        with:
+          context: ./
+          file: ./Dockerfile
+          push: true
+          tags: cofacts/rumors-site:${{ env.RELEASE_TAG }}${{ matrix.locales.postfix }}
+          build-args: |
+            APP_ID=RUMORS_SITE
+            LOCALE=${{ matrix.locales.locale }}
+          cache-from: type=gha
+          cache-to: type=gha,mode=max
+
+      - name: Image digest
+        run: echo ${{ steps.docker_build.outputs.digest }}
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -0,0 +1,26 @@
+name: CI test
+
+on:
+  # Triggers the workflow on push or pull request events but only for the dev branch
+  - pull_request
+  - push
+  # Allows you to run this workflow manually from the Actions tab
+  - workflow_dispatch
+
+jobs:
+  install-and-test:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2
+        with:
+          node-version: '16'
+          cache: 'npm'
+      - run: npm ci
+      - run: npm run lint
+      - run: npm run i18n:validate
+      - run: npm run test -- --coverage
+      - name: Update coveralls
+        uses: coverallsapp/github-action@master
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
diff --git a/.travis.yml b/.travis.yml
diff --git a/README.md b/README.md
@@ -1,6 +1,6 @@
 # rumors-site
 
-[![Build Status](https://travis-ci.org/cofacts/rumors-site.svg?branch=master)](https://travis-ci.org/cofacts/rumors-site) [![Coverage Status](https://coveralls.io/repos/github/cofacts/rumors-site/badge.svg?branch=master)](https://coveralls.io/github/cofacts/rumors-site?branch=master)
+[![CI test](https://github.com/cofacts/rumors-site/actions/workflows/ci.yml/badge.svg)](https://github.com/cofacts/rumors-site/actions/workflows/ci.yml) [![Coverage Status](https://coveralls.io/repos/github/cofacts/rumors-site/badge.svg?branch=master)](https://coveralls.io/github/cofacts/rumors-site?branch=master)
 
 Rumors list / creation UI, with server-side rendering.
 
@@ -34,11 +34,13 @@ See: https://github.com/zeit/styled-jsx#syntax-highlighting
 Build docker image.
 
 ``` bash
-# build
-$ IMAGE_NAME=rumors-site-test hooks/build
+# build en version
+$ docker build --build-arg APP_ID=RUMORS_SITE --build-arg LOCALE=en_US -t rumors-site-test-tw
+# build tw version
+$ docker build --build-arg APP_ID=RUMORS_SITE --build-arg LOCALE=zh_TW -t rumors-site-test-tw
 ```
 
-This will build both `$IMAGE_NAME-en` and `$IMAGE_NAME-tw` image.
+This will build both `rumors-site-test` image.
 
 Run the docker image on local machine, then visit `http://localhost:3000`.
 
@@ -50,8 +52,6 @@ $ docker run --rm --env-file .env -e NODE_ENV=production -p 3000:3000 rumors-sit
 $ docker run --rm --env-file .env -e NODE_ENV=production -p 3000:3000 rumors-site-test-tw
 ```
 
-On [docker hub](https://hub.docker.com/r/cofacts/rumors-site), `hooks/build` is automatically executed on `master` branch.
-
 ### Storybook
 We use storybook to demonstrate components.
 ```bash
@@ -127,7 +127,6 @@ You will need to change the following to reflect the locale change:
 
 - `i18n:extract` script in `package.json`
 - `i18n:validate` script in `package.json`
-- `hooks/build` script & `hooks/push` script, with correct LOCALE setup and image tags
 
 ### Building in different languages
 
@@ -136,7 +135,7 @@ By default, the chatbot will be built under `en_US` locale.
 During development, changing `LOCALE` in `.env` allows you to spin up dev server under a specific locale.
 Please set `LOCALE` to one of `en_US`, `zh_TW` or any other language code that exists under `i18n/` directory.
 
-When building using Docker, `LOCALE` can be provided via build args. See `hooks/build` for the command to use.
+When building using Docker, `LOCALE` can be provided via build args.
 
 ## Legal
 

diff --git a/components/ListPageDisplays/__snapshots__/ListPageCards.stories.storyshot b/components/ListPageDisplays/__snapshots__/ListPageCards.stories.storyshot
@@ -117,7 +117,17 @@ exports[`Storyshots ListPageDisplays/ListPageCards Article Cards 1`] = `
           "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris eu ex augue. Etiam posuere sagittis iaculis. Vestibulum sollicitudin nec felis a mollis. Phasellus ut est velit. Proin fermentum arcu ornare quam vulputate, vel eleifend velit ultrices. Fusce tincidunt vel urna at luctus.",
         }
       }
-      query="dolor sit amet"
+      highlight={
+        Object {
+          "hyperlinks": Array [
+            Object {
+              "summary": "<HIGHLIGHT>Mauris eu ex augue</HIGHLIGHT>. Etiam posuere sagittis iaculis.",
+              "title": "<HIGHLIGHT>Lorem ipsum</HIGHLIGHT> dolor sit amet",
+            },
+          ],
+          "text": "<HIGHLIGHT>Lorem ipsum</HIGHLIGHT> dolor sit amet, consectetur adipiscing elit. <HIGHLIGHT>Mauris eu ex augue</HIGHLIGHT>. Etiam posuere sagittis iaculis. Vestibulum sollicitudin nec felis a mollis. Phasellus ut est velit. Proin fermentum arcu ornare quam vulputate, vel eleifend velit ultrices. Fusce tincidunt vel urna at luctus.",
+        }
+      }
     >
       <Link
         as="/article/id2"
@@ -200,14 +210,39 @@ exports[`Storyshots ListPageDisplays/ListPageCards Article Cards 1`] = `
                         }
                       }
                     >
-                      Lorem ipsum 
-                      <span
+                      <mark
+                        className="makeStyles-highlight"
+                        key="highlight-0"
+                      >
+                        Lorem ipsum
+                      </mark>
+                       dolor sit amet, consectetur adipiscing elit. 
+                      <mark
                         className="makeStyles-highlight"
                         key="highlight-1"
                       >
-                        dolor sit amet
-                      </span>
-                      , consectetur adipiscing elit. Mauris eu ex augue. Etiam posuere sagittis iaculis. Vestibulum sollicitudin nec felis a mollis. Phasellus ut est velit. Proin fermentum arcu ornare quam vulputate, vel eleifend velit ultrices. Fusce tincidunt vel urna at luctus.
+                        Mauris eu ex augue
+                      </mark>
+                      . Etiam posuere sagittis iaculis. Vestibulum sollicitudin nec felis a mollis. Phasellus ut est velit. Proin fermentum arcu ornare quam vulputate, vel eleifend velit ultrices. Fusce tincidunt vel urna at luctus.
+                      <section
+                        className="makeStyles-hyperlinks"
+                        key="hyperlink-section-0"
+                      >
+                        <mark
+                          className="makeStyles-highlight"
+                          key="highlight-0"
+                        >
+                          Lorem ipsum
+                        </mark>
+                         dolor sit amet 
+                        <mark
+                          className="makeStyles-highlight"
+                          key="highlight-1"
+                        >
+                          Mauris eu ex augue
+                        </mark>
+                        . Etiam posuere sagittis iaculis.
+                      </section>
                     </div>
                   </div>
                 </ExpandableText>

diff --git a/components/ReportPage/__snapshots__/ActionButton.stories.storyshot b/components/ReportPage/__snapshots__/ActionButton.stories.storyshot
@@ -9,7 +9,7 @@ exports[`Storyshots ReportPage/ActionButton Default 1`] = `
   }
 >
   <button
-    className="MuiButtonBase-root-1170 MuiButton-root-1141 MuiButton-outlined-1146 makeStyles-button"
+    className="MuiButtonBase-root-1173 MuiButton-root-1144 MuiButton-outlined-1149 makeStyles-button"
     disabled={false}
     onBlur={[Function]}
     onDragLeave={[Function]}
@@ -31,13 +31,13 @@ exports[`Storyshots ReportPage/ActionButton Default 1`] = `
     type="button"
   >
     <span
-      className="MuiButton-label-1142"
+      className="MuiButton-label-1145"
     >
       Action button text
       <Arrow>
         <svg
           aria-hidden="true"
-          className="MuiSvgIcon-root-1173"
+          className="MuiSvgIcon-root-1176"
           focusable="false"
           viewBox="0 0 14 27"
         >
@@ -52,7 +52,7 @@ exports[`Storyshots ReportPage/ActionButton Default 1`] = `
     </span>
     <NoSsr>
       <span
-        className="MuiTouchRipple-root-1182"
+        className="MuiTouchRipple-root-1185"
       >
         <TransitionGroup
           childFactory={[Function]}

diff --git a/hooks/build b/hooks/build
diff --git a/hooks/push b/hooks/push