ryan/myjourney
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
ryan
2025-06-18 17:42:52 +00:00
parent 96b87ff229
commit b72f80cd34
80 changed files with 2896 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/(tabs)/_layout.tsx
+27 -5
View File
@@ -16,6 +16,7 @@ export default function TabLayout() {
screenOptions={{
tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
headerShown: false,
tabBarLabelPosition: 'below-icon',
tabBarButton: HapticTab,
tabBarBackground: TabBarBackground,
tabBarStyle: Platform.select({
@@ -29,15 +30,36 @@ export default function TabLayout() {
<Tabs.Screen
name="index"
options={{
title: 'Home',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="house.fill" color={color} />,
title: 'Journey',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="book" color={color} />,
}}
/>
<Tabs.Screen
name="explore"
name="calendar"
options={{
title: 'Explore',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="paperplane.fill" color={color} />,
title: 'Calendar',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="calendar-today" color={color} />,
}}
/>
<Tabs.Screen
name="media"
options={{
title: 'Media',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="photo" color={color} />,
}}
/>
<Tabs.Screen
name="atlas"
options={{
title: 'Atlas',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="map" color={color} />,
}}
/>
<Tabs.Screen
name="today"
options={{
title: 'Today',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="inbox" color={color} />,
}}
/>
</Tabs>
app/(tabs)/atlas.tsx
+30
View File
@@ -0,0 +1,30 @@
import { Image } from 'expo-image';
import { Platform, StyleSheet, Text, View } from 'react-native';
import { Collapsible } from '@/components/Collapsible';
import { ExternalLink } from '@/components/ExternalLink';
import ParallaxScrollView from '@/components/ParallaxScrollView';
import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView';
import { IconSymbol } from '@/components/ui/IconSymbol';
export default function TabTwoScreen() {
return (
<View>
<Text>Test</Text>
</View>
);
}
const styles = StyleSheet.create({
headerImage: {
color: '#808080',
bottom: -90,
left: -35,
position: 'absolute',
},
titleContainer: {
flexDirection: 'row',
gap: 8,
},
});
app/(tabs)/explore.tsx → app/(tabs)/calendar.tsx
View File
app/(tabs)/index.tsx
+8 -8
View File
@@ -9,15 +9,15 @@ import { ThemedView } from '@/components/ThemedView';
export default function HomeScreen() {
return (
<ParallaxScrollView
headerBackgroundColor={{ light: '#A1CEDC', dark: '#1D3D47' }}
headerBackgroundColor={{ light: '#35C4E5', dark: '#35C4E5' }}
headerImage={
<Image
source={require('@/assets/images/partial-react-logo.png')}
style={styles.reactLogo}
source={require('@/assets/images/main-screen.png')}
style={styles.headerImage}
/>
}>
<ThemedView style={styles.titleContainer}>
<ThemedText type="title">Welcome!</ThemedText>
<ThemedText type="title">Welcome bruh.</ThemedText>
<HelloWave />
</ThemedView>
<ThemedView style={styles.stepContainer}>
@@ -65,11 +65,11 @@ const styles = StyleSheet.create({
gap: 8,
marginBottom: 8,
},
reactLogo: {
height: 178,
width: 290,
headerImage: {
width: 200,
height: 200,
bottom: 0,
left: 0,
left: 20,
position: 'absolute',
},
});
app/(tabs)/media.tsx
+30
View File
@@ -0,0 +1,30 @@
import { Image } from 'expo-image';
import { Platform, StyleSheet, Text, View } from 'react-native';
import { Collapsible } from '@/components/Collapsible';
import { ExternalLink } from '@/components/ExternalLink';
import ParallaxScrollView from '@/components/ParallaxScrollView';
import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView';
import { IconSymbol } from '@/components/ui/IconSymbol';
export default function TabTwoScreen() {
return (
<View>
<Text>Test</Text>
</View>
);
}
const styles = StyleSheet.create({
headerImage: {
color: '#808080',
bottom: -90,
left: -35,
position: 'absolute',
},
titleContainer: {
flexDirection: 'row',
gap: 8,
},
});
app/(tabs)/today.tsx
+30
View File
@@ -0,0 +1,30 @@
import { Image } from 'expo-image';
import { Platform, StyleSheet, Text, View } from 'react-native';
import { Collapsible } from '@/components/Collapsible';
import { ExternalLink } from '@/components/ExternalLink';
import ParallaxScrollView from '@/components/ParallaxScrollView';
import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView';
import { IconSymbol } from '@/components/ui/IconSymbol';
export default function TabTwoScreen() {
return (
<View>
<Text>Test</Text>
</View>
);
}
const styles = StyleSheet.create({
headerImage: {
color: '#808080',
bottom: -90,
left: -35,
position: 'absolute',
},
titleContainer: {
flexDirection: 'row',
gap: 8,
},
});
app/SettingsScreen.tsx
+28
View File
@@ -0,0 +1,28 @@
import { useState } from 'react';
import { Button, Text, View } from 'react-native';
import { pickDirectory } from '@react-native-documents/picker'
export default function SettingsScreen() {
const [directoryUri, setDirectoryUri] = useState<string | null>(null);
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center', gap: 20 }}>
<Text>{directoryUri ?? "No directory set."}</Text>
<Button
title="open directory"
onPress={async () => {
try {
const { uri } = await pickDirectory({
requestLongTermAccess: false,
})
console.log(uri)
setDirectoryUri(uri)
} catch (err) {
// see error handling section
console.error(err)
}
}}
/>
</View>
)
}
app/_layout.tsx
+94 -6
View File
@@ -1,10 +1,74 @@
import { DarkTheme, DefaultTheme, ThemeProvider } from '@react-navigation/native';
import { createDrawerNavigator } from '@react-navigation/drawer';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import { useFonts } from 'expo-font';
import { Stack } from 'expo-router';
import { StatusBar } from 'expo-status-bar';
import 'react-native-reanimated';
import { useColorScheme } from '@/hooks/useColorScheme';
import SettingsScreen from './SettingsScreen';
import { IconSymbol } from '@/components/ui/IconSymbol';
import { TouchableOpacity } from 'react-native';
import { Colors } from '@/constants/Colors';
import NullComponent from '@/components/NullComponent';
const Drawer = createDrawerNavigator();
const RootStack = createNativeStackNavigator();
function TabsNavigator() {
return (
<Stack>
<Stack.Screen name="(tabs)" options={{ headerShown: false }} />
<Stack.Screen name="+not-found" />
</Stack>
);
}
function DrawerNavigator() {
return (
<Drawer.Navigator>
<Drawer.Screen
name="Tabs"
component={TabsNavigator}
options={{
headerShown: false,
drawerItemStyle: { display: 'none' }
}}
/>
<Drawer.Group
screenOptions={{
headerShown: false,
drawerActiveTintColor: Colors.light.tint,
drawerInactiveTintColor: Colors.light.text,
drawerStyle: {
backgroundColor: Colors.light.background,
},
}}
>
<Drawer.Screen
name="SettingsDrawerItem"
component={NullComponent}
options={({ navigation }) => ({
title: 'Settings',
headerShown: false,
drawerLabel: 'Settings',
drawerIcon: ({ color }) => (
<IconSymbol name="settings" size={24} color={color} />
),
})}
listeners={({ navigation }) => ({
drawerItemPress: (e) => {
e.preventDefault();
// Navigate to the Settings screen in the root stack
navigation.getParent()?.navigate('Settings');
navigation.dispatch({ type: 'CLOSE_DRAWER' });
},
})}
/></Drawer.Group>
</Drawer.Navigator>
);
}
export default function RootLayout() {
const colorScheme = useColorScheme();
@@ -13,17 +77,41 @@ export default function RootLayout() {
});
if (!loaded) {
// Async font loading only occurs in development.
return null;
}
return (
<ThemeProvider value={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
<Stack>
<Stack.Screen name="(tabs)" options={{ headerShown: false }} />
<Stack.Screen name="+not-found" />
</Stack>
<RootStack.Navigator>
<RootStack.Screen
name="Main"
component={DrawerNavigator}
options={{ headerShown: false }}
/>
<RootStack.Screen
name="Settings"
component={SettingsScreen}
options={({ navigation }) => ({
headerBackVisible: false,
gestureEnabled: false,
headerTitle: 'Settings',
headerLeft: () => (
<TouchableOpacity
onPress={() => {
navigation.goBack()
}}
style={{
marginRight: 15,
}}
>
<IconSymbol name="close" size={24} color={Colors[colorScheme ?? 'light'].icon} />
</TouchableOpacity>
),
})}
/>
</RootStack.Navigator>
<StatusBar style="auto" />
</ThemeProvider>
);
}
}