# Build a custom flow for authenticating with enterprise connections (Legacy)

> This guide is for users who want to build a custom flow. To use a _prebuilt_ UI, use the [Account Portal pages](https://clerk.com/docs/guides/account-portal/overview.md) or [prebuilt components](https://clerk.com/docs/reference/components/overview.md).

> This guide uses the Core 2 `useSignIn()` and `useSignUp()` hooks, which are available in Core 3 SDKs by adding the `/legacy` subpath to the import path. If you're using a Core 2 SDK, remove the `/legacy` subpath.

## Before you start

You must configure your application instance through the Clerk Dashboard for the enterprise connection(s) that you want to use. Visit [the appropriate guide for your platform](https://clerk.com/docs/guides/configure/auth-strategies/enterprise-connections/overview.md) to learn how to configure your instance.

## Create the sign-up and sign-in flow

The following example **will both sign up _and_ sign in users**, eliminating the need for a separate sign-up page. However, if you want to have separate sign-up and sign-in pages, the sign-up and sign-in flows are equivalent, meaning that all you have to do is swap out the `SignIn` object for the `SignUp` object using the [useSignUp()](https://clerk.com/docs/reference/hooks/use-sign-up.md) hook.

The following example:

1. Accesses the [SignIn](https://clerk.com/docs/reference/objects/sign-in.md) object using the [useSignIn()](https://clerk.com/docs/reference/hooks/use-sign-in.md) hook.
2. Starts the authentication process by calling [SignIn.sso(params)](https://clerk.com/docs/reference/objects/sign-in-future.md#sso). This method requires the following params:
   - `redirectUrl`: The URL that the browser will be redirected to once the user authenticates with the identity provider if no additional requirements are needed, and a session has been created.
   - `redirectCallbackUrl`: The URL that the browser will be redirected to once the user authenticates with the identity provider if additional requirements are needed.
3. Creates a route at the URL that the `redirectCallbackUrl` param points to. The following example re-uses the `/sign-in` route, which should be written to handle when a sign-in attempt is in a non-complete status such as `needs_second_factor`.

**Sign in page**

filename: app/sign-in/[[...sign-in]]/page.tsx
```tsx
'use client'

import * as React from 'react'
import { useSignIn } from '@clerk/nextjs/legacy'

export default function Page() {
  const { signIn, isLoaded } = useSignIn()

  const signInWithEnterpriseSSO = (e: React.FormEvent) => {
    e.preventDefault()

    if (!isLoaded) return null

    const email = (e.target as HTMLFormElement).email.value

    signIn
      .authenticateWithRedirect({
        identifier: email,
        strategy: 'enterprise_sso',
        redirectUrl: '/sign-in/sso-callback',
        redirectUrlComplete: '/',
      })
      .then((res) => {
        console.log(res)
      })
      .catch((err: any) => {
        // See https://clerk.com/docs/guides/development/custom-flows/error-handling
        // for more info on error handling
        console.log(err.errors)
        console.error(err, null, 2)
      })
  }

  return (
    <form onSubmit={(e) => signInWithEnterpriseSSO(e)}>
      <input id="email" type="email" name="email" placeholder="Enter email address" />
      <button>Sign in with Enterprise SSO</button>
    </form>
  )
}
```

**SSO callback page**

filename: app/sign-in/sso-callback/page.tsx
```jsx
import { AuthenticateWithRedirectCallback } from '@clerk/nextjs'

export default function Page() {
  // Handle the redirect flow by calling the Clerk.handleRedirectCallback() method
  // or rendering the prebuilt <AuthenticateWithRedirectCallback/> component.
  // This is the final step in the custom Enterprise SSO flow.
  return <AuthenticateWithRedirectCallback />
}
```

---

## Sitemap

[Overview of all docs pages](https://clerk.com/docs/llms.txt)