From 34050e05bef6e0d543586ee18a4ece2638bdcc08 Mon Sep 17 00:00:00 2001 From: Paul Frazee Date: Thu, 9 Mar 2023 13:45:20 -0600 Subject: [PATCH] WIP Switch to react-navigation --- package.json | 4 + src/view/screens.tsx | 290 ++++++++++++++++++++++++++++++++ src/view/shell/mobile/index.tsx | 68 +------- src/view/shell/web/index.tsx | 4 + yarn.lock | 91 +++++++++- 5 files changed, 389 insertions(+), 68 deletions(-) create mode 100644 src/view/screens.tsx diff --git a/package.json b/package.json index 121ce8f45d..b8e4fe2e37 100644 --- a/package.json +++ b/package.json @@ -33,6 +33,10 @@ "@react-native-camera-roll/camera-roll": "^5.2.2", "@react-native-clipboard/clipboard": "^1.10.0", "@react-native-community/blur": "^4.3.0", + "@react-navigation/bottom-tabs": "^6.5.7", + "@react-navigation/drawer": "^6.6.2", + "@react-navigation/native": "^6.1.6", + "@react-navigation/native-stack": "^6.9.12", "@segment/analytics-react-native": "^2.10.1", "@segment/sovran-react-native": "^0.4.5", "@zxing/text-encoding": "^0.9.0", diff --git a/src/view/screens.tsx b/src/view/screens.tsx new file mode 100644 index 0000000000..b572682b6a --- /dev/null +++ b/src/view/screens.tsx @@ -0,0 +1,290 @@ +import * as React from 'react' +import {View, Text, Button} from 'react-native' +import {NavigationContainer} from '@react-navigation/native' +import {createNativeStackNavigator} from '@react-navigation/native-stack' +import {createDrawerNavigator} from '@react-navigation/drawer' +import {createBottomTabNavigator} from '@react-navigation/bottom-tabs' + +import { + getStateFromPath, + NavigationState, + PartialState, +} from '@react-navigation/native' + +type StackNavigatorParamlist = { + FeedList: undefined + Details: { + id: number + name: string + handle: string + date: string + content: string + image: string + avatar: string + comments: number + retweets: number + hearts: number + } +} +type State = NavigationState | Omit, 'stale'> + +const PATHS = { + Home: '/', + Notifications: '/notifications', + Search: '/search', + Details: '/details', + Profile: '/profile', +} + +const LINKING = { + prefixes: ['bsky://', 'https://bsky.app'], + getPathFromState(state: State, options?: any) { + // TODO add parameterization + let node = state.routes[state.index] + while (node.state?.routes && typeof node.state?.index === 'number') { + node = node.state?.routes[node.state?.index] + } + return PATHS[node.name] || '/' + }, + getStateFromPath(path: string, options?: any) { + // TODO add parameterization + let match = 'Home' // TODO should be not found + for (const [name, matcher] of Object.entries(PATHS)) { + if (path === matcher) { + match = name + break + } + } + let container = 'HomeStack' + if (match === 'Notifications') { + container = 'NotificationsStack' + } else if (match === 'Search') { + container = 'SearchStack' + } + return { + routes: [ + { + name: container, + state: { + routes: [{name: match}], + }, + }, + ], + } + }, +} + +const Drawer = createDrawerNavigator() +const HomeStack = createNativeStackNavigator() +const NotificationsStack = createNativeStackNavigator() +const SearchStack = createNativeStackNavigator() +const Tab = createBottomTabNavigator() + +function HomeScreen({navigation}) { + return ( + + Home Screen +