passbolt-styleguide 3.5.3 → 3.6.0-beta1

package/src/react-extension/contexts/ApiSetupContext.js

@@ -17,7 +17,7 @@ import {withAppContext} from "./AppContext";
 import {ApiClient} from "../../shared/lib/apiClient/apiClient";
 import {BROWSER_NAMES, detectBrowserName} from "../../shared/lib/Browser/detectBrowserName";
 import PassboltApiFetchError from "../../shared/lib/Error/PassboltApiFetchError";
-import getPropValue from "../lib/Object/getPropValue";
+import PassboltServiceUnavailableError from "../../shared/lib/Error/PassboltServiceUnavailableError";
 
 /**
  * The Api setup context.
@@ -27,8 +27,12 @@ export const ApiSetupContext = React.createContext({
   userId: null, // The setup user id
   token: null, // The setup token
   state: null, // The current setup workflow state
+  unexpectedError: null, // The unexpected error obejct if any
   // Whenever the initialization of the setup is requested.
   onInitializeSetupRequested: () => {
+  },
+  // Callback to be used when a user is unexpectedly logged in.
+  logoutUserAndRefresh: () => {
   }
 });
 
@@ -50,10 +54,12 @@ class ApiSetupContextProvider extends React.Component {
    */
   get defaultState() {
     return {
-      userId: null,
-      token: null,
-      state: ApiSetupContextState.INITIAL_STATE,
-      onInitializeSetupRequested: this.onInitializeSetupRequested.bind(this)
+      userId: null, // The account recovery user id
+      token: null, // The recover token
+      state: ApiSetupContextState.INITIAL_STATE, // The current recover workflow state
+      unexpectedError: null, // The unexpected error obejct if any
+      onInitializeSetupRequested: this.onInitializeSetupRequested.bind(this), // Whenever the initialization of the recover is requested.
+      logoutUserAndRefresh: this.logoutUserAndRefresh.bind(this), // Callback to be used when a user is unexpectedly logged in.
     };
   }
 
@@ -63,37 +69,67 @@ class ApiSetupContextProvider extends React.Component {
    */
   async onInitializeSetupRequested() {
     if (!this.state.userId || !this.state.token) {
-      return this.setState({state: ApiSetupContextState.ERROR_STATE});
+      return this.setState({state: ApiSetupContextState.REQUEST_INVITATION_ERROR});
     }
     if (!this.isBrowserSupported()) {
       return this.setState({state: ApiSetupContextState.DOWNLOAD_SUPPORTED_BROWSER_STATE});
     }
 
-    await this.verifySetupInfo()
-      .then(this.handleSetupVerifySuccess.bind(this))
-      .catch(this.handleSetupVerifyError.bind(this));
+    await this.startSetup()
+      .then(this.handleStartSetupSuccess.bind(this))
+      .catch(this.handleStartSetupError.bind(this));
   }
 
   /**
-   * When the setup info are valid.
+   * When the setup start succeed.
    * @return {void}
    */
-  handleSetupVerifySuccess() {
+  handleStartSetupSuccess() {
     this.setState({state: ApiSetupContextState.INSTALL_EXTENSION_STATE});
   }
 
   /**
-   * When the setup info didn't validate
+   * When the user asks for logging out before going on with the desired process.
+   * @returns {Promise<void>}
+   */
+  async logoutUserAndRefresh() {
+    try {
+      const apiClientOptions = this.props.context.getApiClientOptions();
+      apiClientOptions.setResourceName("auth");
+      const apiClient = new ApiClient(apiClientOptions);
+      const fetchOptions = {...apiClient.buildFetchOptions(), method: 'POST', redirect: "manual"};
+      const url = apiClient.buildUrl(`${apiClient.baseUrl}/logout`);
+      await fetch(url.toString(), fetchOptions);
+    } catch (e) {
+      const error = new PassboltServiceUnavailableError(e.message);
+      return this.setState({unexpectedError: error, state: ApiSetupContextState.UNEXPECTED_ERROR_STATE});
+    }
+
+    window.location.reload();
+  }
+
+  /**
+   * When the setup start failed.
    * @return {void}
    */
-  handleSetupVerifyError(error) {
+  handleStartSetupError(error) {
     if (error instanceof PassboltApiFetchError) {
-      const isTokenExpired = getPropValue(error, "data.body.token.expired");
-      if (isTokenExpired) {
+      const isUserLoggedIn = error.data.code === 403;
+      if (isUserLoggedIn) {
+        return this.setState({state: ApiSetupContextState.ERROR_ALREADY_SIGNED_IN_STATE});
+      }
+
+      const isTokenExpired = Boolean(error.data.body?.token?.expired);
+      const isTokenConsumed = Boolean(error.data.body?.token?.isActive);
+      if (isTokenExpired || isTokenConsumed) {
         return this.setState({state: ApiSetupContextState.TOKEN_EXPIRED_STATE});
       }
+
+      if (error?.data?.code === 400) {
+        return this.setState({state: ApiSetupContextState.REQUEST_INVITATION_ERROR});
+      }
     }
-    return this.setState({state: ApiSetupContextState.ERROR_STATE});
+    return this.setState({state: ApiSetupContextState.UNEXPECTED_ERROR_STATE});
   }
 
   /**
@@ -110,7 +146,7 @@ class ApiSetupContextProvider extends React.Component {
    * Verify the setup information.
    * @returns {Promise<object>}
    */
-  async verifySetupInfo() {
+  async startSetup() {
     const apiClientOptions = this.props.context.getApiClientOptions();
     apiClientOptions.setResourceName("setup");
     const apiClient = new ApiClient(apiClientOptions);
@@ -164,5 +200,7 @@ export const ApiSetupContextState = {
   DOWNLOAD_SUPPORTED_BROWSER_STATE: 'Download supported browser state',
   INSTALL_EXTENSION_STATE: 'Install extension state',
   TOKEN_EXPIRED_STATE: 'Token expired state',
-  ERROR_STATE: 'Error state',
+  ERROR_ALREADY_SIGNED_IN_STATE: 'Error, already signed in state',
+  REQUEST_INVITATION_ERROR: 'Request inviration error state',
+  UNEXPECTED_ERROR_STATE: 'Unexpected error state',
 };

package/src/react-extension/contexts/Authentication/AuthenticationAccountRecoveryContext.js

@@ -0,0 +1,282 @@
+/**
+ * Passbolt ~ Open source password manager for teams
+ * Copyright (c) 2022 Passbolt SA (https://www.passbolt.com)
+ *
+ * Licensed under GNU Affero General Public License version 3 of the or any later version.
+ * For full copyright and license information, please see the LICENSE.txt
+ * Redistributions of files must retain the above copyright notice.
+ *
+ * @copyright     Copyright (c) 2022 Passbolt SA (https://www.passbolt.com)
+ * @license       https://opensource.org/licenses/AGPL-3.0 AGPL License
+ * @link          https://www.passbolt.com Passbolt(tm)
+ * @since         3.6.0
+ */
+
+import React from "react";
+import PropTypes from "prop-types";
+import {withAppContext} from "../AppContext";
+
+// The authentication account recovery workflow states.
+export const AuthenticationAccountRecoveryWorkflowStates = {
+  VERIFY_PASSPHRASE: "Validate Passphrase",
+  RECOVERING_ACCOUNT: "Recovering Account",
+  SIGNING_IN: 'Signing in',
+  DOWNLOAD_RECOVERY_KIT: 'Downloading Recovery Kit',
+  LOADING: "Loading",
+  UNEXPECTED_ERROR: "Unexpected Error",
+  HELP_CREDENTIALS_LOST: "Help Credentials lost",
+  CHECK_MAILBOX: "Check mailbox",
+};
+
+/**
+ * The authentication account recovery context.
+ * Handle the business logic of the account recovery and the associated workflow
+ * @type {React.Context<Object>}
+ */
+export const AuthenticationAccountRecoveryContext = React.createContext({
+  // Workflow data.
+  state: null, // The recover workflow current state
+  error: null, // The current error
+
+  // Workflow mutators.
+  verifyPassphrase: () => {
+  }, // Verify the user wants to check the account recovery temporary gpgkey passphrase
+  complete: () => {
+  }, // Complete the account recovery
+  needHelpCredentialsLost: () => {
+  }, // Whenever the user lost its passphrase.
+  goToValidatePassphrase: () => {
+  }, // Whenever the user wants to go to the validate passphrase.
+  requestHelpCredentialsLost: () => {
+  }, // Whenever the user wants to request help because it lost its credentials.
+  downloadRecoveryKit: () => {
+  }, // Go to the download recovery kit step
+  handleRecoveryKitDownloaded: () => {
+  }, // Go to the step after the download recovery kit
+});
+
+/**
+ * The authentication recover context provider.
+ * Handle the business logic of the recover and the associated workflow.
+ */
+export class AuthenticationAccountRecoveryContextProvider extends React.Component {
+  /**
+   * Default constructor
+   * @param props The component props
+   */
+  constructor(props) {
+    super(props);
+    this.state = this.defaultState;
+
+    //This is not on state as it's not related to rendering
+    this.passphrase = null;
+    this.rememberMe = null;
+  }
+
+  /**
+   * Returns the default component state
+   */
+  get defaultState() {
+    return {
+      // Workflow data.
+      state: AuthenticationAccountRecoveryWorkflowStates.LOADING, // The account recovery workflow current state
+      error: null, // The current error
+      account: null, // The account recovery associated account.
+
+      // Public workflow mutators.
+      verifyPassphrase: this.verifyPassphrase.bind(this), // Verify the user wants to check the account recovery temporary gpgkey passphrase
+      complete: this.complete.bind(this), // Complete the account recovery request
+      needHelpCredentialsLost: this.needHelpCredentialsLost.bind(this), // Whenever the user lost its passphrase.
+      goToValidatePassphrase: this.goToValidatePassphrase.bind(this), // Whenever the user wants to go to the validate passphrase.
+      requestHelpCredentialsLost: this.requestHelpCredentialsLost.bind(this), // Whenever the user wants to request help because it lost its credentials.
+      downloadRecoveryKit: this.downloadRecoveryKit.bind(this), // Go to the download recovery kit step
+      handleRecoveryKitDownloaded: this.handleRecoveryKitDownloaded.bind(this), // Go to the step after the download recovery kit
+    };
+  }
+
+  /**
+   * Whenever the component is initialized
+   */
+  componentDidMount() {
+    this.initialize();
+  }
+
+  /**
+   * Initialize the authentication account recovery workflow
+   * @returns {Promise<void>}
+   */
+  async initialize() {
+    if (!(await this.verifyCanContinueAccountRecovery())) {
+      return;
+    }
+    await this.goToValidatePassphrase();
+  }
+
+  /**
+   * Verify the user can continue the account recovery process.
+   * @returns {Promise<void>}
+   */
+  async verifyCanContinueAccountRecovery() {
+    try {
+      await this.props.context.port.request("passbolt.account-recovery.continue");
+      return true;
+    } catch (error) {
+      // It shouldn't occur. For any errors at this stage, the background page will destroy the iframe an let the application served by the API take care of it.
+      await this.handleUnexpectedError(error);
+      return false;
+    }
+  }
+
+  /**
+   * Go to the validate account passphrase.
+   * @returns {Promise<void>}
+   */
+  async goToValidatePassphrase() {
+    try {
+      const account = await this.props.context.port.request("passbolt.account-recovery.get-account");
+      await this.setState({state: AuthenticationAccountRecoveryWorkflowStates.VERIFY_PASSPHRASE, account: account});
+    } catch (error) {
+      await this.handleUnexpectedError(error);
+    }
+  }
+
+  /**
+   * Verify the user account recovery temporary gpgkey passphrase.
+   * @param {string} passphrase The passphrase.
+   * @returns {Promise<void>}
+   * @throw {Error} If an expected errors is returned by the background page, rethrow it for the caller component.
+   *  Errors of type: InvalidMasterPasswordError.
+   */
+  async verifyPassphrase(passphrase) {
+    try {
+      await this.props.context.port.request("passbolt.account-recovery.verify-passphrase", passphrase);
+    } catch (error) {
+      if (error.name === "InvalidMasterPasswordError") {
+        throw error;
+      }
+      await this.handleUnexpectedError(error);
+    }
+  }
+
+  /**
+   * Complete the account recovery.
+   * @param {string} passphrase The passphrase.
+   * @param {boolean} rememberMe (Optional) Should the passphrase be remembered? Default false.
+   * @returns {Promise<void>}
+   */
+  async complete(passphrase, rememberMe = false) {
+    await this.setState({state: AuthenticationAccountRecoveryWorkflowStates.RECOVERING_ACCOUNT});
+    try {
+      await this.props.context.port.request("passbolt.account-recovery.recover-account", passphrase);
+      this.passphrase = passphrase;
+      this.rememberMe = rememberMe;
+      this.setState({state: AuthenticationAccountRecoveryWorkflowStates.DOWNLOAD_RECOVERY_KIT});
+    } catch (error) {
+      await this.handleUnexpectedError(error);
+    }
+  }
+
+  /**
+   * Whenever the user wants to download the recovery kit.
+   * @returns {Promise<void>}
+   */
+  async downloadRecoveryKit() {
+    try {
+      await this.props.context.port.request('passbolt.account-recovery.download-recovery-kit');
+    } catch (error) {
+      this.setState({state: AuthenticationAccountRecoveryWorkflowStates.UNEXPECTED_ERROR, error: error});
+    }
+  }
+
+  /**
+   * Whenever the user finished to download the recovery kit.
+   * @returns {Promise<void>}
+   */
+  async handleRecoveryKitDownloaded() {
+    await this.signIn(this.passphrase, this.rememberMe);
+    this.passphrase = null;
+    this.rememberMe = null;
+  }
+
+  /**
+   * Sign-in.
+   * @param {string} passphrase The passphrase.
+   * @param {boolean} rememberMe (Optional) Should the passphrase be remembered? Default false.
+   * @returns {Promise<void>}
+   */
+  async signIn(passphrase, rememberMe = false) {
+    this.setState({state: AuthenticationAccountRecoveryWorkflowStates.SIGNING_IN});
+    try {
+      await this.props.context.port.request("passbolt.account-recovery.sign-in", passphrase, rememberMe);
+    } catch (error) {
+      await this.handleUnexpectedError(error);
+    }
+  }
+
+  /**
+   * Handle unexpected error.
+   * @param {Object} error The error.
+   * @returns {Promise<void>}
+   */
+  async handleUnexpectedError(error) {
+    await this.setState({state: AuthenticationAccountRecoveryWorkflowStates.UNEXPECTED_ERROR, error: error});
+  }
+
+  /**
+   * Whenever the user lost its passphrase.
+   * @returns {Promise<void>}
+   */
+  async needHelpCredentialsLost() {
+    await this.setState({state: AuthenticationAccountRecoveryWorkflowStates.HELP_CREDENTIALS_LOST});
+  }
+
+  /**
+   * Whenever the user wants to request help because it lost its credentials.
+   * @returns {Promise<void>}
+   */
+  async requestHelpCredentialsLost() {
+    try {
+      await this.props.context.port.request('passbolt.account-recovery.request-help-credentials-lost');
+      await this.setState({state: AuthenticationAccountRecoveryWorkflowStates.CHECK_MAILBOX});
+    } catch (error) {
+      await this.setState({state: AuthenticationAccountRecoveryWorkflowStates.UNEXPECTED_ERROR, error: error});
+    }
+  }
+
+  /**
+   * Render the component
+   * @returns {JSX}
+   */
+  render() {
+    return (
+      <AuthenticationAccountRecoveryContext.Provider value={this.state}>
+        {this.props.children}
+      </AuthenticationAccountRecoveryContext.Provider>
+    );
+  }
+}
+
+AuthenticationAccountRecoveryContextProvider.propTypes = {
+  context: PropTypes.any, // The application context
+  children: PropTypes.any // The children components
+};
+export default withAppContext(AuthenticationAccountRecoveryContextProvider);
+
+/**
+ * Authentication account recovery context consumer HOC
+ * @param {React.Component} WrappedComponent The component to wrap
+ */
+export function withAuthenticationAccountRecoveryContext(WrappedComponent) {
+  return class WithAuthenticationContext extends React.Component {
+    render() {
+      return (
+        <AuthenticationAccountRecoveryContext.Consumer>
+          {
+            authenticationAccountRecoveryContext => <WrappedComponent
+              authenticationAccountRecoveryContext={authenticationAccountRecoveryContext} {...this.props} />
+          }
+        </AuthenticationAccountRecoveryContext.Consumer>
+      );
+    }
+  };
+}

package/src/react-extension/contexts/Authentication/AuthenticationAccountRecoveryContext.test.data.js

@@ -0,0 +1,51 @@
+/**
+ * Passbolt ~ Open source password manager for teams
+ * Copyright (c) 2022 Passbolt SA (https://www.passbolt.com)
+ *
+ * Licensed under GNU Affero General Public License version 3 of the or any later version.
+ * For full copyright and license information, please see the LICENSE.txt
+ * Redistributions of files must retain the above copyright notice.
+ *
+ * @copyright     Copyright (c) 2022 Passbolt SA (https://www.passbolt.com)
+ * @license       https://opensource.org/licenses/AGPL-3.0 AGPL License
+ * @link          https://www.passbolt.com Passbolt(tm)
+ * @since         3.6.0
+ */
+
+import MockPort from "../../test/mock/MockPort";
+import {defaultAppContext} from "../ExtAppContext.test.data";
+
+/**
+ * Default app context for authentication account recovery context.
+ * @param {Object} appContext The context properties override
+ * @return {Object}
+ */
+export function defaultAuthenticationAccountRecoveryAppContext(appContext = {}) {
+  const port = new MockPort();
+  port.addRequestListener("passbolt.account-recovery.continue", jest.fn());
+  port.addRequestListener("passbolt.account-recovery.get-account", jest.fn());
+  port.addRequestListener("passbolt.account-recovery.verify-passphrase", jest.fn());
+  port.addRequestListener("passbolt.account-recovery.recover-account", jest.fn());
+  port.addRequestListener("passbolt.account-recovery.sign-in", jest.fn());
+  port.addRequestListener("passbolt.account-recovery.request-help-credentials-lost", jest.fn());
+  port.addRequestListener("passbolt.account-recovery.download-recovery-kit", jest.fn());
+
+  const defaultAuthenticationRecover = {
+    port: port,
+    onRefreshLocaleRequested: jest.fn(),
+  };
+  return Object.assign(defaultAppContext(defaultAuthenticationRecover), appContext);
+}
+
+/**
+ * Default props.
+ * @param {Object} props The props to override
+ * @returns {object}
+ */
+export function defaultProps(props = {}) {
+  const defaultProps = {
+    context: defaultAuthenticationAccountRecoveryAppContext(props?.context),
+  };
+  delete props.context;
+  return Object.assign(defaultProps, props);
+}