Merge pull request #16017 from overleaf/jel-sso-config-ui

[web] Update SSO settings UI

GitOrigin-RevId: 9b708b7b3fde1cdba1725236d88a88d85acded96

services/web/frontend/extracted-translations.json

@@ -338,7 +338,6 @@
   "enable_sso": "",
   "enable_stop_on_first_error_under_recompile_dropdown_menu": "",
   "enabling": "",
-  "enabling_sso_will_make_this_the_only_sign_in_option": "",
   "end_of_document": "",
   "enter_6_digit_code": "",
   "enter_image_url": "",

services/web/frontend/stylesheets/modules/group-settings.less

@@ -95,8 +95,7 @@ h3.group-settings-title {
 }
 
 .group-settings-sso {
-  .group-settings-sso-enable,
-  .group-settings-sso-configure {
+  .group-settings-sso-row {
     margin-top: @margin-md;
     display: flex;
     align-items: center;

services/web/locales/en.json

@@ -503,7 +503,6 @@
   "enable_sso": "Enable SSO",
   "enable_stop_on_first_error_under_recompile_dropdown_menu": "Enable <0>“Stop on first error”</0> under the <1>Recompile</1> drop-down menu to help you find and fix errors right away.",
   "enabling": "Enabling",
-  "enabling_sso_will_make_this_the_only_sign_in_option": "Enabling SSO will make this the <0>only</0> sign-in option for members.",
   "end_of_document": "End of document",
   "enter_6_digit_code": "Enter 6-digit code",
   "enter_image_url": "Enter image URL",
@@ -1385,7 +1384,7 @@
   "project_url": "Affected project URL",
   "projects": "Projects",
   "projects_list": "Projects list",
-  "provide_details_of_your_sso_configuration": "Provide details of your SSO configuration",
+  "provide_details_of_your_sso_configuration": "Add, edit, or delete your Identity Provider’s SAML metadata.",
   "pt": "Portuguese",
   "public": "Public",
   "publish": "Publish",
@@ -1689,7 +1688,7 @@
   "sso_configuration": "SSO configuration",
   "sso_configuration_created": "SSO configuration has been saved",
   "sso_configuration_updated": "SSO configuration was updated successfully",
-  "sso_explanation": "You can enforce single sign-on for members of this group. When SSO is enabled it will be the <0>only</0> way group members can log in to Overleaf. <1>Learn more about how we support SAML 2.0 IdPs.</1>",
+  "sso_explanation": "Set up single sign-on for your group. This sign in method will be optional for group members unless Managed Users is enabled. <0>Learn more about Overleaf Group SSO</0>.",
   "sso_integration": "SSO integration",
   "sso_integration_info": "Overleaf offers a standard SAML-based Single Sign On integration.",
   "sso_is_disabled": "SSO is disabled",

services/web/test/frontend/features/group-management/components/sso/group-settings-sso.spec.tsx

@@ -31,15 +31,13 @@ describe('GroupSettingsSSO', function () {
     it('renders without sso configuration', function () {
       cy.mount(<GroupSettingsSSOComponent />)
 
-      cy.get('.group-settings-sso-enable').within(() => {
-        cy.contains('Enable SSO')
-        cy.contains(
-          'Enabling SSO will make this the only sign-in option for members.'
-        )
-        cy.get('.switch-input').within(() => {
-          cy.get('.invisible-input').should('not.be.checked')
-          cy.get('.invisible-input').should('be.disabled')
-        })
+      cy.contains('Enable SSO')
+      cy.contains(
+        'Set up single sign-on for your group. This sign in method will be optional for group members unless Managed Users is enabled.'
+      )
+      cy.get('.switch-input').within(() => {
+        cy.get('.invisible-input').should('not.be.checked')
+        cy.get('.invisible-input').should('be.disabled')
       })
     })
 
@@ -59,11 +57,9 @@ describe('GroupSettingsSSO', function () {
 
       cy.wait('@sso')
 
-      cy.get('.group-settings-sso-enable').within(() => {
-        cy.get('.switch-input').within(() => {
-          cy.get('.invisible-input').should('be.checked')
-          cy.get('.invisible-input').should('not.be.disabled')
-        })
+      cy.get('.switch-input').within(() => {
+        cy.get('.invisible-input').should('be.checked')
+        cy.get('.invisible-input').should('not.be.disabled')
       })
     })
 
@@ -94,11 +90,9 @@ describe('GroupSettingsSSO', function () {
 
       cy.wait('@sso')
 
-      cy.get('.group-settings-sso-enable').within(() => {
-        cy.get('.switch-input').within(() => {
-          cy.get('.invisible-input').should('be.checked')
-          cy.get('.invisible-input').should('not.be.disabled')
-        })
+      cy.get('.switch-input').within(() => {
+        cy.get('.invisible-input').should('be.checked')
+        cy.get('.invisible-input').should('not.be.disabled')
       })
 
       cy.findByRole('button', { name: 'View configuration' }).click()
@@ -125,10 +119,8 @@ describe('GroupSettingsSSO', function () {
 
         cy.wait('@sso')
 
-        cy.get('.group-settings-sso-enable').within(() => {
-          cy.get('.switch-input').within(() => {
-            cy.get('.invisible-input').click({ force: true })
-          })
+        cy.get('.switch-input').within(() => {
+          cy.get('.invisible-input').click({ force: true })
         })
       })
 
@@ -168,12 +160,12 @@ describe('GroupSettingsSSO', function () {
           cy.findByRole('button', { name: 'Enable SSO' }).click()
         })
         cy.get('.modal-dialog').should('not.exist')
-        cy.get('.group-settings-sso-enable').within(() => {
-          cy.get('.switch-input').within(() => {
-            cy.get('.invisible-input').should('be.checked')
-            cy.get('.invisible-input').should('not.be.disabled')
-          })
+
+        cy.get('.switch-input').within(() => {
+          cy.get('.invisible-input').should('be.checked')
+          cy.get('.invisible-input').should('not.be.disabled')
         })
+
         cy.findByText('SSO is enabled')
       })
     })
@@ -195,10 +187,8 @@ describe('GroupSettingsSSO', function () {
 
         cy.wait('@sso')
 
-        cy.get('.group-settings-sso-enable').within(() => {
-          cy.get('.switch-input').within(() => {
-            cy.get('.invisible-input').click({ force: true })
-          })
+        cy.get('.switch-input').within(() => {
+          cy.get('.invisible-input').click({ force: true })
         })
       })
 
@@ -240,11 +230,11 @@ describe('GroupSettingsSSO', function () {
           cy.findByRole('button', { name: 'Disable SSO' }).click()
         })
         cy.get('.modal-dialog').should('not.exist')
-        cy.get('.group-settings-sso-enable').within(() => {
-          cy.get('.switch-input').within(() => {
-            cy.get('.invisible-input').should('not.be.checked')
-          })
+
+        cy.get('.switch-input').within(() => {
+          cy.get('.invisible-input').should('not.be.checked')
         })
+
         cy.findByText('SSO is disabled')
       })
     })