Structure globale de l'application client

Signed-off-by: Emmy D'Anello <emmy@luemy.eu>
This commit is contained in:
2024-12-01 18:58:53 +01:00
parent aa1da394b9
commit 49fcb6edbc
13 changed files with 1373 additions and 30 deletions

View File

@ -0,0 +1,50 @@
import { Tabs } from 'expo-router'
import React from 'react'
import { Colors } from '@/constants/Colors'
import { useColorScheme } from '@/hooks/useColorScheme'
import { FontAwesome6, MaterialIcons } from '@expo/vector-icons'
export default function TabLayout() {
const colorScheme = useColorScheme();
return (
<Tabs
screenOptions={{
tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
}}>
<Tabs.Screen
name="index"
options={{
title: 'Carte',
headerShown: false,
tabBarIcon: ({ color }) => <FontAwesome6 name="map-location-dot" size={24} color={color} />,
}}
/>
<Tabs.Screen
name="challenges"
options={{
title: 'Challenges',
headerTitleStyle: {fontSize: 32},
tabBarIcon: ({ color }) => <FontAwesome6 name="coins" size={24} color={color} />,
}}
/>
<Tabs.Screen
name="train"
options={{
title: 'Ajouter un trajet',
headerTitleStyle: {fontSize: 32},
tabBarIcon: ({ color }) => <FontAwesome6 name="train" size={24} color={color} />,
}}
/>
<Tabs.Screen
name="history"
options={{
title: 'Historique',
headerTitleStyle: {fontSize: 32},
tabBarIcon: ({ color }) => <MaterialIcons name="history" size={24} color={color} />,
}}
/>
</Tabs>
);
}

View File

@ -0,0 +1,14 @@
import { ScrollView } from 'react-native';
import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView';
export default function ChallengesScreen() {
return (
<ScrollView>
<ThemedView>
<ThemedText>Ici on aura la gestion des challenges</ThemedText>
</ThemedView>
</ScrollView>
);
}

View File

@ -0,0 +1,14 @@
import { ScrollView } from 'react-native';
import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView';
export default function HistoryScreen() {
return (
<ScrollView>
<ThemedView>
<ThemedText>Ici on aura la gestion de l'historique des trains empruntés et des challenges effectués</ThemedText>
</ThemedView>
</ScrollView>
);
}

View File

@ -0,0 +1,46 @@
import { Platform, StyleSheet } from 'react-native'
import { ThemedView } from '@/components/ThemedView'
export default function MapScreen() {
if (Platform.OS === "web") {
const maplibre = require('react-map-gl/maplibre')
const Map = maplibre.Map
return <ThemedView style={styles.page}>
<Map
initialViewState={{
longitude: 0,
latitude: 0,
zoom: 1
}}
mapStyle="https://demotiles.maplibre.org/style.json"
/>
</ThemedView>
}
else {
const MapLibreGL = require('@maplibre/maplibre-react-native')
MapLibreGL.setAccessToken(null)
return (
<ThemedView style={styles.page}>
<MapLibreGL.MapView
style={styles.map}
logoEnabled={false}
styleURL="https://demotiles.maplibre.org/style.json"
children={[]}
/>
</ThemedView>
)
}
}
const styles = StyleSheet.create({
page: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
map: {
flex: 1,
alignSelf: 'stretch',
},
});

View File

@ -0,0 +1,14 @@
import { ScrollView } from 'react-native';
import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView';
export default function TrainScreen() {
return (
<ScrollView>
<ThemedView>
<ThemedText>Ici on aura la page pour ajouter un trajet en train depuis Rail Planner</ThemedText>
</ThemedView>
</ScrollView>
);
}