airbridge-react-native-sdk/qa/source/pages/Home.js

Airbridge SDK for React Native

import React, { useEffect, useState } from 'react'

import { Platform, Text, View, NativeModules } from 'react-native'
import { CustomView } from '../component/CustomView'
import CustomButton from '../component/CustomButton'
import CustomSwitch from '../component/CustomSwitch'

import { buildNumber, reactNativeSDKVersion, branchName } from '../common/BuildParameter.generated'
import { Styles } from '../common/Styles'
import { Colors } from '../common/Colors'
import { native } from '../common/Native'

import { fcmService } from '../common/FCMService'

import Toast from 'react-native-simple-toast'
import { Airbridge } from 'airbridge-react-native-sdk'

import { qaLog } from '../common/QALog'

export default function HomePage({ navigation }) {

  const [isEnabled, setEnabled] = useState(true);
  const [isStartInAppPurchaseTracking, setStartInAppPurchaseTracking] = useState(false);
  const [isTrackingEnabled, setTrackingEnabled] = useState(true);

  useEffect(() => {
    async function fetchData() {
      setEnabled(await Airbridge.isSDKEnabled())
      setTrackingEnabled(await Airbridge.isTrackingEnabled())
    }
    fetchData()
  }, [])
  
  const header = `${buildNumber},ReactNative,${reactNativeSDKVersion},${branchName}`

  return (
    <CustomView style={Styles.container}>

      <Text 
        style={{
          color: Colors.black, 
          fontSize: 16,
          textAlign: 'center'
        }
      }>{header}</Text>

      <View style={Styles.line} />

      <CustomButton
        buttonColor={Colors.red}
        title={'User Info'}
        accessibilityLabel={'userInfo'}
        onPress={() => navigation.navigate('userInfo')} />

      <View style={{ flexDirection: 'row', alignItems: 'center' }}>
        <View style={{flex: 1}}>
          <CustomButton
            buttonColor={Colors.pink}
            title={'Occurring Event'}
            accessibilityLabel={'occurringEvent'}
            onPress={() => navigation.navigate('occurringEvent')} />
        </View>
        <View style={{ margin: 4}} />
        <View style={{flex: 1}}>
          <CustomButton
            buttonColor={Colors.darkpink}
            title={'InAppPurchaseEvent'}
            accessibilityLabel={'inAppPurchaseEvent'}
            onPress={() => {
              NativeModules.TestUiInteractor.purchase()
            }} />
        </View>
      </View>

      <View style={Styles.line} />
      
      <View style={{ flexDirection: 'row', alignItems: 'center' }}>
        <View style={{flex: 1}}>
          <CustomButton
            height={50}
            buttonColor={Colors.purple}
            title={'identifiers'}
            accessibilityLabel={'identifiers'}
            onPress={() => navigation.navigate('identifiers')} />
        </View>
        <View style={{ margin: 4}} />
        <View style={{flex: 1}}>
          <CustomButton
            height={50}
            buttonColor={Colors.deepPurple}
            title={'Install\nReferrer'}
            accessibilityLabel={'installReferrer'}
            onPress={() => navigation.navigate('installReferrer')} />
        </View>
        <View style={{ margin: 4}} />
        <View style={{flex: 1}}>
          <CustomButton
            height={50}
            buttonColor={Colors.purple}
            title={'Device Info'}
            accessibilityLabel={'deviceInfo'}
            onPress={() => navigation.navigate('deviceInfo')} />
        </View>
      </View>
      
      <View style={Styles.line} />

      <CustomButton
        buttonColor={Colors.indigo}
        title={'Request Permission'}
        accessibilityLabel={'requestPermissions'}
        onPress={() => {
          if (Platform.OS === 'ios') {
            fcmService.requestPermission()
            native.permission.ios.aceessTracking()
          }
          else if (Platform.OS === 'android') {
            navigation.navigate('requestPermissions')
          }
          else {
            Toast.show('Not implementation')
          }
        }} />
      <CustomButton
        buttonColor={Colors.blue}
        title={'Tracking Links Within Apps'}
        accessibilityLabel={'trackingLinksWithinApps'}
        onPress={() => navigation.navigate('trackingLinksWithinApps')} />
      <CustomButton
        buttonColor={Colors.blue}
        title={'Create Tracking Link'}
        accessibilityLabel={'Create Tracking Link'}
        onPress={() => navigation.navigate('createTrackingLink')} />
      <CustomButton
        buttonColor={Colors.teal}
        title={'Browse'}
        accessibilityLabel={'browse'}
        onPress={() => navigation.navigate('browse')} />
      <CustomButton
        buttonColor={Colors.green}
        title={'DMA Consent Data'}
        accessibilityLabel={'dmaConsentData'}
        onPress={() => {
          NativeModules.TestUiInteractor.consentData()
        }} />
      <CustomButton
        buttonColor={Colors.lime}
        title={'BlockingList'}
        accessibilityLabel={'blockingList'}
        onPress={() => navigation.navigate('blockingList')} />
      <CustomButton
        buttonColor={Colors.grey}
        title={'Logs'}
        accessibilityLabel={'logs'}
        onPress={() => Toast.show('Not implementation')} />

      <View style={Styles.line} />

      <CustomButton
        buttonColor={Colors.blue}
        title={'Version'}
        accessibilityLabel={'appInfo'}
        onPress={() => navigation.navigate('appInfo')} />

      <View style={Styles.line} />

      <View style={{ flexDirection: 'row', alignItems: 'center' }}>
        <View style={{flex: 1}}>
          <CustomButton
            buttonColor={Colors.red}
            height={50}
            title={'Stop In-App Purchase Tracking'}
            accessibilityLabel={'stopInAppPurchaseTracking'}
            onPress={ async () => {
              Airbridge.stopInAppPurchaseTracking()
              const state = await Airbridge.isInAppPurchaseTrackingEnabled()
              setStartInAppPurchaseTracking(false)
            }} />
        </View>
        <View style={{ margin: 4}} />
        <View style={{flex: 1}}>
          <CustomButton
            buttonColor={Colors.green}
            height={50}
            title={'Start In-App Purchase Tracking'}
            accessibilityLabel={'startInAppPurchaseTracking'}
            onPress={ async () => {
              Airbridge.startInAppPurchaseTracking()
              const state = await Airbridge.isInAppPurchaseTrackingEnabled()
              setStartInAppPurchaseTracking(true) 
            }} />
        </View>
        <View style={{ margin: 4}} />
        <CustomSwitch
          accessibilityLabel={'checkInAppPurchaseTracking'}
          disabled={true}
          value={isStartInAppPurchaseTracking}
          onPress={ async () => {
            const state = await Airbridge.isInAppPurchaseTrackingEnabled()
            qaLog(`[app] checkInAppPurchaseTracking : ${state}`)
          }} />
      </View>

      <View style={{ flexDirection: 'row', alignItems: 'center' }}>
      <View style={{flex: 1}}>
          <CustomButton
            buttonColor={Colors.red}
            title={'Stop Tracking'}
            accessibilityLabel={'stopTracking'}
            onPress={ async () => {
              Airbridge.stopTracking()
              const state = await Airbridge.isTrackingEnabled()
              setTrackingEnabled(state)
            }} />
        </View>
        <View style={{ margin: 4}} />
        <View style={{flex: 1}}>
          <CustomButton
            buttonColor={Colors.green}
            title={'Start Tracking'}
            accessibilityLabel={'startTracking'}
            onPress={ async () => {
              Airbridge.startTracking()
              const state = await Airbridge.isTrackingEnabled()
              setTrackingEnabled(state)
            }} />
        </View>
        <View style={{ margin: 4}} />
        <CustomSwitch
          accessibilityLabel={'checkStartTracking'}
          disabled={true}
          value={isTrackingEnabled}
          onPress={ async () => {
            const state = await Airbridge.isTrackingEnabled()
            qaLog(`[app] checkStartTracking : ${state}`)
          }} />
      </View>
      <View style={{ flexDirection: 'row', alignItems: 'center' }}>
        <View style={{flex: 1}}>
          <CustomButton
            buttonColor={Colors.red}
            title={'DisableSdk'}
            accessibilityLabel={'disableSdk'}
            onPress={ async () => {
              Airbridge.disableSDK()
              const state = await Airbridge.isSDKEnabled()
              setEnabled(state)
            }} />
        </View>
        <View style={{ margin: 4}} />
        <View style={{flex: 1}}>
          <CustomButton
            buttonColor={Colors.green}
            title={'EnableSdk'}
            accessibilityLabel={'enableSdk'}
            onPress={ async () => {
              Airbridge.enableSDK()
              const state = await Airbridge.isSDKEnabled()
              setEnabled(state)
            } } />
        </View>
        <View style={{ margin: 4}} />
        <CustomSwitch
          accessibilityLabel={'checkEnableSdk'}
          disabled={true}
          value={isEnabled}
          onPress={ async () => {
            const state = await Airbridge.isSDKEnabled()
            qaLog(`[app] checkEnableSdk : ${state}`)
          }} />
      </View>

      <View style={Styles.line} />

      <CustomButton
        buttonColor={Colors.blue}
        title={'SKAdNetwork'}
        accessibilityLabel={'SKAdNetwork'}
        onPress={() => navigation.navigate('SKAdNetwork')} />

    </CustomView>
  )
}