React-navigation change url but not view - reactjs

Question

I am using React Native for Web and implemented navigation in my app but I am not able to navigate next - previous with browser button,
The URL is changed in the address bar of the browser but not able to change the view.
I have used React-Navigation for both Web/Mobile, Anyone knows a better approach please guide me
//App.js
import * as React from 'react';
import { View, Text,Button,Platform } from 'react-native';
import { NavigationContainer } from '#react-navigation/native';
import { createStackNavigator } from '#react-navigation/stack';
function HomeScreen({ navigation }) {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<View style={{ marginVertical: 20 }}>
<Text style={{fontWeight:'100',fontSize:30}}>Home Screen</Text>
</View>
<Button
title="Go to Details Screen"
onPress={() => navigation.navigate('Details')}
/>
<View style={ {marginVertical:20}}>
<Button title="Go to Setting Screen" onPress={() => navigation.navigate('Setting')} />
</View>
</View>
);
}
const Stack = createStackNavigator();
function App() {
const linking = {
prefixes: ['myurlhere://'],
config: {
screens: {
Setting: 'Setting',
Details: 'Details',
},
},
};
return (
<NavigationContainer linking={linking} >
<Stack.Navigator>
<Stack.Screen name="Home" component={HomeScreen} options={{ headerShown: !isWeb, headerLeft:()=> null }} />
<Stack.Screen name="Setting" component={Setting} options={{headerShown:!isWeb}}/>
<Stack.Screen name="Details" component={Details} options={{headerShown:!isWeb}}/>
</Stack.Navigator>
</NavigationContainer>
);
}
[![//Setting Screen
function Setting() {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<Text style={{fontWeight:'100',fontSize:30}}>Setting Screen</Text>
</View>
);
}
//Details Screen
function Details() {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<Text style={{fontWeight:'100',fontSize:30}}>Detail's Screen</Text>
</View>
);
}]
export default App;

Answer 1

I am also looking into it.
But here is where I am at and its working.
const linking = {
prefixes: ['http://localhost:19006/', 'mychat://'],
config: {
screens: {
Home: '',
Search: '?:id/Search',
}
},
};
return (
<AppContext.Provider value={userSettings}>
<NavigationContainer linking={linking}>
<StackContainer />
</NavigationContainer>
</AppContext.Provider>
);