passbolt-styleguide 3.5.2 → 3.6.0-alpha2

package/src/react-extension/components/Authentication/CheckPassphrase/HelpOnPrivateKeyLostSecondaryAction.js

@@ -1,41 +0,0 @@
-/**
- * Passbolt ~ Open source password manager for teams
- * Copyright (c) 2020 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) 2020 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.0.0
- */
-import React, {Component} from "react";
-import {withAuthenticationContext} from "../../../contexts/AuthenticationContext";
-import {Trans, withTranslation} from "react-i18next";
-import PropTypes from "prop-types";
-
-class HelpOnPrivateKeyLostSecondaryAction extends Component {
-  /**
-   * Get the translate function
-   * @returns {function(...[*]=)}
-   */
-  get translate() {
-    return this.props.t;
-  }
-
-  render() {
-    return (
-      <a onClick={this.props.authenticationContext.onPassphraseLost}>
-        <Trans>Help, I lost my private key.</Trans>
-      </a>
-    );
-  }
-}
-
-HelpOnPrivateKeyLostSecondaryAction.propTypes = {
-  authenticationContext: PropTypes.any, // The authentication context
-  t: PropTypes.func, // The translation function
-};
-export default withAuthenticationContext(withTranslation('common')(HelpOnPrivateKeyLostSecondaryAction));

package/src/react-extension/components/Authentication/ImportGpgKey/GenerateKeySecondaryAction.js

@@ -1,40 +0,0 @@
-/**
- * Passbolt ~ Open source password manager for teams
- * Copyright (c) 2020 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) 2020 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.0.0
- */
-import React, {Component} from "react";
-import {withAuthenticationContext} from "../../../contexts/AuthenticationContext";
-import {Trans, withTranslation} from "react-i18next";
-import PropTypes from "prop-types";
-
-export class GenerateKeySecondaryAction extends Component {
-  /**
-   * Get the translate function
-   * @returns {function(...[*]=)}
-   */
-  get translate() {
-    return this.props.t;
-  }
-
-  render() {
-    return (
-      <a onClick={this.props.authenticationContext.onGoToGenerateGpgKeyRequested}>
-        <Trans>Or generate a new private key.</Trans>
-      </a>
-    );
-  }
-}
-GenerateKeySecondaryAction.propTypes = {
-  authenticationContext: PropTypes.any, // The authentication context
-  t: PropTypes.func, // The translation function
-};
-export default withAuthenticationContext(withTranslation('common')(GenerateKeySecondaryAction));

package/src/react-extension/components/Authentication/IntroduceSetupExtension/IntroduceSetupExtension.test.data.js

@@ -1,11 +0,0 @@
-/**
- * Default props
- * @returns {{}}
- */
-export function defaultProps() {
-  return {
-    authenticationContext: {
-      onCompleteIntroduceSetupExtension: jest.fn()
-    }
-  };
-}

package/src/react-extension/components/Authentication/IntroduceSetupExtension/IntroduceSetupExtension.test.stories.js

@@ -1,34 +0,0 @@
-import React from "react";
-import {MemoryRouter, Route} from "react-router-dom";
-import {AuthenticationContext} from "../../../contexts/AuthenticationContext";
-import IntroduceSetupExtension from "./IntroduceSetupExtension";
-
-
-export default {
-  title: 'Passbolt/Authentication/IntroduceSetupExtension',
-  component: IntroduceSetupExtension
-};
-
-const context = {
-  onCompletedIntroduceSetupExtension: jest.fn()
-};
-
-
-const Template = args =>
-  <AuthenticationContext.Provider value={context}>
-    <div id="container" className="container page login">
-      <div className="content">
-        <div className="login-form">
-          <MemoryRouter initialEntries={['/']}>
-            <Route component={routerProps => <IntroduceSetupExtension {...args} {...routerProps}/>}></Route>
-          </MemoryRouter>
-        </div>
-      </div>
-    </div>
-  </AuthenticationContext.Provider>;
-
-
-export const Initial = Template.bind({});
-Initial.parameters = {
-  css: "ext_authentication"
-};

package/src/react-extension/components/AuthenticationLogin/DisplayLoginError/DisplayLoginError.js

@@ -1,87 +0,0 @@
-/**
- * Passbolt ~ Open source password manager for teams
- * Copyright (c) 2020 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) 2020 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.0.0
- */
-import React, {Component} from "react";
-import PropTypes from "prop-types";
-import {withAuthenticationContext} from "../../../contexts/AuthenticationContext";
-import {Trans, withTranslation} from "react-i18next";
-
-/**
- * This component displays an error when the user cannot log in
- */
-class DisplayLoginError extends Component {
-  /**
-   * Default constructor
-   * @param props Component props
-   */
-  constructor(props) {
-    super(props);
-    this.bindEventHandlers();
-  }
-
-  /**
-   * Handle component event handlers
-   */
-  bindEventHandlers() {
-    this.handleSubmit = this.handleSubmit.bind(this);
-  }
-
-  /**
-   * Whenever the users wants to try to log in again
-   * @param event Dom event
-   */
-  async handleSubmit(event) {
-    event.preventDefault();
-    await this.props.authenticationContext.onTryLoginAgainRequested();
-  }
-
-  /**
-   * Get the translate function
-   * @returns {function(...[*]=)}
-   */
-  get translate() {
-    return this.props.t;
-  }
-
-  /**
-   * Render the component
-   */
-  render() {
-    return (
-      <div>
-        <h1><Trans>Sorry, you have not been signed in.</Trans></h1>
-        <p><Trans>Something went wrong, the sign in failed with the following error:</Trans> </p>
-        <p>{this.props.error && this.props.error.message}</p>
-        <form
-          acceptCharset="utf-8"
-          onSubmit={this.handleSubmit}>
-          <div className="form-actions">
-            <button
-              type="submit"
-              className={`button primary big full-width`}
-              role="button">
-              <Trans>Try again</Trans>
-            </button>
-          </div>
-        </form>
-      </div>
-    );
-  }
-}
-
-DisplayLoginError.propTypes = {
-  authenticationContext: PropTypes.any, // The authentication context
-  error: PropTypes.any, // The error to display
-  t: PropTypes.func, // The translation function
-};
-export default withAuthenticationContext(withTranslation('common')(DisplayLoginError));

package/src/react-extension/components/AuthenticationLogin/DisplayLoginError/DisplayLoginError.test.stories.js

@@ -1,33 +0,0 @@
-import React from "react";
-import {MemoryRouter, Route} from "react-router-dom";
-import {AuthenticationContext} from "../../../contexts/AuthenticationContext";
-import DisplayLoginError from "./DisplayLoginError";
-
-
-export default {
-  title: 'Passbolt/AuthenticationLogin/DisplayLoginError',
-  component: DisplayLoginError
-};
-
-const context = {
-};
-
-
-const Template = args =>
-  <AuthenticationContext.Provider value={context}>
-    <div id="container" className="container page login">
-      <div className="content">
-        <div className="login-form">
-          <MemoryRouter initialEntries={['/']}>
-            <Route component={routerProps => <DisplayLoginError {...args} {...routerProps}/>}></Route>
-          </MemoryRouter>
-        </div>
-      </div>
-    </div>
-  </AuthenticationContext.Provider>;
-
-
-export const Initial = Template.bind({});
-Initial.parameters = {
-  css: "ext_authentication"
-};

package/src/react-extension/components/AuthenticationLogin/DisplayLoginInProgress/DisplayLoginInProgress.js

@@ -1,49 +0,0 @@
-/**
- * Passbolt ~ Open source password manager for teams
- * Copyright (c) 2020 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) 2020 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.0.0
- */
-import React, {Component} from "react";
-import {Trans, withTranslation} from "react-i18next";
-import PropTypes from "prop-types";
-
-/**
- * This component displays an in progress feedback to the user when he's log in
- */
-class DisplayLoginInProgress extends Component {
-  /**
-   * Get the translate function
-   * @returns {function(...[*]=)}
-   */
-  get translate() {
-    return this.props.t;
-  }
-
-  /**
-   * Render the component
-   */
-  render() {
-    return (
-      <div className="login-processing">
-        <div className="processing-wrapper">
-          <span className="processing"></span>
-        </div>
-        <h1><Trans>Signing in, please wait...</Trans></h1>
-      </div>
-    );
-  }
-}
-
-DisplayLoginInProgress.propTypes = {
-  t: PropTypes.func, // The translation function
-};
-
-export default withTranslation('common')(DisplayLoginInProgress);

package/src/react-extension/components/AuthenticationLogin/DisplayLoginInProgress/DisplayLoginProgress.test.stories.js

@@ -1,33 +0,0 @@
-import React from "react";
-import {MemoryRouter, Route} from "react-router-dom";
-import {AuthenticationContext} from "../../../contexts/AuthenticationContext";
-import DisplayLoginInProgress from "./DisplayLoginInProgress";
-
-
-export default {
-  title: 'Passbolt/AuthenticationLogin/DisplayLoginInProgress',
-  component: DisplayLoginInProgress
-};
-
-const context = {
-};
-
-
-const Template = args =>
-  <AuthenticationContext.Provider value={context}>
-    <div id="container" className="container page login">
-      <div className="content">
-        <div className="login-form">
-          <MemoryRouter initialEntries={['/']}>
-            <Route component={routerProps => <DisplayLoginInProgress {...args} {...routerProps}/>}></Route>
-          </MemoryRouter>
-        </div>
-      </div>
-    </div>
-  </AuthenticationContext.Provider>;
-
-
-export const Initial = Template.bind({});
-Initial.parameters = {
-  css: "ext_authentication"
-};

package/src/react-extension/components/AuthenticationLogin/OrchestrateLogin/OrchestrateLogin.js

@@ -1,102 +0,0 @@
-import React, {Component} from "react";
-import {
-  AuthenticationContextState,
-  withAuthenticationContext
-} from "../../../contexts/AuthenticationContext";
-import Login from "../Login/Login";
-import DisplayLoginInProgress from "../DisplayLoginInProgress/DisplayLoginInProgress";
-import DisplayLoginError from "../DisplayLoginError/DisplayLoginError";
-import AcceptLoginServerKeyChange from "../AcceptLoginServerKeyChange/AcceptLoginServerKeyChange";
-import NotifyError from "../../Common/Error/NotifyError/NotifyError";
-import {withDialog} from "../../../contexts/DialogContext";
-import PropTypes from "prop-types";
-import LoadingSpinner from "../../Common/Loading/LoadingSpinner/LoadingSpinner";
-import DisplayUnexpectedError from "../../Authentication/DisplayUnexpectedError/DisplayUnexpectedError";
-import {withAppContext} from "../../../contexts/AppContext";
-
-/**
- * The component orchestrates the login authentication process
- */
-class OrchestrateLogin extends Component {
-  /**
-   * Whenever the component is initialized
-   */
-  componentDidMount() {
-    this.verifyServerKey();
-  }
-
-  /**
-   * Whenever the component changes
-   */
-  componentDidUpdate() {
-    const isServerKeyChecked = this.props.authenticationContext.state === AuthenticationContextState.LOGIN_SERVER_KEY_CHECKED;
-    const isServerKeyAccepted = this.props.authenticationContext.state === AuthenticationContextState.LOGIN_NEW_SERVER_KEY_ACCEPTED;
-    const canInitialize = isServerKeyAccepted || isServerKeyChecked;
-    if (canInitialize) {
-      this.initializeLogin();
-    }
-  }
-
-  /**
-   * Verify the potential change of server key
-   */
-  verifyServerKey() {
-    this.props.authenticationContext.onVerifyServerKeyRequested()
-      .catch(this.onVerifyServerKeyFailure.bind(this));
-  }
-
-  /**
-   * Whenever an uncontrolled error occured while the verification of server key
-   */
-  onVerifyServerKeyFailure(error) {
-    const ErrorDialogProps = {message: error.message};
-    this.props.dialogContext.open(NotifyError, ErrorDialogProps);
-  }
-
-  /**
-   * Initialize the login process
-   */
-  initializeLogin() {
-    this.props.authenticationContext.onInitializeLoginRequested();
-  }
-
-  /**
-   * Can the user use the remember until I logout option
-   * @return {boolean}
-   */
-  get canRememberMe() {
-    return this.props.context.siteSettings.hasRememberMeUntilILogoutOption;
-  }
-
-  /**
-   * Render the component
-   */
-  render() {
-    switch (this.props.authenticationContext.state) {
-      case AuthenticationContextState.LOGIN_INITIALIZED:
-        if (this.props.context.siteSettings) {
-          return <Login canRememberMe={this.canRememberMe}/>;
-        } else {
-          return <LoadingSpinner/>;
-        }
-      case AuthenticationContextState.LOGIN_IN_PROGRESS:
-        return <DisplayLoginInProgress/>;
-      case AuthenticationContextState.LOGIN_FAILED:
-        return <DisplayLoginError error={this.props.authenticationContext.error}/>;
-      case AuthenticationContextState.LOGIN_SERVER_KEY_CHANGED:
-        return <AcceptLoginServerKeyChange/>;
-      case AuthenticationContextState.UNEXPECTED_ERROR:
-        return <DisplayUnexpectedError error={this.props.authenticationContext.error}/>;
-      default:
-        return <LoadingSpinner/>;
-    }
-  }
-}
-
-OrchestrateLogin.propTypes = {
-  context: PropTypes.any, // The application context
-  authenticationContext: PropTypes.any, // The authentication context
-  siteSettings: PropTypes.object, // The site settings
-  dialogContext: PropTypes.any // The dialog context
-};
-export default withAppContext(withAuthenticationContext(withDialog(OrchestrateLogin)));

package/src/react-extension/components/Internationalisation/ChangeLocale/ChangeExtAuthenticationLocale.js

@@ -1,63 +0,0 @@
-/**
- * Passbolt ~ Open source password manager for teams
- * Copyright (c) 2020 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) 2020 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.2.0
- */
-import React, {Component} from "react";
-import PropTypes from "prop-types";
-import ChangeLocale from "./ChangeLocale";
-import {
-  AuthenticationContextState,
-  withAuthenticationContext
-} from "../../../contexts/AuthenticationContext";
-
-/**
- * This component allows the user to change the locale for the authentication workflows.
- */
-class ChangeExtAuthenticationLocale extends Component {
-  /**
-   * The states for witch the language switch must be displayed.
-   * @returns {array}
-   */
-  get statesToHideLocaleSwitch() {
-    return [
-      AuthenticationContextState.INITIAL_STATE,
-      AuthenticationContextState.SECURITY_TOKEN_SAVED,
-      AuthenticationContextState.RECOVER_COMPLETED,
-      AuthenticationContextState.SETUP_COMPLETED,
-    ];
-  }
-
-  /**
-   * Must display the locale switch component.
-   * @type {boolean}
-   */
-  get mustDisplayLocaleSwitch() {
-    return !this.statesToHideLocaleSwitch.includes(this.props.authenticationContext.state);
-  }
-
-  /**
-   * Render the component
-   */
-  render() {
-    return (
-      <>
-        {this.mustDisplayLocaleSwitch && <ChangeLocale/>}
-      </>
-    );
-  }
-}
-
-ChangeExtAuthenticationLocale.propTypes = {
-  authenticationContext: PropTypes.any, // The authentication context
-};
-
-export default withAuthenticationContext(ChangeExtAuthenticationLocale);