Split CI into discrete jobs (#981)

* Split CI into discrete jobs

* Update outdated POT file

* Skip writing POT file if the only thing changing is the date

* Format yaml

* Add yaml to lint staged

* Get locales when setting up node env

* Cram it all into a single workflow

* Add getting translations

.github/actions/setup-node-env/action.yml

@@ -0,0 +1,39 @@
+name: openverse-frontend/setup-node-env
+description: Setup the Node.js environment including `pnpm` and dependencies
+
+inputs:
+  install:
+    default: true
+    description: Whether to install dependencies.
+
+runs:
+  using: "composite"
+  steps:
+    - uses: pnpm/action-setup@v2.0.1
+      with:
+        version: 6.30.1
+
+    - name: Cache pnpm modules
+      uses: actions/cache@v2
+      with:
+        path: ~/.pnpm-store
+        key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
+        restore-keys: |
+          ${{ runner.os }}-
+
+    - uses: actions/setup-node@v2.5.1
+      with:
+        node-version: 16
+        cache: pnpm
+        cache-dependency-path: |
+          pnpm-lock.yaml
+          .npmrc
+
+    - name: Install
+      if: inputs.install
+      shell: bash
+      run: "pnpm install"
+
+    - name: Get locales
+      shell: bash
+      run: "pnpm i18n:create-locales-list && pnpm i18n:update-locales && pnpm i18n:get-translations"

.github/workflows/ci.yml

@@ -1,56 +1,103 @@
-name: openverse-frontend-ci
+name: CI
 
 on:
   push:
-    branches:
-      - main
+    branches: -main
   pull_request:
-    branches:
-      - main
-      - audio
 
 jobs:
-  ci:
-    name: Run CI tests
+  types:
+    name: Check types
     runs-on: ubuntu-latest
 
     steps:
       - uses: actions/checkout@v2
 
-      - name: Setup Node.js
-        uses: actions/setup-node@v1
-        with:
-          node-version: "16.13.0"
-
-      - name: Cache Node.js modules
-        uses: actions/cache@v2
-        with:
-          path: ~/.pnpm-store
-          key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
-          restore-keys: |
-            ${{ runner.os }}-
-
-      - uses: pnpm/action-setup@v2.0.1
-        with:
-          version: 6.24.0
-          run_install: |
-            - recursive: true
-              args: [--frozen-lockfile]
-
-      - name: Run lint
+      - uses: ./.github/actions/setup-node-env
+
+      - name: Check types
+        run: pnpm types
+
+  lint:
+    name: Lint files
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v2
+
+      - uses: ./.github/actions/setup-node-env
+
+      - name: ESLint
         run: pnpm lint
 
-      - name: Run formatting test
+      - name: Prettier
         run: pnpm format:test
 
-      - name: Run tests
-        run: pnpm i18n:get-translations && pnpm test:unit
+  i18n:
+    name: Check translation files
+    runs-on: ubuntu-latest
 
-      - name: Run Storybook smoke-test
-        run: pnpm storybook -- --ci --smoke-test
+    steps:
+      - uses: actions/checkout@v2
+
+      - uses: ./.github/actions/setup-node-env
+
+      - name: Check extracted strings
+        run: pnpm vue-i18n-check
+
+      - name: Check POT files are updated
+        shell: bash
+        run: |
+          pnpm i18n:generate-pot
+          exit $(git status -s -uno | wc -l)
+
+  unit:
+    name: Unit tests
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v2
+
+      - uses: ./.github/actions/setup-node-env
+
+      - name: Run unit tests
+        run: pnpm test
+
+  e2e:
+    name: E2E tests
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v2
+
+      - uses: ./.github/actions/setup-node-env
 
       - name: Install E2E browsers
         run: pnpx playwright install
 
-      - name: Run E2E
+      - name: Run E2E tests
         run: pnpm e2e:ci
+
+  storybook:
+    name: Check Storybook build
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v2
+
+      - uses: ./.github/actions/setup-node-env
+
+      - name: Run Storybook smoke-test
+        run: pnpm storybook -- --ci --smoke-test
+
+  build:
+    name: Check Nuxt build
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v2
+
+      - uses: ./.github/actions/setup-node-env
+
+      - name: Run build
+        run: pnpm build

.github/workflows/gh-pages.yaml

@@ -14,31 +14,7 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v2
 
-      # setup node.js environment and npm
-      - name: Setup Node environment
-        uses: actions/setup-node@v2
-        with:
-          node-version: '16.x'
-
-      - name: Cache dependencies
-        uses: actions/cache@v2
-        with:
-          path: ~/.pnpm-store
-          key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
-          restore-keys: |
-            ${{ runner.os }}-
-
-      - name: Setup pnpm
-        uses: pnpm/action-setup@v2.0.1
-        with:
-          version: 6.24.0
-          # Set this to false because we want to be able to skip installation if there is a cache hit in the next step
-          run_install: false
-
-      # install dependencies only if the cache is not present
-      - name: Install dependencies
-        if: steps.cache-node-modules.outputs.cache-hit != 'true'
-        run: pnpm install --frozen-lockfile
+      - uses: ./.github/actions/setup-node-env
 
       - name: Fetch translation files
         run: pnpm i18n:get-translations

.lintstagedrc

@@ -2,10 +2,7 @@
   "*.{ts,js,vue}": [
     "eslint --fix"
   ],
-  ".{ts,js,vue,json}": [
-    "prettier --write"
-  ],
-  "*.mdx": [
+  "*.{ts,js,vue,json,yml,yaml,mdx}": [
     "prettier --write"
   ]
 }

src/locales/po-files/openverse.pot

@@ -4,7 +4,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: Openverse \n"
 "Report-Msgid-Bugs-To: https://github.com/wordpress/openverse/issues \n"
-"POT-Creation-Date: 2022-02-22T03:29:50+00:00\n"
+"POT-Creation-Date: 2022-02-22T15:15:29+00:00\n"
 "MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"

src/locales/scripts/json-to-pot.js

@@ -2,8 +2,21 @@ const json = require('../en.json')
 const fs = require('fs')
 const { createPotFile } = require('./json-pot-helpers')
 
+const matchPotCreationDate = /^"POT-Creation-Date: .*\\n"$/gm
+
 try {
   const fileName = process.cwd() + '/src/locales/po-files/openverse.pot'
+  const existingPotFile = String(fs.readFileSync(fileName)).replace(
+    matchPotCreationDate,
+    ''
+  )
+  const potFile = createPotFile(json)
+
+  if (existingPotFile === potFile.replace(matchPotCreationDate, '')) {
+    console.log('No change detected in pot file, skipping write')
+    return process.exit(0)
+  }
+
   fs.writeFileSync(fileName, createPotFile(json))
   console.log(`Successfully wrote pot file to ${fileName}`)
 } catch (err) {