Merge branch 'v2-mst-aptd-gcms-lcz-sty' into custom-actions-trigger

.eslintrc.yml

@@ -81,14 +81,20 @@ rules: # See https://eslint.org/docs/rules
   linebreak-style:
     - error
     - unix
-  '@typescript-eslint/ban-ts-ignore': warn # ts-ignore are sometimes the only way to bypass a TS issue, we trust we will use them for good and not abuse them
+  '@typescript-eslint/ban-ts-comment': warn # ts-ignore are sometimes the only way to bypass a TS issue, we trust we will use them for good and not abuse them
   '@typescript-eslint/no-use-before-define': warn
   '@typescript-eslint/no-unused-vars':
     - warn
     -
       vars: 'all' # We don't want unused variables (noise) - XXX Note that this will be a duplicate of "no-unused-vars" rule
       args: 'none' # Sometimes it's useful to have unused arguments for later use, such as describing what args are available (DX)
       ignoreRestSiblings: true # Sometimes it's useful to have unused props for later use, such as describing what props are available (DX)
+  '@typescript-eslint/ban-types':
+    - error
+    -
+      extendDefaults: true
+      types:
+        '{}': false # Allow writing `type Props = {}` - See https://github.com/typescript-eslint/typescript-eslint/issues/2063#issuecomment-632833366
 overrides:
   - files: ['**/*.tsx']
     rules:

.github/workflows/deploy-zeit-staging.yml

@@ -86,10 +86,10 @@ jobs:
           # Build alias url and create Vercel alias
           ZEIT_DEPLOYMENT_ALIAS=$ZEIT_DEPLOYMENT_ALIAS.vercel.app
           echo "::set-env name=ZEIT_DEPLOYMENT_ALIAS::https://$ZEIT_DEPLOYMENT_ALIAS"
-          echo "Alias domain: " $ZEIT_DEPLOYMENT_ALIAS
+          echo "Alias domain: "$ZEIT_DEPLOYMENT_ALIAS
           echo "Aliasing the deployment using the git branch alias:"
-          echo "npx now alias " $ZEIT_DEPLOYMENT_URL " https://" $ZEIT_DEPLOYMENT_ALIAS
-          npx now alias $ZEIT_DEPLOYMENT_URL https://$ZEIT_DEPLOYMENT_ALIAS --token $ZEIT_TOKEN
+          echo "npx now alias "$ZEIT_DEPLOYMENT_URL $ZEIT_DEPLOYMENT_ALIAS
+          npx now alias $ZEIT_DEPLOYMENT_URL $ZEIT_DEPLOYMENT_ALIAS --token $ZEIT_TOKEN
         env:
           ZEIT_TOKEN: ${{ secrets.ZEIT_TOKEN }} # Passing github's secret to the worker
           CURRENT_BRANCH: ${{ github.ref }} # Passing current branch to the worker

.gitignore

@@ -148,4 +148,4 @@ _site
 # Tmp files (cache, etc.)
 *.cache
 
-.vercel
+.vercel

cypress/integration/app/_sanity/domain.js

@@ -1,6 +1,10 @@
 const baseUrl = Cypress.config().baseUrl;
 
-describe('Sanity checks > Domain', () => {
+describe('Sanity checks > Domain', {
+  retries: {
+    runMode: 2, // Allows 2 retries (for a total of 3 attempts) to reduce the probability of failing the whole tests suite because Vercel hasn't finished to deploy yet (which makes Cypress fail by trying to test the Vercel "waiting page", instead of our app)
+  }
+}, () => {
   /*
   * Visits the home page before any test
   */

cypress/integration/app/common/nav.js

@@ -26,7 +26,7 @@ describe('Common > Nav section', () => {
     cy.get('#nav-link-examples-static-i-18-n')
       .should('have.text', 'Static i18n')
       .click();
-    cy.url({ timeout: 10000 }).should('eq', `${baseUrl}/en/examples/built-in-features/static-i18n`);
+    cy.url({ timeout: 45000 }).should('eq', `${baseUrl}/en/examples/built-in-features/static-i18n`);
     cy.get('h1').should('have.length', 1).should('have.text', 'Static i18n examples, using i18next and Locize vendor');
   });
 
@@ -37,7 +37,7 @@ describe('Common > Nav section', () => {
     cy.get('#nav-link-examples-ssr-get-server-side-props')
       .should('have.text', 'SSR (getServerSideProps)')
       .click();
-    cy.url({ timeout: 10000 }).should('eq', `${baseUrl}/en/examples/native-features/example-with-ssr`);
+    cy.url({ timeout: 45000 }).should('eq', `${baseUrl}/en/examples/native-features/example-with-ssr`);
     cy.get('h1').should('have.length', 1).should('have.text', 'Example, using SSR');
   });
 });

cypress/support/index.js

@@ -14,7 +14,12 @@
 // ***********************************************************
 
 // Import commands.js using ES2015 syntax:
-import './commands'
+import './commands';
 
-// Alternatively you can use CommonJS syntax:
-// require('./commands')
+// See https://docs.cypress.io/api/events/catalog-of-events.html#Uncaught-Exceptions
+Cypress.on('uncaught:exception', (err, runnable) => {
+  // returning false here prevents Cypress from
+  // failing the test
+  console.error('Application error caught:', err, runnable);
+  return false;
+});

docs/_sass/overrides.scss → docs/_sass/custom/custom.scss

@@ -1,4 +1,4 @@
-// XXX Overrides CSS styles - See https://pmarsceill.github.io/just-the-docs/docs/customization/#override-styles
+// XXX Overrides CSS styles - See https://pmarsceill.github.io/just-the-docs/docs/customization/#override-and-completely-custom-styles
 
 blockquote {
   border-left: #f4f1fa 1px solid;

next.config.js

@@ -17,13 +17,50 @@ const date = new Date();
 
 console.debug(`Building Next with NODE_ENV="${process.env.NODE_ENV}" NEXT_PUBLIC_APP_STAGE="${process.env.NEXT_PUBLIC_APP_STAGE}" for NEXT_PUBLIC_CUSTOMER_REF="${process.env.NEXT_PUBLIC_CUSTOMER_REF}"`);
 
+/**
+ * This file is for advanced configuration of the Next.js framework.
+ *
+ * The below config applies to the whole application.
+ * next.config.js gets used by the Next.js server and build phases, and it's not included in the browser build.
+ *
+ * XXX Not all configuration options are listed below, we only kept those of most interest.
+ *  You'll need to dive into Next.js own documentation to find out about what's not included.
+ *  Basically, we focused on options that seemed important for a SSG/SSR app running on serverless mode (Vercel).
+ *  Also, we included some options by are not using them, this is mostly to help make you aware of those options, in case you'd need them.
+ *
+ * @see https://nextjs.org/docs/api-reference/next.config.js/introduction
+ */
 module.exports = withBundleAnalyzer(withSourceMaps({
-  // target: 'serverless', // Automatically enabled on Vercel, you may need to manually opt-in if you're not using Vercel - See https://nextjs.org/docs/api-reference/next.config.js/build-target#serverless-target
+  // basepath: '', // If you want Next.js to cover only a subsection of the domain. See https://nextjs.org/docs/api-reference/next.config.js/basepath
+  // target: 'serverless', // Automatically enabled on Vercel, you may need to manually opt-in if you're not using Vercel. See https://nextjs.org/docs/api-reference/next.config.js/build-target#serverless-target
+  // trailingSlash: false, // By default Next.js will redirect urls with trailing slashes to their counterpart without a trailing slash. See https://nextjs.org/docs/api-reference/next.config.js/trailing-slash
+
+  /**
+   * React's Strict Mode is a development mode only feature for highlighting potential problems in an application.
+   * It helps to identify unsafe lifecycles, legacy API usage, and a number of other features.
+   *
+   * Officially suggested by Next.js:
+   * We strongly suggest you enable Strict Mode in your Next.js application to better prepare your application for the future of React.
+   *
+   * If you or your team are not ready to use Strict Mode in your entire application, that's OK! You can incrementally migrate on a page-by-page basis using <React.StrictMode>.
+   *
+   * @see https://nextjs.org/docs/api-reference/next.config.js/react-strict-mode
+   */
+  // reactStrictMode: true, // XXX Disabled for now, but we should enable it
+
+  /**
+   * Environment variables added to JS bundle
+   *
+   * XXX All env variables defined in ".env*" files that aren't public (those that don't start with "NEXT_PUBLIC_") MUST manually be made available at build time below.
+   *  They're necessary on Vercel for runtime execution (SSR, SSG with revalidate, everything that happens server-side will need those).
+   *
+   * XXX This is a duplication of the environment variables.
+   *  The variables defined below are only used locally, while those in "now.*.json:build:env" will be used on the Vercel platform.
+   *  See https://vercel.com/docs/v2/build-step/#providing-environment-variables
+   *
+   * @see https://nextjs.org/docs/api-reference/next.config.js/environment-variables
+   */
   env: {
-    // XXX All env variables defined in ".env*" files that aren't public (don't start with "NEXT_PUBLIC_") must manually be made available at build time below
-    //  See https://nextjs.org/docs/api-reference/next.config.js/environment-variables
-    // XXX Duplication of the environment variables, this is only used locally
-    //  while now.json:build:env will be used on the Now platform (See https://vercel.com/docs/v2/build-step/#providing-environment-variables)
     GRAPHQL_API_ENDPOINT: process.env.GRAPHQL_API_ENDPOINT,
     GRAPHQL_API_KEY: process.env.GRAPHQL_API_KEY,
     LOCIZE_API_KEY: process.env.LOCIZE_API_KEY,
@@ -36,50 +73,112 @@ module.exports = withBundleAnalyzer(withSourceMaps({
     NEXT_PUBLIC_APP_VERSION: packageJson.version,
     UNLY_SIMPLE_LOGGER_ENV: process.env.NEXT_PUBLIC_APP_STAGE, // Used by @unly/utils-simple-logger - Fix missing staging logs because otherwise it believes we're in production
   },
-  experimental: {
-    redirects() {
-      const redirects = [
-        {
-          // Redirect root link with trailing slash to non-trailing slash, avoids 404 - See https://github.com/vercel/next.js/discussions/10651#discussioncomment-8270
-          source: '/:locale/',
-          destination: '/:locale',
-          permanent: process.env.NEXT_PUBLIC_APP_STAGE !== 'development', // Do not use permanent redirect locally to avoid browser caching when working on it
-        },
-        {
-          // Redirect link with trailing slash to non-trailing slash (any depth), avoids 404 - See https://github.com/vercel/next.js/discussions/10651#discussioncomment-8270
-          source: '/:locale/:path*/',
-          destination: '/:locale/:path*',
-          permanent: process.env.NEXT_PUBLIC_APP_STAGE !== 'development', // Do not use permanent redirect locally to avoid browser caching when working on it
-        },
-      ];
-
-      if (process.env.NEXT_PUBLIC_APP_STAGE === 'development') {
-        console.info('Using experimental redirects:', redirects);
-      }
 
-      return redirects;
-    },
-    rewrites() {
-      const rewrites = [
-        {
-          // XXX Doesn't work locally (maybe because of rewrites), but works online
-          source: '/',
-          destination: '/api/autoRedirectToLocalisedPage',
-        },
-        {
-          source: `/:locale((?!${noRedirectBasePaths.join('|')})[^/]+)(.*)`,
-          destination: '/api/autoRedirectToLocalisedPage',
-        },
-      ];
-
-      if (process.env.NEXT_PUBLIC_APP_STAGE === 'development') {
-        console.info('Using experimental rewrites:', rewrites);
-      }
+  /**
+   * Headers allow you to set custom HTTP headers for an incoming request path.
+   *
+   * Headers allow you to set route specific headers like CORS headers, content-types, and any other headers that may be needed.
+   * They are applied at the very top of the routes.
+   *
+   * @return {Promise<Array<{ headers: [{value: string, key: string}], source: string }>>}
+   * @see https://nextjs.org/docs/api-reference/next.config.js/headers
+   * @since 9.5 - See https://nextjs.org/blog/next-9-5#headers
+   */
+  async headers() {
+    const headers = [];
+
+    console.info('Using headers:', headers);
+
+    return headers;
+  },
+
+  /**
+   * Rewrites allow you to map an incoming request path to a different destination path.
+   *
+   * Rewrites are only available on the Node.js environment and do not affect client-side routing.
+   * Rewrites are the most commonly used form of custom routing — they're used for dynamic routes (pretty URLs), user-land routing libraries (e.g. next-routes), internationalization, and other advanced use cases.
+   *
+   * For example, the route /user/:id rendering a specific user's profile page is a rewrite.
+   * Rendering your company's about page for both /about and /fr/a-propos is also a rewrite.
+   * The destination url can be internal, or external.
+   *
+   * @return { Promise<Array<{ destination: string, source: string, headers: Array<{ key: string, value: string }> }>> }
+   * @see https://nextjs.org/docs/api-reference/next.config.js/rewrites
+   * @since 9.5 - See https://nextjs.org/blog/next-9-5#rewrites
+   */
+  async rewrites() {
+    const rewrites = [
+      // I18n rewrites
+      {
+        // XXX Doesn't work locally (maybe because of rewrites), but works online
+        source: '/',
+        destination: '/api/autoRedirectToLocalisedPage',
+      },
+      {
+        source: `/:locale((?!${noRedirectBasePaths.join('|')})[^/]+)(.*)`,
+        destination: '/api/autoRedirectToLocalisedPage',
+      },
+
+      // Robots rewrites
+      {
+        source: `/robots.txt`,
+        destination: process.env.NEXT_PUBLIC_APP_STAGE === 'production' ? `/robots/production.txt` : '/robots/!production.txt',
+      },
+    ];
 
-      return rewrites;
-    },
+    console.info('Using rewrites:', rewrites);
+
+    return rewrites;
+  },
+
+  /**
+   * Redirects allow you to redirect an incoming request path to a different destination path.
+   *
+   * Redirects are only available on the Node.js environment and do not affect client-side routing.
+   * By redirects, we mean HTTP Redirects (aka URL forwarding).
+   * Redirects are most commonly used when a website is reorganized — ensuring search engines and bookmarks are forwarded to their new locations.
+   * The destination url can be internal, or external.
+   *
+   * @return { Promise<Array<{ permanent: boolean, destination: string, source: string, statusCode?: number }>> }
+   * @see https://nextjs.org/docs/api-reference/next.config.js/redirects
+   * @since 9.5 - See https://nextjs.org/blog/next-9-5#redirects
+   */
+  async redirects() {
+    const redirects = [
+      // I18n redirects
+      {
+        // Redirect root link with trailing slash to non-trailing slash, avoids 404 - See https://github.com/vercel/next.js/discussions/10651#discussioncomment-8270
+        source: '/:locale/',
+        destination: '/:locale',
+        permanent: process.env.NEXT_PUBLIC_APP_STAGE !== 'development', // Do not use permanent redirect locally to avoid browser caching when working on it
+      },
+      {
+        // Redirect link with trailing slash to non-trailing slash (any depth), avoids 404 - See https://github.com/vercel/next.js/discussions/10651#discussioncomment-8270
+        source: '/:locale/:path*/',
+        destination: '/:locale/:path*',
+        permanent: process.env.NEXT_PUBLIC_APP_STAGE !== 'development', // Do not use permanent redirect locally to avoid browser caching when working on it
+      },
+    ];
+
+    console.info('Using redirects:', redirects);
+
+    return redirects;
   },
-  webpack: (config, { isServer, buildId }) => {
+
+  /**
+   *
+   * The webpack function is executed twice, once for the server and once for the client.
+   * This allows you to distinguish between client and server configuration using the isServer property.
+   *
+   * @param config Current webpack config. Useful to reuse parts of what's already configured while overridding other parts.
+   * @param buildId The build id, used as a unique identifier between builds.
+   * @param dev Indicates if the compilation will be done in development.
+   * @param isServer It's true for server-side compilation, and false for client-side compilation.
+   * @param defaultLoaders Default loaders used internally by Next.js:
+   *  - babel Default babel-loader configuration
+   * @see https://nextjs.org/docs/api-reference/next.config.js/custom-webpack-config
+   */
+  webpack: (config, { buildId, dev, isServer, defaultLoaders }) => {
     if (isServer) {
       // IS_SERVER_INITIAL_BUILD is meant to be defined only at build time and not at run time, and therefore must not be "made public"
       process.env.IS_SERVER_INITIAL_BUILD = '1';
@@ -96,7 +195,7 @@ module.exports = withBundleAnalyzer(withSourceMaps({
     });
 
     if (isServer) { // Trick to only log once
-      console.debug(`[webpack] Building release "${APP_VERSION_RELEASE}" using NODE_ENV="${process.env.NODE_ENV}" ${process.env.IS_SERVER_INITIAL_BUILD ? 'with IS_SERVER_INITIAL_BUILD="1"': ''}`);
+      console.debug(`[webpack] Building release "${APP_VERSION_RELEASE}" using NODE_ENV="${process.env.NODE_ENV}" ${process.env.IS_SERVER_INITIAL_BUILD ? 'with IS_SERVER_INITIAL_BUILD="1"' : ''}`);
     }
 
     // Fixes npm packages that depend on `fs` module
@@ -125,5 +224,35 @@ module.exports = withBundleAnalyzer(withSourceMaps({
 
     return config;
   },
-  poweredByHeader: 'NRN - With love',
+
+  /**
+   * Next.js uses a constant id generated at build time to identify which version of your application is being served.
+   *
+   * This can cause problems in multi-server deployments when next build is ran on every server.
+   * In order to keep a static build id between builds you can provide your own build id.
+   *
+   * XXX We documented this function in case you might want to use it, but we aren't using it.
+   *
+   * @see https://nextjs.org/docs/api-reference/next.config.js/configuring-the-build-id
+   */
+  // generateBuildId: async () => {
+  //   // You can, for example, get the latest git commit hash here
+  //   return 'my-build-id'
+  // },
+
+  /**
+   * Next.js exposes some options that give you some control over how the server will dispose or keep in memory built pages in development.
+   *
+   * XXX We documented this function in case you might want to use it, but we aren't using it.
+   *
+   * @see https://nextjs.org/docs/api-reference/next.config.js/configuring-onDemandEntries
+   */
+  // onDemandEntries: {
+  //   // period (in ms) where the server will keep pages in the buffer
+  //   maxInactiveAge: 25 * 1000,
+  //   // number of pages that should be kept simultaneously without being disposed
+  //   pagesBufferLength: 2,
+  // },
+
+  poweredByHeader: 'Next Right Now - With love - https://github.com/UnlyEd/next-right-now', // See https://nextjs.org/docs/api-reference/next.config.js/disabling-x-powered-by
 }));

now.customer1.production.json

@@ -16,11 +16,5 @@
       "SENTRY_DSN": "@nrn-sentry-dsn"
     }
   },
-  "routes": [
-    {
-      "src": "/robots.txt",
-      "dest": "/robots/production.txt"
-    }
-  ],
   "public": false
 }

now.customer1.staging.json

@@ -16,11 +16,5 @@
       "SENTRY_DSN": "@nrn-sentry-dsn"
     }
   },
-  "routes": [
-    {
-      "src": "/robots.txt",
-      "dest": "/robots/!production.txt"
-    }
-  ],
   "public": false
 }

now.customer2.production.json

@@ -16,11 +16,5 @@
       "SENTRY_DSN": "@nrn-sentry-dsn"
     }
   },
-  "routes": [
-    {
-      "src": "/robots.txt",
-      "dest": "/robots/production.txt"
-    }
-  ],
   "public": false
 }