From 8291010f26c3cdc383c3146d9deed4b3060f0429 Mon Sep 17 00:00:00 2001
From: Max Leiter <maxwell.leiter@gmail.com>
Date: Wed, 30 Mar 2022 23:27:09 -0700
Subject: [PATCH] client: don't flash page after it's expired

---
 client/components/post-page/index.tsx | 24 ++++++++++++++----------
 1 file changed, 14 insertions(+), 10 deletions(-)

diff --git a/client/components/post-page/index.tsx b/client/components/post-page/index.tsx
index 23190fa3..087c2d85 100644
--- a/client/components/post-page/index.tsx
+++ b/client/components/post-page/index.tsx
@@ -26,8 +26,17 @@ const PostPage = ({ post }: Props) => {
 
     const isMobile = useMediaQuery("mobile")
     const [isExpired, setIsExpired] = useState(post.expiresAt ? new Date(post.expiresAt) < new Date() : null)
-
+    const [isLoading, setIsLoading] = useState(true)
     useEffect(() => {
+        const isOwner = post.users ? post.users[0].id === Cookies.get("drift-userid") : false
+
+        const expirationDate = new Date(post.expiresAt ? post.expiresAt : "")
+        if (!isOwner && expirationDate < new Date()) {
+            router.push("/expired")
+        } else {
+            setIsLoading(false)
+        }
+
         let interval: NodeJS.Timer | null = null;
         if (post.expiresAt) {
             interval = setInterval(() => {
@@ -38,16 +47,8 @@ const PostPage = ({ post }: Props) => {
         return () => {
             if (interval) clearInterval(interval)
         }
-    }, [post.expiresAt])
+    }, [post.expiresAt, post.users, router])
 
-    const onExpires = useCallback(() => {
-        const isOwner = post.users ? post.users[0].id === Cookies.get("drift-userid") : false
-
-        if (isExpired && !isOwner) {
-            router.push("/expired")
-            return <></>
-        }
-    }, [isExpired, post.users, router])
 
     const download = async () => {
         const downloadZip = (await import("client-zip")).downloadZip
@@ -65,6 +66,9 @@ const PostPage = ({ post }: Props) => {
         link.remove()
     }
 
+    if (isLoading) {
+        return <></>
+    }
 
     return (
         <Page width={"100%"}>