fix(sso): support registered provider IDs in settings

Author: waleedlatif1

apps/sim/app/api/auth/sso/providers/[providerId]/route.test.ts

@@ -80,6 +80,20 @@ describe('DELETE /api/auth/sso/providers/[providerId]', () => {
     expect(allowed.status).toBe(200)
   })
 
+  it.each([129, 256])('deletes a provider with a %i-character ID', async (length) => {
+    const providerId = 'a'.repeat(length)
+    queueTableRows(schemaMock.ssoProvider, [
+      { id: 'row-1', organizationId: 'org1', userId: 'u1', domain: 'acme.com' },
+    ])
+    queueTableRows(schemaMock.member, [{ role: 'owner' }])
+
+    const res = await DELETE(request(), { params: Promise.resolve({ providerId }) })
+
+    expect(res.status).toBe(200)
+    await expect(res.json()).resolves.toEqual({ success: true, providerId })
+    expect(dbChainMockFns.delete).toHaveBeenCalledWith(schemaMock.ssoProvider)
+  })
+
   it('answers 404 when the row vanished between the check and the delete', async () => {
     queueTableRows(schemaMock.ssoProvider, [
       { id: 'row-1', organizationId: 'org1', userId: 'u1', domain: 'acme.com' },

apps/sim/ee/sso/components/sso-settings.test.tsx

@@ -310,10 +310,10 @@ function startEditing(providerId = 'provider-a') {
 let container: HTMLDivElement
 let root: Root
 
-function renderSso(organizationId: string) {
+function renderSso(organizationId: string, searchParams = '') {
   act(() => {
     root.render(
-      <NuqsTestingAdapter>
+      <NuqsTestingAdapter searchParams={searchParams}>
         <SSO organizationId={organizationId} />
       </NuqsTestingAdapter>
     )
@@ -678,6 +678,40 @@ describe('SAML callback URLs', () => {
 })
 
 describe('SSO provider list', () => {
+  it.each(['', '?provider=new'])(
+    'opens and edits a provider named new with initial search params %s',
+    (searchParams) => {
+      mockUseSSOProviders.mockReturnValue({
+        data: { providers: [{ ...provider('org-a'), providerId: 'new' }] },
+        isLoading: false,
+      })
+      renderSso('org-a', searchParams)
+      if (!searchParams) openProvider('new')
+
+      expect(findButton('Edit')).toBeDefined()
+      expect(findButton('Save')).toBeUndefined()
+      act(() => findButton('Edit')?.click())
+      expect(container.querySelector('input[value="client-a"]')).not.toBeNull()
+    }
+  )
+
+  it('keeps creation separate from an existing provider named new', () => {
+    mockUseSSOProviders.mockReturnValue({
+      data: { providers: [{ ...provider('org-a'), providerId: 'new' }] },
+      isLoading: false,
+    })
+    renderSso('org-a', '?provider=new&createProvider=true')
+
+    expect(findButton('Save')).toBeDefined()
+    expect(findButton('Edit')).toBeUndefined()
+    expect(container.querySelector('input[value="client-a"]')).toBeNull()
+
+    act(() => findButton('Identity providers')?.click())
+    expect(container.querySelector('[aria-label="Open new"]')).not.toBeNull()
+    openProvider('new')
+    expect(findButton('Edit')).toBeDefined()
+  })
+
   it('lists every provider with its protocol and domain, one row each', () => {
     mockUseSSOProviders.mockReturnValue({
       data: {

apps/sim/ee/sso/components/sso-settings.tsx

@@ -16,7 +16,7 @@ import { SsoProviderList } from '@/ee/sso/components/sso-provider-list'
 import { SsoProviderSettings } from '@/ee/sso/components/sso-provider-settings'
 import { VerifiedDomainsSection } from '@/ee/sso/components/verified-domains-section'
 import { useDeleteSSOProvider, useSSOProviders } from '@/ee/sso/hooks/sso'
-import { NEW_SSO_PROVIDER, ssoSettingsParsers, ssoSettingsUrlKeys } from '@/ee/sso/search-params'
+import { ssoSettingsParsers, ssoSettingsUrlKeys } from '@/ee/sso/search-params'
 import { useOrganizationBilling } from '@/hooks/queries/organization'
 
 const SETTINGS_TABS = [
@@ -40,28 +40,23 @@ export function SSO({ organizationId }: SSOProps) {
 }
 
 function OrganizationSsoSettings({ organizationId }: SSOProps) {
-  const [{ tab: requestedTab, provider: requestedProvider }, setParams] = useQueryStates(
-    ssoSettingsParsers,
-    ssoSettingsUrlKeys
-  )
+  const [{ tab: requestedTab, provider: requestedProvider, createProvider }, setParams] =
+    useQueryStates(ssoSettingsParsers, ssoSettingsUrlKeys)
   const { billingEnabled, features } = useDeploymentShape()
   const billing = useOrganizationBilling(organizationId)
   const providers = useSSOProviders({ organizationId })
   const provisioningAvailable = features.scim
   const tab = requestedTab === 'provisioning' && !provisioningAvailable ? 'sign-in' : requestedTab
   const providerList = providers.data?.providers ?? []
   const selectedProvider =
-    requestedProvider && requestedProvider !== NEW_SSO_PROVIDER
+    requestedProvider && !createProvider
       ? providerList.find((entry) => entry.providerId === requestedProvider)
       : undefined
   const signInView: 'create' | 'detail' | 'list' =
-    providerList.length === 0 || requestedProvider === NEW_SSO_PROVIDER
-      ? 'create'
-      : selectedProvider
-        ? 'detail'
-        : 'list'
+    providerList.length === 0 || createProvider ? 'create' : selectedProvider ? 'detail' : 'list'
   /** Opening pushed a history entry; closing must not push another. */
-  const showList = () => void setParams({ provider: null }, { history: 'replace' })
+  const showList = () =>
+    void setParams({ provider: null, createProvider: null }, { history: 'replace' })
   const deleteProvider = useDeleteSSOProvider()
   const [pendingDeleteId, setPendingDeleteId] = useState<string | null>(null)
   const pendingDelete = providerList.find((entry) => entry.providerId === pendingDeleteId)
@@ -128,19 +123,19 @@ function OrganizationSsoSettings({ organizationId }: SSOProps) {
             providers={providerList}
             active={tab === 'sign-in'}
             docsLink={DOCS_LINKS['sign-in']}
-            onAdd={() => void setParams({ provider: NEW_SSO_PROVIDER })}
-            onOpen={(providerId) => void setParams({ provider: providerId })}
+            onAdd={() => void setParams({ provider: null, createProvider: true })}
+            onOpen={(providerId) => void setParams({ provider: providerId, createProvider: null })}
             onDelete={setPendingDeleteId}
           />
         ) : (
           <SsoProviderSettings
-            key={selectedProvider?.providerId ?? NEW_SSO_PROVIDER}
+            key={selectedProvider ? `provider:${selectedProvider.providerId}` : 'create'}
             organizationId={organizationId}
             existingProvider={selectedProvider}
             active={tab === 'sign-in'}
             onOpenDomains={() => void setParams({ tab: 'domains' })}
             onSaved={(providerId) =>
-              void setParams({ provider: providerId }, { history: 'replace' })
+              void setParams({ provider: providerId, createProvider: null }, { history: 'replace' })
             }
             onBack={providerList.length > 0 ? showList : undefined}
             onDelete={

apps/sim/ee/sso/search-params.ts

@@ -1,14 +1,12 @@
-import { parseAsString, parseAsStringLiteral } from 'nuqs/server'
+import { parseAsBoolean, parseAsString, parseAsStringLiteral } from 'nuqs/server'
 
 export const SSO_SETTINGS_TABS = ['sign-in', 'domains', 'provisioning'] as const
 
-/** The value of `provider` that opens the add-provider form rather than an existing one. */
-export const NEW_SSO_PROVIDER = 'new'
-
 export const ssoSettingsParsers = {
   tab: parseAsStringLiteral(SSO_SETTINGS_TABS).withDefault('sign-in'),
   /** Provider id being viewed or edited on the sign-in tab; absent shows the list. */
   provider: parseAsString,
+  createProvider: parseAsBoolean.withDefault(false),
 }
 
 export const ssoSettingsUrlKeys = { history: 'push', clearOnDefault: true } as const

apps/sim/lib/api/contracts/auth.ts

@@ -123,7 +123,7 @@ export type SsoProviderView = z.output<typeof ssoProviderListEntrySchema>
 export const deleteSsoProviderContract = defineRouteContract({
   method: 'DELETE',
   path: '/api/auth/sso/providers/[providerId]',
-  params: z.object({ providerId: z.string().min(1).max(128) }),
+  params: z.object({ providerId: z.string().min(1) }),
   response: {
     mode: 'json',
     schema: z.object({ success: z.literal(true), providerId: z.string() }),