diff --git a/src/components/follow-request-buttons.jsx b/src/components/follow-request-buttons.jsx index a40ba534..112b2ac3 100644 --- a/src/components/follow-request-buttons.jsx +++ b/src/components/follow-request-buttons.jsx @@ -2,11 +2,17 @@ import { useState } from 'preact/hooks'; import { api } from '../utils/api'; +import Icon from './icon'; import Loader from './loader'; function FollowRequestButtons({ accountID, onChange }) { const { masto } = api(); const [uiState, setUIState] = useState('default'); + const [requestState, setRequestState] = useState(null); // accept, reject + const [relationship, setRelationship] = useState(null); + + const hasRelationship = relationship !== null; + return (

-

); } diff --git a/src/components/icon.jsx b/src/components/icon.jsx index 567e7688..6c2d3f5a 100644 --- a/src/components/icon.jsx +++ b/src/components/icon.jsx @@ -13,6 +13,7 @@ const ICONS = { heart: () => import('@iconify-icons/mingcute/heart-line'), bookmark: () => import('@iconify-icons/mingcute/bookmark-line'), 'check-circle': () => import('@iconify-icons/mingcute/check-circle-line'), + 'x-circle': () => import('@iconify-icons/mingcute/close-circle-line'), transfer: () => import('@iconify-icons/mingcute/transfer-4-line'), rocket: () => import('@iconify-icons/mingcute/rocket-line'), 'arrow-left': () => import('@iconify-icons/mingcute/arrow-left-line'), diff --git a/src/components/notification.jsx b/src/components/notification.jsx index 64bb1060..787a00b3 100644 --- a/src/components/notification.jsx +++ b/src/components/notification.jsx @@ -137,7 +137,7 @@ function Notification({ notification, instance, reload }) { { - reload(); + // reload(); }} /> )} diff --git a/src/pages/notifications.css b/src/pages/notifications.css index 20b69b38..b986018a 100644 --- a/src/pages/notifications.css +++ b/src/pages/notifications.css @@ -204,7 +204,19 @@ justify-content: flex-end; align-items: center; } -.follow-requests ul li .follow-request-buttons .loader-container { +.follow-request-buttons .follow-request-states { + vertical-align: middle; +} +.follow-request-buttons .follow-request-states .icon { + margin-inline: 8px; +} +.follow-request-buttons .follow-request-states .icon.follow-accepted { + color: var(--green-color); +} +.follow-request-buttons .follow-request-states .icon.follow-rejected { + color: var(--red-color); +} +.follow-requests ul li .follow-request-buttons .follow-request-states { order: -1; } diff --git a/src/pages/notifications.jsx b/src/pages/notifications.jsx index 03490828..2228d4fd 100644 --- a/src/pages/notifications.jsx +++ b/src/pages/notifications.jsx @@ -49,6 +49,7 @@ function Notifications() { // Reset iterator notificationsIterator.current = masto.v1.notifications.list({ limit: LIMIT, + excludeTypes: ['follow_request'], }); } const allNotifications = await notificationsIterator.current.next(); @@ -295,13 +296,13 @@ function Notifications() { {followRequests.length} follow requests