> For the complete documentation index, see [llms.txt](https://docs.quadrata.com/integration/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.quadrata.com/integration/how-to-integrate/quadrata-sdk/advanced/client-libraries/client-examples/all-in-one.md).

# All In One

## Enabling The All In One Component

The All In One Component is enabled when you specify a combination of properties in the Quadrata Component.

You can enable the All In One Component in one of the following ways:

* Specify `sharedProps` and either `kybProps` or `kycProps`
* Specify both `kybProps` and `kycProps`

## Example

This example demonstrates how to set up the `Quadrata` component to launch the All In One multi-component.

This context gives the user an intro screen where they can select either Individual User Onboarding or Business Onboarding.

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

{% hint style="info" %}
In this context, if the wallet address is unknown, the Individual User option will be disabled on the intro screen.
{% endhint %}

{% hint style="warning" %}
Not all of the required configuration or props are included in this example

See all available KYC props and configuration at the following page: [QuadClient Package](/integration/how-to-integrate/onboard-users/individual-passport-onboarding/4.-quadclient-package.md)

See all available KYB props and configuration at the following page: [QuadrataKyb Package](/integration/how-to-integrate/onboard-users/business-passport-onboarding/3.-quadratakyb-package.md)
{% endhint %}

{% hint style="info" %}
It is suggested that you use the built-in [`withWagmiConnect`](/integration/how-to-integrate/quadrata-sdk/advanced/client-libraries/client-examples/with-wagmi-connect.md) props initializer to abstract connecting a wallet and signing transactions, but you are free to implement your own logic.
{% endhint %}

{% hint style="info" %}
You can use the [`createAccessToken`](/integration/how-to-integrate/quadrata-sdk/advanced/api-libraries/api-service-libraries/create-access-token.md) API Service to create the access token you need to pass in to the component.
{% endhint %}

```tsx
import * as QuadrataTypes from '@quadrata/sdk/types';
import { Quadrata } from '@quadrata/sdk/client';

const quadrataSdkConfig: QuadrataTypes.QuadrataSdkConfiguration = {
    environment: QuadrataTypes.QuadrataEnvironment.SANDBOX
};

export default function AllInOneOnboardingComponent(props: { accessToken: string }) {
    const quadrataProps = {
        accessToken: props.accessToken,
        sdkConfig: quadrataSdkConfig,
        clientConfig: {
            _debug: true,
            protocolName: 'Your Company Name'
        },
        sharedProps: {
            onApplicationEnd: (data: Record<string, any>) => {
                console.log('Application ended', data.status, data.error);
            },
        },
        kycProps: {
            // see available props at
            // https://docs.quadrata.com/integration/how-to-integrate/onboard-users/individual-passport-onboarding/4.-quadclient-package#less-than-quadclient-greater-than-props
            account: '0x123',
            attributes: [
                QuadrataTypes.QuadrataAttribute.DID,
                QuadrataTypes.QuadrataAttribute.COUNTRY,
                QuadrataTypes.QuadrataAttribute.AML
            ],
            chainId: QuadrataTypes.QuadrataNetwork.SEPOLIA,
            privacyScopes: [
                QuadrataTypes.QuadrataPrivacyConsent.EMAIL,
                QuadrataTypes.QuadrataPrivacyConsent.DATE_OF_BIRTH,
                QuadrataTypes.QuadrataPrivacyConsent.FIRST_NAME,
                QuadrataTypes.QuadrataPrivacyConsent.LAST_NAME,
                QuadrataTypes.QuadrataPrivacyConsent.ADDRESS
            ],
        },
        kybProps: {
            // since clientConfig and sharedProps define everything, nothing is 
            // required here unless you want to override anything or have more 
            // control over the callbacks
            
            // see available props at
            // https://docs.quadrata.com/integration/how-to-integrate/onboard-users/business-passport-onboarding/3.-quadratakyb-package
        }
    };
    return (
        <Quadrata {...quadrataProps}>
            {((helper: QuadrataTypes.Client.Components.Helper) => {
                if (helper.isApplicationComplete) {
                    return <p>Application is Complete</p>;
                }
                if (helper.isPassportInReview) {
                    return <p>Your application is in review.</p>;
                }
                return (
                    <button
                        disabled={!helper.isApplicationReady}
                        onClick={helper.launchApplication}
                    >
                        Launch Application
                    </button>
                );
            })}
        </Quadrata>
    );
}
```