You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
58 lines
1.6 KiB
58 lines
1.6 KiB
import { AdSlot } from '@/components/AdSlot';
|
|
import { EntryCard } from '@/components/EntryCard';
|
|
import { VStack } from '@/components/Stacks';
|
|
import { useDiary } from '@/stores/diaryStore';
|
|
import { FlatList, View } from 'react-native';
|
|
import { FAB, Text } from 'react-native-paper';
|
|
import { spacing, styles } from '~/theme';
|
|
|
|
export default function ListScreen({
|
|
onOpenCreate,
|
|
onOpenEdit,
|
|
}: {
|
|
onOpenCreate: () => void;
|
|
onOpenEdit: (id: string) => void;
|
|
}) {
|
|
const { state } = useDiary();
|
|
|
|
return (
|
|
<VStack style={{ flex: 1 }} justify="space-between">
|
|
{/* 메인영역 */}
|
|
<View style={styles.flex}>
|
|
<FlatList
|
|
style={styles.flex}
|
|
contentContainerStyle={{ padding: 16, gap: 12 }}
|
|
data={state.ids}
|
|
keyExtractor={(id) => id}
|
|
renderItem={({ item: id }) => {
|
|
const e = state.byId[id];
|
|
if (!e) return null;
|
|
return <EntryCard item={e} onPress={() => onOpenEdit(id)} />;
|
|
}}
|
|
ListEmptyComponent={
|
|
<View
|
|
style={{
|
|
height: 200,
|
|
flex: 1,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
}}>
|
|
<Text>작성된 기록이 없어요. </Text>
|
|
<Text>아래 +를 눌러</Text>
|
|
<Text>오늘의 감정을 남겨보세요.</Text>
|
|
</View>
|
|
}
|
|
/>
|
|
|
|
<FAB
|
|
mode="flat"
|
|
icon="plus"
|
|
style={{ position: 'absolute', right: 24, bottom: 24 }}
|
|
onPress={onOpenCreate}
|
|
/>
|
|
</View>
|
|
|
|
<AdSlot height={80} />
|
|
</VStack>
|
|
);
|
|
}
|
|
|