The Functions and data passed from the bridge is inaccessible after a release has been made via OTA using CodePush
"@webview-bridge/react-native": "^1.3.3",
"react-native-code-push": "^8.2.1",
"react": "18.2.0",
"react-native": "0.71.12",
import {bridge} from '@webview-bridge/react-native';
import {RootStackParamList} from '../../types/RootStackPrams';
import {
StackActions,
createNavigationContainerRef,
} from '@react-navigation/native';
import {goBack, navigate} from '@utils/NavigationService';
import {store} from '@config/configureStore';
import {hbookAPI} from '@utils/ApiUtils';
export const navigationRef = createNavigationContainerRef<RootStackParamList>();
export const appBridge = bridge({
async canGoBack() {
return await Boolean(
navigationRef.current?.isReady() && navigationRef.current.canGoBack(),
);
},
async goBack() {
await goBack();
},
async navigate<RouteName extends keyof RootStackParamList>(
name: RouteName,
params: RootStackParamList[RouteName],
) {
if (name === 'ChatSettingScreen') {
params = {...params, screenName: 'ChatScreen'};
}
await navigate(name as any, params as any);
},
async push<RouteName extends keyof RootStackParamList>(
name: RouteName,
params: RootStackParamList[RouteName],
) {
if (navigationRef.current?.isReady()) {
await navigationRef.current.dispatch(StackActions.push(name, params));
}
},
async replace<RouteName extends keyof RootStackParamList>(
name: RouteName,
params: RootStackParamList[RouteName],
) {
if (navigationRef.current?.isReady()) {
await navigationRef.current.dispatch(StackActions.replace(name, params));
}
},
async popToTop() {
if (navigationRef.current?.isReady()) {
await navigationRef.current.dispatch(StackActions.popToTop());
}
},
async getNativeState() {
return await store.getState();
},
async changeBranch(token, id) {
try {
const response = await hbookAPI().post(
'api/get-token',
{
data: {
token,
id,
},
},
);
return response.data;
} catch (error) {
console.error(error);
}
},
});
export type AppBridge = typeof appBridge;
"@webview-bridge/react": "^1.4.0",
"@webview-bridge/web": "^1.4.0",
"next": "14.1.1",
"react": "^18",
"use client";
import { createLinkBridgeProvider } from "@webview-bridge/react";
export const {
BridgeProvider,
useBridgeStore,
useBridgeStatus,
useBridgeLoose,
} = createLinkBridgeProvider({
throwOnError: true,
onReady: () => {
console.log("Bridge is ready");
},
});
import { useCallback, useEffect, useState } from "react";
import { useBridgeStatus, useBridgeStore } from "@/providers/BridgeProvider";
interface NativeState {
loginMobileReducer: {
token: string;
book_token: string;
doctor_role_id: string;
doctor_details: {
doctor_id: string;
doctor_name: string;
doctor_profile_image: string;
branch_doctor_id: string;
branch_name: string;
patient_role_id: string;
};
};
}
const useNativeBridge = () => {
const [nativeState, setNativeState] = useState<NativeState>();
const { getNativeState, goBack, canGoBack, navigate, changeBranch } =
useBridgeStore((state) => ({
getNativeState: state.getNativeState,
goBack: state.goBack,
canGoBack: state.canGoBack,
navigate: state.navigate,
changeBranch: state.changeBranch,
}));
const { isNativeMethodAvailable, isWebViewBridgeAvailable } =
useBridgeStatus();
const isNativeMethodSafe = useCallback(
(method: string | number) =>
isWebViewBridgeAvailable && isNativeMethodAvailable(method),
[isWebViewBridgeAvailable, isNativeMethodAvailable]
);
const fetchNativeState = useCallback(async () => {
if (!isNativeMethodSafe("getNativeState")) return;
const state = await getNativeState();
setNativeState(state);
}, [getNativeState, isNativeMethodSafe]);
const fetchNativeGoBack = useCallback(async () => {
if (!isNativeMethodSafe("goBack")) return;
return await goBack();
}, [goBack, isNativeMethodSafe]);
const fetchNativeCanGoBack = useCallback(async () => {
if (!isNativeMethodSafe("canGoBack")) return;
return await canGoBack();
}, [canGoBack, isNativeMethodSafe]);
const fetchNativeNavigate = useCallback(
async (screenName: string) => {
if (!isNativeMethodSafe("navigate")) return;
return await navigate(screenName);
},
[navigate, isNativeMethodSafe]
);
const switchBranchSPOT = useCallback(
async (token: string, id: string) => {
if (!isNativeMethodSafe("changeBranch")) return;
return await changeBranch(token, id);
},
[changeBranch, isNativeMethodSafe]
);
useEffect(() => {
fetchNativeState();
}, [fetchNativeState]);
return {
nativeState,
isNativeMethodSafe,
isWebViewBridgeAvailable,
fetchNativeGoBack,
fetchNativeCanGoBack,
fetchNativeNavigate,
switchBranchSPOT,
};
};
export default useNativeBridge;