import React, { useState } from 'react';
import { Alert, Button, SafeAreaView, View } from 'react-native';
import { PFMWebView } from 'equal-react-native-pfm-sdk';
import type { EventResponse } from 'equal-react-native-pfm-sdk';
export default function App() {
const [showPFM, setShowPFM] = useState(false);
const [token, setToken] = useState<string | null>(null);
const fetchTokenAndLaunch = async () => {
fetch('https://<your_backend_api_that_calls_sdk_init_api_and_returns_token>', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify('<API Body as per your API contracts>')
})
.then(response => response.json())
.then(data => {
setToken(data.session_token);
setShowPFM(true);
})
.catch(error => console.error('Error fetching token:', error));
};
const handleClosed = (data: EventResponse) => {
console.log('PFM Closed:', data);
setShowPFM(false);
};
const handleError = (data: EventResponse) => {
console.error('PFM Error:', data);
setShowPFM(false);
};
if (showPFM && token) {
return (
<PFMWebView
token={token}
env="sandbox"
onClosed={handleClosed}
onError={handleError}
/>
);
}
return (
<SafeAreaView style={{ flex: 1 }}>
<View style={{ flex: 1, justifyContent: 'center', padding: 24 }}>
<Button title="Launch PFM" onPress={fetchTokenAndLaunch} />
</View>
</SafeAreaView>
);
}