diff --git a/app/soapbox/actions/accounts.ts b/app/soapbox/actions/accounts.ts index 0b7f4e0cc..c3bc56557 100644 --- a/app/soapbox/actions/accounts.ts +++ b/app/soapbox/actions/accounts.ts @@ -946,7 +946,7 @@ const fetchBirthdayReminders = (month: number, day: number) => dispatch({ type: BIRTHDAY_REMINDERS_FETCH_REQUEST, day, month, id: me }); - api(getState).get('/api/v1/pleroma/birthdays', { params: { day, month } }).then(response => { + return api(getState).get('/api/v1/pleroma/birthdays', { params: { day, month } }).then(response => { dispatch(importFetchedAccounts(response.data)); dispatch({ type: BIRTHDAY_REMINDERS_FETCH_SUCCESS, diff --git a/app/soapbox/components/birthday-panel.tsx b/app/soapbox/components/birthday-panel.tsx index 2cc139357..8381203b9 100644 --- a/app/soapbox/components/birthday-panel.tsx +++ b/app/soapbox/components/birthday-panel.tsx @@ -1,30 +1,50 @@ import { OrderedSet as ImmutableOrderedSet } from 'immutable'; -import * as React from 'react'; +import React, { useRef } from 'react'; import { FormattedMessage } from 'react-intl'; -import { useDispatch } from 'react-redux'; import { fetchBirthdayReminders } from 'soapbox/actions/accounts'; import { Widget } from 'soapbox/components/ui'; import AccountContainer from 'soapbox/containers/account_container'; -import { useAppSelector } from 'soapbox/hooks'; +import { useAppDispatch, useAppSelector } from 'soapbox/hooks'; + +const timeToMidnight = () => { + const now = new Date(); + const midnight = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1, 0, 0, 0); + + return midnight.getTime() - now.getTime(); +}; interface IBirthdayPanel { limit: number } const BirthdayPanel = ({ limit }: IBirthdayPanel) => { - const dispatch = useDispatch(); + const dispatch = useAppDispatch(); const birthdays: ImmutableOrderedSet = useAppSelector(state => state.user_lists.birthday_reminders.get(state.me as string)?.items || ImmutableOrderedSet()); const birthdaysToRender = birthdays.slice(0, limit); - React.useEffect(() => { + const timeout = useRef(); + + const handleFetchBirthdayReminders = () => { const date = new Date(); const day = date.getDate(); const month = date.getMonth() + 1; - dispatch(fetchBirthdayReminders(month, day)); + dispatch(fetchBirthdayReminders(month, day))?.then(() => { + timeout.current = setTimeout(() => handleFetchBirthdayReminders(), timeToMidnight()); + }); + }; + + React.useEffect(() => { + handleFetchBirthdayReminders(); + + return () => { + if (timeout.current) { + clearTimeout(timeout.current); + } + }; }, []); if (birthdaysToRender.isEmpty()) {