feat: fetch feed entries and display to user
This commit is contained in:
parent
d063c69172
commit
046b50942d
|
@ -1,8 +1,55 @@
|
||||||
import { View } from 'react-native'
|
import { View, Text, StyleSheet, ScrollView } from 'react-native'
|
||||||
|
import { useEffect, useState } from 'react'
|
||||||
|
import axios from 'axios'
|
||||||
|
import { useAuthStore } from '../store'
|
||||||
|
|
||||||
|
const Separator = () => <View style={styles.separator} />
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
separator: {
|
||||||
|
marginVertical: 8,
|
||||||
|
borderBottomColor: '#cccccc',
|
||||||
|
borderBottomWidth: 1
|
||||||
|
},
|
||||||
|
entryItem: {
|
||||||
|
padding: 16
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
export default function FeedListView() {
|
export default function FeedListView() {
|
||||||
|
const { credential } = useAuthStore()
|
||||||
|
const [entries, setEntries] = useState<Entry[]>([])
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
console.log(credential)
|
||||||
|
if (!credential) return
|
||||||
|
|
||||||
|
fetchList()
|
||||||
|
}, [])
|
||||||
|
|
||||||
|
async function fetchList() {
|
||||||
|
try {
|
||||||
|
const res = await axios.get("https://api.feedbin.com/v2/entries.json", { auth: credential })
|
||||||
|
const entriesRes = res.data as Entry[]
|
||||||
|
setEntries(entriesRes)
|
||||||
|
console.log(entries)
|
||||||
|
} catch (e) {
|
||||||
|
console.log("`fetchList has an error`")
|
||||||
|
console.log(e)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View>
|
<ScrollView>
|
||||||
|
{ entries.length > 0 ?
|
||||||
|
entries.map(entry => <View key={entry.id}>
|
||||||
|
<View style={styles.entryItem}>
|
||||||
|
<Text>{entry.title}</Text>
|
||||||
|
<Text>{entry.author}</Text>
|
||||||
</View>
|
</View>
|
||||||
|
<Separator />
|
||||||
|
</View>)
|
||||||
|
: <Text>No entries</Text> }
|
||||||
|
</ScrollView>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user