Merge pull request #402 from auth0/feat/sso-hide-mappings

feat: add hideAttributeMappings prop to SsoProviderEdit

Author: rax7389

packages/react/src/components/auth0/my-organization/__tests__/sso-provider-edit.test.tsx

@@ -473,6 +473,61 @@ describe('SsoProviderEdit', () => {
     });
   });
 
+  describe('hideAttributeMappings', () => {
+    describe('on SSO tab', () => {
+      describe('when is true', () => {
+        it('should not display attribute mappings section', async () => {
+          renderWithProviders(
+            <SsoProviderEdit
+              {...createMockSsoProviderEditProps({ hideAttributeMappings: true })}
+            />,
+          );
+
+          await waitForComponentToLoad();
+
+          expect(screen.queryByText(/mappings.title/i)).not.toBeInTheDocument();
+        });
+      });
+
+      describe('when is false', () => {
+        it('should display attribute mappings section', async () => {
+          renderWithProviders(
+            <SsoProviderEdit
+              {...createMockSsoProviderEditProps({ hideAttributeMappings: false })}
+            />,
+          );
+
+          await waitForComponentToLoad();
+
+          expect(screen.queryByText(/mappings.title/i)).toBeInTheDocument();
+        });
+      });
+    });
+
+    describe('on Provisioning tab', () => {
+      describe('when is true', () => {
+        it('should not display attribute mappings section', async () => {
+          const user = userEvent.setup();
+
+          renderWithProviders(
+            <SsoProviderEdit
+              {...createMockSsoProviderEditProps({ hideAttributeMappings: true })}
+            />,
+          );
+
+          await waitForComponentToLoad();
+
+          const provisioningTab = screen.getByText(/tabs.provisioning.name/i);
+          await user.click(provisioningTab);
+
+          await waitFor(() => {
+            expect(screen.queryByText(/mappings.title/i)).not.toBeInTheDocument();
+          });
+        });
+      });
+    });
+  });
+
   describe('sso action props', () => {
     describe('when sso.updateAction is provided', () => {
       it('should call onBefore when toggling provider', async () => {

packages/react/src/components/auth0/my-organization/shared/idp-management/sso-provider-edit/sso-provider-details.tsx

@@ -38,6 +38,7 @@ import type { SsoProviderDetailsProps } from '@/types/my-organization/idp-manage
 export function SsoProviderDetails({
   provider,
   readOnly = false,
+  hideAttributeMappings = false,
   idpConfig,
   formActions,
   customMessages = {},
@@ -134,15 +135,19 @@ export function SsoProviderDetails({
         />
       </div>
 
-      <Separator />
-      <div className="space-y-4">
-        <SsoProviderAttributeMappings
-          strategy={provider?.strategy || null}
-          userAttributeMap={attributes}
-          customMessages={customMessages.mappings}
-          className={currentStyles.classes?.['SsoProvider-attributeMapping']}
-        />
-      </div>
+      {!hideAttributeMappings && (
+        <>
+          <Separator />
+          <div className="space-y-4">
+            <SsoProviderAttributeMappings
+              strategy={provider?.strategy || null}
+              userAttributeMap={attributes}
+              customMessages={customMessages.mappings}
+              className={currentStyles.classes?.['SsoProvider-attributeMapping']}
+            />
+          </div>
+        </>
+      )}
 
       {formActions && (
         <FormActions

packages/react/src/components/auth0/my-organization/shared/idp-management/sso-provider-edit/sso-provider-tab.tsx

@@ -55,6 +55,7 @@ export function SsoProviderTab({
   shouldAllowDeletion,
   hideDeleteProvider = false,
   hideRemoveFromOrganization = false,
+  hideAttributeMappings = false,
   formActions,
   hasSsoAttributeSyncWarning,
   onAttributeSync,
@@ -94,6 +95,7 @@ export function SsoProviderTab({
             <SsoProviderDetails
               provider={provider}
               readOnly={readOnly}
+              hideAttributeMappings={hideAttributeMappings}
               formActions={formActions}
               customMessages={customMessages.details}
               styling={styling}

packages/react/src/components/auth0/my-organization/shared/idp-management/sso-provider-edit/sso-provisioning/sso-provisioning-details.tsx

@@ -59,6 +59,7 @@ export function SsoProvisioningDetails({
   isScimTokensLoading,
   isScimTokenCreating,
   isScimTokenDeleting,
+  hideAttributeMappings = false,
   onListScimTokens,
   onCreateScimToken,
   onDeleteScimToken,
@@ -155,14 +156,18 @@ export function SsoProvisioningDetails({
           />
         </form>
       </Form>
-      <Separator />
-      <SsoProviderAttributeMappings
-        strategy={provisioningConfig?.strategy || null}
-        isProvisioning
-        userAttributeMap={provisioningConfig?.attributes || null}
-        customMessages={customMessages.mappings}
-        className={currentStyles.classes?.['SsoProvisioning-attributeMapping']}
-      />
+      {!hideAttributeMappings && (
+        <>
+          <Separator />
+          <SsoProviderAttributeMappings
+            strategy={provisioningConfig?.strategy || null}
+            isProvisioning
+            userAttributeMap={provisioningConfig?.attributes || null}
+            customMessages={customMessages.mappings}
+            className={currentStyles.classes?.['SsoProvisioning-attributeMapping']}
+          />
+        </>
+      )}
     </div>
   );
 }

packages/react/src/components/auth0/my-organization/shared/idp-management/sso-provider-edit/sso-provisioning/sso-provisioning-tab.tsx

@@ -44,6 +44,7 @@ export function SsoProvisioningTab({
   provider,
   styling = { variables: { common: {}, light: {}, dark: {} }, classes: {} },
   customMessages = {},
+  hideAttributeMappings = false,
   hasProvisioningAttributeSyncWarning,
   onAttributeSync,
   isSyncingAttributes = false,
@@ -164,6 +165,7 @@ export function SsoProvisioningTab({
               isScimTokensLoading={isScimTokensLoading}
               isScimTokenCreating={isScimTokenCreating}
               isScimTokenDeleting={isScimTokenDeleting}
+              hideAttributeMappings={hideAttributeMappings}
               onListScimTokens={listScimTokens}
               onCreateScimToken={createScimToken}
               onDeleteScimToken={deleteScimToken}

packages/react/src/components/auth0/my-organization/sso-provider-edit.tsx

@@ -56,6 +56,7 @@ function SsoProviderEdit(props: SsoProviderEditProps) {
     hideProvisioningTab = false,
     hideDeleteProvider = false,
     hideRemoveFromOrganization = false,
+    hideAttributeMappings = false,
     customMessages = {},
     styling = {
       variables: { common: {}, light: {}, dark: {} },
@@ -88,6 +89,7 @@ function SsoProviderEdit(props: SsoProviderEditProps) {
     hideProvisioningTab,
     hideDeleteProvider,
     hideRemoveFromOrganization,
+    hideAttributeMappings,
   };
 
   const ssoProviderCreateHandlerProps: SsoProviderEditHandlerProps = {
@@ -137,6 +139,7 @@ function SsoProviderEditView({ logic, handlers }: SsoProviderEditViewProps) {
     hideHeader,
     hideDeleteProvider,
     hideRemoveFromOrganization,
+    hideAttributeMappings,
     provider,
     organization,
     isLoading,
@@ -244,6 +247,7 @@ function SsoProviderEditView({ logic, handlers }: SsoProviderEditViewProps) {
               shouldAllowDeletion={shouldAllowDeletion}
               hideDeleteProvider={hideDeleteProvider}
               hideRemoveFromOrganization={hideRemoveFromOrganization}
+              hideAttributeMappings={hideAttributeMappings}
               hasSsoAttributeSyncWarning={hasSsoAttributeSyncWarning}
               onAttributeSync={syncSsoAttributes}
               isSyncingAttributes={isSsoAttributesSyncing}
@@ -269,6 +273,7 @@ function SsoProviderEditView({ logic, handlers }: SsoProviderEditViewProps) {
                 isScimTokensLoading={isScimTokensLoading}
                 isScimTokenCreating={isScimTokenCreating}
                 isScimTokenDeleting={isScimTokenDeleting}
+                hideAttributeMappings={hideAttributeMappings}
                 hasProvisioningAttributeSyncWarning={hasProvisioningAttributeSyncWarning}
                 onAttributeSync={syncProvisioningAttributes}
                 isSyncingAttributes={isProvisioningAttributesSyncing}

packages/react/src/types/my-organization/idp-management/sso-provider/sso-provider-edit-types.ts

@@ -81,6 +81,7 @@ export interface SsoProviderEditProps
   hideProvisioningTab?: boolean;
   hideDeleteProvider?: boolean;
   hideRemoveFromOrganization?: boolean;
+  hideAttributeMappings?: boolean;
   providerId: IdpId;
   sso?: SsoProviderTabEditProps;
   provisioning?: SsoProvisioningTabEditProps;

packages/react/src/types/my-organization/idp-management/sso-provider/sso-provider-tab-types.ts

@@ -61,6 +61,7 @@ export interface SsoProviderTabProps
   shouldAllowDeletion: boolean;
   hideDeleteProvider?: boolean;
   hideRemoveFromOrganization?: boolean;
+  hideAttributeMappings?: boolean;
   provider: IdpKnownResponse | null;
   onDelete: (provider: IdpKnownResponse) => Promise<void>;
   onRemove: (provider: IdpKnownResponse) => Promise<void>;
@@ -97,5 +98,6 @@ export interface SsoProviderDetailsProps
   provider: IdpKnownResponse;
   idpConfig: GetIdpConfigurationResponseContent | null;
   readOnly?: boolean;
+  hideAttributeMappings?: boolean;
   formActions?: SsoProviderDetailsFormActions;
 }

packages/react/src/types/my-organization/idp-management/sso-provisioning/sso-provisioning-tab-types.ts

@@ -49,6 +49,7 @@ export interface SsoProvisioningTabProps
   isScimTokensLoading: boolean;
   isScimTokenCreating: boolean;
   isScimTokenDeleting: boolean;
+  hideAttributeMappings?: boolean;
   onCreateProvisioning: () => Promise<void>;
   onDeleteProvisioning: () => Promise<void>;
   onListScimTokens: () => Promise<ListIdpProvisioningScimTokensResponseContent | null>;
@@ -88,6 +89,7 @@ export interface SsoProvisioningDetailsProps
   isScimTokensLoading: boolean;
   isScimTokenCreating: boolean;
   isScimTokenDeleting: boolean;
+  hideAttributeMappings?: boolean;
   onListScimTokens: () => Promise<ListIdpProvisioningScimTokensResponseContent | null>;
   onCreateScimToken: (
     data: CreateIdpProvisioningScimTokenRequestContent,