From 357c942f9fe62723d67183db4de4ab7392e9a79b Mon Sep 17 00:00:00 2001 From: Nevo David Date: Wed, 1 Jan 2025 01:54:01 +0700 Subject: [PATCH] feat: interval --- .../src/components/launches/calendar.tsx | 31 +++++++++++++++++-- 1 file changed, 28 insertions(+), 3 deletions(-) diff --git a/apps/frontend/src/components/launches/calendar.tsx b/apps/frontend/src/components/launches/calendar.tsx index ada2d2b6..e067b269 100644 --- a/apps/frontend/src/components/launches/calendar.tsx +++ b/apps/frontend/src/components/launches/calendar.tsx @@ -1,6 +1,13 @@ 'use client'; -import React, { FC, Fragment, useCallback, useMemo } from 'react'; +import React, { + FC, + Fragment, + useCallback, + useEffect, + useMemo, + useState, +} from 'react'; import { CalendarContext, Integrations, @@ -23,11 +30,12 @@ import { IntegrationContext } from '@gitroom/frontend/components/launches/helper import { PreviewPopup } from '@gitroom/frontend/components/marketplace/special.message'; import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'; import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'; -import { groupBy, sortBy } from 'lodash'; +import { groupBy, random, sortBy } from 'lodash'; import Image from 'next/image'; import { extend } from 'dayjs'; import { isUSCitizen } from './helpers/isuscitizen.utils'; import removeMd from 'remove-markdown'; +import { useInterval } from '@mantine/hooks'; extend(isSameOrAfter); extend(isSameOrBefore); @@ -258,6 +266,8 @@ export const CalendarColumn: FC<{ randomHour?: boolean; }> = (props) => { const { getDate, randomHour } = props; + const [num, setNum] = useState(0); + const user = useUser(); const { integrations, @@ -299,7 +309,22 @@ export const CalendarColumn: FC<{ const isBeforeNow = useMemo(() => { return getDate.startOf('hour').isBefore(dayjs().startOf('hour')); - }, [getDate]); + }, [getDate, num]); + + const { start, stop } = useInterval(useCallback(() => { + if (isBeforeNow) { + return ; + } + setNum(num + 1); + }, [isBeforeNow]), random(120000, 150000)); + + useEffect(() => { + start(); + + return () => { + stop(); + }; + }, []); const [{ canDrop }, drop] = useDrop(() => ({ accept: 'post',