LucraSDK Initialization

Initialize LucraSDK once at app startup. Initialization is asynchronous because the SDK must validate configuration and establish backend communication.

Required Configuration

LucraSDK.init(options) expects:

  • apiKey (string, required): API key matching your environment.

  • environment (LucraSDK.ENVIRONMENT, required): SANDBOX or PRODUCTION.

  • theme (object, optional but recommended): Overrides Lucra UI appearance. See Theming.

Example Initialization

import { LucraSDK } from '@lucra-sports/lucra-react-native-sdk';
import { useEffect, useState } from 'react';
import { Platform } from 'react-native';

const lucraSDKOptions = {
  apiKey: 'YOUR_API_KEY', // use sandbox API key with sandbox, production API key with production.
  environment: LucraSDK.ENVIRONMENT.SANDBOX, //or PRODUCTION
  theme: {
    primary: '#09E35F',
    secondary: '#5E5BD0',
    tertiary: '#9C99FC',
    onPrimary: '#001448',
    onSecondary: '#FFFFFF',
    onTertiary: '#FFFFFF',
    fontFamily: {
      normal:
        Platform.OS === 'ios'
          ? 'Inter Regular'
          : 'fonts/Inter-Regular.ttf',
      medium:
        Platform.OS === 'ios'
          ? 'Inter Medium'
          : 'fonts/Inter-Medium.ttf',
      semibold:
        Platform.OS === 'ios'
          ? 'Inter SemiBold'
          : 'fonts/Inter-SemiBold.ttf',
      bold:
        Platform.OS === 'ios' ? 'Inter Bold' : 'fonts/Inter-Bold.ttf',
    },
  },
};

export function AppRoot() {
  const [isReady, setIsReady] = useState(false);

  useEffect(() => {
    LucraSDK.init(lucraSDKOptions).then(() => setIsReady(true));
  }, []);

  if (!isReady) return null;
  return <YourApp />;
}

LucraSDK.ready is false by default and flips to true after LucraSDK.init resolves. Use your own state to gate rendering and treat LucraSDK.ready as an internal flag:

After Initialization

Once LucraSDK.init resolves, you can:

Last updated