Set up your configuration so you can use it across API calls and Client Components
import { QuadrataSdkConfiguration, QuadrataEnvironment } from '@quadrata/sdk/types';
export const quadrataSdkConfig: QuadrataSdkConfiguration = {
environment: QuadrataEnvironment.SANDBOX
};
import { createAccessToken } from '@quadrata/sdk/api';
const { data: { accessToken } } = await createAccessToken(
{
apiKey: process.env.QUADRATA_API_KEY,
options: {
cache: 'no-cache'
}
},
quadrataSdkConfig
);
import * as QuadrataTypes from '@quadrata/sdk/types';
import { withWagmiConnect, Quadrata } from '@quadrata/sdk/client';
export default function OnboardingComponent({ accessToken }) {
const quadrataProps = withWagmiConnect({
accessToken: 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
attributes: [
QuadrataTypes.QuadrataAttribute.DID,
QuadrataTypes.QuadrataAttribute.COUNTRY,
QuadrataTypes.QuadrataAttribute.AML
],
privacyScopes: [
QuadrataTypes.QuadrataPrivacyConsent.EMAIL,
QuadrataTypes.QuadrataPrivacyConsent.DATE_OF_BIRTH,
QuadrataTypes.QuadrataPrivacyConsent.FIRST_NAME,
QuadrataTypes.QuadrataPrivacyConsent.LAST_NAME,
QuadrataTypes.QuadrataPrivacyConsent.ADDRESS
],
},
kybProps: {
// 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.Component.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>
);
}