46 lines
1.4 KiB
TypeScript
46 lines
1.4 KiB
TypeScript
"use client";
|
|
|
|
import { type ReactNode, useState, useEffect } from "react";
|
|
import { RepoContext } from "@automerge/automerge-repo-react-hooks";
|
|
import type { Repo } from "@automerge/automerge-repo";
|
|
|
|
export default function Providers({ children }: { children: ReactNode }) {
|
|
const [repo, setRepo] = useState<Repo | null>(null);
|
|
const [error, setError] = useState<string | null>(null);
|
|
|
|
useEffect(() => {
|
|
let cleanup: (() => void) | undefined;
|
|
let handleBeforeUnload: (() => void) | undefined;
|
|
|
|
import("../lib/repo.js").then(({ getRepo, cleanupRepo }) => {
|
|
const r = getRepo();
|
|
setRepo(r);
|
|
cleanup = cleanupRepo;
|
|
|
|
handleBeforeUnload = () => {
|
|
r.networkSubsystem.adapters.forEach((adapter) => adapter.disconnect());
|
|
};
|
|
window.addEventListener("beforeunload", handleBeforeUnload);
|
|
}).catch(() => {
|
|
setError("Failed to initialize. Please refresh the page.");
|
|
});
|
|
|
|
return () => {
|
|
if (handleBeforeUnload) {
|
|
window.removeEventListener("beforeunload", handleBeforeUnload);
|
|
}
|
|
cleanup?.();
|
|
};
|
|
}, []);
|
|
|
|
if (error) {
|
|
return <div className="flex min-h-screen items-center justify-center text-red-500">{error}</div>;
|
|
}
|
|
|
|
if (!repo) {
|
|
return <div className="flex min-h-screen items-center justify-center text-gray-400">Loading...</div>;
|
|
}
|
|
|
|
return <RepoContext.Provider value={repo}>{children}</RepoContext.Provider>;
|
|
}
|