Shazam the filtered notifications

This commit is contained in:
Lim Chee Aun 2024-03-27 10:18:34 +08:00
parent e3591514a1
commit 66e58c74ef

View file

@ -532,66 +532,72 @@ function Notifications({ columnMode }) {
)} )}
{supportsFilteredNotifications && {supportsFilteredNotifications &&
notificationsPolicy?.summary?.pendingRequestsCount > 0 && ( notificationsPolicy?.summary?.pendingRequestsCount > 0 && (
<div class="filtered-notifications"> <div class="shazam-container">
<details <div class="shazam-container-inner">
onToggle={async (e) => { <div class="filtered-notifications">
const { open } = e.target; <details
if (open) { onToggle={async (e) => {
const requests = await fetchNotificationsRequest(); const { open } = e.target;
setNotificationsRequests(requests); if (open) {
console.log({ open, requests }); const requests = await fetchNotificationsRequest();
} setNotificationsRequests(requests);
}} console.log({ open, requests });
> }
<summary> }}
Filtered notifications from{' '} >
{notificationsPolicy.summary.pendingRequestsCount} people <summary>
</summary> Filtered notifications from{' '}
{!notificationsRequests ? ( {notificationsPolicy.summary.pendingRequestsCount} people
<p class="ui-state"> </summary>
<Loader abrupt /> {!notificationsRequests ? (
</p> <p class="ui-state">
) : ( <Loader abrupt />
notificationsRequests?.length > 0 && ( </p>
<ul> ) : (
{notificationsRequests.map((request) => ( notificationsRequests?.length > 0 && (
<li key={request.id}> <ul>
<div class="request-notifcations"> {notificationsRequests.map((request) => (
{!request.lastStatus?.id && ( <li key={request.id}>
<AccountBlock <div class="request-notifcations">
useAvatarStatic {!request.lastStatus?.id && (
showStats <AccountBlock
account={request.account} useAvatarStatic
/> showStats
)} account={request.account}
{request.lastStatus?.id && (
<div class="last-post">
<Link
class="status-link"
to={`/${instance}/s/${request.lastStatus.id}`}
>
<Status
status={request.lastStatus}
size="s"
readOnly
/> />
</Link> )}
{request.lastStatus?.id && (
<div class="last-post">
<Link
class="status-link"
to={`/${instance}/s/${request.lastStatus.id}`}
>
<Status
status={request.lastStatus}
size="s"
readOnly
/>
</Link>
</div>
)}
<NotificationRequestModalButton
request={request}
/>
</div> </div>
)} <NotificationRequestButtons
<NotificationRequestModalButton request={request} /> request={request}
</div> onChange={() => {
<NotificationRequestButtons loadNotifications(true);
request={request} }}
onChange={() => { />
loadNotifications(true); </li>
}} ))}
/> </ul>
</li> )
))} )}
</ul> </details>
) </div>
)} </div>
</details>
</div> </div>
)} )}
<div id="mentions-option"> <div id="mentions-option">