diff --git a/components/composed/AccountDropdown/PreviewModeButton.tsx b/components/composed/AccountDropdown/PreviewModeButton.tsx index 30089109..ef507ba1 100644 --- a/components/composed/AccountDropdown/PreviewModeButton.tsx +++ b/components/composed/AccountDropdown/PreviewModeButton.tsx @@ -1,6 +1,6 @@ "use client"; -import { useTransition } from "react"; +import { useTransition, useEffect, useRef } from "react"; import { useDropdownContext } from "@/components/atomic/BaseDropdown/BaseDropdown"; import { useProgress } from "@/lib/vendor/react-transition-progress"; import { Link } from "@/components/atomic"; @@ -8,10 +8,10 @@ import { enterPreviewMode } from "./actions"; export default function PreviewModeButton({ label }: { label: string }) { const dropdown = useDropdownContext(); - const startProgress = useProgress(); - const [, startTransition] = useTransition(); + const [isPending, startTransition] = useTransition(); + const pendingRef = useRef(false); const handleClick = () => { dropdown?.hide(); @@ -19,11 +19,21 @@ export default function PreviewModeButton({ label }: { label: string }) { startTransition(async () => { startProgress(); await enterPreviewMode(); - // Hard reload rather than router.refresh() to recover from notFound() - window.location.reload(); }); }; + useEffect(() => { + if (isPending && !pendingRef.current) { + pendingRef.current = true; + return; + } + if (!isPending && pendingRef.current) { + pendingRef.current = false; + window.location.reload(); + return; + } + }, [isPending]); + return ( {label} diff --git a/components/composed/AccountDropdown/actions.ts b/components/composed/AccountDropdown/actions.ts index fe8d0955..14d15e0e 100644 --- a/components/composed/AccountDropdown/actions.ts +++ b/components/composed/AccountDropdown/actions.ts @@ -1,7 +1,6 @@ "use server"; import { draftMode } from "next/headers"; -import { revalidatePath } from "next/cache"; import joinURL from "url-join"; import { auth, @@ -21,7 +20,6 @@ export async function signIn() { export async function enterPreviewMode() { (await draftMode()).enable(); - revalidatePath("/", "layout"); } export async function signOut() {