[next] Auth Popup v2 (#2101)

* feat: Implement new Sign In view

* feat: Move forgot + resetPassword to new design

* feat: Implement sign up with new design

* fix: narrow gutter

* test: add unit tests

* test: integration tests

* feat: support show / hide password

* feat: support oauth2 flow

* feat: add views for user completion

* feat: implement oauth2 sign up

* test: fix snapshots

* fix: lint

* fix: get more complete mutation response

* fix: removed array of OIDC integrations

* fix: renamed resolver function

* fix: adapt oidc client implementation

* fix: targetFilter should be stream on signup

* fix: removed unneeded message

* fix: moved password into local profile

* fix: made username optional, removed valid null value

* fix: linting

* fix: respect targetFilter

* feat: support user registration mutations

- Added `setUsername`
- Added `setEmail`
- Added `setPassword`
- Added `permit` to `@auth`
- Added `email` to `User`

* fix: fixed issue with query

* feat: added user password update

* feat: complete sign in mutation

* fix: adapt some rebasing gitches

* test: improve tests

* test: unittest for setting auth token

* fix: failing tests

* test: move most tests from enzyme to react-test-renderer

* fix: remove schema warnings in tests

* test: improve window mock

* test: test different social login configurations

* test: test social logins for sign up

* fix: use htmlFor instead of for

* test: more feature tests

* feat: always go through account completion

* test: feature test account completion

* feat: addtional account completion test

* Update start.ts

* chore: refactor auth token retrieval logic

src/core/client/framework/lib/messages.tsx

@@ -54,6 +54,12 @@ export const PASSWORDS_DO_NOT_MATCH = () => (
   </Localized>
 );
 
+export const EMAILS_DO_NOT_MATCH = () => (
+  <Localized id="framework-validation-emailsDoNotMatch">
+    <span>Emails do not match. Try again.</span>
+  </Localized>
+);
+
 export const INVALID_URL = () => (
   <Localized id="framework-validation-invalidURL">
     <span>Invalid URL</span>

src/core/client/framework/lib/relay/wrapFetchWithLogger.ts

@@ -6,19 +6,21 @@ import { FetchFunction } from "relay-runtime";
  */
 export default function wrapFetchWithLogger(
   fetch: FetchFunction,
-  logResult?: boolean
+  options: { logResult?: boolean; muteErrors?: boolean } = {}
 ): FetchFunction {
   return async (...args: any[]) => {
     try {
       const result = await (fetch as any)(...args);
-      if (logResult) {
+      if (options.logResult) {
         // tslint:disable-next-line:no-console
         console.log(JSON.stringify(result));
       }
       return result;
     } catch (err) {
-      // tslint:disable-next-line:no-console
-      console.error(err);
+      if (!options.muteErrors) {
+        // tslint:disable-next-line:no-console
+        console.error(err);
+      }
       throw err;
     }
   };

src/core/client/framework/lib/validation.tsx

@@ -1,5 +1,6 @@
 import { ReactNode } from "react";
 import {
+  EMAILS_DO_NOT_MATCH,
   INVALID_CHARACTERS,
   INVALID_EMAIL,
   INVALID_URL,
@@ -101,10 +102,18 @@ export const validatePassword = createValidator(
   PASSWORD_TOO_SHORT(8)
 );
 
-/**s
- * validateUsername is a Validator that checks that the value is a valid username.
+/**
+ * validateEqualPasswords is a Validator that checks for correct password confirmation.
  */
 export const validateEqualPasswords = createValidator(
   (v, values) => v === values.password,
   PASSWORDS_DO_NOT_MATCH()
 );
+
+/**
+ * validateEqualEmails is a Validator that checks for correct email confirmation.
+ */
+export const validateEqualEmails = createValidator(
+  (v, values) => v === values.email,
+  EMAILS_DO_NOT_MATCH()
+);