Im working on a journal app and i need to map through a list of 'days' but it doesn't render them
Heres my JournalScreen.tsx:
I have a testing array journal where i set a basic 'day'
I want to map through but it doesn't work
import * as React from 'react';import { StyleSheet, TouchableOpacity, Linking, Platform } from 'react-native';import JournalCard from '../components/JournalCard';import { View } from '../components/Themed';import { RootTabScreenProps } from '../types';export default function JournalScreen({ navigation }: RootTabScreenProps<'Journal'>) { const [journal, setJournal] = React.useState([ { date: "29.09.21", value: "Today was a nice day this is also a Placeholder" } ]) return (<View style={styles.container}> { journal.map((journal) => {<JournalCard key="i" value={journal} /> }) }</View> );}const styles = StyleSheet.create({ container: { flex: 1, alignItems: 'center', justifyContent: 'center', },});
and here's my JournalCard.tsx:It's very basic just the props and some text not much to say
import { Ionicons } from '@expo/vector-icons';import React, { useState } from 'react';import { StyleSheet, Pressable } from 'react-native';import { Text, View } from './Themed';import { Audio } from 'expo-av';import AsyncStorage from "@react-native-async-storage/async-storage";import Colors from '../constants/Colors';import useColorScheme from '../hooks/useColorScheme';type JournalCardProps = { value: any}export default function JournalCard({ value }: JournalCardProps) { const colorScheme = useColorScheme() return (<View style={[styles.container, { backgroundColor: Colors[colorScheme].uiBg }]}><Text style={styles.date}>{value.date}</Text><Text>{value.value}</Text></View> );}const styles = StyleSheet.create({ container: { width: '90%', padding: 10, borderRadius: 5 }, date: { fontWeight: 'bold', fontSize: 26, marginBottom: 20, borderBottomWidth: 2 }});