diff --git a/frontend/src/App.js b/frontend/src/App.js index adc4491..e766879 100644 --- a/frontend/src/App.js +++ b/frontend/src/App.js @@ -1,14 +1,13 @@ import { createBrowserRouter, RouterProvider } from "react-router-dom"; -import Footnote from "./components/Footnote"; -import Navbar from "./components/Navbar"; -import Home from "./components/Home"; import AboutUs from "./components/AboutUs"; -import Events from "./components/Events"; import Admin from "./components/Admin"; -import Parties from "./Parties"; +import { default as Event, default as Events } from "./components/Events"; +import Footnote from "./components/Footnote"; +import Home from "./components/Home"; +import Navbar from "./components/Navbar"; import Leadership from "./Leadership"; -import Event from "./components/Events"; -import Contact from "./contact" +import Parties from "./Parties"; +// import Contact from "./contact" import ConstitutionReact from "./ConstitutionReact"; // Router : A constant determining the total connection between the home page and @@ -24,7 +23,7 @@ const router = createBrowserRouter([ { path: "/events", element: }, { path: "/leadership", element: }, { path: "/constitution", element: }, - { path: "/contact", element: }, + // { path: "/contact", element: }, { path: "/parties", element: }, ]); diff --git a/frontend/src/components/Admin.jsx b/frontend/src/components/Admin.jsx index 8f2a1f8..4017b69 100644 --- a/frontend/src/components/Admin.jsx +++ b/frontend/src/components/Admin.jsx @@ -1,18 +1,19 @@ -import { useState, useEffect } from "react"; +import React, { useEffect, useState } from 'react'; +import "../App.css"; import { useFirebase } from "../firebase"; -import ModifiableEventCard from "./Modifiable/ModifiableEventCard"; -import ModifiablePartiesCard from "./Modifiable/ModifiablePartiesCard"; -import ModifiableLeadCard from "./Modifiable/ModifiableLeadCard"; import ModifiableAddEventCard from "./Modifiable/ModifiableAddEventCard"; import ModifiableAddLeadCard from "./Modifiable/ModifiableAddLeadCard"; import ModifiableAddPartiesCard from "./Modifiable/ModifiableAddPartiesCard"; -import React from 'react'; -import "../App.css" +import ModifiableEventCard from "./Modifiable/ModifiableEventCard"; +import ModifiableLeadCard from "./Modifiable/ModifiableLeadCard"; +import ModifiablePartiesCard from "./Modifiable/ModifiablePartiesCard"; -const Dashboard = ({ firebase, signOut }) => { +const Dashboard = ({ signOut }) => { const [events, setEvents] = useState([]); const [parties, setParties] = useState([]); const [leader, setLeaders] = useState([]); + const firebase = useFirebase(); + useEffect(() => { async function fetch() { setEvents((await firebase.getAllGenDocs("events")).sort()); @@ -33,7 +34,6 @@ const Dashboard = ({ firebase, signOut }) => { return (
{
{loggedIn ? ( ) : ( diff --git a/frontend/src/components/Modifiable/ModifiableAddEventCard.jsx b/frontend/src/components/Modifiable/ModifiableAddEventCard.jsx index 28b9eda..770d419 100644 --- a/frontend/src/components/Modifiable/ModifiableAddEventCard.jsx +++ b/frontend/src/components/Modifiable/ModifiableAddEventCard.jsx @@ -1,21 +1,9 @@ -import {useState} from "react"; -import {addDoc, collection, getFirestore, Timestamp} from "firebase/firestore"; -import React from "react"; -import {initializeApp} from "firebase/app"; +import { addDoc, collection, getFirestore, Timestamp } from "firebase/firestore"; +import React, { useState } from "react"; -const config = { - apiKey: process.env.REACT_APP_API_KEY, - authDomain: process.env.REACT_APP_AUTH_DOMAIN, - projectId: process.env.REACT_APP_PROJECT_ID, - storageBucket: process.env.REACT_APP_STORAGE_BUCKET, - messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID, - appId: process.env.REACT_APP_APP_ID, - measurementId: process.env.REACT_APP_MEASUREMENT_ID, -}; const ModifiableAddEventCard = () => { - const app = initializeApp(config); - const firestore = getFirestore(app); + const firestore = getFirestore(); const [currentImage, setCurrentImage] = useState(); const [newEvent, setNewEvent] = useState({ description: "", diff --git a/frontend/src/components/Modifiable/ModifiableAddLeadCard.jsx b/frontend/src/components/Modifiable/ModifiableAddLeadCard.jsx index 6f2eeb0..6165b60 100644 --- a/frontend/src/components/Modifiable/ModifiableAddLeadCard.jsx +++ b/frontend/src/components/Modifiable/ModifiableAddLeadCard.jsx @@ -1,21 +1,8 @@ -import {useState} from "react"; -import React from "react"; -import {collection, addDoc, getFirestore} from "firebase/firestore"; -import {initializeApp} from "firebase/app"; - -const config = { - apiKey: process.env.REACT_APP_API_KEY, - authDomain: process.env.REACT_APP_AUTH_DOMAIN, - projectId: process.env.REACT_APP_PROJECT_ID, - storageBucket: process.env.REACT_APP_STORAGE_BUCKET, - messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID, - appId: process.env.REACT_APP_APP_ID, - measurementId: process.env.REACT_APP_MEASUREMENT_ID, -}; +import { addDoc, collection, getFirestore } from "firebase/firestore"; +import React, { useState } from "react"; const ModifiableAddLeadCard = () => { - const app = initializeApp(config); - const firestore = getFirestore(app); + const firestore = getFirestore(); const [currentImage, setCurrentImage] = useState(); const [newEvent, setNewEvent] = useState({ image: "", diff --git a/frontend/src/components/Modifiable/ModifiableAddPartiesCard.jsx b/frontend/src/components/Modifiable/ModifiableAddPartiesCard.jsx index 0ec2faf..4a26186 100644 --- a/frontend/src/components/Modifiable/ModifiableAddPartiesCard.jsx +++ b/frontend/src/components/Modifiable/ModifiableAddPartiesCard.jsx @@ -1,21 +1,8 @@ -import {useState} from "react"; -import React from "react"; -import {addDoc, collection, getFirestore} from "firebase/firestore"; -import {initializeApp} from "firebase/app"; - -const config = { - apiKey: process.env.REACT_APP_API_KEY, - authDomain: process.env.REACT_APP_AUTH_DOMAIN, - projectId: process.env.REACT_APP_PROJECT_ID, - storageBucket: process.env.REACT_APP_STORAGE_BUCKET, - messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID, - appId: process.env.REACT_APP_APP_ID, - measurementId: process.env.REACT_APP_MEASUREMENT_ID, -}; +import { addDoc, collection, getFirestore } from "firebase/firestore"; +import React, { useState } from "react"; const ModifiableAddPartiesCard = () => { - const app = initializeApp(config); - const firestore = getFirestore(app); + const firestore = getFirestore(); const [currentImage, setCurrentImage] = useState(); const [newEvent, setNewEvent] = useState({ name: "", diff --git a/frontend/src/components/Modifiable/ModifiableEventCard.jsx b/frontend/src/components/Modifiable/ModifiableEventCard.jsx index 4fb4409..ccd0097 100644 --- a/frontend/src/components/Modifiable/ModifiableEventCard.jsx +++ b/frontend/src/components/Modifiable/ModifiableEventCard.jsx @@ -1,8 +1,8 @@ -import {useState} from "react"; -import {Timestamp} from "firebase/firestore"; +import { Timestamp } from "firebase/firestore"; +import { useState } from "react"; +import { useFirebase } from "../../firebase"; const ModifiableEventCard = ({ - firebase, id, image, virtual, @@ -20,6 +20,7 @@ const ModifiableEventCard = ({ when: when, where: where, }); + const firebase = useFirebase() const handleInputChange = (event) => { event.preventDefault(); let value = event.target.value; diff --git a/frontend/src/firebase/firebase.js b/frontend/src/firebase/firebase.js index c106135..099ee1c 100644 --- a/frontend/src/firebase/firebase.js +++ b/frontend/src/firebase/firebase.js @@ -1,6 +1,6 @@ -import {initializeApp} from "firebase/app"; -import {getAuth, signInWithEmailAndPassword, createUserWithEmailAndPassword} from "firebase/auth"; -import {collection, doc, getDocs, getFirestore, query, updateDoc, deleteDoc} from "firebase/firestore"; +import { getApp, getApps, initializeApp } from "firebase/app"; +import { createUserWithEmailAndPassword, getAuth, signInWithEmailAndPassword } from "firebase/auth"; +import { collection, deleteDoc, doc, getDocs, getFirestore, query, updateDoc } from "firebase/firestore"; const config = { apiKey: process.env.REACT_APP_API_KEY, @@ -12,13 +12,22 @@ const config = { measurementId: process.env.REACT_APP_MEASUREMENT_ID, databaseURL: process.env.REACT_APP_DATABASE_URL, }; +export function firebaseInit() { + let app; + if (getApps().length === 0) { + app = initializeApp(config); + } else { + app = getApp(); + } + return app; +} export class Firebase { firestore; auth; constructor() { - const app = initializeApp(config); + const app = firebaseInit(); this.firestore = getFirestore(app); this.auth = getAuth(app); }