---
title: Introduction
slug: infra/introduction
createdAt: 2022-05-15T11:02:08.000Z
---

## Why Callbacks?

The Socratease SDK loads a UI and, based on user interaction, modifies the UI. For example, imagine you load the Quiz UI and a user answers the quiz and then submits it. By default, the user will see a summary as shown below.

::Image[]{src="https://api.archbee.com/api/optimize/sIThB0ZiqhR6tdk4fXm2D/fVL6I3qnBN1X7Idfr8ncC_image.png" size="66" width="2248" height="1428" position="center" showCaption="false"}

But instead of showing this page, maybe you want to **redirect a user to a different URL**. To override this default behavior, Socratease allows you to use callbacks.

## How Does It Work

Let's consider the previous example. If a user clicks the Submit button on a quiz, you want to intercept it and perform some action. For this, you need to know that there is an event called `unit.submitted` . See the code below. There is the regular `Socratease.init` function, which you would include by default. Just below that, we have a `Socratease.callback` function, which is meant for these interceptions.

Imagine you want to redirect the user to [google.com](#) if they finished the quiz. You could check for the event type and if it qualifies, just write regular JS code to carry out the redirection.&#x20;

```javascript
//Make Sure to add this code inside onLoad event
Socratease.init(clientId, jsonPayload, hmacPayloadB64, options);

Socratease.callback = (type, resp, fallback) => {
    if (type === "unit.submitted") {
        window.location.href = "https://google.com";
    } else {
        fallback(...resp);
    }
};
```

## Callback Parameters

The callback is a function of these parameters:

1. `type`: Actions like Quiz submission or Quiz creation generate a unique event name that you can identify by type to override the default behavior. In this way, you can just write multiple `if else `conditions and override behavior or each action.
2. `resp`: Often, you would want the post-callback behaviour to depend on what the user did before the callback. For example, you would like to redirect the user to different pages based on the percentage they scored. `resp` contains this information as list of dictionaries.
3. `fallback`: fallback is basically the default behaviour of an action. For example, if you don't want to modify the navigation flow of a high-scoring user, you will call `fallback(...resp)` within an if condition for that user.

:::hint{type="warning"}
You should always make the fallback **explicit**. In the example above, if the callback type is not `unit.submitted`, we have explicitly written that `fallback(...reso)` should be called. Otherwise, for example, if the event type is `unit.created` as the if condition isn't satisfied, nothing will happen as `fallback(...resp)` isn't being called.
:::

## Event Types

You can find the list of all events in the Events article within this help folder in the sidebar to your left.

