Как исправить белый экран после SplashScreen в react native Expo?

Я сейчас занимаюсь своим первым проектом на react native. Прошу помочь в решении проблемы с белым экранов после скрытия splash screen.

Expo go Билд приложения

App.js

import { SafeAreaView, SafeAreaProvider } from 'react-native-safe-area-context';
import AsyncStorage from '@react-native-async-storage/async-storage';
import { StyleSheet, View, useColorScheme } from 'react-native';
import { useState, useEffect, useMemo } from 'react';
import * as SplashScreen from 'expo-splash-screen';
import { StatusBar } from 'expo-status-bar';
import ScheduleList from './widgets/schedule/ScheduleList';
import Settings from './widgets/settings/Settings';
import NetInfo from '@react-native-community/netinfo';
import { Context } from './context'
import Indicator from './widgets/Indicator';


SplashScreen.preventAutoHideAsync();

export default function App() {

    const [isSchedule, setIsShedule] = useState(true);
    const [isConnected, setIsConnected] = useState(true);

    const colorTheme = useColorScheme();

    const [color, setColor] = useState({
        bg: '#1B1B1B',
        bgNight: '#222222',
        bgLight: '#272727',
        main: '#FFFFFF',
    });
    const [validation, setValidation] = useState(false);
    const [settings, setSettings] = useState(false);
    const [schedule, setSchedule] = useState({});
    const [id, setId] = useState({
        id: 236,
        type: 'group',
        name: 'ИСР-12',
    });

    const [refreshing, setRefreshing] = useState(false);



    const onRefresh = () => {
        setRefreshing(true);
        loadSchedule();
    };

    const saveData = async () => {
        await AsyncStorage.setItem('id', JSON.stringify(id));
        await AsyncStorage.setItem('color', JSON.stringify(color));
        //await AsyncStorage.setItem('schedule', JSON.stringify(schedule));
    };
    const getData = async () => {
        const getId = await AsyncStorage.getItem('id');
        const getColor = await AsyncStorage.getItem('color');

        if (getId !== null) {
            setId(JSON.parse(getId))
        }
        if (getColor !== null) {
            setColor(JSON.parse(getColor))
        }
    };
    const getOfflineSchedule = async () => {
        const getSchedule = await AsyncStorage.getItem('schedule');

        if (getSchedule !== null) {
            setSchedule(JSON.parse(getSchedule))
        }
    };


    const loadSchedule = () => {
        setValidation(false)
        fetch(`https://schedule-backend-production.koka.team/v1/schedule?${id.type}_id=${id.id}&is_new=true`)
            .then(response => {
                if (response.ok) {
                    return response.json();
                } else {
                    return null;
                }
            })
            .then(data => {
                if (data !== null && isConnected) {
                    const parsedSchedule = {};
                    Object.assign(parsedSchedule, data.schedule);
                    setSchedule(parsedSchedule);
                    setRefreshing(false);
                    if (Object.keys(parsedSchedule).length > 0) {
                        setValidation(true);
                        setIsShedule(true)
                    } else {
                        setValidation(false)
                        setIsShedule(false);
                    }
                } else if (!isConnected || data == null) {
                    setValidation(false);
                    //getOfflineSchedule();
                }
            })
            .catch(error => {
                setValidation(false);
                setRefreshing(false);
                //getOfflineSchedule();
                console.log('ошибка в catch')
            });
    };

    useEffect(() => {
        const unsubscribe = NetInfo.addEventListener(state => {
            setIsConnected(state.isConnected);
        });

        return () => {
            unsubscribe();
        };
    }, []);

    useMemo(() => {
        if (id.id !== undefined && isConnected) {
            SplashScreen.hideAsync()
            loadSchedule()
        }
    }, [isConnected, id])

    useMemo(() => {
        getData();
    }, [])

    useMemo(() => {
        saveData()
    }, [id, color])

    useMemo(() => {
        if (colorTheme == 'light') {
            setColor(prev => {
                return {
                    bg: '#D2D2D2',
                    bgNight: '#E2E2E2',
                    bgLight: '#ECECEC',
                    main: (prev.main !== '#FFFFFF') ? prev.main : '#000000',
                }
            })
        } else if (colorTheme == 'dark') {
            setColor(prev => {
                return {
                    bg: '#1B1B1B',
                    bgNight: '#222222',
                    bgLight: '#272727',
                    main: (prev.main !== '#000000') ? prev.main : '#FFFFFF',
                }
            })
        }
    }, [colorTheme])

    return (
        <Context.Provider value={{
            color, setColor, isConnected, settings, setSettings, schedule, id, setId, refreshing, onRefresh, isSchedule, colorTheme
        }}>
            <SafeAreaProvider>
                <SafeAreaView style={[styles.container, { backgroundColor: color.bg }]}
                    edges={['bottom', 'top', 'left', 'right']}
                >
                    {(color.bg !== undefined && validation) ? <ScheduleList /> : <Indicator />}
                    <Settings />
                    <StatusBar style="light" />
                </SafeAreaView>
            </SafeAreaProvider>
        </Context.Provider>
    );
}


const styles = StyleSheet.create({
    container: {
        flex: 1,
        paddingTop: 5,
        justifyContent: 'center',
    },
});

app.json

{
  "expo": {
    "name": "Расписание",
    "slug": "schedule",
    "version": "0.7.0",
    "orientation": "portrait",
    "icon": "./assets/icon.png",
    "userInterfaceStyle": "automatic",
    "splash": {
      "image": "./assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#1B1B1B"
    },
    "assetBundlePatterns": [
      "**/*"
    ],
    "ios": {
      "supportsTablet": true,
      "runtimeVersion": {
        "policy": "appVersion"
      }
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./assets/adaptive-icon.png",
        "backgroundColor": "#1D1D1D"
      },
      "package": "com.kredao.schedule",
      "runtimeVersion": "0.7.0"
    },
    "web": {
      "favicon": "./assets/favicon.png"
    },
    "extra": {
      "eas": {
        "projectId": "27796f19-61ac-48eb-96b1-9c8739bb23c9"
      }
    },
    "plugins": [
      [
        "expo-font",
        {
          "fonts": [
            "./assets/fonts/Raleway-Medium.ttf",
            "./assets/fonts/Raleway-Regular.ttf"
          ]
        }
      ]
    ]
  }
}

package.json

{
  "name": "schedule",
  "version": "1.0.0",
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo run:android",
    "ios": "expo run:ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@expo/webpack-config": "^19.0.0",
    "@react-native-async-storage/async-storage": "1.21.0",
    "@react-native-community/netinfo": "11.1.0",
    "@react-native-segmented-control/segmented-control": "2.4.1",
    "expo": "^50.0.7",
    "expo-font": "~11.10.3",
    "expo-splash-screen": "~0.26.4",
    "expo-status-bar": "~1.11.1",
    "expo-system-ui": "~2.9.3",
    "expo-updates": "~0.24.11",
    "lodash": "^4.17.21",
    "punycode": "^2.3.1",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-native": "0.73.4",
    "react-native-gesture-handler": "~2.14.0",
    "react-native-reanimated": "~3.6.2",
    "react-native-safe-area-context": "4.8.2",
    "react-native-vector-icons": "^10.0.2",
    "react-native-web": "~0.19.6",
    "reanimated-color-picker": "^3.0.3"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0"
  },
  "private": true
}

Пробовал удалить библиотеку expo-splash-screen.


Ответы (0 шт):