None of these files exist, firebase

Question

I ran into a problem following a tutorial on developing a whatsApp clone from a YouTube video, expo is telling me that:

None of these files exist:

• ..\firebase(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
• ..\firebase\index(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json) 4 | import { useAssets } from 'expo-asset'; 5 | import { onAuthStateChanged } from 'firebase/auth';

6 | import { auth } from '../firebase'; | ^ 7 | 8 | LogBox.ignoreLogs([ 9 | "Setting a timer",

I don't understand exactly what is going on so I decided to fetch some help online, thank you in advance, here is my code and files arrangements to help you understand my project :

import { StatusBar } from 'expo-status-bar';
import React, { useState, useEffect } from 'react';
import { StyleSheet, Text, View, LogBox } from 'react-native';
import { useAssets } from 'expo-asset';
import { onAuthStateChanged } from 'firebase/auth';
import { auth } from '../firebase';

LogBox.ignoreLogs([
  "Setting a timer",
  "Async storage has been extracted from react-native core"
]);

function App() {
  const [currUser, setCurrUser] = useState(null)
  const [loading, setLoading] = useState(true)

  useEffect(()=> {
    const unsubscribe = onAuthStateChanged(auth, user => {
      setLoading(false);
      if(user){
        setCurrUser(user);
      }
    });
    return () => unsubscribe();
  }, []);

  if(loading){
    return <Text>Loading ...</Text>
  }

  return (
    <View style={styles.container}>
      <Text>{JSON.stringify(currUser)}</Text>
      <StatusBar style="auto" />
    </View>
  );

}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

function Main(){
  const [assets] = useAssets(
    require("./assets/icon-square.png"),
    require("./assets/chatbg.png"),
    require("./assets/user-icon.png"),
    require("./assets/welcome-img.png")
  )
  // le (!assets) veux dire que si il n'y a PAS
  if(!assets){
    return <Text>Loading ...</Text>
  }
  return <App />;
}

export default Main

code arrangement