Skip to content

Commit

Permalink
fix(WalletActivityRequirement): display before/after dates correctly
Browse files Browse the repository at this point in the history
  • Loading branch information
@dovalid
dovalid committed Sep 9, 2024
1 parent 4a57459 commit f651986
Show file tree
Hide file tree
Showing 2 changed files with 45 additions and 73 deletions.
33 changes: 33 additions & 0 deletions src/components/[guild]/Requirements/components/DataBlockWithDate.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,4 +16,37 @@ const DataBlockWithDate = ({ timestamp }: Props): JSX.Element => {
return <DataBlock>{formattedDate ?? "Invalid date"}</DataBlock>
}

export const BeforeAfterDates = ({
minTs,
maxTs,
}: { minTs?: number; maxTs?: number }) => {
if (maxTs && minTs === undefined)
return (
<>
{` before `}
<DataBlockWithDate timestamp={maxTs} />
</>
)

if (maxTs === undefined && minTs)
return (
<>
{` after `}
<DataBlockWithDate timestamp={minTs} />
</>
)

if (maxTs && minTs)
return (
<>
{` between `}
<DataBlockWithDate timestamp={minTs} />
{` and `}
<DataBlockWithDate timestamp={maxTs} />
</>
)

return null
}

export default DataBlockWithDate
85 changes: 12 additions & 73 deletions src/requirements/WalletActivity/WalletActivityRequirement.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import {
IconProps,
Wallet,
} from "@phosphor-icons/react"
import DataBlockWithDate from "components/[guild]/Requirements/components/DataBlockWithDate"
import { BeforeAfterDates } from "components/[guild]/Requirements/components/DataBlockWithDate"
import Requirement, {
RequirementProps,
} from "components/[guild]/Requirements/components/Requirement"
Expand All @@ -16,6 +16,7 @@ import DataBlock from "components/common/DataBlock"
import DataBlockWithCopy from "components/common/DataBlockWithCopy"
import { ForwardRefExoticComponent, RefAttributes } from "react"
import formatRelativeTimeFromNow from "utils/formatRelativeTimeFromNow"
import pluralize from "utils/pluralize"
import shortenHex from "utils/shortenHex"

const requirementIcons: Record<
Expand Down Expand Up @@ -47,36 +48,6 @@ const WalletActivityRequirement = (props: RequirementProps): JSX.Element => {
const maxAmount = requirement.data?.timestamps?.maxAmount
const minAmount = requirement.data?.timestamps?.minAmount

const getFirstTxContent = () => {
if (maxAmount && minAmount === undefined)
return (
<>
{`Have your first transaction before `}
<DataBlockWithDate timestamp={maxAmount} />
</>
)

if (maxAmount === undefined && minAmount)
return (
<>
{`Have your first transaction after `}
<DataBlockWithDate timestamp={minAmount} />
</>
)

if (maxAmount && minAmount)
return (
<>
{`Have your first transaction between `}
<DataBlockWithDate timestamp={minAmount} />
{` and `}
<DataBlockWithDate timestamp={maxAmount} />
</>
)

return <>Have at least one transaction</>
}

const getFirstTxRelativeContent = () => {
const formattedMin = formatRelativeTimeFromNow(minAmount)
const formattedMax = formatRelativeTimeFromNow(maxAmount)
Expand Down Expand Up @@ -122,35 +93,22 @@ const WalletActivityRequirement = (props: RequirementProps): JSX.Element => {
{(() => {
switch (requirement.type) {
case "COVALENT_FIRST_TX":
return getFirstTxContent()
if (!minAmount && !maxAmount) return "Have at least one transaction"
return (
<>
Have your first transaction
<BeforeAfterDates minTs={minAmount} maxTs={maxAmount} />
</>
)
case "COVALENT_FIRST_TX_RELATIVE":
return getFirstTxRelativeContent()
case "COVALENT_CONTRACT_DEPLOY":
return (
<>
{`Deployed ${
requirement.data.txCount > 1 ? requirement.data.txCount : "a"
} contract${requirement.data.txCount > 1 ? "s" : ""}`}
{requirement.data.timestamps.maxAmount &&
requirement.data.timestamps.minAmount ? (
<>
{" between "}
<DataBlockWithDate
timestamp={requirement.data.timestamps.minAmount}
/>
{" and "}
<DataBlockWithDate
timestamp={requirement.data.timestamps.maxAmount}
/>
</>
) : requirement.data.timestamps.minAmount ? (
<>
{" before "}
<DataBlockWithDate
timestamp={requirement.data.timestamps.minAmount}
/>
</>
) : null}
} ${pluralize(requirement.data.txCount, "contract", false)}`}
<BeforeAfterDates minTs={minAmount} maxTs={maxAmount} />
</>
)
case "COVALENT_CONTRACT_DEPLOY_RELATIVE": {
Expand Down Expand Up @@ -199,26 +157,7 @@ const WalletActivityRequirement = (props: RequirementProps): JSX.Element => {
</>
)}

{requirement.data.timestamps.maxAmount &&
requirement.data.timestamps.minAmount ? (
<>
{" between "}
<DataBlockWithDate
timestamp={requirement.data.timestamps.minAmount}
/>
{" and "}
<DataBlockWithDate
timestamp={requirement.data.timestamps.maxAmount}
/>
</>
) : requirement.data.timestamps.minAmount ? (
<>
{" before "}
<DataBlockWithDate
timestamp={requirement.data.timestamps.minAmount}
/>
</>
) : null}
<BeforeAfterDates minTs={minAmount} maxTs={maxAmount} />
</>
)
case "COVALENT_TX_COUNT_RELATIVE": {
Expand Down

0 comments on commit f651986

Please sign in to comment.