Цвет точки React Native Calendar отображается неправильно

Я разрабатываю приложение с помощью react native. Я использую библиотеку «react-native-calendars». Но у меня есть ошибка.

Я работал над получением данных из асинхронного хранилища и ставил точку в календаре.

Это сохраненные данные.

номер списка: 2

1 календарь: 30 марта 2023 г.

30.03.2023календарь: счастливо-розовый

2календарь: 31 марта 2023 г.

31.03.2023календарь: счастливо-желтый

И это мой код.

import React, {useState, useEffect} from 'react';
import {SafeAreaProvider} from 'react-native-safe-area-context';
import {Calendar} from "react-native-calendars";
import {View, StyleSheet} from 'react-native';
import AsyncStorage from "@react-native-async-storage/async-storage";

function HomeScreen({navigation}) {
  const [markedDates, setMarkedDates] = React.useState(null);
  const [dates, setDates] = React.useState([]);

  const readCalendarData = async () => {
    try {
      const listnumber = await AsyncStorage.getItem("listnumber");
      const listnumbertoint = parseInt(listnumber, 10);
      for (var i = 1; i <= listnumbertoint; i++) {
        console.info(i);
        const date = await AsyncStorage.getItem(i + "calendar");
        console.info(date);
        const color = await AsyncStorage.getItem(date + "calendar");
        console.info(color);
        if (color == "happy-pink" || color == "happy2-pink") {
          dates.push(date);
          let obj = dates.reduce(
            (c, v) =>
              Object.assign(c, {
                [v]: { marked: true, dotColor: 'pink' },
              }),
            {},
          );
          setMarkedDates(obj);
        }else if (color == "happy-yellow"){
         dates.push(date);
          let obj = dates.reduce(
            (c, v) =>
              Object.assign(c, {
                [v]: { marked: true, dotColor: 'yellow' },
              }),
            {},
          );
          setMarkedDates(obj);
        }else if (color == "sad-skyblue") {
          dates.push(date);
          let obj = dates.reduce(
            (c, v) =>
              Object.assign(c, {
                [v]: { marked: true, dotColor: 'skyblue' },
              }),
            {},
          );
          setMarkedDates(obj);
        }else if (color == "soso-green") {
          dates.push(date);
          let obj = dates.reduce(
            (c, v) =>
              Object.assign(c, {
                [v]: { marked: true, dotColor: 'green' },
              }),
            {},
          );
          setMarkedDates(obj);
        }else if (color == "soso-orange") {
          dates.push(date);
          let obj = dates.reduce(
            (c, v) =>
              Object.assign(c, {
                [v]: { marked: true, dotColor: 'orange' },
              }),
            {},
          );
          setMarkedDates(obj);
        }else{
          dates.push(date);
          let obj = dates.reduce(
            (c, v) =>
              Object.assign(c, {
                [v]: { marked: true, dotColor: 'pink' },
              }),
            {},
          );
          setMarkedDates(obj);
        }
      }
    } catch (error) {
      console.error(error);
    }
  };
  useEffect(() => {
    readCalendarData();
  }, [])
  return(
      <SafeAreaProvider>
         <View>
            <Calendar
              markedDates = {markedDates}
              onDayPress = {(day) => {
                navigation.push('Detail', {day});
              }}
           />
         </View>
      </SafeAreaProvider>
  );
}

export default HomeScreen;

А когда работает, то точки отображаются хорошо на датах 2023-03-30 и 2023-03-31, но цвет желтый.

И я удалил данные и сохранил данные, чтобы показать 2023-03-30 небесно-голубым цветом, и сохранил данные, чтобы показать 2023-03-31 зеленым цветом.

Но опять же на этот раз показывает нормально, но проблема в том, что цвет зеленый.

Вы можете помочь мне? Пожалуйста, помогите мне, если можете.