46 lines
1.4 KiB
JavaScript
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>
|
|
);
|
|
}
|