72 lines
2.7 KiB
JavaScript
72 lines
2.7 KiB
JavaScript
|
import React, { useState } from 'react';
|
||
|
|
import { View, Text, TextInput, Button, TouchableOpacity } from 'react-native';
|
||
|
|
import AsyncStorage from '@react-native-async-storage/async-storage';
|
||
|
|
import { useTailwind } from 'tailwind-rn';
|
||
|
|
import moment from 'moment';
|
||
|
|
import Icon from 'react-native-vector-icons/FontAwesome'
|
||
|
|
import { Swit } from './Home';
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
function SearchScreen({ navigation }) {
|
||
|
|
const tailwind = useTailwind();
|
||
|
|
const [userId, setUserId] = useState('');
|
||
|
|
|
||
|
|
// query is the search term entered by the user
|
||
|
|
const [query, setQuery] = useState('');
|
||
|
|
// userResults and switResults are the search results
|
||
|
|
const [userResults, setUserResults] = useState([]);
|
||
|
|
const [switResults, setSwitResults] = useState([]);
|
||
|
|
|
||
|
|
async function search() {
|
||
|
|
// Get the user's token
|
||
|
|
const token = await AsyncStorage.getItem('token');
|
||
|
|
const apiUrl = await AsyncStorage.getItem('apiEndpoint')
|
||
|
|
const id = await AsyncStorage.getItem('userId');
|
||
|
|
setUserId(id);
|
||
|
|
|
||
|
|
// Fetch user search results
|
||
|
|
const userResponse = await fetch(`${apiUrl}/api/v1/app/user/search/?q=${query}`, {
|
||
|
|
headers: { 'Authorization': token },
|
||
|
|
});
|
||
|
|
const userData = await userResponse.json();
|
||
|
|
console.warn(userData)
|
||
|
|
setUserResults(userData);
|
||
|
|
|
||
|
|
// Fetch swit search results
|
||
|
|
const switResponse = await fetch(`${apiUrl}/api/v1/app/swit/search/?q=${query}`, {
|
||
|
|
headers: { 'Authorization': token },
|
||
|
|
});
|
||
|
|
const switData = await switResponse.json();
|
||
|
|
console.warn(switData)
|
||
|
|
setSwitResults(switData);
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<View >
|
||
|
|
<TextInput value={query} onChangeText={text => setQuery(text)} />
|
||
|
|
<Button title="Search" onPress={search} />
|
||
|
|
|
||
|
|
<Text>User Results</Text>
|
||
|
|
{userResults.slice(0, 2).map(user => (
|
||
|
|
// Display user result, which includes profile picture, display name, username, and bio
|
||
|
|
// This is a placeholder and needs to be replaced with actual components
|
||
|
|
<Text key={user._id}>{user.username}</Text>
|
||
|
|
))}
|
||
|
|
{userResults.length > 2 && <Button title="Show More" onPress={() => navigation.navigate('UserSearchResults', { query })} />}
|
||
|
|
|
||
|
|
<Text>Swit Results</Text>
|
||
|
|
{switResults.slice(0, 10).map(swit => (
|
||
|
|
// Display swit result, which includes the swit content
|
||
|
|
// This is a placeholder and needs to be replaced with actual components
|
||
|
|
<View style={tailwind('p-4')}>
|
||
|
|
<Swit swit={swit} navigation={navigation} userId={userId} setSwits={setSwitResults} swits={switResults}/>
|
||
|
|
</View>
|
||
|
|
))}
|
||
|
|
{switResults.length > 10 && <Button title="Show More" onPress={() => navigation.navigate('SwitSearchResults', { query })} />}
|
||
|
|
</View>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export default SearchScreen;
|