Files
CPLv4.0/pages/wait.js
ISA ab8a80f34c feat: dynamische URL-Anpassung für Entwicklungs- und Produktionsumgebung
- Navigation und Weiterleitungen angepasst, um dynamisch `.html`-Endungen in Produktionsumgebung anzuhängen.
- Nutzung von `NEXT_PUBLIC_NODE_ENV` ermöglicht unterschiedliche URL-Strukturen in Entwicklungs- und Produktionsumgebung.
- `Navigation`-Komponente und `index.js` entsprechend konfiguriert, um `.html` in der Produktionsumgebung automatisch anzuhängen.
- Verbesserte Konsistenz und Funktionalität zwischen beiden Umgebungen, 404-Fehler in Produktion behoben.
2024-10-25 11:21:56 +02:00

46 lines
1.4 KiB
JavaScript

"use client"; // app/wait/page.jsx
import { useEffect } from "react";
import { useRouter } from "next/navigation";
import { ClipLoader } from "react-spinners";
// IndexedDB functions only in the browser
let storePage, getPage;
if (typeof window !== "undefined") {
const indexedDBModule = require("../utils/indexedDB");
storePage = indexedDBModule.storePage;
getPage = indexedDBModule.getPage;
}
export default function WaitPage() {
const router = useRouter();
useEffect(() => {
// Store the page as a Blob in IndexedDB in the background
if (typeof window !== "undefined" && storePage) {
const pageContent = `
<div style="text-align: center; margin-top: 100px;">
<h1>Bitte warten...</h1>
<div class="spinner"></div>
<p>Die Seite wird automatisch neu geladen.</p>
</div>`;
storePage("waitPage", new Blob([pageContent], { type: "text/html" }));
}
// Timer to redirect after 20 seconds
const timer = setTimeout(() => {
router.push("/");
}, 20000);
// Cleanup timer when component is unmounted
return () => clearTimeout(timer);
}, [router]);
return (
<div style={{ textAlign: "center", marginTop: "100px" }}>
<h1>Bitte warten...</h1>
<ClipLoader color={"#76c7c0"} size={50} /> {/* Spinner */}
<p>Die Seite wird automatisch neu geladen.</p>
</div>
);
}