From f1598cef783873a76b410789fb2f26ad4c7ec74b Mon Sep 17 00:00:00 2001
From: liliana <liliana.sanfilippo@uni-bielefeld.de>
Date: Thu, 8 Aug 2024 17:02:24 +0200
Subject: [PATCH] ladebildschirm wieder da
---
src/App/App.tsx | 25 ++++++++++++++++++++++++-
1 file changed, 24 insertions(+), 1 deletion(-)
diff --git a/src/App/App.tsx b/src/App/App.tsx
index 42b3927d..fe6ceacd 100644
--- a/src/App/App.tsx
+++ b/src/App/App.tsx
@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+ import { useEffect, useState } from "react";
import "./App.css";
import '../App/Graph.css';
import '../components/test.css'
@@ -7,6 +7,7 @@ import "./App.scss";
import 'beautiful-react-diagrams/styles.css';
import "bootstrap/dist/css/bootstrap.min.css";
import "./Graph.css"
+import LoadingScreen from "../components/LoadingScreen.tsx";
import { Routes, Route } from "react-router-dom";
import { Footer } from "../components/Footer.tsx";
import { NotFound } from "../components/NotFound.tsx";
@@ -19,6 +20,8 @@ import "./LoadingScreen.css";
const App = () => {
+ const [isLoading, setIsLoading] = useState(true);
+
const pathMapping = getPathMapping();
const currentPath =
location.pathname
@@ -33,7 +36,25 @@ const App = () => {
document.title = `${title || ""} | ${import.meta.env.VITE_TEAM_NAME} - iGEM ${import.meta.env.VITE_TEAM_YEAR}`;
}, [title]);
+
+ useEffect(() => {
+ const timer = setTimeout(() => {
+ console.log("Hiding loading screen");
+ setIsLoading(false);
+ }, 0); // Adjust the delay as needed, Update the loading state after 3 seconds
+
+ return () => {
+ console.log("Cleaning up timer");
+ clearTimeout(timer); // Clear the timer on component unmount
+ };
+ }, []);
+
return (
+ <>
+ {isLoading ? (
+ <LoadingScreen />
+ ) : (
+
<>
{/* Navigation */}
<Navbar />
@@ -97,6 +118,8 @@ const App = () => {
{/* Footer */}
<Footer />
+ </>
+ )}
</>
);
};
--
GitLab