> ## Documentation Index
> Fetch the complete documentation index at: https://wundergraphinc-milinda-eng-8701-implement-cache-warmer-from.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Auth0

> Setting up SSO with Auth0

### Steps to set Auth0 as an OIDC identity provider

<Steps>
  <Step>
    Navigate to the Applications view within your Auth0 account.
  </Step>

  <Step>
    Either use the default application or create a new application by clicking on the **Create Application** button.
  </Step>

  <Step>
    A dialog will open, give the app a name, select the type of application and then click on the **Create** button.

    <Frame>
      <img src="https://mintcdn.com/wundergraphinc-milinda-eng-8701-implement-cache-warmer-from/w_FX7ZOgBLGbd6Dk/images/studio/sso/create-native-app-named-my-app.png?fit=max&auto=format&n=w_FX7ZOgBLGbd6Dk&q=85&s=752076291ada3573d7324ec0488585c8" alt="Creating a new Native application named My App" title="Create Native app named My App" width="768" height="422" data-path="images/studio/sso/create-native-app-named-my-app.png" />
    </Frame>
  </Step>

  <Step>
    Once the app is created, navigate to the Setting tab. Now copy the **Domain**, **Client ID** and **Client Secret**.

    <Frame>
      <img src="https://mintcdn.com/wundergraphinc-milinda-eng-8701-implement-cache-warmer-from/w_FX7ZOgBLGbd6Dk/images/studio/sso/app-basic-info-with-name-and-domain.png?fit=max&auto=format&n=w_FX7ZOgBLGbd6Dk&q=85&s=dc4f88e9ec24e8e2d6f7243e65bad116" alt="Basic Information section showing app name My App and development domain" title="App basic info with name and domain" width="768" height="392" data-path="images/studio/sso/app-basic-info-with-name-and-domain.png" />
    </Frame>
  </Step>

  <Step>
    Navigate to the settings page on Cosmo.
  </Step>

  <Step>
    * Click on **Connect.**

    <Frame>
      <img src="https://mintcdn.com/wundergraphinc-milinda-eng-8701-implement-cache-warmer-from/w_FX7ZOgBLGbd6Dk/images/studio/sso/organization-settings-with-ai-rbac-scim.png?fit=max&auto=format&n=w_FX7ZOgBLGbd6Dk&q=85&s=eb301622de96280b5e75df91b41925e0" alt="Organization settings showing name, slug, and status of AI, RBAC, and SCIM features" title="Organization settings with AI, RBAC, SCIM" width="2796" height="1902" data-path="images/studio/sso/organization-settings-with-ai-rbac-scim.png" />
    </Frame>
  </Step>

  <Step>
    Give the connection a name, the **Discovery Endpoint** will be  `https://YOUR_AUTH0_DOMAIN/.well-known/openid-configuration` **,** and paste the **Client ID** and  **Client secret**copied before into the **Client ID** and  **Client Secret fields respectively,** and then click on **Connect.**

    <Frame>
      <img src="https://mintcdn.com/wundergraphinc-milinda-eng-8701-implement-cache-warmer-from/w_FX7ZOgBLGbd6Dk/images/studio/sso/oidc-provider-configuration-form.png?fit=max&auto=format&n=w_FX7ZOgBLGbd6Dk&q=85&s=ea8cd77ebc2c07035751f195408f3280" alt="Connect OpenID Connect Provider form with fields for name, endpoint, and credentials" title="OIDC provider configuration form" width="2786" height="2122" data-path="images/studio/sso/oidc-provider-configuration-form.png" />
    </Frame>
  </Step>

  <Step>
    Configure the mapping between the roles in Cosmo and the user roles in Auth0. The field **Group in the provider** can be populated with the name of the role or a regex to match the user roles. Once all the mappers are configured, click on **Save**.

    <Frame>
      <img src="https://mintcdn.com/wundergraphinc-milinda-eng-8701-implement-cache-warmer-from/w_FX7ZOgBLGbd6Dk/images/studio/sso/group-to-role-mapping-dialog.png?fit=max&auto=format&n=w_FX7ZOgBLGbd6Dk&q=85&s=1d69a674dd2bcc918f95a3205b9dd769" alt="Group mapper configuration dialog linking provider groups to Cosmo roles" title="Group-to-role mapping dialog" width="2774" height="1972" data-path="images/studio/sso/group-to-role-mapping-dialog.png" />
    </Frame>
  </Step>

  <Step>
    Copy the sign-in and sign-out redirect URIs displayed in the dialog.

    <Frame>
      <img src="https://mintcdn.com/wundergraphinc-milinda-eng-8701-implement-cache-warmer-from/w_FX7ZOgBLGbd6Dk/images/studio/sso/oidc-provider-configuration-steps.png?fit=max&auto=format&n=w_FX7ZOgBLGbd6Dk&q=85&s=28249ea3fedaa99d41a6b3adb53fb661" alt="Steps to configure OIDC provider with sign-in and sign-out redirect URLs" title="OIDC provider configuration steps" width="2784" height="1848" data-path="images/studio/sso/oidc-provider-configuration-steps.png" />
    </Frame>
  </Step>

  <Step>
    Navigate back to the settings tab of the application created on Auth0 and populate the **Allowed Callback URLs** and **Allowed Logout URLs** redirect URIs with the above-copied sign-in and sign-out URLs respectively. Click on **Save Changes**.

    <Frame>
      <img src="https://mintcdn.com/wundergraphinc-milinda-eng-8701-implement-cache-warmer-from/w_FX7ZOgBLGbd6Dk/images/studio/sso/application-uri-configuration.png?fit=max&auto=format&n=w_FX7ZOgBLGbd6Dk&q=85&s=69cab79542570a9263b5bf755c1ef431" alt="Application URI settings for callback and logout URLs in Cosmo Docs" title="Application URI configuration" width="768" height="394" data-path="images/studio/sso/application-uri-configuration.png" />
    </Frame>
  </Step>

  <Step>
    Now navigate to **Actions** -> **Library,** and then click on  **the Build Custom**button**.**

    <Frame>
      <img src="https://mintcdn.com/wundergraphinc-milinda-eng-8701-implement-cache-warmer-from/w_FX7ZOgBLGbd6Dk/images/studio/sso/empty-library-page.png?fit=max&auto=format&n=w_FX7ZOgBLGbd6Dk&q=85&s=43c9521b2022362f1f2adfbd5c21e94c" alt="Cosmo Docs library page showing no installed actions or configurations" title="Empty library page" width="768" height="389" data-path="images/studio/sso/empty-library-page.png" />
    </Frame>
  </Step>

  <Step>
    Give the action a name, select **Login/Post Login** as the **Trigger** and **Node 18** as the **Runtime** and then click the  **Create**button**.**
  </Step>

  <Step>
    Copy the below code and paste it into the editor shown, then click the **Deploy** button.

    ```js theme={null}
    exports.onExecutePostLogin = async (event, api) => {
      if(event.authorization){
        api.idToken.setCustomClaim(`ssoGroups`, event.authorization.roles);
      }
    };
    ```
  </Step>

  <Step>
    Now navigate to **Actions** -> **Flows,** and then click on  the  **Login**flow**.**
  </Step>

  <Step>
    Navigate to the **Custom** tab on the right side of the page. Now drag the action and place it between Start and Complete as shown below, and then click on **Apply**.

    <Frame>
      <img src="https://mintcdn.com/wundergraphinc-milinda-eng-8701-implement-cache-warmer-from/w_FX7ZOgBLGbd6Dk/images/studio/sso/login-flow-customization.png?fit=max&auto=format&n=w_FX7ZOgBLGbd6Dk&q=85&s=512bf2fe46214f6b9d0aabeb9480e175" alt="Login flow customization showing Start, test, and Complete actions" title="Login flow customization" width="768" height="470" data-path="images/studio/sso/login-flow-customization.png" />
    </Frame>
  </Step>

  <Step>
    Now you can assign users/groups to the application, and those users will be able to log into Cosmo using the URL provided on setting up the provider.
  </Step>
</Steps>
