V1 (#1)

* Draft 1

* Attempt to fix CI

* Remove GITHUB_SSH_KEY_CDE usage + use correct now config file (CI) + doc

* Doc + use lowercase project name

* Fix TS + doc

* Make Github Action automatically link deployment to alias domain name based on git branch name

* Fix yml indent (GH actions)

* Update doc

* Fix toc

* Add CC badges

* Add MIT License + doc

* Update svg template, KISS

* Run now:cleanup before deploying any customer so that local setup don't use cache in /.now folder, which messed up our local deployment (wasn't affecting CI)

* Remove dead code + doc

* Fix CI E2E tests

* More doc

* More doc (how to remove)

* Properly configure Terms page (and its analytics)

* Doc

* Add Part 1 video

* Add pricing example

* Add more videos/guides

* Remove draft status + doc:toc

.codeclimate.yml

@@ -0,0 +1,78 @@
+# XXX See https://docs.codeclimate.com/docs/advanced-configuration
+version: "2"
+checks:
+  argument-count:
+    enabled: true
+    config:
+      threshold: 4
+  complex-logic:
+    enabled: true
+    config:
+      threshold: 4
+  file-lines:
+    enabled: true
+    config:
+      threshold: 400 # 250 by default
+  method-complexity:
+    enabled: true
+    config:
+      threshold: 10
+  method-count:
+    enabled: true
+    config:
+      threshold: 20
+  method-lines:
+    enabled: true
+    config:
+      threshold: 100 # 25 by default
+  nested-control-flow:
+    enabled: true
+    config:
+      threshold: 4
+  return-statements:
+    enabled: true
+    config:
+      threshold: 4
+
+plugins:
+#  eslint: # https://docs.codeclimate.com/docs/eslint
+#    enabled: true
+#    channel: "eslint-4" # Depends on installed ESLint version - See https://docs.codeclimate.com/docs/eslint#section-eslint-versions
+  duplication: # https://docs.codeclimate.com/docs/duplication
+    enabled: true
+    config:
+      languages:
+        javascript:
+          mass_threshold: 50 # See https://docs.codeclimate.com/docs/duplication#section-understand-the-engine
+  fixme: # https://docs.codeclimate.com/docs/fixme
+    enabled: true
+    config:
+      strings: # Skip "XXX" as we don't use it for things to fix but rather for highlighting comments (DX)
+        - FIXME
+        - BUG
+        - TODO
+        - HACK
+  git-legal: # https://docs.codeclimate.com/docs/git-legal
+    enabled: true
+#  tslint: # https://docs.codeclimate.com/docs/tslint
+#    enabled: true
+#    config: tslint.json
+
+# See https://docs.codeclimate.com/docs/excluding-files-and-folders
+exclude_patterns:
+  - "**/*.test.*"
+  - "**/*.spec.*"
+  - "src/svg/"
+
+  # Default CC excluded paths:
+  - "config/"
+  - "db/"
+  - "dist/"
+  - "features/"
+  - "**/node_modules/"
+  - "script/"
+  - "**/spec/"
+  - "**/test/"
+  - "**/tests/"
+  - "**/vendor/"
+  - "**/*.d.ts"

.editorconfig

@@ -0,0 +1,46 @@
+[*]
+charset = utf-8
+end_of_line = lf
+trim_trailing_whitespace = true
+insert_final_newline = true
+indent_style = space
+indent_size = 2
+
+[{*.jhm, *.xslt, *.xul, *.rng, *.xsl, *.xsd, *.ant, *.tld, *.fxml, *.jrxml, *.xml, *.jnlp, *.wsdl}]
+indent_style = space
+indent_size = 4
+
+[{.babelrc, .prettierrc, .stylelintrc, .eslintrc, jest.config, *.json, *.js, *.js.map, *.ts, *.tsx, *.jsb3, *.jsb2, *.bowerrc, *.graphqlconfig}]
+indent_style = space
+indent_size = 2
+
+[.editorconfig]
+indent_style = space
+indent_size = 4
+
+[*.less]
+indent_style = space
+indent_size = 2
+
+[*.jshintrc]
+indent_style = space
+indent_size = 2
+
+[*.jscsrc]
+indent_style = space
+indent_size = 2
+
+[{tsconfig.lib.json, tsconfig.spec.json, tsconfig.app.json, tsconfig.json, tsconfig.e2e.json}]
+indent_style = space
+indent_size = 2
+
+[*.ejs]
+indent_style = space
+indent_size = 4
+
+[{.analysis_options, *.yml, *.yaml}]
+indent_style = space
+indent_size = 2
+
+[*.md]
+indent_size = 4

.env.build.example

@@ -0,0 +1,31 @@
+# XXX Copy this file as ".env.build", will be used only in development stage. For staging/production stages, check the config at "now.CUSTOMER_REF.APP_STAGE.yml".
+# XXX Used during the build step in next.config.js
+# See https://zeit.co/docs/v2/environment-variables-and-secrets#local-development
+
+# The environment is "where" the application is running. It can be either "development" (localhost) or "production" (on Zeit's servers)
+NODE_ENV=development
+
+# The stage is "how" the application is running. It can be either "development" (localhost), "staging" or "production" (on Zeit's servers)
+APP_STAGE=development
+
+# The customer that is being deployed
+CUSTOMER_REF=customer1
+
+# Locize project ID, can be found in the project settings page - Example: 615384ff-0f39-4c7b-89ca-9b0acbfd0869
+LOCIZE_PROJECT_ID=
+
+# Locize API key, used to automatically save missing translations - Example: 615384ff-0f39-4c7b-89ca-9b0acbfd0869
+# TODO Create a Locize account at
+LOCIZE_API_KEY=
+
+# Amplitude API key, used to report analytics usage - Example: 615384ff0f394c7b89ca9b0acbfd0869
+AMPLITUDE_API_KEY=
+
+# Sentry DSN, used to report events (errors, etc.) - Example: https://[email protected]/1234567
+SENTRY_DSN=
+
+# GraphQL API endpoint - XXX We only use one stage due to our plan's limitation, but using two stages is the recommended way
+GRAPHQL_API_ENDPOINT=https://api-euwest.graphcms.com/v1/ck73ixhlv09yt01dv2ga1bkbp/master
+
+# GraphQL API key (GraphCMS auth token) - Readonly because we want everyone to fetch data but not mess with it
+GRAPHQL_API_KEY=eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCIsImtpZCI6ImdjbXMtbWFpbi1wcm9kdWN0aW9uIn0.eyJ2ZXJzaW9uIjoyLCJ0b2tlbklkIjoiMGEyZWYwZWYtYmY4Ny00ZmVlLTkzYmQtMzBkMzIzYzAwODM4IiwiaWF0IjoxNTgyNzQ2MDc1LCJpc3MiOiJodHRwczovL21hbmFnZW1lbnQuZ3JhcGhjbXMuY29tLyJ9.wE-IDwFnCNpwUj5AMeGsbf2CGcTgkT1KkE9_l6s-bU03sckdDgV2LXCHH5Fb8XwJGAkoeD5bK9yDnY6oNapiusvg4xRqY-hkRxgh8lB_lTXXpIka6HhjIJz1RQO_dObNGFqr41dKihseBqN5Ce4AJvQBIHyJasKX63xe2eEzdUnWfuNUmrG_XStRu1-xDKKp7vFVox272rr-LqgwRymF3eYcw7J-IAag4qpztoU6zNhKJNYzQKdMMejvMDNg34bHNp4TRIbIUIYpytkwCaAb5TsH98xEiFziU5rUr4EYToSltgE46VnqX2npm56qK-AGp5zauMZgvA20Djtb7BuYqGAqCdOHEQtjjyVLufCu6Y72i9gNQqFQ-WGQ6AFN84KT7BJgRoTruduYG9VhGMOR59HR3jG2QIWXOCt55aI9YwAGNQii0b_QqaoSO08Pb_Ooji5abFLISs70jQb-z1QcnvHIzHnsKqymEWwZhbkxpwf8bv8C6-8k4JGB5YdVj3T_0XQ-OCyvWQIGwVxKysLj8HBeVvXOKUyz7p-thOHbO4qSaRaV7w6_Yy2XtdwBlkIiTTqLezN34vCnsyhZ7N1IgLzp0bwNCyCoPOFs5Q9Ccw7hwJRP3kDT2cW4COJWVt-V5YF_9nnlZN8JjcIgv7FMZKoKRHi004vSosPYGd-v3Uw

.eslintignore

@@ -0,0 +1,8 @@
+node_modules
+.next
+src/**/*.test*
+src/gql/**
+src/propTypes/**
+src/svg/**
+src/types/**
+src/components/svg/**

.eslintrc.yml

@@ -0,0 +1,96 @@
+---
+env:
+  browser: true
+  commonjs: true
+  es6: true
+  node: true
+extends:
+  - plugin:@typescript-eslint/recommended
+  - plugin:react/recommended
+  - plugin:jsx-a11y/recommended
+globals:
+  Atomics: readonly
+  SharedArrayBuffer: readonly
+plugins:
+  - jest
+  - react
+  - react-hooks
+parser: '@typescript-eslint/parser'
+parserOptions:
+  project: ./tsconfig.json
+settings:
+  react:
+    version: detect
+rules: # See https://eslint.org/docs/rules
+  semi:
+    - error
+    - always # Always put commas, to avoid multilines git diff when new lines are added
+  quotes:
+    - error
+    - single # Prefer simple quotes
+    - allowTemplateLiterals: true # Allow the use of `` instead of '' and don't try to replace it, even when `` isn't needed
+  comma-spacing:
+    - error
+    - before: false
+      after: true
+  indent:
+    - error
+    - 2
+    - SwitchCase: 1
+  arrow-parens:
+    - error
+    - always
+  max-len: 0 # Disable line length checks, because the IDE is already configured to warn about it, and it's a waste of time to check for lines that are too long, especially in comments (like this one!)
+  strict: 'off'
+  no-console: 1 # Shouldn't use "console", but "logger" instead
+  allowArrowFunctions: 0
+  no-unused-vars:
+    - warn # Warn otherwise it false-positive with needed React imports
+    - args: none # Allow to declare unused variables in function arguments, meant to be used later
+  import/prefer-default-export: 0 # When there is only a single export from a module, don't enforce a default export, but rather let developer choose what's best
+  no-else-return: 0 # Don't enforce, let developer choose. Sometimes we like to specifically use "return" for the sake of comprehensibility and avoid ambiguity
+  no-underscore-dangle: 0 # Allow _ before/after variables and functions, convention for something meant to be "private"
+  arrow-body-style: 0 # Don't enforce, let developer choose. Sometimes we like to specifically use "return" for ease of debugging and printing
+  quote-props:
+    - warn
+    - consistent-as-needed # Enforce consistency with quotes on props, either all must be quoted, or all unquoted for a given object
+  no-return-await: 0 # Useful before, but recent node.js enhancements make it useless on node 12+ (we use 10, but still, for consistency) - Read https://stackoverflow.com/questions/44806135/why-no-return-await-vs-const-x-await
+  no-extra-boolean-cast: 0 # Don't enforce, let developer choose. Using "!!!" is sometimes useful (edge cases), and has a semantic value (dev intention)
+  object-curly-newline:
+    - warn
+    - ObjectExpression:
+        multiline: true
+        minProperties: 5
+        consistent: true
+      ObjectPattern:
+        multiline: true
+        minProperties: 5
+        consistent: true
+      ImportDeclaration:
+        multiline: true
+        minProperties: 8 # Doesn't play so well with webstorm, which wraps based on the number of chars in the row, not based on the number of props #sucks
+        consistent: true
+      ExportDeclaration:
+        multiline: true
+        minProperties: 5
+        consistent: true
+  react-hooks/rules-of-hooks: error
+  react-hooks/exhaustive-deps: warn
+  react/jsx-no-target-blank: warn # Not using "noreferrer" is not a security risk, but "noopener" should always be used indeed
+  react/prop-types: warn # Should be handled with TS instead
+  react/no-unescaped-entities: warn # Causes text mismatch when enabled
+  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/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)
+overrides:
+  - files: ['**/*.tsx']
+    rules:
+      'react/prop-types': 'off'

.github/workflows/README.md

@@ -0,0 +1,105 @@
+# Github Actions <> Zeit integrations
+
+> Automated actions configured through GitHub Actions
+>
+> This documentation explains how our GitHub actions integrate themselves with the Zeit platform
+
+---
+
+## Getting started
+
+### Introducing GitHub Actions
+
+> Stuff to read if you're not familiar with GitHub Actions
+
+[Official documentation](https://help.github.com/en/actions/automating-your-workflow-with-github-actions)
+
+Most useful documentation links:
+- [https://help.github.com/en/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#about-yaml-syntax-for-workflows](https://help.github.com/en/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#about-yaml-syntax-for-workflows)
+- [https://help.github.com/en/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#on](https://help.github.com/en/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#on)
+- [https://help.github.com/en/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#jobsjob_idneeds](https://help.github.com/en/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#jobsjob_idneeds)
+- [https://help.github.com/en/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#jobsjob_idruns-on](https://help.github.com/en/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#jobsjob_idruns-on)
+- [https://help.github.com/en/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#filter-pattern-cheat-sheet](https://help.github.com/en/actions/automating-your-workflow-with-github-actions/workflow-syntax-for-github-actions#filter-pattern-cheat-sheet)
+
+
+### Requirements
+
+> List of necessary requirements for the `Github Actions <> Zeit` to work properly.
+
+#### Required GitHub secrets:
+
+> Those secrets must be added on Github settings page, such as https://github.com/UnlyEd/next-right-now/settings/secrets
+
+- `GITHUB_CI_PR_COMMENT`: Allows to post comments on GitHub Pull Request - See [https://github.com/settings/tokens](https://github.com/settings/tokens)
+  GitHub **["personal access token"](https://github.com/settings/tokens)** from your personal account with the following permission scopes:
+  - `repo` (all)
+  - `user`
+    - `read:user`
+    - `user:email`
+  - `workflow`
+
+- `ZEIT_TOKEN`: Allows to trigger deployments - See [https://zeit.co/account/tokens](https://zeit.co/account/tokens)
+  Zeit personal token
+
+---
+
+## Overview
+### Stages
+
+> We use two different stages. Each stage is meant to use a different configuration.
+
+_**staging**_ (see [`deploy-zeit-staging`](./deploy-zeit-staging.yml)):
+Every pushed commit, (except those made on `master`) automatically starts a new Zeit deployment, using the related staging configuration file.
+You can choose which client you deploy by changing the symbolic link `now.json` file.
+Changing the symlink allows to change which "CUSTOMER_REF" gets automatically deployed.
+
+_**production**_ (see [`deploy-zeit-production`](./deploy-zeit-production.yml)):
+Commits pushed to the `master` branch will automatically deploy the "CUSTOMER_REF" specified in `now.json` to Zeit, but will use it's production configuration.
+
+> N.B: Those events are triggered by pushed commit, but also merged branches.
+
+### GitHub Actions Jobs workflow
+
+> The same workflow is used for both stages. The main difference is the trigger.
+>
+> A `production` deployment is **triggered by any change** in the `master` branch,
+> while a `staging` deployment is **triggered by any change that is not on** the `master` branch.
+
+**Jobs workflow:**
+* Installing Node.js and npm dependencies, by specifying Node version
+* Deploy code:
+    * We checkout to the last branch commit, documentation [here](https://github.com/cypress-io/github-action)
+    * We parse current `now.json` config file to get `CUSTOMER_REF`, which corresponding to customer project to deploy, and then we run `yarn deploy:CUSTOMER_REF` or in production `yarn deploy:CUSTOMER_REF:production`
+* Run 2e2 tests:
+    * We need to checkout again (because the code is not persistent)
+    * We ask to Zeit api for the last deployment data, retrieve the url and then set it as environment variable as `ZEIT_DEPLOYMENT_URL` (to be able to use it afterwards)
+    * We use default action provided by cypress (documentation [here](https://github.com/cypress-io/github-action)):
+        * _**wait-on**_: Allows us to wait before starting tests. It ping the endpoint until it's up, with a timeout of 60 seconds per default.
+        * _**config-file**_: We need to specify a config file because cypress is looking for cypress.json in the main folder.
+            The config file itself doesn't matter because we will override most settings anyway. We just need `projectId` to run the tests.
+        * _**config**_: Overrides some default config, like the `baseUrl` in particular (we use the `ZEIT_DEPLOYMENT_URL` instead)
+    * We upload artifacts on tests failure, more documentation [here](https://help.github.com/en/actions/automating-your-workflow-with-github-actions/persisting-workflow-data-using-artifacts)
+
+---
+
+## Dependencies
+
+### Actions
+* _**[actions/setup-node@v1](https://github.com/actions/setup-node)**_:
+    Setup node.js and install dependencies
+* _**[actions/checkout@v1](https://github.com/cypress-io/github-action)**_:
+    Checkout to last commit to retrieve code
+* _**[cypress-io/github-action@v1](https://github.com/cypress-io/github-action)**_:
+    Run Cypress tests
+* _**[actions/upload-artifact@v1](https://help.github.com/en/actions/automating-your-workflow-with-github-actions/persisting-workflow-data-using-artifacts)**_:
+    Upload artifacts to Github
+
+---
+
+## Complex commands
+* _**[jq](https://cameronnokes.com/blog/working-with-json-in-bash-using-jq/)**_:
+    JSON parser for bash
+* _**[tr](http://linuxcommand.org/lc3_man_pages/tr1.html)**_:
+    Bash editor, used to remove characters
+* _**[echo "::set-env name=key::value"](https://help.github.com/en/actions/automating-your-workflow-with-github-actions/development-tools-for-github-actions)**_:
+    Set env variable for all others jobs