diff --git a/src/components/NotificationList/index.tsx b/src/components/NotificationList/index.tsx index 55a0ee0f..9e23b333 100644 --- a/src/components/NotificationList/index.tsx +++ b/src/components/NotificationList/index.tsx @@ -11,6 +11,7 @@ import { useEffect, useMemo, useRef, useState } from 'react' import { useTranslation } from 'react-i18next' import { FormattedTimestamp } from '../FormattedTimestamp' import UserAvatar from '../UserAvatar' +import PullToRefresh from 'react-simple-pull-to-refresh' const LIMIT = 50 @@ -18,6 +19,7 @@ export default function NotificationList() { const { t } = useTranslation() const { pubkey } = useNostr() const [timelineKey, setTimelineKey] = useState(undefined) + const [refreshCount, setRefreshCount] = useState(0) const [initialized, setInitialized] = useState(false) const [notifications, setNotifications] = useState([]) const [until, setUntil] = useState(dayjs().unix()) @@ -62,7 +64,7 @@ export default function NotificationList() { return () => { promise.then((closer) => closer?.()) } - }, [pubkey]) + }, [pubkey, refreshCount]) useEffect(() => { if (!initialized) return @@ -108,14 +110,24 @@ export default function NotificationList() { } return ( -
- {notifications.map((notification) => ( - - ))} -
- {until ?
{t('loading...')}
: t('no more notifications')} + + new Promise((resolve) => { + setRefreshCount((pre) => pre + 1) + setTimeout(resolve, 1000) + }) + } + pullingContent="" + > +
+ {notifications.map((notification) => ( + + ))} +
+ {until ?
{t('loading...')}
: t('no more notifications')} +
-
+ ) }