chore: release 1.0.0-rc.10

.github/workflows/conventional-pr-name.yml

@@ -12,14 +12,13 @@ jobs:
     name: Validate PR Title (conventional-commit)
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v1
-
+      - uses: actions/checkout@v3
       - name: Setup node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: "16"
 
       - name: Install Dependencies
-        run: yarn
+        run: rm package.json && npm i @commitlint/config-conventional
 
-      - uses: JulienKode/pull-request-name-linter-action@v0.2.0
+      - uses: JulienKode/pull-request-name-linter-action@v0.5.0

.github/workflows/deploy-vue-storefront-cloud.yml

@@ -8,15 +8,62 @@ on:
       - release/*
 
 jobs:
+  create-deployment:
+    runs-on: ubuntu-latest
+    outputs:
+      environment-name: ${{ steps.determine-environment.outputs.name }}
+      environment-code: ${{ steps.determine-environment.outputs.code }}
+      deployment_id: ${{ steps.deployment.outputs.deployment_id }}
+    steps:
+      - name: Determine environment name
+        id: determine-environment
+        shell: bash
+        run: |
+          REF=${{ github.ref }}
+
+          if [ $REF = 'refs/heads/main' ]; then
+            ENVNAME='production'
+            ENVCODE='demo-magento2'
+
+          elif [ $REF = 'refs/heads/develop' ]; then
+            ENVNAME='dev'
+            ENVCODE='demo-magento2-dev'
+
+          elif [[ $REF = refs/heads/release* ]]; then
+            ENVNAME='canary'
+            ENVCODE='demo-magento2-canary'
+
+          elif [ $REF = 'refs/heads/enterprise' ]; then
+            ENVNAME='enterprise'
+            ENVCODE='demo-magento2-enterprise'
+
+          else
+              echo 'unrecognized branch name'
+              exit 1
+          fi
+
+          echo ::set-output name=name::$ENVNAME
+          echo ::set-output name=code::$ENVCODE
+
+      - name: Create GitHub deployment
+        id: deployment
+        uses: chrnorm/deployment-action@v2
+        with:
+          token: ${{ secrets.DEPLOYMENT_PERSONAL_ACCESS_TOKEN }}
+          environment: ${{ steps.determine-environment.outputs.name }}
+          initial-status: in_progress
   build:
+    needs: create-deployment
     runs-on: ubuntu-latest
     steps:
       - name: Checkout code
         uses: actions/checkout@v1
+
       - name: Setup node
         uses: actions/setup-node@v1
         with:
           node-version: 16.x
+
       - name: Build and publish docker image
         uses: elgohr/Publish-Docker-Github-Action@master
         with:
@@ -53,66 +100,44 @@ jobs:
           VSF_REDIS_CACHE_INVALIDATE_KEY: magento2vsf2
           VSF_REDIS_CACHE_INVALIDATE_URL: /cache-invalidate
 
-          VSF_RECAPTCHA_ENABLED: false
-          VSF_RECAPTCHA_HIDE_BADGE: false
+          VSF_RECAPTCHA_ENABLED: true
           VSF_RECAPTCHA_VERSION: 3
           VSF_RECAPTCHA_SIZE: invisible
-          VSF_RECAPTCHA_MIN_SCORE: 0.5
+          VSF_RECAPTCHA_MIN_SCORE: 1.0
           VSF_RECAPTCHA_SITE_KEY: 6Ldce0EeAAAAAAGGtGWG-e-SygXiFub6PXHT5fKd
           VSF_RECAPTCHA_SECRET_KEY: ${{ secrets.RECAPTCHA_SECRET_KEY }}
 
           VSF_SENTRY_DSN: ${{ secrets.SENTRY_DSN }}
 
           LAST_COMMIT: ${{ github.sha  }}
 
-  deploy-main:
+  deploy:
+    needs: [create-deployment, build]
     uses: ./.github/workflows/deployment-template.yml
-    needs: build
-    if: github.ref == 'refs/heads/main'
     with:
-      github_environment_name: production
-      environment_code: demo-magento2
-      target_url: https://demo-magento2.europe-west1.gcp.storefrontcloud.io
+      environment-code: ${{ needs.create-deployment.outputs.environment-code }}
     secrets:
-      cloud_username: ${{ secrets.CLOUD_USERNAME }}
-      cloud_password: ${{ secrets.CLOUD_PASSWORD }}
-      deployment_status_token: ${{ secrets.DEPLOYMENT_PERSONAL_ACCESS_TOKEN }}
+      cloud-username: ${{ secrets.CLOUD_USERNAME }}
+      cloud-password: ${{ secrets.CLOUD_PASSWORD }}
 
-  deploy-develop:
-    uses: ./.github/workflows/deployment-template.yml
-    needs: build
-    if: github.ref == 'refs/heads/develop'
-    with:
-      github_environment_name: dev
-      environment_code: demo-magento2-dev
-      target_url: https://demo-magento2-dev.europe-west1.gcp.storefrontcloud.io
-    secrets:
-      cloud_username: ${{ secrets.CLOUD_USERNAME }}
-      cloud_password: ${{ secrets.CLOUD_PASSWORD }}
-      deployment_status_token: ${{ secrets.DEPLOYMENT_PERSONAL_ACCESS_TOKEN }}
 
-  deploy-release:
-    uses: ./.github/workflows/deployment-template.yml
-    needs: build
-    if: startsWith(github.ref, 'refs/heads/release')
-    with:
-      github_environment_name: canary
-      environment_code: demo-magento2-canary
-      target_url: https://demo-magento2-canary.europe-west1.gcp.storefrontcloud.io
-    secrets:
-      cloud_username: ${{ secrets.CLOUD_USERNAME }}
-      cloud_password: ${{ secrets.CLOUD_PASSWORD }}
-      deployment_status_token: ${{ secrets.DEPLOYMENT_PERSONAL_ACCESS_TOKEN }}
+  finalize-deployment:
+    runs-on: ubuntu-latest
+    needs: [create-deployment, build, deploy]
+    if: always()
+    steps:
+      - name: Update deployment status (success)
+        if: ${{ !(contains(join(needs.*.result, ','), 'failure') || contains(join(needs.*.result, ','), 'cancelled')) }}
+        uses: chrnorm/deployment-status@v2
+        with:
+          token: ${{ secrets.DEPLOYMENT_PERSONAL_ACCESS_TOKEN }}
+          deployment-id: ${{ needs.create-deployment.outputs.deployment_id }}
+          state: success
 
-  deploy-enterprise:
-    uses: ./.github/workflows/deployment-template.yml
-    needs: build
-    if: github.ref == 'refs/heads/enterprise'
-    with:
-      github_environment_name: enterprise
-      environment_code: demo-magento2-enterprise
-      target_url: https://demo-magento2-enterprise.europe-west1.gcp.storefrontcloud.io
-    secrets:
-      cloud_username: ${{ secrets.CLOUD_USERNAME }}
-      cloud_password: ${{ secrets.CLOUD_PASSWORD }}
-      deployment_status_token: ${{ secrets.DEPLOYMENT_PERSONAL_ACCESS_TOKEN }}
+      - name: Update deployment status (failure)
+        if: ${{ contains(join(needs.*.result, ','), 'failure') || contains(join(needs.*.result, ','), 'cancelled')  }}
+        uses: chrnorm/deployment-status@v2
+        with:
+          token: ${{ secrets.DEPLOYMENT_PERSONAL_ACCESS_TOKEN }}
+          deployment-id: ${{ needs.create-deployment.outputs.deployment_id }}
+          state: failure

.github/workflows/deployment-template.yml

@@ -2,42 +2,23 @@
 on:
   workflow_call:
     inputs:
-      github_environment_name:
+      environment-code:
         required: true
         type: string
 
-      environment_code:
-        required: true
-        type: string
-
-      target_url:
-        required: true
-        type: string
     secrets:
-       cloud_username:
+       cloud-username:
          required: true
-       cloud_password:
+       cloud-password:
          required: true
-       deployment_status_token: # can be ${{ github.token }}
-         required: true
-
 
 jobs:
   deploy:
     runs-on: ubuntu-latest
     steps:
-      - uses: chrnorm/deployment-action@releases/v1
-        name: Create GitHub deployment
-        id: deployment
-        with:
-          token: ${{ secrets.deployment_status_token }}
-          environment: ${{ inputs.github_environment_name }}
-          initial_status: in_progress
-          target_url: ${{ inputs.target_url }}
-      - name: Deploy on ${{ inputs.target_url }}
-        run: |
-          if curl -s -H 'X-User-Id: ${{ secrets.cloud_username }}'  -H 'X-Api-Key: ${{ secrets.cloud_password }}' -H 'Content-Type: application/json' -X POST -d '{
-              "code":"${{ inputs.environment_code }}",
+      - run: |
+          if curl -s -H 'X-User-Id: ${{ secrets.cloud-username }}'  -H 'X-Api-Key: ${{ secrets.cloud-password }}' -H 'Content-Type: application/json' -X POST -d '{
+              "code":"${{ inputs.environment-code }}",
               "region":"europe-west1.gcp",
               "frontContainerVersion":"${{ github.sha }}"
             }' https://farmer.storefrontcloud.io/instances | grep -q '{"code":200,"result":"Instance updated!"}'; then
@@ -47,23 +28,9 @@ jobs:
             exit 1
           fi
 
-      - name: Update deployment status (success)
-        if: success()
-        uses: chrnorm/deployment-status@releases/v1
-        with:
-          token: ${{ secrets.deployment_status_token }}
-          target_url: ${{ inputs.target_url }}
-          state: success
-          description: Congratulations! The deploy is done.
-          deployment_id: ${{ steps.deployment.outputs.deployment_id }}
-
-      - name: Update deployment status (failure)
-        if: failure()
-        uses: chrnorm/deployment-status@releases/v1
-        with:
-          token: ${{ secrets.deployment_status_token }}
-          target_url: ${{ inputs.target_url }}
-          description: Unfortunately, the instance hasn't been updated.
-          state: failure
-          deployment_id: ${{ steps.deployment.outputs.deployment_id }}
-
+        # the above curl only *asks* for the container to be deployed
+        # we don't know when the newly built Docker image replaces the old one
+        # but it takes less than 5 minutes
+      - name: 'Wait for container deployed on VSF Cloud to come online'
+        run: 'sleep 300'
+        shell: 'bash'

.github/workflows/publish-npm.yml

@@ -18,7 +18,7 @@ jobs:
         uses: actions/checkout@v2
 
       - name: Setup node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: "16"
           registry-url: "https://registry.npmjs.org/"

.github/workflows/speedcurve.yml

@@ -8,10 +8,6 @@ jobs:
     if: github.event.deployment_status.state == 'success' && github.event.deployment.ref == 'refs/heads/develop'
     runs-on: ubuntu-latest
     steps:
-      - name: 'Wait for container deployed on VSF Cloud to come online'
-        run: 'sleep 300'
-        shell: 'bash'
-
       - name: Shorten deployment commit SHA
         id: vars
         shell: bash

.github/workflows/test.yml

@@ -25,10 +25,9 @@ jobs:
         uses: actions/checkout@v2
 
       - name: Setup node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: '16.13.0'
-          cache: 'yarn'
 
       - name: Install dependencies
         run: yarn install

.vuestorefrontcloud/docker/Dockerfile

@@ -62,7 +62,7 @@ ENV VSF_RECAPTCHA_VERSION=${VSF_RECAPTCHA_VERSION}
 ENV VSF_RECAPTCHA_SIZE=${VSF_RECAPTCHA_SIZE}
 ENV VSF_RECAPTCHA_MIN_SCORE=${VSF_RECAPTCHA_MIN_SCORE}
 ENV VSF_RECAPTCHA_SITE_KEY=${VSF_RECAPTCHA_SITE_KEY}
-ENV VSF_RECAPTCHA_SECRET_KEY=${VSF_RECAPTCHA_SITE_KEY}
+ENV VSF_RECAPTCHA_SECRET_KEY=${VSF_RECAPTCHA_SECRET_KEY}
 
 RUN npm config set @vsf-enterprise:registry=https://registrynpm.storefrontcloud.io
 

.vuestorefrontcloud/docker/nuxt.config.additional.js

@@ -7,7 +7,7 @@ export default () => {
     ...baseDefaults,
     modules: [
       ...baseDefaults.modules,
-      '@nuxtjs/sentry'
+      '@nuxtjs/sentry',
     ],
     sentry: {
       dsn: process.env.VSF_SENTRY_DSN,

docs/.vuepress/config.js

@@ -63,6 +63,18 @@ module.exports = {
     '@vuepress/active-header-links',
     '@vuepress/search',
   ],
+
+  /**
+   * Ref: https://v1.vuepress.vuejs.org/config/#markdown
+   */
+   markdown: {
+    extendMarkdown: md => {
+      md.use(require('markdown-it-video'), {
+        youtube: { width: 740, height: 416.25 }, // 16:9 ratio, where 740px is the width of the page content
+      });
+    }
+  },
+
   themeConfig: {
     GTM_TAG,
     sidebarDepth: 0,
@@ -91,14 +103,26 @@ module.exports = {
         ],
       },
       {
-        title: 'Getting started',
+        title: 'Installation & Setup',
         collapsable: false,
         children: [
-          ['/getting-started/installation', 'Installation'],
-          ['/getting-started/configure-magento', 'Configuring Magento'],
-          ['/getting-started/configure-integration', 'Configuring Vue Storefront'],
+          ['/installation-setup/installation', 'Installation'],
+          ['/installation-setup/configure-magento', 'Configuring Magento'],
+          ['/installation-setup/configure-integration', 'Configuring Vue Storefront'],
         ],
       },
+      {
+        title: 'Getting started',
+        collapsable: false,
+        children: [
+          ['/getting-started/introduction', 'Introduction'],
+          ['/getting-started/project-structure', 'Project structure'],
+          ['/getting-started/configuration', 'Configuration'],
+          ['/getting-started/layouts-and-routing', 'Layouts and Routing'],
+          ['/getting-started/theme', 'Theme'],
+          ['/getting-started/internationalization', 'Internationalization']
+        ]
+      },
       {
         title: 'Composition',
         collapsable: false,