From b04d18b739d4625e073dc8e929940be2d72c348a Mon Sep 17 00:00:00 2001
From: Alban Costaz <alban.costaz@gmail.com>
Date: Wed, 11 Sep 2024 16:44:47 +0200
Subject: [PATCH] [MS] Added back buttons after server choice on organization
 creation

---
 client/src/locales/en-US.json                 |  3 +-
 client/src/locales/fr-FR.json                 |  1 +
 client/src/views/client-area/BmsLogin.vue     | 20 +++++++-
 .../CreateOrganizationCustomServer.vue        |  2 +
 .../creation/CreateOrganizationModal.vue      |  7 +++
 .../creation/CreateOrganizationSaas.vue       |  3 ++
 .../creation/CreateOrganizationTrial.vue      |  2 +
 .../OrganizationNameAndServerPage.vue         |  1 -
 .../creation/OrganizationNamePage.vue         | 17 ++++++-
 .../OrganizationUserInformationPage.vue       |  1 -
 client/tests/pw/e2e/client_area_login.spec.ts |  6 +--
 .../tests/pw/e2e/create_organization.spec.ts  | 49 +++++++++++++++++++
 .../pw/e2e/create_organization_custom.spec.ts |  4 --
 .../pw/e2e/create_organization_saas.spec.ts   | 20 ++++----
 .../pw/e2e/create_organization_trial.spec.ts  |  4 --
 client/tests/pw/helpers/fixtures.ts           |  2 +-
 16 files changed, 114 insertions(+), 28 deletions(-)

diff --git a/client/src/locales/en-US.json b/client/src/locales/en-US.json
index 4265b2c4e30..539226027ed 100644
--- a/client/src/locales/en-US.json
+++ b/client/src/locales/en-US.json
@@ -1209,12 +1209,13 @@
     },
     "clientArea": {
         "app": {
-            "titleLinkOrganization": "Link you customer account to your new organization",
+            "titleLinkOrganization": "Link your customer account to your new organization",
             "titleLogin": "Log in to your customer account",
             "emailLabel": "Email",
             "password": "Password",
             "forgottenPassword": "Forgot your password?",
             "login": "Log in",
+            "backButton": "Back",
             "saveLogin": "Remember me",
             "loginFailed": "Cannot log in. Please check your email and password.",
             "networkFailed": "Could not reach the server. Make sure that you are online and try again.",
diff --git a/client/src/locales/fr-FR.json b/client/src/locales/fr-FR.json
index cbba9e0df7e..ced393a0934 100644
--- a/client/src/locales/fr-FR.json
+++ b/client/src/locales/fr-FR.json
@@ -1215,6 +1215,7 @@
             "password": "Mot de passe",
             "forgottenPassword": "Mot de passe oublié ?",
             "login": "Se connecter",
+            "backButton": "Retour",
             "saveLogin": "Se souvenir de moi",
             "loginFailed": "Impossible de se connecter. Veuillez vérifier votre email et mot de passe.",
             "networkFailed": "Impossible de contacter le serveur. Veuillez vérifier votre connexion à internet.",
diff --git a/client/src/views/client-area/BmsLogin.vue b/client/src/views/client-area/BmsLogin.vue
index 1883cd38288..135b336f3d2 100644
--- a/client/src/views/client-area/BmsLogin.vue
+++ b/client/src/views/client-area/BmsLogin.vue
@@ -107,8 +107,17 @@
           </ion-text>
         </div>
 
-        <!-- login button -->
+        <!-- back and login buttons -->
         <div class="saas-login-button">
+          <ion-text
+            :disabled="querying"
+            class="button-medium custom-button custom-button-ghost saas-login-button__item"
+            button
+            @click="$emit('goBackRequested')"
+          >
+            <ion-icon :icon="arrowBack" />
+            {{ $msTranslate('clientArea.app.backButton') }}
+          </ion-text>
           <ion-button
             v-if="!loading"
             :disabled="!emailInputRef || emailInputRef.validity !== Validity.Valid || !password.length || querying"
@@ -182,7 +191,7 @@
 import { IonButton, IonText, IonButtons, IonFooter, IonIcon, IonSkeletonText } from '@ionic/vue';
 import { MsInput, MsPasswordInput, Translatable, Validity, MsSpinner, MsCheckbox } from 'megashark-lib';
 import { emailValidator } from '@/common/validators';
-import { warning, arrowForward, close } from 'ionicons/icons';
+import { warning, arrowBack, arrowForward, close } from 'ionicons/icons';
 import { onMounted, ref } from 'vue';
 import { AuthenticationToken, BmsAccessInstance, PersonalInformationResultData } from '@/services/bms';
 import CreateOrganizationModalHeader from '@/components/organizations/CreateOrganizationModalHeader.vue';
@@ -196,6 +205,7 @@ const props = defineProps<{
 const emits = defineEmits<{
   (e: 'loginSuccess', token: AuthenticationToken, personalInformation: PersonalInformationResultData): void;
   (e: 'closeRequested'): void;
+  (e: 'goBackRequested'): void;
   (e: 'forgottenPasswordClicked'): void;
 }>();
 
@@ -343,12 +353,18 @@ async function onLoginClicked(): Promise<void> {
       display: flex;
       gap: 1rem;
       align-items: center;
+      justify-content: end;
       margin-top: 0.5rem;
       width: 100%;
 
       &__item {
         height: 2.5rem;
         border-radius: var(--parsec-radius-6);
+        border: 1px solid transparent;
+
+        &:hover {
+          border: 1px solid var(--parsec-color-light-secondary-contrast);
+        }
       }
 
       .skeleton-login-button {
diff --git a/client/src/views/organizations/creation/CreateOrganizationCustomServer.vue b/client/src/views/organizations/creation/CreateOrganizationCustomServer.vue
index 5d668a9d646..d95d056f848 100644
--- a/client/src/views/organizations/creation/CreateOrganizationCustomServer.vue
+++ b/client/src/views/organizations/creation/CreateOrganizationCustomServer.vue
@@ -11,6 +11,7 @@
       :disable-server-addr-field="bootstrapLink !== undefined"
       :disable-organization-name-field="bootstrapLink !== undefined"
       @organization-name-and-server-chosen="onOrganizationNameAndServerChosen"
+      @go-back-requested="$emit('backToServerChoice')"
       @close-requested="$emit('closeRequested')"
       :hide-previous="true"
     />
@@ -107,6 +108,7 @@ const props = defineProps<{
 
 const emits = defineEmits<{
   (e: 'closeRequested'): void;
+  (e: 'backToServerChoice'): void;
   (e: 'organizationCreated', organizationName: OrganizationID, device: AvailableDevice, saveStrategy: DeviceSaveStrategy): void;
 }>();
 
diff --git a/client/src/views/organizations/creation/CreateOrganizationModal.vue b/client/src/views/organizations/creation/CreateOrganizationModal.vue
index e48d17de5a5..3370b43bf40 100644
--- a/client/src/views/organizations/creation/CreateOrganizationModal.vue
+++ b/client/src/views/organizations/creation/CreateOrganizationModal.vue
@@ -14,18 +14,21 @@
         :information-manager="informationManager"
         @close-requested="onCloseRequested"
         @organization-created="onOrganizationCreated"
+        @back-to-server-choice="onBackToServerChoice"
       />
       <create-organization-custom-server
         v-if="serverType === ServerType.Custom"
         :bootstrap-link="bootstrapLink"
         @close-requested="onCloseRequested"
         @organization-created="onOrganizationCreated"
+        @back-to-server-choice="onBackToServerChoice"
       />
       <create-organization-trial
         v-if="serverType === ServerType.Trial"
         :bootstrap-link="bootstrapLink"
         @close-requested="onCloseRequested"
         @organization-created="onOrganizationCreated"
+        @back-to-server-choice="onBackToServerChoice"
         :information-manager="informationManager"
       />
     </div>
@@ -103,6 +106,10 @@ async function onOrganizationCreated(
       : AccessStrategy.usePassword(device, (saveStrategy as DeviceSaveStrategyPassword).password);
   await modalController.dismiss({ device: device, access: accessStrategy }, MsModalResult.Confirm);
 }
+
+async function onBackToServerChoice(): Promise<void> {
+  serverType.value = undefined;
+}
 </script>
 
 <style lang="scss" scoped>
diff --git a/client/src/views/organizations/creation/CreateOrganizationSaas.vue b/client/src/views/organizations/creation/CreateOrganizationSaas.vue
index 3f1d5223c1b..da07cc0dbac 100644
--- a/client/src/views/organizations/creation/CreateOrganizationSaas.vue
+++ b/client/src/views/organizations/creation/CreateOrganizationSaas.vue
@@ -6,6 +6,7 @@
       v-show="step === Steps.BmsLogin"
       @login-success="onLoginSuccess"
       @close-requested="$emit('closeRequested', false)"
+      @go-back-requested="$emit('backToServerChoice')"
       @forgotten-password-clicked="step = Steps.BmsForgotPassword"
     />
     <bms-forgot-password
@@ -20,6 +21,7 @@
       :organization-name="organizationName ?? ''"
       @organization-name-chosen="onOrganizationNameChosen"
       :error="currentError"
+      @go-back-requested="$emit('backToServerChoice')"
       @close-requested="$emit('closeRequested', false)"
     />
     <organization-authentication-page
@@ -107,6 +109,7 @@ const props = defineProps<{
 
 const emits = defineEmits<{
   (e: 'closeRequested', force: boolean): void;
+  (e: 'backToServerChoice'): void;
   (e: 'organizationCreated', organizationName: OrganizationID, device: AvailableDevice, saveStrategy: DeviceSaveStrategy): void;
 }>();
 
diff --git a/client/src/views/organizations/creation/CreateOrganizationTrial.vue b/client/src/views/organizations/creation/CreateOrganizationTrial.vue
index ee1905fe509..7c421a321f8 100644
--- a/client/src/views/organizations/creation/CreateOrganizationTrial.vue
+++ b/client/src/views/organizations/creation/CreateOrganizationTrial.vue
@@ -6,6 +6,7 @@
       v-show="step === Steps.PersonalInformation"
       :class="step === Steps.PersonalInformation ? 'active' : ''"
       @user-information-filled="onUserInformationFilled"
+      @go-back-requested="$emit('backToServerChoice')"
       @close-requested="$emit('closeRequested')"
       :hide-previous="true"
     />
@@ -71,6 +72,7 @@ const props = defineProps<{
 
 const emits = defineEmits<{
   (e: 'closeRequested'): void;
+  (e: 'backToServerChoice'): void;
   (e: 'organizationCreated', organizationName: OrganizationID, device: AvailableDevice, saveStrategy: DeviceSaveStrategy): void;
 }>();
 
diff --git a/client/src/views/organizations/creation/OrganizationNameAndServerPage.vue b/client/src/views/organizations/creation/OrganizationNameAndServerPage.vue
index 02eb16be994..40d368ac072 100644
--- a/client/src/views/organizations/creation/OrganizationNameAndServerPage.vue
+++ b/client/src/views/organizations/creation/OrganizationNameAndServerPage.vue
@@ -53,7 +53,6 @@
             size="default"
             id="previous-button"
             @click="$emit('goBackRequested')"
-            v-show="!hidePrevious"
           >
             {{ $msTranslate('CreateOrganization.button.previous') }}
             <ion-icon
diff --git a/client/src/views/organizations/creation/OrganizationNamePage.vue b/client/src/views/organizations/creation/OrganizationNamePage.vue
index 6f322724e2e..a681bdf6933 100644
--- a/client/src/views/organizations/creation/OrganizationNamePage.vue
+++ b/client/src/views/organizations/creation/OrganizationNamePage.vue
@@ -41,6 +41,20 @@
         slot="primary"
         class="modal-footer-buttons"
       >
+        <ion-button
+          fill="clear"
+          size="default"
+          id="previous-button"
+          @click="$emit('goBackRequested')"
+        >
+          {{ $msTranslate('CreateOrganization.button.previous') }}
+          <ion-icon
+            slot="start"
+            :icon="chevronBack"
+            size="small"
+          />
+        </ion-button>
+
         <ion-button
           fill="solid"
           size="default"
@@ -65,7 +79,7 @@
 import { OrganizationID } from '@/parsec';
 import { IonPage, IonButton, IonText, IonButtons, IonFooter, IonIcon } from '@ionic/vue';
 import { onMounted, ref } from 'vue';
-import { chevronForward } from 'ionicons/icons';
+import { chevronBack, chevronForward } from 'ionicons/icons';
 import { organizationValidator } from '@/common/validators';
 import { Translatable, Validity, MsInput } from 'megashark-lib';
 import CreateOrganizationModalHeader from '@/components/organizations/CreateOrganizationModalHeader.vue';
@@ -79,6 +93,7 @@ const props = defineProps<{
 
 defineEmits<{
   (e: 'organizationNameChosen', name: OrganizationID): void;
+  (e: 'goBackRequested'): void;
   (e: 'closeRequested'): void;
 }>();
 
diff --git a/client/src/views/organizations/creation/OrganizationUserInformationPage.vue b/client/src/views/organizations/creation/OrganizationUserInformationPage.vue
index 3ffcaab8377..981f3d24e71 100644
--- a/client/src/views/organizations/creation/OrganizationUserInformationPage.vue
+++ b/client/src/views/organizations/creation/OrganizationUserInformationPage.vue
@@ -26,7 +26,6 @@
           size="default"
           id="previous-button"
           @click="$emit('goBackRequested')"
-          v-show="!hidePrevious"
         >
           {{ $msTranslate('CreateOrganization.button.previous') }}
           <ion-icon
diff --git a/client/tests/pw/e2e/client_area_login.spec.ts b/client/tests/pw/e2e/client_area_login.spec.ts
index a6d2ca402be..26bdd43fe2a 100644
--- a/client/tests/pw/e2e/client_area_login.spec.ts
+++ b/client/tests/pw/e2e/client_area_login.spec.ts
@@ -22,7 +22,7 @@ msTest('Log into the customer area', async ({ home }) => {
   await expect(home.locator('.saas-login-container').locator('.saas-login__title')).toHaveText('Log in to your customer account');
   await fillIonInput(home.locator('.input-container').nth(0).locator('ion-input'), DEFAULT_USER_INFORMATION.email);
   await fillIonInput(home.locator('.input-container').nth(1).locator('ion-input'), DEFAULT_USER_INFORMATION.password);
-  await home.locator('.saas-login-button__item').click();
+  await home.locator('.saas-login-button__item').nth(1).click();
   await expect(home.locator('.header-content').locator('.header-title')).toHaveText('Dashboard');
   const logOutButton = home.locator('.header-content').locator('.custom-button').first();
   await expect(logOutButton).toHaveText('Log out');
@@ -45,7 +45,7 @@ msTest('Log into the customer area failed', async ({ home }) => {
   await expect(home).toHaveURL(/.+\/home$/);
   await fillIonInput(home.locator('.input-container').nth(0).locator('ion-input'), DEFAULT_USER_INFORMATION.email);
   await fillIonInput(home.locator('.input-container').nth(1).locator('ion-input'), 'invalid_password');
-  await home.locator('.saas-login-button__item').click();
+  await home.locator('.saas-login-button__item').nth(1).click();
   const error = home.locator('.saas-login-container').locator('.login-button-error');
   await expect(error).toBeVisible();
   await expect(error).toHaveText('Cannot log in. Please check your email and password.');
@@ -140,7 +140,7 @@ for (const frozen of [false, true]) {
     await button.click();
     await fillIonInput(home.locator('.input-container').nth(0).locator('ion-input'), DEFAULT_USER_INFORMATION.email);
     await fillIonInput(home.locator('.input-container').nth(1).locator('ion-input'), DEFAULT_USER_INFORMATION.password);
-    await home.locator('.saas-login-button__item').click();
+    await home.locator('.saas-login-button__item').nth(1).click();
     const orgSwitchButton = home.locator('.sidebar-header').locator('.card-header-title');
     await expect(orgSwitchButton).toHaveText('All organizations');
     await orgSwitchButton.click();
diff --git a/client/tests/pw/e2e/create_organization.spec.ts b/client/tests/pw/e2e/create_organization.spec.ts
index b1b5297ea03..453d71d5d26 100644
--- a/client/tests/pw/e2e/create_organization.spec.ts
+++ b/client/tests/pw/e2e/create_organization.spec.ts
@@ -1,7 +1,10 @@
 // Parsec Cloud (https://parsec.cloud) Copyright (c) BUSL-1.1 2016-present Scille SAS
 
 import { expect } from '@tests/pw/helpers/assertions';
+import { MockBms } from '@tests/pw/helpers/bms';
+import { DEFAULT_USER_INFORMATION } from '@tests/pw/helpers/data';
 import { msTest } from '@tests/pw/helpers/fixtures';
+import { fillIonInput } from '@tests/pw/helpers/utils';
 
 msTest('Opens the create organization modal', async ({ home }) => {
   await expect(home.locator('#create-organization-button')).toHaveText('Create or join');
@@ -35,3 +38,49 @@ msTest('Opens the create organization modal', async ({ home }) => {
   await modal.locator('.closeBtn').click();
   await expect(modal).toBeHidden();
 });
+
+msTest('Return to server selection after selecting server type', async ({ home }) => {
+  await home.locator('#create-organization-button').click();
+  await home.locator('.popover-viewport').getByRole('listitem').nth(0).click();
+  const modal = home.locator('.create-organization-modal');
+  await expect(modal.locator('.server-modal')).toBeVisible();
+
+  // Go to saas and back
+  await modal.locator('.server-choice-item').nth(0).click();
+  await modal.locator('.server-modal-footer').locator('ion-button').nth(1).click();
+  await expect(modal.locator('.saas-login')).toBeVisible();
+  await modal.locator('.saas-login-button__item').nth(0).click();
+  await expect(modal.locator('.server-modal')).toBeVisible();
+
+  // Go to saas, login, and back
+  await modal.locator('.server-choice-item').nth(0).click();
+  await modal.locator('.server-modal-footer').locator('ion-button').nth(1).click();
+
+  await MockBms.mockLogin(home);
+  await MockBms.mockUserRoute(home);
+  const bmsContainer = modal.locator('.saas-login');
+  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item').nth(1);
+
+  await fillIonInput(bmsContainer.locator('ion-input').nth(0), DEFAULT_USER_INFORMATION.email);
+  await expect(bmsNext).toHaveDisabledAttribute();
+  await fillIonInput(bmsContainer.locator('ion-input').nth(1), DEFAULT_USER_INFORMATION.password);
+  await expect(bmsNext).not.toHaveDisabledAttribute();
+  await bmsNext.click();
+  await expect(bmsContainer).toBeHidden();
+  await expect(modal.locator('.organization-name-page')).toBeVisible();
+  await modal.locator('.organization-name-page').locator('#previous-button').click();
+  await expect(modal.locator('.server-modal')).toBeVisible();
+
+  // To to trial and back
+  await modal.locator('.server-choice-item').nth(1).click();
+  await modal.locator('.server-modal-footer').locator('ion-button').nth(1).click();
+  await expect(modal.locator('.user-information-page')).toBeVisible();
+  await modal.locator('.user-information-page').locator('#previous-button').click();
+  await expect(modal.locator('.server-modal')).toBeVisible();
+
+  // Go to custom and back
+  await modal.locator('.server-modal-footer').locator('ion-button').nth(0).click();
+  await expect(modal.locator('.organization-name-and-server-page')).toBeVisible();
+  await modal.locator('.organization-name-and-server-page').locator('#previous-button').click();
+  await expect(modal.locator('.server-modal')).toBeVisible();
+});
diff --git a/client/tests/pw/e2e/create_organization_custom.spec.ts b/client/tests/pw/e2e/create_organization_custom.spec.ts
index b31a3ddc7d8..dff44935481 100644
--- a/client/tests/pw/e2e/create_organization_custom.spec.ts
+++ b/client/tests/pw/e2e/create_organization_custom.spec.ts
@@ -34,9 +34,7 @@ msTest('Go through custom org creation process', async ({ home }) => {
 
   const orgServerContainer = modal.locator('.organization-name-and-server-page');
   await expect(orgServerContainer.locator('.modal-header-title__text')).toHaveText('Create organization on my Parsec server');
-  const orgPrevious = orgServerContainer.locator('.organization-name-and-server-page-footer').locator('ion-button').nth(0);
   const orgNext = orgServerContainer.locator('.organization-name-and-server-page-footer').locator('ion-button').nth(1);
-  await expect(orgPrevious).toBeHidden();
   await expect(orgNext).toHaveDisabledAttribute();
   await fillIonInput(orgServerContainer.locator('ion-input').nth(0), DEFAULT_ORGANIZATION_INFORMATION.name);
   await expect(orgNext).toHaveDisabledAttribute();
@@ -206,9 +204,7 @@ msTest('Go through custom org creation process from bootstrap link', async ({ ho
 
   const orgServerContainer = modal.locator('.organization-name-and-server-page');
   await expect(orgServerContainer.locator('.modal-header-title__text')).toHaveText('Create organization on my Parsec server');
-  const orgPrevious = orgServerContainer.locator('.organization-name-and-server-page-footer').locator('ion-button').nth(0);
   const orgNext = orgServerContainer.locator('.organization-name-and-server-page-footer').locator('ion-button').nth(1);
-  await expect(orgPrevious).toBeHidden();
   await expect(orgNext).not.toHaveDisabledAttribute();
 
   await expect(orgServerContainer.locator('ion-input').nth(0)).toHaveTheClass('input-disabled');
diff --git a/client/tests/pw/e2e/create_organization_saas.spec.ts b/client/tests/pw/e2e/create_organization_saas.spec.ts
index f04da52db54..a4fdb901204 100644
--- a/client/tests/pw/e2e/create_organization_saas.spec.ts
+++ b/client/tests/pw/e2e/create_organization_saas.spec.ts
@@ -40,8 +40,8 @@ msTest('Go through saas org creation process', async ({ home }) => {
   await MockBms.mockCreateOrganization(home, BOOTSTRAP_ADDR);
 
   const bmsContainer = modal.locator('.saas-login');
-  await expect(bmsContainer.locator('.modal-header-title__text')).toHaveText('Link you customer account to your new organization');
-  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item');
+  await expect(bmsContainer.locator('.modal-header-title__text')).toHaveText('Link your customer account to your new organization');
+  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item').nth(1);
   await expect(bmsNext).toHaveDisabledAttribute();
   await fillIonInput(bmsContainer.locator('ion-input').nth(0), DEFAULT_USER_INFORMATION.email);
   await expect(bmsNext).toHaveDisabledAttribute();
@@ -55,7 +55,7 @@ msTest('Go through saas org creation process', async ({ home }) => {
   await expect(bmsContainer).toBeHidden();
   await expect(orgNameContainer).toBeVisible();
   await expect(orgNameContainer.locator('.modal-header-title__text')).toHaveText('Create an organization');
-  const orgNameNext = modal.locator('.organization-name-page-footer').locator('ion-button');
+  const orgNameNext = modal.locator('.organization-name-page-footer').locator('ion-button').nth(1);
   await expect(orgNameNext).toHaveDisabledAttribute();
 
   await cancelAndResume(home, orgNameContainer);
@@ -174,8 +174,8 @@ msTest('Go through saas org creation process from bootstrap link', async ({ home
   await MockBms.mockCreateOrganization(home, BOOTSTRAP_ADDR);
 
   const bmsContainer = modal.locator('.saas-login');
-  await expect(bmsContainer.locator('.modal-header-title__text')).toHaveText('Link you customer account to your new organization');
-  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item');
+  await expect(bmsContainer.locator('.modal-header-title__text')).toHaveText('Link your customer account to your new organization');
+  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item').nth(1);
   await expect(bmsNext).toHaveDisabledAttribute();
   await fillIonInput(bmsContainer.locator('ion-input').nth(0), DEFAULT_USER_INFORMATION.email);
   await expect(bmsNext).toHaveDisabledAttribute();
@@ -262,7 +262,7 @@ msTest('Fail to login to BMS', async ({ home }) => {
   await MockBms.mockLogin(home, { POST: { errors: { status: 401 } } });
 
   const bmsContainer = modal.locator('.saas-login');
-  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item');
+  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item').nth(1);
   await fillIonInput(bmsContainer.locator('ion-input').nth(0), DEFAULT_USER_INFORMATION.email);
   await fillIonInput(bmsContainer.locator('ion-input').nth(1), DEFAULT_USER_INFORMATION.password);
   await bmsNext.click();
@@ -276,7 +276,7 @@ msTest('Cannot reach the BMS', async ({ home }) => {
   const modal = await openCreateOrganizationModal(home);
 
   const bmsContainer = modal.locator('.saas-login');
-  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item');
+  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item').nth(1);
   await fillIonInput(bmsContainer.locator('ion-input').nth(0), DEFAULT_USER_INFORMATION.email);
   await fillIonInput(bmsContainer.locator('ion-input').nth(1), DEFAULT_USER_INFORMATION.password);
   await bmsNext.click();
@@ -295,13 +295,13 @@ msTest('Edit from summary', async ({ home }) => {
   await MockBms.mockCreateOrganization(home, BOOTSTRAP_ADDR);
 
   const bmsContainer = modal.locator('.saas-login');
-  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item');
+  const bmsNext = bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item').nth(1);
   await fillIonInput(bmsContainer.locator('ion-input').nth(0), DEFAULT_USER_INFORMATION.email);
   await fillIonInput(bmsContainer.locator('ion-input').nth(1), DEFAULT_USER_INFORMATION.password);
   await bmsNext.click();
 
   const orgNameContainer = modal.locator('.organization-name-page');
-  const orgNameNext = modal.locator('.organization-name-page-footer').locator('ion-button');
+  const orgNameNext = modal.locator('.organization-name-page-footer').locator('ion-button').nth(1);
   await fillIonInput(orgNameContainer.locator('ion-input'), DEFAULT_ORGANIZATION_INFORMATION.name);
   await orgNameNext.click();
 
@@ -361,7 +361,7 @@ msTest('Try to create an org with custom order', async ({ home }) => {
   const bmsContainer = modal.locator('.saas-login');
   await fillIonInput(bmsContainer.locator('ion-input').nth(0), DEFAULT_USER_INFORMATION.email);
   await fillIonInput(bmsContainer.locator('ion-input').nth(1), DEFAULT_USER_INFORMATION.password);
-  await bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item').click();
+  await bmsContainer.locator('.saas-login-button').locator('.saas-login-button__item').nth(1).click();
   await expect(modal).toBeHidden();
   await expect(home).toShowInformationModal(
     'Clients with a custom contract are not allowed to directly create organizations. If you need another organization, please contact us.',
diff --git a/client/tests/pw/e2e/create_organization_trial.spec.ts b/client/tests/pw/e2e/create_organization_trial.spec.ts
index 385812cb979..27bf918f553 100644
--- a/client/tests/pw/e2e/create_organization_trial.spec.ts
+++ b/client/tests/pw/e2e/create_organization_trial.spec.ts
@@ -34,9 +34,7 @@ msTest('Go through trial org creation process', async ({ home }) => {
   const modal = await openCreateOrganizationModal(home);
 
   const userInfoContainer = modal.locator('.user-information-page');
-  const userPrevious = modal.locator('.user-information-page-footer').locator('ion-button').nth(0);
   const userNext = modal.locator('.user-information-page-footer').locator('ion-button').nth(1);
-  await expect(userPrevious).toBeHidden();
   await expect(userNext).toBeVisible();
   await expect(userNext).toHaveDisabledAttribute();
   await expect(userInfoContainer.locator('.modal-header-title__text')).toHaveText('Enter your personal information');
@@ -137,9 +135,7 @@ msTest('Go through trial org creation process from bootstrap link', async ({ hom
   const modal = home.locator('.create-organization-modal');
 
   const userInfoContainer = modal.locator('.user-information-page');
-  const userPrevious = modal.locator('.user-information-page-footer').locator('ion-button').nth(0);
   const userNext = modal.locator('.user-information-page-footer').locator('ion-button').nth(1);
-  await expect(userPrevious).toBeHidden();
   await expect(userNext).toBeVisible();
   await expect(userNext).toHaveDisabledAttribute();
   await expect(userInfoContainer.locator('.modal-header-title__text')).toHaveText('Enter your personal information');
diff --git a/client/tests/pw/helpers/fixtures.ts b/client/tests/pw/helpers/fixtures.ts
index 2611b48cbfa..39161ca3e59 100644
--- a/client/tests/pw/helpers/fixtures.ts
+++ b/client/tests/pw/helpers/fixtures.ts
@@ -137,7 +137,7 @@ export const msTest = base.extend<{
     await button.click();
     await fillIonInput(home.locator('.input-container').nth(0).locator('ion-input'), DEFAULT_USER_INFORMATION.email);
     await fillIonInput(home.locator('.input-container').nth(1).locator('ion-input'), DEFAULT_USER_INFORMATION.password);
-    await home.locator('.saas-login-button__item').click();
+    await home.locator('.saas-login-button__item').nth(1).click();
     await expect(home).toHaveURL(/.+\/clientArea$/);
 
     // Switch to first org