83 lines
2.9 KiB
TypeScript
83 lines
2.9 KiB
TypeScript
|
import { useFocusEffect } from 'expo-router'
|
||
|
|
import React, { useState } from 'react'
|
||
|
|
import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'
|
||
|
|
import { Post } from '../models/postModel'
|
||
|
|
|
||
|
|
export default function PostsScreen() {
|
||
|
|
|
||
|
|
const [posts, setPosts] = useState<Post[]>()
|
||
|
|
|
||
|
|
useFocusEffect(
|
||
|
|
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')
|
||
|
|
.then((res) => res.json())
|
||
|
|
.then((json) => {
|
||
|
|
console.log(json)
|
||
|
|
setPosts(json.data)
|
||
|
|
});
|
||
|
|
return () => {
|
||
|
|
// Do something when the screen is unfocused
|
||
|
|
// Useful for cleanup functions
|
||
|
|
}
|
||
|
|
}, [])
|
||
|
|
)
|
||
|
|
|
||
|
|
function approvePost(postID: string) {
|
||
|
|
// add code to update post to approved status
|
||
|
|
console.log('Approving post ' + postID)
|
||
|
|
}
|
||
|
|
|
||
|
|
function denyPost(postID: string) {
|
||
|
|
// add code to update post to remove status
|
||
|
|
console.log('Denying post ' + postID)
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<View style={styles.container}>
|
||
|
|
<Text style={styles.text}>Posts</Text>
|
||
|
|
<View style={{ width: '90%', marginTop: 20 }}></View>
|
||
|
|
{
|
||
|
|
posts && posts.map(el => (
|
||
|
|
<View key={el._id} style={styles.posts}>
|
||
|
|
<Text style={{ color: '#fff' }}>{el._id}</Text>
|
||
|
|
<Text style={{ color: '#fff' }}>{el.notes}</Text>
|
||
|
|
<View style={{ flexDirection: 'row', justifyContent: 'space-between', marginTop: 10 }}>
|
||
|
|
<TouchableOpacity style={{ flex: 1, marginRight: 5 }} onPress={() => denyPost(el._id)}>
|
||
|
|
<Text style={{ backgroundColor: '#bf3636ff', color: '#fff', textAlign: 'center', padding: 8, borderRadius: 4 }}>
|
||
|
|
Deny
|
||
|
|
</Text>
|
||
|
|
</TouchableOpacity>
|
||
|
|
<TouchableOpacity style={{ flex: 1, marginLeft: 5 }} onPress={() => approvePost(el._id)}>
|
||
|
|
<Text style={{ backgroundColor: '#17be3bff', color: '#fff', textAlign: 'center', padding: 8, borderRadius: 4 }}>
|
||
|
|
Approve
|
||
|
|
</Text>
|
||
|
|
</TouchableOpacity>
|
||
|
|
</View>
|
||
|
|
</View>
|
||
|
|
))
|
||
|
|
}
|
||
|
|
</View>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
const styles = StyleSheet.create({
|
||
|
|
container: {
|
||
|
|
flex: 1,
|
||
|
|
backgroundColor: '#25292e',
|
||
|
|
justifyContent: 'center',
|
||
|
|
alignItems: 'center',
|
||
|
|
overflow: 'scroll'
|
||
|
|
},
|
||
|
|
text: {
|
||
|
|
color: '#fff'
|
||
|
|
},
|
||
|
|
posts: {
|
||
|
|
marginBottom: 10,
|
||
|
|
backgroundColor: '#363c43ff',
|
||
|
|
padding: 10
|
||
|
|
}
|
||
|
|
})
|