# User Settings

## Settings link

* [Two-step Authentication ](/intercode-saas-kit/pages/auth/two-factor-auth.md)
* [Impersonation](/intercode-saas-kit/features/impersonation.md)
* [App Tour](/intercode-saas-kit/pages/user-settings/app-tour.md)

## Page

User settings have their own page. You can access it from this menu.

<figure><img src="/files/I93g0q2cGQoHDETLSitI" alt=""><figcaption></figcaption></figure>

or by typing

<http://your\\_website/user-settings>

Go there and look at what setting do you have. Simple settings with switchers but all the mechanics you can learn from separate blocks.

## Switcher handler

What can be mentioned is the function that handles the request based on what switcher we switch.

```javascript
    const handleSwitchChange = async (value, type) => {
        setLoading(prev => ({ ...prev, [type]: true }));

        try {
            switch (type) {
                case 'impersonationAllowed':
                    await updateProfile({ impersonationAllowed: value });
                    break;
                case 'tourCompleted':
                    await updateUserTourStatus();
                    fetchUser();
                    break;
                default:
                    break;
            }

            setOptions(prevState => ({
                ...prevState,
                [type]: value,
            }));

            globalNotification.open({
                type: notificationType.SUCCESS,
                message: t('notification.save-success.message'),
                description: t('notification.save-success.description'),
                placement: 'top',
            });
        } catch (err) {
            const errorCode = err.response.data?.code;

            globalNotification.open({
                type: notificationType.ERROR,
                message: t(`apiResponses:${errorCode}.message`),
                description: t(`apiResponses:${errorCode}.description`),
                placement: 'top',
            });
        } finally {
            setLoading(prev => ({ ...prev, [type]: false }));
        }
    };
```

The **`handleSwitchChange`**&#x69;s universal function that manages the behavior when a switch toggle is changed, updating settings and notifying the user accordingly. You can apply it every new switcher but edit the switch logic inside.

Here’s a breakdown of how it works:

1. **Set Loading State**: It first sets a loading state specific to the **type** (e.g., '**impersonationAllowed**' or '**tourCompleted**'), so the UI can show loading feedback for the action in progress.
2. **Process Switch Type**: The function checks the **type** to determine which action to perform:
   * If the **type** is **impersonationAllowed**, it calls **updateProfile** to update the user's profile with the new value.
   * If the **type** is **tourCompleted**, it calls **updateUserTourStatus** to update the tour status and then fetches the updated user data by calling **fetchUser()**.
3. **Update Options**: After successfully executing the action, it updates the **options** state by setting the value of the corresponding **type** in the **options** object.
4. **Show Success Notification**: Upon successful completion, it displays a global success notification, retrieving translated message and description strings via **t**.
5. **Handle Errors**: If an error occurs:
   * It captures the error code from the response (**err.response.data?.code**).
   * It displays a global error notification with a message and description based on the error code.
6. **Unset Loading State**: Finally, it resets the loading state for the **type** to **false** in the **finally** block, ensuring that loading stops regardless of success or error.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://intercode.gitbook.io/intercode-saas-kit/pages/user-settings.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.