From eae627807b3df85b840828868ec0d615fc7ea072 Mon Sep 17 00:00:00 2001
From: Max Leiter <maxwell.leiter@gmail.com>
Date: Wed, 30 Mar 2022 23:30:01 -0700
Subject: [PATCH] client: expiration styling improvements

---
 .../badges/expiration-badge/index.tsx          | 18 +++++++++---------
 client/components/post-page/index.tsx          |  5 ++---
 client/pages/expired.tsx                       |  2 +-
 3 files changed, 12 insertions(+), 13 deletions(-)

diff --git a/client/components/badges/expiration-badge/index.tsx b/client/components/badges/expiration-badge/index.tsx
index 09f620a8..62655ae8 100644
--- a/client/components/badges/expiration-badge/index.tsx
+++ b/client/components/badges/expiration-badge/index.tsx
@@ -4,7 +4,7 @@ import { useCallback, useEffect, useMemo, useState } from "react";
 
 const ExpirationBadge = ({
     postExpirationDate,
-    onExpires
+    // onExpires
 }: {
     postExpirationDate: Date | string | null
     onExpires?: () => void
@@ -33,14 +33,14 @@ const ExpirationBadge = ({
         return timeUntilString && timeUntilString === "in 0 seconds"
     }, [timeUntilString])
 
-    useEffect(() => {
-        // check if expired every 
-        if (isExpired) {
-            if (onExpires) {
-                onExpires();
-            }
-        }
-    }, [isExpired, onExpires])
+    // useEffect(() => {
+    //     // check if expired every 
+    //     if (isExpired) {
+    //         if (onExpires) {
+    //             onExpires();
+    //         }
+    //     }
+    // }, [isExpired, onExpires])
 
     if (!expirationDate) {
         return null;
diff --git a/client/components/post-page/index.tsx b/client/components/post-page/index.tsx
index 087c2d85..ef6d3d5c 100644
--- a/client/components/post-page/index.tsx
+++ b/client/components/post-page/index.tsx
@@ -94,12 +94,11 @@ const PostPage = ({ post }: Props) => {
                             }}>
                             <VisibilityBadge visibility={post.visibility} />
                             <CreatedAgoBadge createdAt={post.createdAt} />
-                            <ExpirationBadge onExpires={onExpires} postExpirationDate={post.expiresAt} />
+                            <ExpirationBadge postExpirationDate={post.expiresAt} />
                         </ButtonGroup>
                     </span>
                     <span className={styles.buttons}>
-                        {/* If it hasn't expired, the badge can be too long */}
-                        <ButtonGroup vertical={isMobile || (post.expiresAt && !isExpired) ? true : false}>
+                        <ButtonGroup vertical={true}>
                             <Button auto onClick={download} icon={<Archive />}>
                                 Download as ZIP archive
                             </Button>
diff --git a/client/pages/expired.tsx b/client/pages/expired.tsx
index a1adcff5..aecb1fff 100644
--- a/client/pages/expired.tsx
+++ b/client/pages/expired.tsx
@@ -8,7 +8,7 @@ const Expired = () => {
             <Header />
             <Page.Content className={styles.main}>
                 <Note type="error" label={false}>
-                    <Text h4>Error: The drift you&apos;re trying to view has expired.</Text>
+                    <Text h4>Error: The Drift you&apos;re trying to view has expired.</Text>
                 </Note>
 
             </Page.Content>