wbaumbach/tattletires
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

resetting state after submit (todo: add confirmation message), update posts screen after aprove or deny

Browse Source
This commit is contained in:
Will Baumbach
2025-08-05 10:22:48 -05:00
parent e49674a755
commit 813cb44637
7 changed files with 107 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
app/(tabs)/_layout.tsx
View File

@@ -1,6 +1,6 @@
import Ionicons from '@expo/vector-icons/Ionicons';
import { Tabs } from 'expo-router';
import React from 'react';
import Ionicons from '@expo/vector-icons/Ionicons'
import { Tabs } from 'expo-router'
import React from 'react'
export default function TabLayout() {
return (
@@ -8,29 +8,49 @@ export default function TabLayout() {
screenOptions={{
tabBarActiveTintColor: '#ffd33d',
headerStyle: {
backgroundColor: '#25292e',
backgroundColor: '#25292e'
},
headerShadowVisible: false,
headerTintColor: '#fff',
tabBarStyle: {
backgroundColor: '#25292e',
},
}}>
<Tabs.Screen name="index" options={{
title: 'Home', headerShown: false, tabBarIcon: ({ color, focused }) => (
<Ionicons name={focused ? 'home-sharp' : 'home-outline'} color={color} size={24} />
)
}} />
<Tabs.Screen name="posts" options={{
title: 'Posts', headerShown: false, tabBarIcon: ({ color, focused }) => (
<Ionicons name={focused ? 'rocket-sharp' : 'rocket-outline'} size={24} color={color} />
)
}} />
<Tabs.Screen name="login" options={{
title: 'Login', headerShown: false, tabBarIcon: ({ color, focused }) => (
<Ionicons name={focused ? 'person-circle-sharp' : 'person-circle-outline'} size={24} color={color} />
)
}} />
backgroundColor: '#25292e'
}
}}
>
<Tabs.Screen
name='index'
options={{
title: 'Home',
headerShown: false,
tabBarIcon: ({ color, focused }) => (
<Ionicons name={focused ? 'home-sharp' : 'home-outline'} color={color} size={24} />
)
}}
/>
<Tabs.Screen
name='posts'
options={{
title: 'Posts',
headerShown: false,
tabBarIcon: ({ color, focused }) => (
<Ionicons name={focused ? 'rocket-sharp' : 'rocket-outline'} size={24} color={color} />
)
}}
/>
<Tabs.Screen
name='login'
options={{
title: 'Login',
headerShown: false,
tabBarIcon: ({ color, focused }) => (
<Ionicons
name={focused ? 'person-circle-sharp' : 'person-circle-outline'}
size={24}
color={color}
/>
)
}}
/>
</Tabs>
);
)
}

13
app/(tabs)/index.tsx
View File

@@ -9,6 +9,12 @@ export default function App() {
const [notes, setNotes] = useState('')
const cameraRef = useRef<CameraView>(null)
async function resetState() {
setPhoto('')
setAddress('')
setNotes('')
}
async function _takePhoto() {
if (cameraRef.current) {
let pic = await cameraRef.current.takePictureAsync({
@@ -34,6 +40,11 @@ export default function App() {
address,
notes
})
}).then((res) => {
console.log(res.status)
if (res.status === 200) {
resetState()
}
})
}
@@ -78,7 +89,7 @@ export default function App() {
/>
</View>
<View style={styles.buttonContainer}>
<TouchableOpacity style={styles.button} onPress={() => setPhoto('')}>
<TouchableOpacity style={styles.button} onPress={() => resetState()}>
<Text style={styles.text}>Retake</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.button} onPress={sendData}>

35
app/(tabs)/posts.tsx
View File

@@ -11,11 +11,7 @@ export default function PostsScreen() {
React.useCallback(() => {
// Do something when the screen is focused
// TODO: add endpoint to get only non approved or denied status posts
fetch('http://localhost:3000/api/v1/posts/status/created')
.then((res) => res.json())
.then((json) => {
setPosts(json.data)
})
fetchData()
return () => {
// Do something when the screen is unfocused
// Useful for cleanup functions
@@ -23,6 +19,14 @@ export default function PostsScreen() {
}, [])
)
async function fetchData() {
fetch('http://localhost:3000/api/v1/posts/status/created')
.then((res) => res.json())
.then((json) => {
setPosts(json.data)
})
}
async function approvePost(postID: string) {
// add code to update post to approved status
console.log('Approving post ' + postID)
@@ -35,6 +39,8 @@ export default function PostsScreen() {
body: JSON.stringify({
status: 'approved'
})
}).then(() => {
fetchData()
})
}
@@ -50,6 +56,8 @@ export default function PostsScreen() {
body: JSON.stringify({
status: 'denied'
})
}).then(() => {
fetchData()
})
}
@@ -57,7 +65,7 @@ export default function PostsScreen() {
<View style={styles.wrapper}>
<View style={styles.container}>
<Text style={styles.text}>Posts</Text>
{posts &&
{posts?.length ? (
posts.map((el) => (
<View key={el._id} style={styles.posts}>
<Text style={styles.text}>{el._id}</Text>
@@ -101,7 +109,12 @@ export default function PostsScreen() {
</TouchableOpacity>
</View>
</View>
))}
))
) : (
<View style={styles.caughtUpContainer}>
<Text style={styles.caughtUpText}>All caught up!</Text>
</View>
)}
</View>
</View>
)
@@ -128,5 +141,13 @@ const styles = StyleSheet.create({
padding: 10,
width: '90%',
borderRadius: 5
},
caughtUpContainer: {
flex: 1,
alignContent: 'center',
justifyContent: 'center'
},
caughtUpText: {
color: '#787b80ff'
}
})

8
app/_layout.tsx
View File

@@ -1,9 +1,9 @@
import { Stack } from "expo-router";
import { Stack } from 'expo-router'
export default function RootLayout() {
return (
return (
<Stack>
<Stack.Screen name="(tabs)" options={{ headerShown: false }}></Stack.Screen>
<Stack.Screen name='(tabs)' options={{ headerShown: false }}></Stack.Screen>
</Stack>
);
)
}