diff --git a/components/Grant/GrantInfo.tsx b/components/Grant/GrantInfo.tsx index 54db340fb..4bb94e82d 100644 --- a/components/Grant/GrantInfo.tsx +++ b/components/Grant/GrantInfo.tsx @@ -4,13 +4,13 @@ import { FC } from 'react'; import { CurrencyBadge } from '@/components/ui/CurrencyBadge'; import { Button } from '@/components/ui/Button'; import { AvatarStack } from '@/components/ui/AvatarStack'; -import { formatDate, isDeadlineInFuture } from '@/utils/date'; +import { isDeadlineInFuture } from '@/utils/date'; import { FeedGrantContent } from '@/types/feed'; import { useRouter } from 'next/navigation'; import { colors } from '@/app/styles/colors'; import { StatusCard } from '@/components/ui/StatusCard'; import { useCurrencyPreference } from '@/contexts/CurrencyPreferenceContext'; -import { Clock } from 'lucide-react'; +import { RollingDeadlineInfo } from '@/components/work/components/RollingDeadlineInfo'; interface GrantInfoProps { grant: FeedGrantContent; @@ -28,7 +28,6 @@ export const GrantInfo: FC = ({ grant, className, onFeedItemClic const isActive = grant.grant?.status === 'OPEN' && (grant.grant?.endDate ? isDeadlineInFuture(grant.grant?.endDate) : true); - const deadline = grant.grant.endDate ? formatDate(grant.grant.endDate) : undefined; const applicants = grant.grant.applicants?.map((applicant) => ({ @@ -90,14 +89,6 @@ export const GrantInfo: FC = ({ grant, className, onFeedItemClic shorten={false} /> - {/* Close date */} - {deadline && isActive && ( -
- - Closes {deadline} -
- )} - {/* Status badges */} {isActive && ( @@ -110,6 +101,9 @@ export const GrantInfo: FC = ({ grant, className, onFeedItemClic )} + {/* Rolling deadline */} + {isActive && } + {/* Applicants section */} {applicantCount > 0 && (
@@ -125,23 +122,8 @@ export const GrantDocument = ({ {isActive ? 'Accepting Applications' : 'Closed'}
- {/* Deadline and countdown - stack on mobile */} - {endDate && isActive && ( -
- - Closes {format(endDate, 'MMMM d, yyyy')} at {format(endDate, 'h:mm a')} - - {/* Show countdown when expiring soon */} - {expiringSoon && work.note?.post?.grant?.endDate && ( - <> -
- - {formatDeadline(work.note.post.grant.endDate)} - - - )} -
- )} + {/* Rolling deadline for open grants */} + {isActive && } {/* Closed grant deadline */} {!isActive && endDate && ( diff --git a/components/work/components/GrantStatusSection.tsx b/components/work/components/GrantStatusSection.tsx index 61cae974e..438d7e0fd 100644 --- a/components/work/components/GrantStatusSection.tsx +++ b/components/work/components/GrantStatusSection.tsx @@ -4,6 +4,7 @@ import { Work } from '@/types/work'; import { format } from 'date-fns'; import { Clock } from 'lucide-react'; import { isDeadlineInFuture } from '@/utils/date'; +import { RollingDeadlineInfo } from './RollingDeadlineInfo'; interface GrantStatusSectionProps { work: Work; @@ -37,17 +38,8 @@ export const GrantStatusSection = ({ work }: GrantStatusSectionProps) => { /> {isActive ? 'Accepting Applications' : 'Closed'}
- {/* Deadline information for open grants */} - {isActive && ( -
-
- - - Closes {format(endDate, 'MMMM d, yyyy')} at {format(endDate, 'h:mm a')} - -
-
- )} + {/* Rolling deadline for open grants */} + {isActive && } {!isActive && (
diff --git a/components/work/components/RollingDeadlineInfo.tsx b/components/work/components/RollingDeadlineInfo.tsx new file mode 100644 index 000000000..f7a50c29d --- /dev/null +++ b/components/work/components/RollingDeadlineInfo.tsx @@ -0,0 +1,53 @@ +'use client'; + +import { Info } from 'lucide-react'; +import { Tooltip } from '@/components/ui/Tooltip'; +import { cn } from '@/utils/styles'; + +interface RollingDeadlineInfoProps { + className?: string; + variant?: 'default' | 'compact'; + iconPosition?: 'left' | 'right'; +} + +const tooltipContent = ( +
+

+ Applications are reviewed on an ongoing basis and may be funded at any time. +

+
+); + +export const RollingDeadlineInfo = ({ + className, + variant = 'default', + iconPosition = 'right', +}: RollingDeadlineInfoProps) => { + const isCompact = variant === 'compact'; + const infoTrigger = ( + + + + ); + + return ( +
+ {iconPosition === 'left' && infoTrigger} + Rolling Deadline + {iconPosition === 'right' && infoTrigger} +
+ ); +};