Are you building an app that needs OAuth flow? Well, you’ll need to create a built-in hook that helps with that. This documentation will help you get started!

This built-in hook manages the communication with the Unbounce backend by itself.

This hook must be the app ID you’ve defined in the manifest file, or you’ll have to include it manually.

This built-in hook is called the useAppOauth:

export const useAppOauth = (appId: AppId) => {
  ...// private code
  return { authState, triggerConnect, triggerRetry, credentialsId };
};

When using the useAppOauth hook, we get an object with the following properties:

• authState
  • contains the result of authenticating the app, and its value is a string, authenticated, unauthenticated, loading, waiting, or error.
• triggerConnect
  • as its name suggests, it’s a function that triggers the opening of a modal with the authorization flow.
• triggerRetry
  • another function that’s commonly used when the state is waiting and error.
• credentialsId
  • This value is used along with the useApiRequest hook and allows us to fetch data from the Unbounce backend; otherwise, you’ll receive an error message.

Key Takeaways

• useAppOauth hook is imported from import { useAppOauth } from 'smart-builder-sdk'.