mod: improve the styling of feed list

This commit is contained in:
Astrian Zheng 2025-07-01 09:48:13 +10:00
parent 0a1db64a08
commit 457fdd4951
Signed by: Astrian
SSH Key Fingerprint: SHA256:rVnhx3DAKjujCwWE13aDl7uV6+9U1MvydLkNRXJrBiA

View File

@ -1,4 +1,4 @@
import { View, Text, StyleSheet, ScrollView } from 'react-native' import { View, Text, StyleSheet, ScrollView, Pressable } from 'react-native'
import { useEffect, useState } from 'react' import { useEffect, useState } from 'react'
import axios from 'axios' import axios from 'axios'
import { useAuthStore, useSubscription } from '../store' import { useAuthStore, useSubscription } from '../store'
@ -11,7 +11,14 @@ const styles = StyleSheet.create({
borderBottomWidth: 1 borderBottomWidth: 1
}, },
entryItem: { entryItem: {
padding: 16 padding: 16,
gap: 4
},
entryTitle: {
fontSize: 20
},
entryMetadata: {
color: '#aaaaaa'
} }
}) })
@ -24,7 +31,6 @@ export default function FeedListView() {
const [entries, setEntries] = useState<Entry[]>([]) const [entries, setEntries] = useState<Entry[]>([])
useEffect(() => { useEffect(() => {
console.log(credential)
if (!credential) return if (!credential) return
fetchList() fetchList()
@ -35,7 +41,6 @@ export default function FeedListView() {
const res = await axios.get("https://api.feedbin.com/v2/entries.json", { auth: credential }) const res = await axios.get("https://api.feedbin.com/v2/entries.json", { auth: credential })
const entriesRes = res.data as Entry[] const entriesRes = res.data as Entry[]
setEntries(entriesRes) setEntries(entriesRes)
console.log(entriesRes[3])
} catch (e) { } catch (e) {
console.log("`fetchList has an error`") console.log("`fetchList has an error`")
console.log(e) console.log(e)
@ -46,10 +51,12 @@ export default function FeedListView() {
<ScrollView> <ScrollView>
{ entries.length > 0 ? { entries.length > 0 ?
entries.map(entry => <View key={entry.id}> entries.map(entry => <View key={entry.id}>
<Pressable>
<View style={styles.entryItem}> <View style={styles.entryItem}>
<Text>{entry.title}</Text> <Text style={styles.entryTitle}>{entry.title}</Text>
<Text>{entry.author && <Text>{entry.author} &middot; </Text>}{subscriptions[entry.feed_id].title}</Text> <Text style={styles.entryMetadata}>{entry.author && <Text>{entry.author} &middot; </Text>}{subscriptions[entry.feed_id].title}</Text>
</View> </View>
</Pressable>
<Separator /> <Separator />
</View>) </View>)
: <Text>No entries</Text> } : <Text>No entries</Text> }