Add Group Attribute Name field to IdP view (#2520)

* Add Group Attribute Name field to IdP view

* Use text-balance to even out ragged field descriptions

* add 'required' so we hide the 'optional' text

* Update help copy; undo text-balance

* add group attribute name to the mock IdP and test it

---------

Co-authored-by: David Crespo <[email protected]>

Author: charliepark

app/forms/idp/create.tsx

@@ -133,7 +133,7 @@ export function CreateIdpSideModalForm() {
       <TextField
         name="groupAttributeName"
         label="Group attribute name"
-        description="Name of SAML attribute where we can find a comma-separated list of names of groups the user belongs to"
+        description="Name of the SAML attribute in the IdP response listing the user’s groups"
         control={form.control}
       />
       {/* TODO: Email field, probably */}

app/forms/idp/edit.tsx

@@ -104,14 +104,14 @@ export function EditIdpSideModalForm() {
         control={form.control}
         disabled
       />
-      {/* TODO: add group attribute name when it is added to the API
-          <TextField
-            name="groupAttributeName"
-            label="Group attribute name"
-            description="Name of SAML attribute where we can find a comma-separated list of names of groups the user belongs to"
-            control={form.control}
-            disabled
-          /> */}
+      <TextField
+        name="groupAttributeName"
+        label="Group attribute name"
+        description="Name of the SAML attribute in the IdP response listing the user’s groups"
+        required
+        control={form.control}
+        disabled
+      />
       {/* TODO: Email field, probably */}
       <TextField
         name="technicalContactEmail"

mock-api/silo.ts

@@ -85,6 +85,7 @@ export const samlIdp: Json<SamlIdentityProvider> = {
   slo_url: '',
   sp_client_id: '',
   technical_contact_email: '',
+  group_attribute_name: 'groups',
 }
 
 // This works differently from Nexus, but the result is the same. In Nexus,

test/e2e/silos.e2e.ts

@@ -186,6 +186,10 @@ test('Identity providers', async ({ page }) => {
     'text="Single Logout (SLO) URL"',
   ])
 
+  await expect(page.getByRole('textbox', { name: 'Group attribute name' })).toHaveValue(
+    'groups'
+  )
+
   await page.getByRole('button', { name: 'Cancel' }).click()
   await expectNotVisible(page, ['role=dialog[name="Identity provider"]'])
 })