87 lines
2.6 KiB
TypeScript
87 lines
2.6 KiB
TypeScript
import "./App.css";
|
|
import Musicians from "./Musicians/Musicians";
|
|
import NavBar from "./NavBar/NavBar";
|
|
import ContactForm from "./Forms/Contact/ContactForm";
|
|
import { Container } from "react-bootstrap";
|
|
import Group, { GroupObj } from "./Group/Group";
|
|
import SeriesList, { EventSeriesObj } from "./Series/SeriesList";
|
|
import { useState, useEffect } from "react";
|
|
import Footer from "./Footer/Footer";
|
|
import { getRoot } from "./api";
|
|
import { MusicianObj } from "./Musicians/Musician/Musician";
|
|
import ErrorModal from "./ErrorModal/ErrorModal";
|
|
import Cookies from "js-cookie";
|
|
|
|
function App() {
|
|
const tokenCookie = Cookies.get("token");
|
|
const [group, setGroup] = useState<GroupObj>();
|
|
const [update, setUpdate] = useState<boolean>(false);
|
|
const [musicians, setMusicians] = useState<MusicianObj[]>([]);
|
|
const [seriesList, setSeriesList] = useState<EventSeriesObj[]>([]);
|
|
const [apiVersion, setApiVersion] = useState<string>("");
|
|
const [error, setError] = useState<string>("");
|
|
const [errorModalShow, setErrorModalShow] = useState<boolean>(false);
|
|
const [errorEntity, setErrorEntity] = useState<string>("");
|
|
const [token, setToken] = useState<string>(tokenCookie ? tokenCookie : "");
|
|
const appVersion = import.meta.env.PACKAGE_VERSION;
|
|
|
|
const handleGroupBioChange = () => {
|
|
setUpdate(!update);
|
|
};
|
|
|
|
const handleError = (error: string, entity: string) => {
|
|
console.error(error);
|
|
setError(error);
|
|
setErrorEntity(entity);
|
|
setErrorModalShow(true);
|
|
};
|
|
|
|
useEffect(() => {
|
|
getRoot()
|
|
.then((tgd): void => {
|
|
setGroup(tgd.group);
|
|
setMusicians(tgd.musicians);
|
|
setSeriesList(tgd.events);
|
|
setApiVersion(tgd.version);
|
|
})
|
|
.catch((error) => {
|
|
handleError(error.message, "root");
|
|
});
|
|
}, []);
|
|
|
|
return (
|
|
<div id="home">
|
|
<NavBar
|
|
musicians={musicians}
|
|
apiVersion={apiVersion}
|
|
appVersion={appVersion}
|
|
token={token}
|
|
setToken={setToken}
|
|
/>
|
|
<Container id="content" style={{ maxWidth: "1200px", margin: "0 auto" }}>
|
|
<Group
|
|
group={group}
|
|
onBioChange={handleGroupBioChange}
|
|
setGroup={setGroup}
|
|
token={token}
|
|
/>
|
|
<Musicians
|
|
musicians={musicians}
|
|
setMusicians={setMusicians}
|
|
token={token}
|
|
/>
|
|
<SeriesList
|
|
seriesList={seriesList}
|
|
setSeriesList={setSeriesList}
|
|
token={token}
|
|
/>
|
|
<ContactForm />
|
|
</Container>
|
|
<Footer />
|
|
<ErrorModal error={error} show={errorModalShow} entity={errorEntity} />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default App;
|