cc/CoastalCommitsPastes
cc/CoastalCommitsPastes
3
1
Fork 0
forked from CoastalCommitsArchival/github.com-MaxLeiter-drift
Code Pull requests Activity Actions

client: expiration styling improvements

Browse source
This commit is contained in:
Max Leiter 2022-03-30 23:30:01 -07:00
parent 8291010f26
commit eae627807b
WARNING! Although there is a key with this ID in the database it does not verify this commit! This commit is SUSPICIOUS.
GPG key ID: A3512F2F2F17EBDA
3 changed files with 12 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
client/components/badges/expiration-badge/index.tsx
View file

@ -4,7 +4,7 @@ import { useCallback, useEffect, useMemo, useState } from "react";
const ExpirationBadge = ({ const ExpirationBadge = ({
postExpirationDate, postExpirationDate,
onExpires // onExpires
}: { }: {
postExpirationDate: Date | string | null postExpirationDate: Date | string | null
onExpires?: () => void onExpires?: () => void
@ -33,14 +33,14 @@ const ExpirationBadge = ({
return timeUntilString && timeUntilString === "in 0 seconds" return timeUntilString && timeUntilString === "in 0 seconds"
}, [timeUntilString]) }, [timeUntilString])
useEffect(() => { // useEffect(() => {
// check if expired every // // check if expired every
if (isExpired) { // if (isExpired) {
if (onExpires) { // if (onExpires) {
onExpires(); // onExpires();
} // }
} // }
}, [isExpired, onExpires]) // }, [isExpired, onExpires])
if (!expirationDate) { if (!expirationDate) {
return null; return null;

5
client/components/post-page/index.tsx
View file

@ -94,12 +94,11 @@ const PostPage = ({ post }: Props) => {
}}> }}>
<VisibilityBadge visibility={post.visibility} /> <VisibilityBadge visibility={post.visibility} />
<CreatedAgoBadge createdAt={post.createdAt} /> <CreatedAgoBadge createdAt={post.createdAt} />
<ExpirationBadge onExpires={onExpires} postExpirationDate={post.expiresAt} /> <ExpirationBadge postExpirationDate={post.expiresAt} />
</ButtonGroup> </ButtonGroup>
</span> </span>
<span className={styles.buttons}> <span className={styles.buttons}>
{/* If it hasn't expired, the badge can be too long */} <ButtonGroup vertical={true}>
<ButtonGroup vertical={isMobile || (post.expiresAt && !isExpired) ? true : false}>
<Button auto onClick={download} icon={<Archive />}> <Button auto onClick={download} icon={<Archive />}>
Download as ZIP archive Download as ZIP archive
</Button> </Button>

2
client/pages/expired.tsx
View file

@ -8,7 +8,7 @@ const Expired = () => {
<Header /> <Header />
<Page.Content className={styles.main}> <Page.Content className={styles.main}>
<Note type="error" label={false}> <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> </Note>
</Page.Content> </Page.Content>