passbolt-styleguide 3.8.4 → 3.9.0-alpha2

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

@@ -15,10 +15,6 @@ import PropTypes from "prop-types";
 import {withAppContext} from "./AppContext";
 import {withRouter} from "react-router-dom";
 import {withLoading} from "./LoadingContext";
-import {ApiClient} from "../../shared/lib/apiClient/apiClient";
-import DisplayAdministrationWorkspaceActions
-  from "../components/Administration/DisplayAdministrationWorkspaceActions/DisplayAdministrationWorkspaceActions";
-
 /**
  * Context related to resources ( filter, current selections, etc.)
  */
@@ -26,36 +22,18 @@ export const AdministrationWorkspaceContext = React.createContext({
   selectedAdministration: null, // The current menu administration selected
   can: {
     save: false, // If the button save settings is enable
-    test: false, // If the button test settings is enable
-    synchronize: false // If the button synchronize settings is enable
   },
   must: {
     save: false, // Must save settings
-    test: false, // Must test settings
-    synchronize: false, // Must synchronize settings
     editSubscriptionKey: false, // Must edit subscription key
     refreshSubscriptionKey: false // Must refresh the subscription key
   },
-  administrationWorkspaceAction: DisplayAdministrationWorkspaceActions, // Class of the component to display the actions of the users
+  administrationWorkspaceAction: null, // Class of the component to display the actions of the users
   setDisplayAdministrationWorkspaceAction: () => {}, // Whenever the component to display workspace action is requested
   resetDisplayAdministrationWorkspaceAction: () => {}, // Whenever the reset of the display workspace action is requested
-  onGetMfaRequested: () => {}, // Whenever the user access to the Mfa page
-  onSaveMfaRequested: () => {}, // Whenever the user wants save Mfa settings
-  onGetUsersDirectoryRequested: () => {}, // Whenever the user access to the users directory page
-  onUpdateUsersDirectoryRequested: () => {}, // Whenever the user update the users directory settings
-  onDeleteUsersDirectoryRequested: () => {}, // Whenever the user delete the users directory settings
-  onTestUsersDirectoryRequested: () => {}, // Whenever the user test the users directory settings
-  onGetSimulateSynchronizeUsersDirectoryRequested: () => {}, // Whenever the user simulate synchronize the users directory settings
-  onGetSynchronizeUsersDirectoryRequested: () => {}, // Whenever the user synchronize the users directory settings
-  onGetUsersRequested: () => {}, // Whenever we need get the users
   onUpdateSubscriptionKeyRequested: () => {}, // Whenever the user update the subscription key
-  onSaveLocaleRequested: () => {}, // Whenever the user access save the locale settings
   onSaveEnabled: () => {}, // Whenever a user change settings
   onMustSaveSettings: () => {}, // Whenever a user wants save settings
-  onTestEnabled: () => {}, // Whenever a user change settings
-  onMustTestSettings: () => {}, // Whenever a user wants save settings
-  onSynchronizeEnabled: () => {}, // Whenever a user have settings to be synchronized
-  onMustSynchronizeSettings: () => {}, // Whenever a user wants synchronized settings
   onMustEditSubscriptionKey: () => {}, // Whenever a user wants edit the susbcription key
   onMustRefreshSubscriptionKey: () => {}, // Whenever the susbcription key needs to be refreshed
   onResetActionsSettings: () => {}, // Reset states after a user do an action for the settings
@@ -82,36 +60,18 @@ class AdministrationWorkspaceContextProvider extends React.Component {
       selectedAdministration: AdministrationWorkspaceMenuTypes.NONE, // The current menu administration selected
       can: {
         save: false, // If the button save settings is enable
-        test: false, // If the button test settings is enable
-        synchronize: false // If the button synchronize settings is enable
       },
       must: {
         save: false, // Must save settings
-        test: false, // Must test settings
-        synchronize: false, // Must synchronize settings
         editSubscriptionKey: false, // Must edit subscription key
         refreshSubscriptionKey: false // Must refresh the susbcription key
       },
-      administrationWorkspaceAction: DisplayAdministrationWorkspaceActions, // Class of the component to display the actions of the users
+      administrationWorkspaceAction: () => <></>, // Class of the component to display the actions of the users
       setDisplayAdministrationWorkspaceAction: this.setDisplayAdministrationWorkspaceAction.bind(this), // Whenever the component to display workspace action is requested
       resetDisplayAdministrationWorkspaceAction: this.resetDisplayAdministrationWorkspaceAction.bind(this), // Whenever the reset of the display workspace action is requested
-      onGetMfaRequested: this.onGetMfaRequested.bind(this), // Whenever the user access to the Mfa page
-      onSaveMfaRequested: this.onSaveMfaRequested.bind(this), // Whenever the user wants save the Mfa page
-      onGetUsersDirectoryRequested: this.onGetUsersDirectoryRequested.bind(this), // Whenever the user access to the users directory page
-      onUpdateUsersDirectoryRequested: this.onUpdateUsersDirectoryRequested.bind(this), // Whenever the user update the users directory settings
-      onDeleteUsersDirectoryRequested: this.onDeleteUsersDirectoryRequested.bind(this), // Whenever the user delete the users directory settings
-      onTestUsersDirectoryRequested: this.onTestUsersDirectoryRequested.bind(this), // Whenever the user test the users directory settings
-      onGetSimulateSynchronizeUsersDirectoryRequested: this.onGetSimulateSynchronizeUsersDirectoryRequested.bind(this), // Whenever the user simulate synchronize the users directory settings
-      onGetSynchronizeUsersDirectoryRequested: this.onGetSynchronizeUsersDirectoryRequested.bind(this), // Whenever the user synchronize the users directory settings
-      onGetUsersRequested: this.onGetUsersRequested.bind(this), // Whenever we need get the users
       onUpdateSubscriptionKeyRequested: this.onUpdateSubscriptionKeyRequested.bind(this), // Whenever the user update the subscription key
-      onSaveLocaleRequested: this.onSaveLocaleRequested.bind(this), // Whenever the user save the locale settings
       onSaveEnabled: this.handleSaveEnabled.bind(this), // Whenever a user change settings
       onMustSaveSettings: this.handleMustSaveSettings.bind(this), // Whenever a user wants save settings
-      onTestEnabled: this.handleTestEnabled.bind(this), // Whenever a user have settings to be tested
-      onMustTestSettings: this.handleMustTestSettings.bind(this), // Whenever a user wants test settings
-      onSynchronizeEnabled: this.handleSynchronizeEnabled.bind(this), // Whenever a user have settings to be synchronized
-      onMustSynchronizeSettings: this.handleMustSynchronizeSettings.bind(this), // Whenever a user wants synchronized settings
       onMustEditSubscriptionKey: this.handleMustEditSubscriptionKey.bind(this), // Whenever a user wants edit the susbcription key
       onMustRefreshSubscriptionKey: this.handleMustRefreshSubscriptionKey.bind(this), // Whenever the susbcription key needs to be refreshed
       onResetActionsSettings: this.handleResetActionsSettings.bind(this), // Reset states after a user do an action for the settings
@@ -147,34 +107,6 @@ class AdministrationWorkspaceContextProvider extends React.Component {
     await this.setState({must: {...this.state.must, save: true}});
   }
 
-  /**
-   * Handle test enabled
-   */
-  async handleTestEnabled(boolean) {
-    await this.setState({can: {...this.state.can, test: boolean}});
-  }
-
-  /**
-   * Handle must test settings
-   */
-  async handleMustTestSettings() {
-    await this.setState({must: {...this.state.must, test: true}});
-  }
-
-  /**
-   * Handle synchronize enabled
-   */
-  async handleSynchronizeEnabled(boolean) {
-    await this.setState({can: {...this.state.can, synchronize: boolean}});
-  }
-
-  /**
-   * Handle must synchronize settings
-   */
-  async handleMustSynchronizeSettings() {
-    await this.setState({must: {...this.state.must, synchronize: true}});
-  }
-
   /**
    * Handle must edit subscription key
    */
@@ -225,6 +157,8 @@ class AdministrationWorkspaceContextProvider extends React.Component {
     const isInternationalizationLocation = this.props.location.pathname.includes('internationalization');
     const isAccountRecoveryLocation = this.props.location.pathname.includes('account-recovery');
     const isSmtpSettingsLocation = this.props.location.pathname.includes('smtp-settings');
+    const isSelfRegistrationLocation = this.props.location.pathname.includes('self-registration');
+    const isSso = this.props.location.pathname.includes('sso');
     const can = {
       save: false,
       test: false,
@@ -242,17 +176,21 @@ class AdministrationWorkspaceContextProvider extends React.Component {
     if (isMfaLocation) {
       selectedAdministration = AdministrationWorkspaceMenuTypes.MFA;
     } else if (isUserDirectoryLocation) {
-      selectedAdministration =  AdministrationWorkspaceMenuTypes.USER_DIRECTORY;
+      selectedAdministration = AdministrationWorkspaceMenuTypes.USER_DIRECTORY;
     } else if (isEmailNotificationLocation) {
-      selectedAdministration =  AdministrationWorkspaceMenuTypes.EMAIL_NOTIFICATION;
+      selectedAdministration = AdministrationWorkspaceMenuTypes.EMAIL_NOTIFICATION;
     } else if (isSubscriptionLocation) {
-      selectedAdministration =  AdministrationWorkspaceMenuTypes.SUBSCRIPTION;
+      selectedAdministration = AdministrationWorkspaceMenuTypes.SUBSCRIPTION;
     } else if (isInternationalizationLocation) {
-      selectedAdministration =  AdministrationWorkspaceMenuTypes.INTERNATIONALIZATION;
+      selectedAdministration = AdministrationWorkspaceMenuTypes.INTERNATIONALIZATION;
     } else if (isAccountRecoveryLocation) {
-      selectedAdministration =  AdministrationWorkspaceMenuTypes.ACCOUNT_RECOVERY;
+      selectedAdministration = AdministrationWorkspaceMenuTypes.ACCOUNT_RECOVERY;
     } else if (isSmtpSettingsLocation) {
-      selectedAdministration =  AdministrationWorkspaceMenuTypes.SMTP_SETTINGS;
+      selectedAdministration = AdministrationWorkspaceMenuTypes.SMTP_SETTINGS;
+    } else if (isSelfRegistrationLocation) {
+      selectedAdministration = AdministrationWorkspaceMenuTypes.SELF_REGISTRATION;
+    } else if (isSso) {
+      selectedAdministration = AdministrationWorkspaceMenuTypes.SSO;
     }
     await this.setState({selectedAdministration, can, must});
   }
@@ -269,97 +207,7 @@ class AdministrationWorkspaceContextProvider extends React.Component {
    * Reset the display of the administration workspace action
    */
   resetDisplayAdministrationWorkspaceAction() {
-    this.setState({administrationWorkspaceAction: DisplayAdministrationWorkspaceActions});
-  }
-
-  /**
-   * Whenever the mfa is requested.
-   * @return {Promise<object>}
-   */
-  async onGetMfaRequested() {
-    const apiClientOptions = this.props.context.getApiClientOptions().setResourceName("mfa/settings");
-    const apiClient = new ApiClient(apiClientOptions);
-    return apiClient.findAll();
-  }
-
-  /**
-   * Whenever the save mfa is requested.
-   * @return {Promise<object>}
-   */
-  async onSaveMfaRequested(mfa) {
-    const apiClientOptions = this.props.context.getApiClientOptions().setResourceName("mfa/settings");
-    const apiClient = new ApiClient(apiClientOptions);
-    await apiClient.create(mfa);
-  }
-
-  /**
-   * Whenever the users directory is requested.
-   * @return {Promise<object>}
-   */
-  async onGetUsersDirectoryRequested() {
-    const apiClientOptions = this.props.context.getApiClientOptions().setResourceName("directorysync/settings");
-    const apiClient = new ApiClient(apiClientOptions);
-    return apiClient.findAll();
-  }
-
-  /**
-   * Whenever the update users directory is requested.
-   * @return {Promise<object>}
-   */
-  async onUpdateUsersDirectoryRequested(usersDirectory) {
-    const apiClientOptions = this.props.context.getApiClientOptions().setResourceName("directorysync");
-    const apiClient = new ApiClient(apiClientOptions);
-    return apiClient.update('settings', usersDirectory);
-  }
-
-  /**
-   * Whenever the delete users directory is requested.
-   * @return {Promise<object>}
-   */
-  async onDeleteUsersDirectoryRequested() {
-    const apiClientOptions = this.props.context.getApiClientOptions().setResourceName("directorysync");
-    const apiClient = new ApiClient(apiClientOptions);
-    return apiClient.delete('settings');
-  }
-
-  /**
-   * Whenever the test users directory is requested.
-   * @return {Promise<object>}
-   */
-  async onTestUsersDirectoryRequested(usersDirectory) {
-    const apiClientOptions = this.props.context.getApiClientOptions().setResourceName("directorysync/settings/test");
-    const apiClient = new ApiClient(apiClientOptions);
-    return apiClient.create(usersDirectory);
-  }
-
-  /**
-   * Whenever the simulate synchronize users directory is requested.
-   * @return {Promise<object>}
-   */
-  async onGetSimulateSynchronizeUsersDirectoryRequested() {
-    const apiClientOptions = this.props.context.getApiClientOptions().setResourceName("directorysync");
-    const apiClient = new ApiClient(apiClientOptions);
-    return apiClient.get("synchronize/dry-run");
-  }
-
-  /**
-   * Whenever the simulate synchronize users directory is requested.
-   * @return {Promise<object>}
-   */
-  async onGetSynchronizeUsersDirectoryRequested() {
-    const apiClientOptions = this.props.context.getApiClientOptions().setResourceName("directorysync/synchronize");
-    const apiClient = new ApiClient(apiClientOptions);
-    return apiClient.create({});
-  }
-
-  /**
-   * Whenever the users is requested.
-   * @return {Promise<object>}
-   */
-  async onGetUsersRequested() {
-    const apiClientOptions = this.props.context.getApiClientOptions().setResourceName("users");
-    const apiClient = new ApiClient(apiClientOptions);
-    return apiClient.findAll();
+    this.setState({administrationWorkspaceAction: () => <></>});
   }
 
   /**
@@ -371,17 +219,6 @@ class AdministrationWorkspaceContextProvider extends React.Component {
     return this.props.context.port.request("passbolt.subscription.update", keyDto);
   }
 
-  /**
-   * Whenever the locale is requested.
-   * @param {string} value the locale
-   * @return {Promise<object>}
-   */
-  async onSaveLocaleRequested(value) {
-    const apiClientOptions = this.props.context.getApiClientOptions().setResourceName("locale/settings");
-    const apiClient = new ApiClient(apiClientOptions);
-    return apiClient.create({value});
-  }
-
   /**
    * Render the component
    * @returns {JSX}
@@ -438,4 +275,6 @@ export const AdministrationWorkspaceMenuTypes = {
   INTERNATIONALIZATION: 'INTERNATIONALIZATION', // Internationalization administration menu selected
   ACCOUNT_RECOVERY: 'ACCOUNT-RECOVERY', // Account Recovery administration menu selected
   SMTP_SETTINGS: 'SMTP-SETTINGS', // Smtp settings administration menu selected
+  SELF_REGISTRATION: 'SELF-REGISTRATION', // Self registration settings administration menu selected
+  SSO: "SSO", // SSO administration menu selected
 };

package/src/react-extension/contexts/AdministrationWorkspaceContext.test.js

@@ -94,16 +94,6 @@ describe("Administration Workspace Context", () => {
       await page.onSaveEnabled();
       expect(page.isSaveEnabled).toBeTruthy();
     });
-
-    it("As AD I should have the test enabled", async() => {
-      await page.onTestEnabled();
-      expect(page.isTestEnabled).toBeTruthy();
-    });
-
-    it("As AD I should have the synchronize enabled", async() => {
-      await page.onSynchronizeEnabled();
-      expect(page.isSynchronizeEnabled).toBeTruthy();
-    });
   });
 
   describe("As AD I should have the appropriate action enable at any time", () => {
@@ -112,16 +102,6 @@ describe("Administration Workspace Context", () => {
       expect(page.mustSaveSettings).toBeTruthy();
     });
 
-    it("As AD I should enabled must test settings", async() => {
-      await page.onMustTestSettings();
-      expect(page.mustTestSettings).toBeTruthy();
-    });
-
-    it("As AD I should enabled must synchronize settings", async() => {
-      await page.onMustSynchronizeSettings();
-      expect(page.mustSynchronizeSettings).toBeTruthy();
-    });
-
     it("As AD I should enabled must edit subscription key", async() => {
       await page.onMustEditSubscriptionKey();
       expect(page.mustEditSubscriptionKey).toBeTruthy();
@@ -134,19 +114,13 @@ describe("Administration Workspace Context", () => {
 
     it("As AD I should enabled reset all action settings", async() => {
       await page.onMustSaveSettings();
-      await page.onMustTestSettings();
-      await page.onMustSynchronizeSettings();
       await page.onMustEditSubscriptionKey();
       await page.onMustRefreshSubscriptionKey();
       expect(page.mustSaveSettings).toBeTruthy();
-      expect(page.mustTestSettings).toBeTruthy();
-      expect(page.mustSynchronizeSettings).toBeTruthy();
       expect(page.mustEditSubscriptionKey).toBeTruthy();
       expect(page.mustRefreshSubscriptionKey).toBeTruthy();
       await page.onResetActionsSettings();
       expect(page.mustSaveSettings).toBeFalsy();
-      expect(page.mustTestSettings).toBeFalsy();
-      expect(page.mustSynchronizeSettings).toBeFalsy();
       expect(page.mustEditSubscriptionKey).toBeFalsy();
       expect(page.mustRefreshSubscriptionKey).toBeFalsy();
     });

package/src/react-extension/contexts/ApiAppContext.test.data.js

@@ -20,19 +20,21 @@ import {ApiClientOptions} from "../../shared/lib/apiClient/apiClientOptions";
  * @param {Object} appContext (Optional)Properties to override
  * @returns {Object}
  */
-export function defaultAppContext(appContext = {}) {
+export function defaultAppContext(appContext = {}, userId = uuidv4()) {
   const siteSettings = new SiteSettings(siteSettingsFixture);
   const defaultAppContext = {
     locale: 'en-UK',
+    onRefreshLocaleRequested: jest.fn(),
     siteSettings,
     trustedDomain: "http://localhost:6006",
     loggedInUser: {
-      id: uuidv4(),
+      id: userId,
       username: "user@passbolt.com",
       role: {
         name: 'admin'
       }
     },
+    setContext: jest.fn(),
     baseUrl: "http://localhost:6006",
     getApiClientOptions: () => new ApiClientOptions()
       .setBaseUrl("http://localhost:6006")

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

@@ -14,6 +14,8 @@
 import React from "react";
 import PropTypes from "prop-types";
 import {withAppContext} from "../AppContext";
+import {withSso} from "../SsoContext";
+import SsoProviders from "../../components/Administration/ManageSsoSettings/SsoProviders.data";
 
 // The authentication login workflow states.
 export const AuthenticationLoginWorkflowStates = {
@@ -44,6 +46,8 @@ export const AuthenticationLoginContext = React.createContext({
   }, // Whenever a user passphrase check is required.
   signIn: () => {
   }, // Whenever a user sign-in is required.
+  handleSsoSignIn: () => {
+  }, // Whenever a user sign-in via SSO is required.
   handleSwitchAccount: () => {
   }, // Whenever a switch account is required.
   acceptNewServerKey: () => {
@@ -54,6 +58,10 @@ export const AuthenticationLoginContext = React.createContext({
   }, // Whenever the user wants to request help because it lost its credentials.
   goToValidatePassphrase: () => {
   }, // Whenever the users wants to go to the validate passphrase.
+  handleSsoLoginError: () => {
+  }, // Handles the SSO login error
+  getSsoProvider: () => {
+  }, // Returns the current SSO provider if any
 });
 
 /**
@@ -83,19 +91,23 @@ export class AuthenticationLoginContextProvider extends React.Component {
       // Public workflow mutators.
       checkPassphrase: this.checkPassphrase.bind(this), // Whenever a user passphrase check is required.
       signIn: this.signIn.bind(this), // Whenever a user sign-in is required.
+      handleSsoSignIn: this.handleSsoSignIn.bind(this), // Whenever a user sign-in via SSO is required.
       handleSwitchAccount: this.handleSwitchAccount.bind(this), // Whenever a switch account is required.
       acceptNewServerKey: this.acceptNewServerKey.bind(this), // Whenever a new server gpg key is accepted.
       needHelpCredentialsLost: this.needHelpCredentialsLost.bind(this), // Whenever a user lost its passphrase.
       requestHelpCredentialsLost: this.requestHelpCredentialsLost.bind(this), // Whenever the user wants to request help because it lost its credentials.
       goToValidatePassphrase: this.goToValidatePassphrase.bind(this), // Whenever the users wants to go to the validate passphrase.
+      handleSsoLoginError: this.handleSsoLoginError.bind(this), // Handles the SSO login error
+      getSsoProvider: this.getSsoProvider.bind(this), // Returns the current SSO provider if any
     };
   }
 
   /**
    * Whenever the component is initialized
    */
-  componentDidMount() {
-    this.initialize();
+  async componentDidMount() {
+    await this.initialize();
+    await this.props.ssoContext.loadSsoConfiguration();
   }
 
   /**
@@ -170,6 +182,23 @@ export class AuthenticationLoginContextProvider extends React.Component {
     }
   }
 
+  /**
+   * Whenever the user wants to sign in using SSO.
+   * @returns {Promise<void>}
+   */
+  async handleSsoSignIn() {
+    try {
+      await this.props.ssoContext.runSignInProcess();
+      this.setState({state: AuthenticationLoginWorkflowStates.SIGNING_IN});
+    } catch (e) {
+      if (e.name === "UserClosedSsoPopUpError") {
+        throw e; // the error needs to be sent to Login.js in order to display the right form
+      } else {
+        this.handleSsoLoginError(e);
+      }
+    }
+  }
+
   /**
    * Whenever the user wants to switch account.
    */
@@ -178,6 +207,14 @@ export class AuthenticationLoginContextProvider extends React.Component {
     window.open(url, '_parent', 'noopener,noreferrer');
   }
 
+  /**
+   * Handles the SSO login error
+   * @param {error} e
+   */
+  handleSsoLoginError(e) {
+    this.setState({state: AuthenticationLoginWorkflowStates.UNEXPECTED_ERROR, error: e});
+  }
+
   /**
    * Whenever the user accepts the new server key.
    * @returns {Promise<void>}
@@ -225,6 +262,18 @@ export class AuthenticationLoginContextProvider extends React.Component {
     await this.setState({state: AuthenticationLoginWorkflowStates.SIGN_IN});
   }
 
+  /**
+   * Returns the current SSO provider if any, null otherwise
+   * @returns {object}
+   */
+  getSsoProvider() {
+    const ssoProvider = this.props.ssoContext.getProvider();
+    if (!ssoProvider) {
+      return null;
+    }
+    return SsoProviders.find(provider => provider.id === ssoProvider);
+  }
+
   /**
    * Render the component
    * @returns {JSX}
@@ -240,9 +289,10 @@ export class AuthenticationLoginContextProvider extends React.Component {
 
 AuthenticationLoginContextProvider.propTypes = {
   context: PropTypes.any, // The application context
-  children: PropTypes.any // The children components
+  children: PropTypes.any, // The children components
+  ssoContext: PropTypes.object, // The SSO user context
 };
-export default withAppContext(AuthenticationLoginContextProvider);
+export default withAppContext(withSso(AuthenticationLoginContextProvider));
 
 /**
  * Authentication login context consumer HOC

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

@@ -59,9 +59,18 @@ export function defaultAuthenticationLoginAppContextWithAccountRecoveryDisabled(
  * @returns {object}
  */
 export function defaultProps(props) {
+  const ssoContext = Object.assign({
+    loadSsoConfiguration: () => {},
+    runSignInProcess: () => {}
+  }, props?.ssoContext);
+
   const defaultProps = {
-    context: defaultAuthenticationLoginAppContext()
+    context: defaultAuthenticationLoginAppContext(),
+    ssoContext: ssoContext
   };
+
+  delete props?.ssoContext;
+
   return Object.assign(defaultProps, props || {});
 }