TypeError: undefined is not an object (evaluating 'items.rows')

前提・実現したいこと

react nativeのexpoを利用して家計簿サンプルアプリを作成しながら勉強しています。
その際に以下のようなエラーが出て困っています。
親コンポーネントのuseEffectであらかじめDBから値を取り出してstateに入れているにもかかわらず、
子コンポーネントでundefinedになってしまっています。
useEffectはマウント前に実行してくれるので今回の場合は上手くいくのではないのでしょうか。
この辺りに関してご存知の方がいましたらコメントお願いします。

発生している問題・エラーメッセージ

TypeError: undefined is not an object (evaluating 'items.rows')

該当のソースコード

js
1export const CalendarScreen: VFC<Props> = ({ navigation, route }) => {
2  const [items, setItems] = useState<SQLite.SQLResultSet>();
3
4  useEffect(() => {
5    db.transaction((tx: any) => {
6      tx.executeSql(
7        "select * from costHistoryV3;",
8        [],
9        (_, resultSet: any) => {
10          setItems(resultSet);
11        },
12        () => {
13          console.log("select fail");
14          return false;
15        }
16      )
17    })
18  }, []);
19  
20  return (
21    <View style={styles.container}>
22      <CustomCalendar items={items} />
23      <View>
24        {monthlyCostHistory.map((value, index) => {
25          return (
26            <CostHistory
27              key={index}
28              cost={value.cost}
29              type={value.type}
30              onPress={() => onPress(value.cost)}
31            />
32          );
33        })}
34      </View>
35    </View>
36  );
37};

export const CustomCalendar: VFC<Props> = ({ items }) => {
  return (
    <Calendar
      theme={{
        "stylesheet.calendar.header": {
          dayTextAtIndex0: {
            color: "red",
          },
          dayTextAtIndex6: {
            color: "blue",
          },
        },
      }}
      dayComponent={({ date }) => {
        // dateが一致するitemを取り出して足し合わせる
        let plusSum = 0;
        let minusSum = 0;
        for (let i = 0; i < items.rows.length; i++){
          if (items.rows.item(i).date == date) {
            if (items.rows.item(i).type == 0) {
              minusSum += items.rows.item(i).cost;
            } else {
              plusSum += items.rows.item(i).cost;
            }
          }
        }
        return (
          <View style={styles.customDayComponent}>
            <Text style={styles.customDayText}>{date.day}</Text>
            <Text style={styles.dayPlusCost}>{plusSum}</Text>
            <Text style={styles.dayMinusCost}>{minusSum}</Text>
          </View>
        );
      }}
    />
  );
};