> ## Documentation Index
> Fetch the complete documentation index at: https://docs.superblocks.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Okta SSO setup

export const Alert = ({type, title, children}) => {
  const getIcon = () => {
    switch (type) {
      case 'info':
        return "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M10 0C4.477 0 0 4.477 0 10s4.477 10 10 10 10-4.477 10-10S15.523 0 10 0zm0 15c-.552 0-1-.448-1-1s.448-1 1-1 1 .448 1 1-.448 1-1 1zm1-3H9V6h2v6z' fill='%230099FF'/%3E%3C/svg%3E";
      case 'success':
        return "data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M10 0C4.477 0 0 4.477 0 10s4.477 10 10 10 10-4.477 10-10S15.523 0 10 0zm4.293 6.293L9 11.586 5.707 8.293c-.391-.391-1.024-.391-1.414 0s-.391 1.024 0 1.414l4 4c.391.391 1.024.391 1.414 0l6-6c.391-.391.391-1.024 0-1.414s-1.024-.391-1.414 0z' fill='%230CC26D'/%3E%3C/svg%3E";
      case 'warning':
        return "data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHhtbDpzcGFjZT0ncHJlc2VydmUnIHdpZHRoPScxMDgwJyBoZWlnaHQ9JzEwODAnPjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIGZpbGw9J3RyYW5zcGFyZW50Jy8+PHBhdGggZD0nTTEzLjc5NCAxMC43NSA4LjMgMS4yNWExLjUgMS41IDAgMCAwLTIuNiAwbC01LjQ5NCA5LjVBMS40OTQgMS40OTQgMCAwIDAgMS41IDEzaDExYTEuNDkzIDEuNDkzIDAgMCAwIDEuMjk0LTIuMjVNNi41IDUuNWEuNS41IDAgMCAxIDEgMFY4YS41LjUgMCAwIDEtMSAwek03IDExYS43NS43NSAwIDEgMSAwLTEuNS43NS43NSAwIDAgMSAwIDEuNScgc3R5bGU9J3N0cm9rZTpub25lO3N0cm9rZS13aWR0aDoxO3N0cm9rZS1kYXNoYXJyYXk6bm9uZTtzdHJva2UtbGluZWNhcDpidXR0O3N0cm9rZS1kYXNob2Zmc2V0OjA7c3Ryb2tlLWxpbmVqb2luOm1pdGVyO3N0cm9rZS1taXRlcmxpbWl0OjQ7ZmlsbDojZmY5ZjM1O2ZpbGwtcnVsZTpub256ZXJvO29wYWNpdHk6MScgdHJhbnNmb3JtPSd0cmFuc2xhdGUoLjAyIDE5LjMwNSlzY2FsZSg3Ny4xNCknLz48L3N2Zz4=";
      case 'danger':
        return "data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 0C4.477 0 0 4.477 0 10s4.477 10 10 10 10-4.477 10-10S15.523 0 10 0zm5.707 4.293L10 9.586 4.293 4.293c-.391-.391-1.024-.391-1.414 0s-.391 1.024 0 1.414L8.586 11l-5.707 5.293c-.391.391-.391 1.024 0 1.414s1.024.391 1.414 0L10 12.414l5.707 5.293c.391.391 1.024.391 1.414 0s.391-1.024 0-1.414L11.414 11l5.707-5.293c.391-.391.391-1.024 0-1.414s-1.024-.391-1.414 0z' fill='%23F45252'/%3E%3C/svg%3E";
      case 'note':
        return "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M10 0C4.477 0 0 4.477 0 10s4.477 10 10 10 10-4.477 10-10S15.523 0 10 0zm0 15c-.552 0-1-.448-1-1s.448-1 1-1 1 .448 1 1-.448 1-1 1zm1-3H9V6h2v6z' fill='%230099FF'/%3E%3C/svg%3E";
      default:
        return "";
    }
  };
  return <div className={`alert alert--${type}`}>
      <div className="alert-icon" style={{
    backgroundImage: `url("${getIcon()}")`,
    backgroundRepeat: 'no-repeat',
    backgroundPosition: 'center center',
    backgroundSize: '20px',
    width: '24px',
    height: '24px',
    position: 'absolute',
    left: '16px',
    top: '16px'
  }} />
      <div className="alert-content">
        {title && <div className="alert-title">{title}</div>}
        <div className="alert-body">{children}</div>
      </div>
    </div>;
};

Superblocks single sign-on (SSO) with Okta lets your team seamlessly authenticate and access Superblocks using their Okta credentials. This guide walks you through how to configure single sign-on for Superblocks.

## Prerequisites

To setup SSO for your organization, you'll need:

* An Okta account
* A user account with **[App Admin](https://help.okta.com/en-us/content/topics/security/administrators-admin-comparison.htm)** access
* A Superblocks organization on the **[Enterprise](https://www.superblocks.com/pricing)** plan

## Set up Okta

Set up single sign-on for Okta by creating either a custom **SAML** or **OIDC** application. For full details, see Okta's guides for how to:

* [Create SAML app integrations](https://help.okta.com/en-us/content/topics/apps/apps_app_integration_wizard_saml.htm)
* [Create OIDC app integrations](https://help.okta.com/en-us/content/topics/apps/apps_app_integration_wizard_oidc.htm)

<Alert type="info">
  For the fastest setup,{" "}
  <a href="#create-an-oidc-integration">create an OIDC integration</a>.

  <br />

  <br />

  If you plan on using SCIM for user provisioning and group management, we recommend{" "}
  <a href="#create-a-saml-integration">creating a SAML integration</a>. Learn more
  about <a href="/admin/org-administration/auth/scim/">
  Managing users and groups with SCIM
  </a>.
</Alert>

### Create an OIDC integration

1. Log in to Okta and go to the **Admin Console**

2. Navigate to **Applications** → **Applications**

3. Click **Create App Integration**

4. Select **OIDC - OpenID Connect** as the **Sign-on method**

5. Select **Web Application** as the **Application type** and click **Next**

6. Configure the following settings for your application

   <table>
     <tr>
       <th>Name</th>

       <td>
         <strong>Superblocks</strong>, or a custom name you want users to see on
         their application dashboard.
       </td>
     </tr>

     <tr>
       <th>Grant type</th>
       <td>Implicit (hybrid)</td>
     </tr>

     <tr>
       <th>Sign-in redirect URIs</th>

       <td>
         <code>[https://login.superblocks.com/login/callback](https://login.superblocks.com/login/callback)</code>
       </td>
     </tr>

     <tr>
       <th>Sign-out redirect URIs</th>

       <td>
         <code>[https://app.superblocks.com/logout](https://app.superblocks.com/logout)</code>
       </td>
     </tr>

     <tr>
       <th>Assignments</th>
       <td>Your desired settings for who can access Superblocks.</td>
     </tr>
   </table>

7. Click **Save**. You'll be brought to the **General** tab of your new application. Stay on this tab and continue to find out [what info to send to Superblocks](#oidc-application).

### Create a SAML integration

1. Log in to Okta and go to the **Admin Console**

2. Navigate to **Applications** → **Applications**

3. Click **Create App Integration**

4. Select **SAML 2.0** as the **Sign-on method**

5. Provide the general information for the integration and click **Next**

6. Enter the following information into **SAML Settings** → **General**

   <table>
     <tr>
       <th>Single sign-on URL</th>

       <td>
         <span>[https://login.superblocks.com/login/callback?connection=](https://login.superblocks.com/login/callback?connection=)</span><code>\<CompanyName>-SAML</code>
       </td>
     </tr>

     <tr>
       <th>Audience URI</th>

       <td>
         `urn:auth0:superblocks-prod:<CompanyName>-SAML`
       </td>
     </tr>

     <tr>
       <th>Name ID format</th>
       <td>EmailAddress</td>
     </tr>

     <tr>
       <th>Application username</th>
       <td>Email</td>
     </tr>
   </table>

   <Alert type="warning">
     Replace `<CompanyName>` with your company's name. Remove
     all spaces and special characters from the name. If your company name is
     multiple words, capitalize the first letter of each word.

     <br />

     For example, the company River Bank Technologies would become `RiverBankTechnologies`
   </Alert>

7. Configure the follow attributes in **SAML Settings** → **Attribute Statements**

   | Name      | Name format | Value          |
   | --------- | ----------- | -------------- |
   | email     | Unspecified | user.email     |
   | givenname | Unspecified | user.firstName |
   | surname   | Unspecified | user.lastName  |

8. Click **Next** and fill out the Okta feedback form, then click **Finish**.

9. You'll be brought to the **Sign on** tab of your new application. Click **View Setup Instructions** and continue to the next section to learn [what info to send to Superblocks](#saml-application).

## Send IDP info to Superblocks

### OIDC application

Send the following information to [support@superblocks.com](mailto:support@superblocks.com)

<table>
  <tr>
    <th style={{ width: 200 }}>Client ID</th>

    <td>
      The public identifier for your client located on the{" "}
      <strong>General</strong> tab of your application.
    </td>
  </tr>

  <tr>
    <th>Client Secret</th>

    <td>
      The <strong>secret</strong> value shows in the{" "}
      <strong>CLIENT SECRETS</strong> section.<br /><br />

      Note: we recommend using a secure transfer mechanism such as [https://onetimesecret.com](https://onetimesecret.com) or similar to send the secret.
    </td>
  </tr>

  <tr>
    <th>Okta domain</th>

    <td>
      Your company's Okta domain. You can find this by clicking your username in
      the upper-right corner of the Admin Console. Learn more about how to{" "}
      <a href="https://developer.okta.com/docs/guides/find-your-domain/main/">Find your Okta domain</a>.
    </td>
  </tr>

  <tr>
    <th>Domains</th>

    <td>
      A list of domain and domain aliases your employees should be able to use
      when logging into Superblocks.
    </td>
  </tr>

  <tr>
    <th>Google Sign-in</th>

    <td>
      If your use Google Workspace, let us know if you want employees to also be
      able to login with their Google credentials, or if they should be forced
      to login using Okta.
    </td>
  </tr>
</table>

### SAML application

Send the following information to [support@superblocks.com](mailto:support@superblocks.com)

<table>
  <tr>
    <th style={{ width: 200 }}>Sign In URL</th>

    <td>
      The <strong>Identity Provider Single Sign-On URL</strong> in the Okta
      setup instructions.
    </td>
  </tr>

  <tr>
    <th>X509 Signing Certificate</th>
    <td>The certificate downloaded from the setup instructions.</td>
  </tr>

  <tr>
    <th>Metadata URL (optional)</th>

    <td>
      Optionally, send us the <strong>Metadata URL</strong> shown on the{" "}
      <strong>Sign on</strong> tab of your application.
    </td>
  </tr>

  <tr>
    <th>Domains</th>

    <td>
      A list of domain and domain aliases your employees should be able to use
      when logging into Superblocks.
    </td>
  </tr>

  <tr>
    <th>Google Sign-in</th>

    <td>
      If you use Google Workspace, let us know if you want employees to also be
      able to login with their Google credentials, or if they should be forced
      to login using Okta.
    </td>
  </tr>
</table>