kylefang/react-navigation
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-navigation.git synced 2026-03-26 01:04:20 +08:00
Code Issues Packages Projects Releases Wiki Activity

chore: remove compat package

Browse Source
This commit is contained in:
Satyajit Sahoo
2020-11-17 20:34:45 +01:00
parent c85f2ff47a
commit 852f2f0f19
25 changed files with 0 additions and 2011 deletions
Download Patch File Download Diff File Expand all files Collapse all files

164
example/src/Screens/CompatAPI.tsx
View File

@@ -1,164 +0,0 @@
import * as React from 'react';
import { View, ScrollView, StyleSheet, Platform } from 'react-native';
import { Button } from 'react-native-paper';
import {
createCompatNavigatorFactory,
CompatScreenType,
} from '@react-navigation/compat';
import {
createStackNavigator,
StackNavigationProp,
StackScreenProps,
} from '@react-navigation/stack';
import Article from '../Shared/Article';
import Albums from '../Shared/Albums';
import NewsFeed from '../Shared/NewsFeed';
type CompatStackParams = {
Albums: undefined;
Nested: { author: string };
};
type NestedStackParams = {
Feed: undefined;
Article: { author: string };
};
const scrollEnabled = Platform.select({ web: true, default: false });
const AlbumsScreen: CompatScreenType<StackNavigationProp<
CompatStackParams
>> = ({ navigation }) => {
return (
<ScrollView>
<View style={styles.buttons}>
<Button
mode="contained"
onPress={() => navigation.push('Nested', { author: 'Babel fish' })}
style={styles.button}
>
Push nested
</Button>
<Button
mode="outlined"
onPress={() => navigation.goBack()}
style={styles.button}
>
Go back
</Button>
</View>
<Albums scrollEnabled={scrollEnabled} />
</ScrollView>
);
};
const FeedScreen: CompatScreenType<StackNavigationProp<NestedStackParams>> = ({
navigation,
}) => {
return (
<ScrollView>
<View style={styles.buttons}>
<Button
mode="contained"
onPress={() => navigation.push('Article')}
style={styles.button}
>
Push article
</Button>
<Button
mode="outlined"
onPress={() => navigation.goBack()}
style={styles.button}
>
Go back
</Button>
</View>
<NewsFeed scrollEnabled={scrollEnabled} />
</ScrollView>
);
};
const ArticleScreen: CompatScreenType<StackNavigationProp<
NestedStackParams,
'Article'
>> = ({ navigation }) => {
return (
<ScrollView>
<View style={styles.buttons}>
<Button
mode="contained"
onPress={() => navigation.push('Albums')}
style={styles.button}
>
Push albums
</Button>
<Button
mode="outlined"
onPress={() => navigation.goBack()}
style={styles.button}
>
Go back
</Button>
</View>
<Article
author={{ name: navigation.getParam('author') }}
scrollEnabled={scrollEnabled}
/>
</ScrollView>
);
};
ArticleScreen.navigationOptions = ({ navigation }) => ({
title: `Article by ${navigation.getParam('author')}`,
});
const createCompatStackNavigator = createCompatNavigatorFactory(
createStackNavigator
);
const CompatStack = createCompatStackNavigator<
StackNavigationProp<CompatStackParams>
>(
{
Albums: AlbumsScreen,
Nested: {
screen: createCompatStackNavigator<
StackNavigationProp<NestedStackParams>
>(
{
Feed: { getScreen: () => FeedScreen },
Article: { getScreen: () => ArticleScreen },
},
{ navigationOptions: { headerShown: false } }
),
params: {
author: 'Gandalf',
},
},
},
{
mode: 'modal',
}
);
export default function CompatStackScreen({
navigation,
}: StackScreenProps<{}>) {
React.useLayoutEffect(() => {
navigation.setOptions({
headerShown: false,
});
}, [navigation]);
return <CompatStack />;
}
const styles = StyleSheet.create({
buttons: {
flexDirection: 'row',
padding: 8,
},
button: {
margin: 8,
},
});

5
example/src/index.tsx
View File

@@ -51,7 +51,6 @@ import DynamicTabs from './Screens/DynamicTabs';
import MasterDetail from './Screens/MasterDetail';
import AuthFlow from './Screens/AuthFlow';
import PreventRemove from './Screens/PreventRemove';
import CompatAPI from './Screens/CompatAPI';
import LinkComponent from './Screens/LinkComponent';
if (Platform.OS !== 'web') {
@@ -103,10 +102,6 @@ const SCREENS = {
title: 'Prevent removing screen',
component: PreventRemove,
},
CompatAPI: {
title: 'Compat Layer',
component: CompatAPI,
},
LinkComponent: {
title: '<Link />',
component: LinkComponent,