156 lines
4.8 KiB
JavaScript
156 lines
4.8 KiB
JavaScript
import React, { useState, useEffect } from 'react';
|
|
import { View, Text, TextInput, Button, ScrollView } from 'react-native';
|
|
import AsyncStorage from '@react-native-async-storage/async-storage';
|
|
import axios from 'axios';
|
|
import { useTailwind } from 'tailwind-rn';
|
|
|
|
function SwitDetailScreen({ route, navigation, userId }) {
|
|
const [swit, setSwit] = useState(null);
|
|
const [newComment, setNewComment] = useState('');
|
|
const { switId } = route.params;
|
|
const [username, setUsername] = useState('');
|
|
const [errorMessage, setErrorMessage] = useState(null); // Add this state for error message
|
|
const [uId, setUId] = useState(''); // Add this state for error message
|
|
|
|
const tailwind = useTailwind();
|
|
|
|
async function fetchUserData() {
|
|
try {
|
|
const apiUrl = await AsyncStorage.getItem('apiEndpoint')
|
|
const userId = await AsyncStorage.getItem('userID');
|
|
setUId(userId);
|
|
const token = await AsyncStorage.getItem('token');
|
|
const response = await fetch(`${apiUrl}/api/v1/app/user/data/${userId}`, {
|
|
headers: { 'Authorization': token },
|
|
});
|
|
|
|
if (!response.ok) {
|
|
throw new Error(`Failed to fetch user data: ${response.status} ${await response.text()}`);
|
|
}
|
|
|
|
const user = await response.json();
|
|
setUsername(user.username);
|
|
} catch (error) {
|
|
console.error('Error:', error);
|
|
setErrorMessage(error.message);
|
|
}
|
|
}
|
|
|
|
const fetchSwit = async () => {
|
|
const token = await AsyncStorage.getItem('token');
|
|
const apiUrl = await AsyncStorage.getItem('apiEndpoint')
|
|
|
|
const response = await axios.get(`${apiUrl}/api/v1/app/swit/swits/${switId}`, {
|
|
headers: { 'Authorization': token },
|
|
});
|
|
console.warn(response.data)
|
|
setSwit(response.data);
|
|
console.warn(swit.comments)
|
|
};
|
|
|
|
const postComment = async () => {
|
|
const token = await AsyncStorage.getItem('token');
|
|
const apiUrl = await AsyncStorage.getItem('apiEndpoint')
|
|
|
|
await axios.post(`${apiUrl}/api/v1/app/swit/swits/${switId}/comments`, {
|
|
text: newComment,
|
|
username: username
|
|
}, {
|
|
headers: { 'Authorization': token },
|
|
});
|
|
setNewComment('');
|
|
fetchSwit();
|
|
};
|
|
|
|
const likeComment = async (commentId) => {
|
|
const token = await AsyncStorage.getItem('token');
|
|
const apiUrl = await AsyncStorage.getItem('apiEndpoint')
|
|
|
|
await axios.post(`${apiUrl}/api/v1/app/swit/swits/${switId}/comments/${commentId}/like`, {}, {
|
|
headers: { 'Authorization': token },
|
|
});
|
|
fetchSwit();
|
|
};
|
|
|
|
const unlikeComment = async (commentId) => {
|
|
const token = await AsyncStorage.getItem('token');
|
|
const apiUrl = await AsyncStorage.getItem('apiEndpoint')
|
|
await axios.post(`${apiUrl}/api/v1/app/swit/swits/${switId}/comments/${commentId}/unlike`, {}, {
|
|
headers: { 'Authorization': token },
|
|
});
|
|
fetchSwit();
|
|
};
|
|
|
|
const deleteComment = async (commentId) => {
|
|
const token = await AsyncStorage.getItem('token');
|
|
const apiUrl = await AsyncStorage.getItem('apiEndpoint')
|
|
|
|
await axios.delete(`${apiUrl}/api/v1/app/swit/swits/${switId}/comments/${commentId}`, {
|
|
headers: { 'Authorization': token },
|
|
});
|
|
fetchSwit();
|
|
};
|
|
|
|
|
|
|
|
async function deleteSwit() {
|
|
try {
|
|
const token = await AsyncStorage.getItem('token');
|
|
const apiUrl = await AsyncStorage.getItem('apiEndpoint')
|
|
|
|
const response = await fetch(`${apiUrl}/api/v1/app/swit/swits/${switId}`, {
|
|
method: 'DELETE',
|
|
headers: { 'Authorization': token },
|
|
});
|
|
|
|
if (!response.ok) {
|
|
throw new Error(`Failed to delete swit: ${response.status} ${await response.text()}`);
|
|
}
|
|
|
|
// Redirect to the home screen after deleting
|
|
navigation.goBack();
|
|
} catch (error) {
|
|
console.error('Error:', error);
|
|
setErrorMessage(error.message);
|
|
}
|
|
}
|
|
|
|
|
|
useEffect(() => {
|
|
fetchSwit();
|
|
fetchUserData();
|
|
}, []);
|
|
|
|
if (!swit) {
|
|
return <Text>Loading...</Text>;
|
|
}
|
|
|
|
return (
|
|
<View>
|
|
{errorMessage ? <Text style={tailwind('text-red-500 mb-2 text-center')}>{errorMessage}</Text> : null}
|
|
<Text>{swit.text}</Text>
|
|
<ScrollView>
|
|
{swit.comments.map((comment, index) => (
|
|
<>
|
|
<Text key={index}>{comment.username}: {comment.text}</Text>
|
|
<Button title="Like" onPress={() => likeComment(comment._id)} />
|
|
<Button title="Unlike" onPress={() => unlikeComment(comment._id)} />
|
|
{uId === comment.user && <Button title="Delete" onPress={() => deleteComment(comment._id)} />}
|
|
|
|
</>
|
|
))}
|
|
</ScrollView>
|
|
|
|
<TextInput
|
|
value={newComment}
|
|
onChangeText={text => setNewComment(text)}
|
|
placeholder="Write a comment..."
|
|
/>
|
|
<Button title="Post comment" onPress={postComment} />
|
|
{swit.user === userId && <Button title="Delete" onPress={deleteSwit} />}
|
|
</View>
|
|
);
|
|
}
|
|
|
|
export default SwitDetailScreen;
|