@meshconnect/react-native-link-sdk
Version:
Mesh Connect React Native SDK.
149 lines (148 loc) • 6.39 kB
JavaScript
import { useEffect, useState } from 'react';
import { Alert, Appearance } from 'react-native';
import { decode64, isValidUrl, urlSearchParams, decodeLinkStyle } from '../utils';
import { isLinkEventTypeKey, mappedLinkEvents, } from '../';
const useSDKCallbacks = (props) => {
var _a;
const [linkUrl, setLinkUrl] = useState(null);
const [showWebView, setShowWebView] = useState(false);
const [showNativeNavbar, setShowNativeNavbar] = useState(false);
const [linkColorScheme, setLinkColorScheme] = useState(undefined);
const [darkTheme, setDarkTheme] = useState(undefined);
useEffect(() => {
var _a, _b;
try {
if (props.linkToken) {
let decodedUrl = decode64(props.linkToken);
if (!isValidUrl(decodedUrl)) {
throw new Error('Invalid link token provided');
}
const queryParams = urlSearchParams(decodedUrl);
const styleParam = queryParams['link_style'];
const style = decodeLinkStyle(styleParam);
if ((style === null || style === void 0 ? void 0 : style.th) === 'system') {
const colorScheme = Appearance.getColorScheme();
setLinkColorScheme(style === null || style === void 0 ? void 0 : style.th);
setDarkTheme(colorScheme === 'dark');
}
else {
setDarkTheme((style === null || style === void 0 ? void 0 : style.th) === 'dark');
}
decodedUrl = `${decodedUrl}${decodedUrl.includes('?') ? '&' : '?'}lng=${((_a = props.settings) === null || _a === void 0 ? void 0 : _a.language) || 'en'}`;
setLinkUrl(decodedUrl);
setShowWebView(true);
}
// eslint-disable-next-line
}
catch (err) {
(_b = props.onExit) === null || _b === void 0 ? void 0 : _b.call(props, (err === null || err === void 0 ? void 0 : err.message) || 'An error occurred during connection establishment');
}
return () => {
setLinkUrl(null);
setShowWebView(false);
};
}, [props.linkToken, props.onExit, (_a = props.settings) === null || _a === void 0 ? void 0 : _a.language]);
useEffect(() => {
const colorSchemeWatcher = Appearance.addChangeListener(({ colorScheme }) => {
if (linkColorScheme === 'system') {
setDarkTheme(colorScheme === 'dark');
}
});
return () => {
colorSchemeWatcher.remove();
};
}, [linkColorScheme]);
// istanbul ignore next
const showCloseAlert = () => Alert.alert('Are you sure you want to exit?', 'Your progress will be lost.', [
{
text: 'Cancel',
style: 'cancel',
},
{
text: 'Exit',
onPress: () => {
var _a;
(_a = props.onExit) === null || _a === void 0 ? void 0 : _a.call(props);
},
},
]);
// istanbul ignore next
const handleMessage = (event) => {
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
const nativeEventData = JSON.parse(event.nativeEvent.data);
const { type, payload } = nativeEventData;
const eventType = mappedLinkEvents[type] || type;
switch (type) {
case 'close':
case 'done':
case 'exit': {
(_a = props.onExit) === null || _a === void 0 ? void 0 : _a.call(props, payload);
break;
}
case 'showClose': {
showCloseAlert();
break;
}
case 'showNativeNavbar': {
setShowNativeNavbar(payload);
break;
}
case 'brokerageAccountAccessToken': {
const payloadData = {
accessToken: payload,
};
(_b = props === null || props === void 0 ? void 0 : props.onEvent) === null || _b === void 0 ? void 0 : _b.call(props, {
type: eventType,
payload: payloadData,
});
(_c = props === null || props === void 0 ? void 0 : props.onIntegrationConnected) === null || _c === void 0 ? void 0 : _c.call(props, payloadData);
break;
}
case 'delayedAuthentication': {
const payloadData = {
delayedAuth: payload,
};
(_d = props === null || props === void 0 ? void 0 : props.onEvent) === null || _d === void 0 ? void 0 : _d.call(props, {
type: eventType,
payload: payloadData,
});
(_e = props === null || props === void 0 ? void 0 : props.onIntegrationConnected) === null || _e === void 0 ? void 0 : _e.call(props, payloadData);
break;
}
case 'transferFinished': {
const payloadData = payload;
(_f = props === null || props === void 0 ? void 0 : props.onEvent) === null || _f === void 0 ? void 0 : _f.call(props, {
type: eventType,
payload: payloadData,
});
(_g = props === null || props === void 0 ? void 0 : props.onTransferFinished) === null || _g === void 0 ? void 0 : _g.call(props, payloadData);
break;
}
case 'loaded': {
(_h = props === null || props === void 0 ? void 0 : props.onEvent) === null || _h === void 0 ? void 0 : _h.call(props, { type: eventType });
break;
}
default: {
if (isLinkEventTypeKey(type)) {
(_j = props === null || props === void 0 ? void 0 : props.onEvent) === null || _j === void 0 ? void 0 : _j.call(props, nativeEventData);
}
break;
}
}
};
const handleNavState = (event) => {
if (event.url.endsWith('/broker-connect/catalog')) {
setShowNativeNavbar(false);
}
};
return {
linkUrl,
showWebView,
showNativeNavbar,
darkTheme,
handleMessage,
handleNavState,
showCloseAlert,
};
};
export { useSDKCallbacks };