Code no longer works after 6 months

[lukeskywalker22]

import React, { useCallback, useState } from 'react';
import {
  Dimensions,
  FlatList,
  SafeAreaView,
  ScrollView,
  StatusBar,
  StyleSheet,
  Text,
  useColorScheme,
  View,
} from 'react-native';
import { Button, FAB, List, Provider as PaperProvider, TextInput } from 'react-native-paper';
import { DatePickerModal, TimePickerModal } from 'react-native-paper-dates';
import dateFormat from 'dateformat';
import { Navigation } from 'react-native-navigation';
import firestore from '@react-native-firebase/firestore';
var Icon = require('react-native-vector-icons/MaterialCommunityIcons')

interface Task {
  name: string,
  notes: string,
  shownDate: string,
  shownTime: string,
  id: string,
}

export let globalTasks: Task[] = [];
let globalSelectedTask: Task;

function getRandomInt(max: number) {
  return Math.floor(Math.random() * max);
}

export const HomePage = (props: { componentId: string; }) => {
  const [tasks, setTasks] = useState<Task[]>([])

  Navigation.events().registerComponentListener({
    componentDidAppear: () => {
      setTasks([...globalTasks]);
      console.log(globalTasks);
    },
  },
    props.componentId,
  );

  return (
    <PaperProvider>
      <SafeAreaView style={styles.mainView}>
        <StatusBar />
        <View style={styles.padding}>
          <FlatList
            data={tasks}
            keyExtractor={item => item.id}
            renderItem={({ item }) => {
              return (
                <List.Item
                  title={item.name}
                  description={`Due ${item.shownDate}, ${item.shownTime}`}
                  onPress={() => {
                    globalSelectedTask = item;
                    Navigation.push(props.componentId, {
                      component: {
                        name: 'ViewTask',
                      }
                    })
                  }}
                />
              );
            }}
          />
        </View>
        < FAB style={styles.fab} icon="plus" onPress={() => {
          Navigation.push(props.componentId, {
            component: {
              name: 'AddTask',
            },
          });
        }} />
      </SafeAreaView>
    </PaperProvider>
  );
};

HomePage.options = {
  topBar: {
    title: {
      text: 'My Tasks',
      color: 'black',
    },
  },
};

export const AddTaskPage = (props: { componentId: string; }) => {
  const [nameFieldText, setNameFieldText] = useState('');
  const [notesFieldText, setNotesFieldText] = useState('');
  const [dateIsOpen, setDateIsOpen] = useState(false);
  const [timeIsOpen, setTimeIsOpen] = useState(false);
  const [date, setDate] = useState<Date>(new Date());
  const [time, setTime] = useState('')
  const [shownDate, setShownDate] = useState('');
  const [shownTime, setShownTime] = useState('');
  const onConfirmDate = useCallback((params) => {
    setDateIsOpen(false);
    setDate(params.date);
    setShownDate(dateFormat(params.date, 'dddd, d mmmm yyyy'));
  }, [setDateIsOpen, setDate, setShownDate]);
  const onConfirmTime = useCallback(
    ({ hours, minutes }) => {
      setTimeIsOpen(false);
      setTime({
        hours: hours,
        minutes: minutes,
      });
      setShownTime(`$(hours):${('0' + minutes).slice(-2)}`)
    }, [setTimeIsOpen, setTime, setShownTime]);

  return (
    <PaperProvider>
      <SafeAreaView style={styles.mainView}>
        <StatusBar />
        <View style={styles.padding}>
          <TextInput
            label="Name"
            value={nameFieldText}
            onChangeText={(newtext) => {
              setNameFieldText(newtext)
            }}
          />
          <View style={styles.emptySpace} />
          <TextInput
            label="Notes"
            value={notesFieldText}
            onChangeText={(newtext) => {
              setNotesFieldText(newtext)
            }}
          />
          <View style={styles.emptySpace} />
          {shownDate !== '' ? <Text>{shownDate}</Text> : <View />}
          {shownDate !== '' ? <View style={styles.emptySpace} /> : <View />}
          <Button icon="calendar-range" mode="outlined" onPress={() => {
            setDateIsOpen(true);
          }}>
            {shownDate !== '' ? 'EDIT DATE' : 'SET DATE'}
          </Button>
          <View style={styles.emptySpace} />
          {shownTime !== '' ? <Text>{shownTime}</Text> : <View />}
          {shownTime !== '' ? <View style={styles.emptySpace} /> : <View />}
          <Button icon="clock-outline" mode="outlined" onPress={() => {
            setTimeIsOpen(true);
          }}>
            {shownTime !== '' ? 'EDIT TIME' : 'SET TIME'}
          </Button>
          <DatePickerModal
            mode="single"
            locale="en"
            visible={dateIsOpen}
            date={date}
            onDismiss={() => {
              setDateIsOpen(false);
            }}
            onConfirm={onConfirmDate}
          />
          <TimePickerModal visible={timeIsOpen} onDismiss={() => {
            setTimeIsOpen(false);
          }}
            onConfirm={onConfirmTime} />
          <View style={styles.bottomButton}>
            <Button
              mode="contained"
              disabled={
                shownTime === '' ||
                shownDate === '' ||
                nameFieldText === '' ||
                notesFieldText === ''
              }
              onPress={async () => {
                const taskID = getRandomInt(1000000).toString();
                const taskData = {
                  name: nameFieldText,
                  notes: notesFieldText,
                  shownDate: shownDate,
                  shownTime: shownTime,
                  id: taskID,
                };
                globalTasks.push(taskData);
                await firestore().collection('tasks').doc(taskID).set(taskData);
                console.log("Add Task", globalTasks)
                Navigation.pop(props.componentId);
              }}>
              ADD TASK
            </Button>
          </View>
        </View>
      </SafeAreaView>
    </PaperProvider >
  )
};

AddTaskPage.options = {
  topBar: {
    title: {
      text: 'Add Tasks',
      color: 'black',
    },
  },
};

export const ViewTaskPage = (props: { componentId: string; }) => {
  const [task, setTask] = useState<Task>();

  Navigation.events().registerComponentListener(
    {
      componentDidAppear: () => {
        setTask(globalSelectedTask)
      },
    },
    props.componentId,
  );

  return (
    <PaperProvider>
      <SafeAreaView style={styles.mainView}>
        <StatusBar />
        <View style={styles.padding}>
          <Text style={styles.titleText}>{task?.name}</Text>
          <View style={styles.emptySpace} />
          <Text style={styles.notesText}>{task?.notes}</Text>
          <View style={styles.emptySpace} />
          <View style={styles.bottomButton}>
            <Button
              mode="contained"
              color="red"
              onPress={async () => {
                globalTasks.splice(globalTasks.indexOf(globalSelectedTask), 1);
                await firestore().collection('tasks').doc(globalSelectedTask.id).delete()
                Navigation.pop(props.componentId);
              }}>
              DELETE TASK
            </Button>
          </View>
        </View>
      </SafeAreaView>
    </PaperProvider>
  )
};

const styles = StyleSheet.create({
  mainView: {
    flex: 1,
  },
  emptySpace: {
    height: 20,
  },
  padding: {
    flex: 1,
    padding: 10,
  },
  titleText: {
    fontSize: 40,
    fontWeight: 'bold',
  },
  notesText: {
    fontSize: 16,
  },
  fab: {
    position: 'absolute',
    margin: 16,
    right: 0,
    bottom: 0,
  },
  bottomButton: {
    position: 'absolute',
    width: 200,
    left: Dimensions.get('window').width / 2 - 100,
    bottom: 10,
  },

});

export default HomePage;

error messages unclear

[qin-guan]

You didn't call Firebase.initializeApp()