Mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2025-02-02 06:06:41 +01:00
Code Issues Projects Releases Packages Wiki Activity

Use v2 notifications policy API and new UI

Browse source 
Reference: https://github.com/mastodon/mastodon/pull/31342

Very MVP, not a lot of explanations. Maybe revisit later.
This commit is contained in:
Lim Chee Aun 2024-08-14 20:12:39 +08:00
parent b1a8f1aa8f
commit 59f8f44776
4 changed files with 132 additions and 106 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/index.css
View file

@ -389,7 +389,7 @@ textarea:disabled {
width: 100%; width: 100%;
} }
:is(button, .button).small { :is(button, .button, select).small {
font-size: 90%; font-size: 90%;
padding: 4px 8px; padding: 4px 8px;
} }

103
src/locales/en.po
View file

@ -424,8 +424,8 @@ msgstr ""
#: src/pages/catchup.jsx:1548 #: src/pages/catchup.jsx:1548
#: src/pages/filters.jsx:224 #: src/pages/filters.jsx:224
#: src/pages/list.jsx:274 #: src/pages/list.jsx:274
#: src/pages/notifications.jsx:823 #: src/pages/notifications.jsx:840
#: src/pages/notifications.jsx:1055 #: src/pages/notifications.jsx:1051
#: src/pages/settings.jsx:69 #: src/pages/settings.jsx:69
#: src/pages/status.jsx:1256 #: src/pages/status.jsx:1256
msgid "Close" msgid "Close"
@ -499,7 +499,7 @@ msgstr ""
#: src/components/list-add-edit.jsx:147 #: src/components/list-add-edit.jsx:147
#: src/components/shortcuts-settings.jsx:712 #: src/components/shortcuts-settings.jsx:712
#: src/pages/filters.jsx:554 #: src/pages/filters.jsx:554
#: src/pages/notifications.jsx:910 #: src/pages/notifications.jsx:906
msgid "Save" msgid "Save"
msgstr "" msgstr ""
@ -527,7 +527,7 @@ msgstr ""
#: src/pages/filters.jsx:89 #: src/pages/filters.jsx:89
#: src/pages/followed-hashtags.jsx:40 #: src/pages/followed-hashtags.jsx:40
#: src/pages/home.jsx:52 #: src/pages/home.jsx:52
#: src/pages/notifications.jsx:488 #: src/pages/notifications.jsx:505
msgid "Home" msgid "Home"
msgstr "" msgstr ""
@ -915,6 +915,7 @@ msgid "Open in new window"
msgstr "" msgstr ""
#: src/components/follow-request-buttons.jsx:42 #: src/components/follow-request-buttons.jsx:42
#: src/pages/notifications.jsx:890
msgid "Accept" msgid "Accept"
msgstr "" msgstr ""
@ -923,7 +924,7 @@ msgid "Reject"
msgstr "" msgstr ""
#: src/components/follow-request-buttons.jsx:75 #: src/components/follow-request-buttons.jsx:75
#: src/pages/notifications.jsx:1171 #: src/pages/notifications.jsx:1167
msgid "Accepted" msgid "Accepted"
msgstr "" msgstr ""
@ -946,7 +947,7 @@ msgstr ""
#: src/components/generic-accounts.jsx:205 #: src/components/generic-accounts.jsx:205
#: src/components/timeline.jsx:513 #: src/components/timeline.jsx:513
#: src/pages/list.jsx:293 #: src/pages/list.jsx:293
#: src/pages/notifications.jsx:803 #: src/pages/notifications.jsx:820
#: src/pages/search.jsx:454 #: src/pages/search.jsx:454
#: src/pages/status.jsx:1289 #: src/pages/status.jsx:1289
msgid "Show more…" msgid "Show more…"
@ -1207,8 +1208,8 @@ msgstr ""
#: src/pages/filters.jsx:24 #: src/pages/filters.jsx:24
#: src/pages/home.jsx:83 #: src/pages/home.jsx:83
#: src/pages/home.jsx:183 #: src/pages/home.jsx:183
#: src/pages/notifications.jsx:89 #: src/pages/notifications.jsx:106
#: src/pages/notifications.jsx:492 #: src/pages/notifications.jsx:509
msgid "Notifications" msgid "Notifications"
msgstr "" msgstr ""
@ -2256,7 +2257,7 @@ msgstr ""
#: src/components/timeline.jsx:548 #: src/components/timeline.jsx:548
#: src/pages/home.jsx:212 #: src/pages/home.jsx:212
#: src/pages/notifications.jsx:779 #: src/pages/notifications.jsx:796
#: src/pages/status.jsx:945 #: src/pages/status.jsx:945
#: src/pages/status.jsx:1318 #: src/pages/status.jsx:1318
msgid "Try again" msgid "Try again"
@ -3013,113 +3014,125 @@ msgstr ""
msgid "Unable to load mentions." msgid "Unable to load mentions."
msgstr "" msgstr ""
#: src/pages/notifications.jsx:506 #: src/pages/notifications.jsx:97
#: src/pages/notifications.jsx:827 msgid "You don't follow"
msgstr ""
#: src/pages/notifications.jsx:98
msgid "Who don't follow you"
msgstr ""
#: src/pages/notifications.jsx:99
msgid "With a new account"
msgstr ""
#: src/pages/notifications.jsx:100
msgid "Who unsolicitedly private mention you"
msgstr ""
#: src/pages/notifications.jsx:101
msgid "Who are limited by server moderators"
msgstr ""
#: src/pages/notifications.jsx:523
#: src/pages/notifications.jsx:844
msgid "Notifications settings" msgid "Notifications settings"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:524 #: src/pages/notifications.jsx:541
msgid "New notifications" msgid "New notifications"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:535 #: src/pages/notifications.jsx:552
msgid "{0, plural, one {Announcement} other {Announcements}}" msgid "{0, plural, one {Announcement} other {Announcements}}"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:582 #: src/pages/notifications.jsx:599
#: src/pages/settings.jsx:1016 #: src/pages/settings.jsx:1016
msgid "Follow requests" msgid "Follow requests"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:587 #: src/pages/notifications.jsx:604
msgid "{0, plural, one {# follow request} other {# follow requests}}" msgid "{0, plural, one {# follow request} other {# follow requests}}"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:642 #: src/pages/notifications.jsx:659
msgid "{0, plural, one {Filtered notifications from # person} other {Filtered notifications from # people}}" msgid "{0, plural, one {Filtered notifications from # person} other {Filtered notifications from # people}}"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:708 #: src/pages/notifications.jsx:725
msgid "Only mentions" msgid "Only mentions"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:712 #: src/pages/notifications.jsx:729
msgid "Today" msgid "Today"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:716 #: src/pages/notifications.jsx:733
msgid "You're all caught up." msgid "You're all caught up."
msgstr "" msgstr ""
#: src/pages/notifications.jsx:739 #: src/pages/notifications.jsx:756
msgid "Yesterday" msgid "Yesterday"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:775 #: src/pages/notifications.jsx:792
msgid "Unable to load notifications" msgid "Unable to load notifications"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:854 #: src/pages/notifications.jsx:871
msgid "Notifications settings updated" msgid "Notifications settings updated"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:862 #: src/pages/notifications.jsx:879
msgid "Filter out notifications from people:" msgid "Filter out notifications from people:"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:872 #: src/pages/notifications.jsx:893
msgid "You don't follow" msgid "Filter"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:883 #: src/pages/notifications.jsx:896
msgid "Who don't follow you" msgid "Ignore"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:894 #: src/pages/notifications.jsx:969
msgid "With a new account"
msgstr ""
#: src/pages/notifications.jsx:905
msgid "Who unsolicitedly private mention you"
msgstr ""
#: src/pages/notifications.jsx:973
msgid "Updated <0>{0}</0>" msgid "Updated <0>{0}</0>"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:1041 #: src/pages/notifications.jsx:1037
msgid "View notifications from @{0}" msgid "View notifications from @{0}"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:1059 #: src/pages/notifications.jsx:1055
msgid "Notifications from @{0}" msgid "Notifications from @{0}"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:1123 #: src/pages/notifications.jsx:1119
msgid "Notifications from @{0} will not be filtered from now on." msgid "Notifications from @{0} will not be filtered from now on."
msgstr "" msgstr ""
#: src/pages/notifications.jsx:1128 #: src/pages/notifications.jsx:1124
msgid "Unable to accept notification request" msgid "Unable to accept notification request"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:1133 #: src/pages/notifications.jsx:1129
msgid "Allow" msgid "Allow"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:1153 #: src/pages/notifications.jsx:1149
msgid "Notifications from @{0} will not show up in Filtered notifications from now on." msgid "Notifications from @{0} will not show up in Filtered notifications from now on."
msgstr "" msgstr ""
#: src/pages/notifications.jsx:1158 #: src/pages/notifications.jsx:1154
msgid "Unable to dismiss notification request" msgid "Unable to dismiss notification request"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:1163 #: src/pages/notifications.jsx:1159
msgid "Dismiss" msgid "Dismiss"
msgstr "" msgstr ""
#: src/pages/notifications.jsx:1178 #: src/pages/notifications.jsx:1174
msgid "Dismissed" msgid "Dismissed"
msgstr "" msgstr ""

17
src/pages/notifications.css
View file

@ -560,9 +560,26 @@
display: flex; display: flex;
gap: 8px; gap: 8px;
align-items: center; align-items: center;
justify-content: space-between;
input[type='checkbox'] { input[type='checkbox'] {
flex-shrink: 0; flex-shrink: 0;
} }
} }
.notification-policy-fields {
display: flex;
flex-direction: column;
gap: 8px;
select:has(option[value='accept']:checked) {
box-shadow: 0 0 0 2px var(--green-color);
}
select:has(option[value='filter']:checked) {
box-shadow: 0 0 0 2px var(--orange-color);
}
select:has(option[value='drop']:checked) {
box-shadow: 0 0 0 2px var(--red-color);
}
}
} }

116
src/pages/notifications.jsx
View file

@ -1,6 +1,7 @@
import './notifications.css'; import './notifications.css';
import { Plural, t, Trans } from '@lingui/macro'; import { msg, Plural, t, Trans } from '@lingui/macro';
import { useLingui } from '@lingui/react';
import { Fragment } from 'preact'; import { Fragment } from 'preact';
import { memo } from 'preact/compat'; import { memo } from 'preact/compat';
import { useCallback, useEffect, useRef, useState } from 'preact/hooks'; import { useCallback, useEffect, useRef, useState } from 'preact/hooks';
@ -85,7 +86,23 @@ export function getGroupedNotifications(notifications) {
} }
} }
const NOTIFICATIONS_POLICIES = [
'forNotFollowing',
'forNotFollowers',
'forNewAccounts',
'forPrivateMentions',
'forLimitedAccounts',
];
const NOTIFICATIONS_POLICIES_TEXT = {
forNotFollowing: msg`You don't follow`,
forNotFollowers: msg`Who don't follow you`,
forNewAccounts: msg`With a new account`,
forPrivateMentions: msg`Who unsolicitedly private mention you`,
forLimitedAccounts: msg`Who are limited by server moderators`,
};
function Notifications({ columnMode }) { function Notifications({ columnMode }) {
const { _ } = useLingui();
useTitle(t`Notifications`, '/notifications'); useTitle(t`Notifications`, '/notifications');
const { masto, instance } = api(); const { masto, instance } = api();
const snapStates = useSnapshot(states); const snapStates = useSnapshot(states);
@ -222,7 +239,7 @@ function Notifications({ columnMode }) {
useState(false); useState(false);
const [notificationsPolicy, setNotificationsPolicy] = useState({}); const [notificationsPolicy, setNotificationsPolicy] = useState({});
function fetchNotificationsPolicy() { function fetchNotificationsPolicy() {
return masto.v1.notifications.policy.fetch().catch(() => {}); return masto.v2.notifications.policy.fetch().catch(() => {});
} }
function loadNotificationsPolicy() { function loadNotificationsPolicy() {
fetchNotificationsPolicy() fetchNotificationsPolicy()
@ -832,25 +849,25 @@ function Notifications({ columnMode }) {
onSubmit={(e) => { onSubmit={(e) => {
e.preventDefault(); e.preventDefault();
const { const {
filterNotFollowing, forNotFollowing,
filterNotFollowers, forNotFollowers,
filterNewAccounts, forNewAccounts,
filterPrivateMentions, forPrivateMentions,
forLimitedAccounts,
} = e.target; } = e.target;
const allFilters = { const newPolicy = {
filterNotFollowing: filterNotFollowing.checked,
filterNotFollowers: filterNotFollowers.checked,
filterNewAccounts: filterNewAccounts.checked,
filterPrivateMentions: filterPrivateMentions.checked,
};
setNotificationsPolicy({
...notificationsPolicy, ...notificationsPolicy,
...allFilters, forNotFollowing: forNotFollowing.value,
}); forNotFollowers: forNotFollowers.value,
forNewAccounts: forNewAccounts.value,
forPrivateMentions: forPrivateMentions.value,
forLimitedAccounts: forLimitedAccounts.value,
};
setNotificationsPolicy(newPolicy);
setShowNotificationsSettings(false); setShowNotificationsSettings(false);
(async () => { (async () => {
try { try {
await masto.v1.notifications.policy.update(allFilters); await masto.v2.notifications.policy.update(newPolicy);
showToast(t`Notifications settings updated`); showToast(t`Notifications settings updated`);
} catch (e) { } catch (e) {
console.error(e); console.error(e);
@ -861,50 +878,29 @@ function Notifications({ columnMode }) {
<p> <p>
<Trans>Filter out notifications from people:</Trans> <Trans>Filter out notifications from people:</Trans>
</p> </p>
<p> <div class="notification-policy-fields">
<label> {NOTIFICATIONS_POLICIES.map((key) => {
<input const value = notificationsPolicy[key];
type="checkbox" return (
switch <div key={key}>
defaultChecked={notificationsPolicy.filterNotFollowing} <label>
name="filterNotFollowing" {_(NOTIFICATIONS_POLICIES_TEXT[key])}
/>{' '} <select name={key} defaultValue={value} class="small">
<Trans>You don't follow</Trans> <option value="accept">
</label> <Trans>Accept</Trans>
</p> </option>
<p> <option value="filter">
<label> <Trans>Filter</Trans>
<input </option>
type="checkbox" <option value="drop">
switch <Trans>Ignore</Trans>
defaultChecked={notificationsPolicy.filterNotFollowers} </option>
name="filterNotFollowers" </select>
/>{' '} </label>
<Trans>Who don't follow you</Trans> </div>
</label> );
</p> })}
<p> </div>
<label>
<input
type="checkbox"
switch
defaultChecked={notificationsPolicy.filterNewAccounts}
name="filterNewAccounts"
/>{' '}
<Trans>With a new account</Trans>
</label>
</p>
<p>
<label>
<input
type="checkbox"
switch
defaultChecked={notificationsPolicy.filterPrivateMentions}
name="filterPrivateMentions"
/>{' '}
<Trans>Who unsolicitedly private mention you</Trans>
</label>
</p>
<p> <p>
<button type="submit"> <button type="submit">
<Trans>Save</Trans> <Trans>Save</Trans>