From 961d8e35fabab2f767f2f3e9d1d52e8c5cdefaa8 Mon Sep 17 00:00:00 2001 From: Marcus Date: Wed, 4 Dec 2024 19:09:37 -0800 Subject: [PATCH] partial new notification fix --- src/features/mutual_checker.js | 12 +++++------- src/features/notificationblock.js | 8 +++++++- src/features/quote_replies.css | 4 +++- src/features/quote_replies.js | 9 ++++++--- src/utils/interface.js | 2 +- 5 files changed, 22 insertions(+), 13 deletions(-) diff --git a/src/features/mutual_checker.js b/src/features/mutual_checker.js index cb6614c62..ee43df7e9 100644 --- a/src/features/mutual_checker.js +++ b/src/features/mutual_checker.js @@ -1,4 +1,4 @@ -import { buildStyle, getTimelineItemWrapper, filterPostElements, getPopoverWrapper } from '../utils/interface.js'; +import { buildStyle, getTimelineItemWrapper, filterPostElements, getPopoverWrapper, notificationSelector } from '../utils/interface.js'; import { blogData, notificationObject, timelineObject } from '../utils/react_props.js'; import { apiFetch } from '../utils/tumblr_helpers.js'; import { primaryBlogName } from '../utils/user.js'; @@ -14,7 +14,7 @@ const hiddenAttribute = 'data-mutual-checker-hidden'; const mutualsClass = 'from-mutual'; const postAttributionSelector = `header ${keyToCss('attribution')} a:not(${keyToCss('reblogAttribution', 'rebloggedFromName')} *)`; -const onlyMutualsStyleElement = buildStyle(`${keyToCss('notification')}:not([data-mutuals]) { display: none !important; }`); +const onlyMutualsStyleElement = buildStyle(`${notificationSelector}:not([data-mutuals]) { display: none !important; }`); const regularPath = 'M593 500q0-45-22.5-64.5T500 416t-66.5 19-18.5 65 18.5 64.5T500 583t70.5-19 22.5-64zm-90 167q-44 0-83.5 18.5t-63 51T333 808v25h334v-25q0-39-22-71.5t-59.5-51T503 667zM166 168l14-90h558l12-78H180q-8 0-51 63l-42 63v209q-19 3-52 3t-33-3q-1 1 0 27 3 53 0 53l32-2q35-1 53 2v258H2l-3 40q-2 41 3 41 42 0 64-1 7-1 21 1v246h756q25 0 42-13 14-10 22-27 5-13 8-28l1-13V275q0-47-3-63-5-24-22.5-34T832 168H166zm667 752H167V754q17 0 38.5-6.5T241 730q16-12 16-26 0-21-33-28-19-4-57-4-3 0-1-51 2-37 1-36V421q88 0 90-48 1-20-33-30-24-6-57-6-4 0-2-44l2-43h635q14 0 22.5 11t8.5 26v543q0 5 4 26 5 30 5 42 1 22-9 22z'; const aprilFoolsPath = 'M858 352q-6-14-8-35-2-12-4-38-3-38-6-54-7-28-22-43t-43-22q-16-3-54-6-26-2-38-4-21-2-34.5-8T619 124q-9-7-28-24-29-25-44-34-24-16-47-16t-47 16q-15 9-44 34-19 17-28 24-16 12-29.5 18t-34.5 8q-12 2-38 4-38 3-54 6-28 7-43 22t-22 43q-3 16-6 54-2 26-4 38-2 21-8 34.5T124 381q-7 9-24 28-25 29-34 44-16 24-16 47t16 47q9 15 34 44 17 19 24 28 12 16 18 29.5t8 34.5q2 12 4 38 3 38 6 54 7 28 22 43t43 22q16 3 54 6 26 2 38 4 21 2 34.5 8t29.5 18q9 7 28 24 29 25 44 34 24 16 47 16t47-16q15-9 44-34 19-17 28-24 16-12 29.5-18t34.5-8q12-2 38-4 38-3 54-6 28-7 43-22t22-43q3-16 6-54 2-26 4-38 2-21 8-34.5t18-29.5q7-9 24-28 25-29 34-44 16-24 16-47t-16-47q-9-15-34-44-17-19-24-28-12-16-18-29zm-119 62L550 706q-10 17-26.5 27T488 745l-11 1q-34 0-59-24L271 584q-26-25-27-60.5t23.5-61.5 60.5-27.5 62 23.5l71 67 132-204q20-30 55-38t65 11.5 37.5 54.5-11.5 65z'; @@ -57,11 +57,9 @@ const styleElement = buildStyle(` const processNotifications = (notificationElements) => { notificationElements.forEach(async notificationElement => { const notification = await notificationObject(notificationElement); - if (notification) { - const { mutuals } = notification; - if (mutuals) { - notificationElement.dataset.mutuals = mutuals; - } + + if (notification?.mutuals || notification?.title?.relationshipLabel === 'mutuals') { + notificationElement.setAttribute('data-mutuals', ''); } }); }; diff --git a/src/features/notificationblock.js b/src/features/notificationblock.js index e3ec8b09d..97b000b30 100644 --- a/src/features/notificationblock.js +++ b/src/features/notificationblock.js @@ -23,9 +23,15 @@ const buildCss = () => `:is(${blockedPostTargetIDs.map(rootId => `[data-target-r const processNotifications = (notificationElements) => { notificationElements.forEach(async notificationElement => { const notification = await notificationObject(notificationElement); - if (notification !== undefined) { + if (notification?.targetRootPostId || notification?.targetPostId) { const { targetRootPostId, targetPostId } = notification; notificationElement.dataset.targetRootPostId = targetRootPostId || targetPostId; + } else if (notification?.actions) { + // const postId = notification.actions.longTap.meta.postId; + const postId = Object.values(notification.actions).map(action => action?.meta?.postId).find(Boolean); + + console.log(postId); + // hm. I guess we do an api fetch here now. } }); }; diff --git a/src/features/quote_replies.css b/src/features/quote_replies.css index 43e041056..f38f96ae1 100644 --- a/src/features/quote_replies.css +++ b/src/features/quote_replies.css @@ -34,7 +34,9 @@ button.xkit-quote-replies-dropdown { transform: scale(0); } - :is(:hover, :focus-within) > button.xkit-quote-replies svg { + /* temporary. this probably needs keyToCss */ + [aria-label="Notification"]:is(:hover, :focus-within) button.xkit-quote-replies svg, + [aria-label="Notification"]:is(:hover, :focus-within) + div button.xkit-quote-replies svg { opacity: 1; transform: scale(1); } diff --git a/src/features/quote_replies.js b/src/features/quote_replies.js index ae0403101..c06c26f8d 100644 --- a/src/features/quote_replies.js +++ b/src/features/quote_replies.js @@ -16,7 +16,7 @@ const dropdownButtonClass = 'xkit-quote-replies-dropdown'; const originalPostTagStorageKey = 'quick_tags.preferences.originalPostTag'; -const activitySelector = `${keyToCss('notification')} > ${keyToCss('activity')}`; +const activitySelector = `:is(${keyToCss('notification')} > ${keyToCss('activity')}, ${keyToCss('activityContent')})`; const dropdownSelector = '[role="tabpanel"] *'; @@ -31,7 +31,10 @@ const processNotifications = notifications => notifications.forEach(async notifi notification ); - if (!['reply', 'reply_to_comment', 'note_mention'].includes(notificationProps.type)) return; + console.log(notificationProps.type === 'generic' ? notificationProps.subtype : notificationProps.type); + + if (!['reply', 'reply_to_comment', 'note_mention'].includes(notificationProps.type === 'generic' ? notificationProps.subtype : notificationProps.type)) return; + // need a new way to determine this! if (notificationProps.community) return; const activityElement = notification.querySelector(activitySelector); @@ -46,7 +49,7 @@ const processNotifications = notifications => notifications.forEach(async notifi { click () { this.disabled = true; - quoteReply(tumblelogName, notificationProps) + quoteReply(tumblelogName /* how do we get this information now? */) .catch(showErrorModal) .finally(() => { this.disabled = false; }); } diff --git a/src/utils/interface.js b/src/utils/interface.js index 86b67680b..1dfe202fd 100644 --- a/src/utils/interface.js +++ b/src/utils/interface.js @@ -4,7 +4,7 @@ import { timelineSelector } from './timeline_id.js'; export const postSelector = '[tabindex="-1"][data-id]'; export const blogViewSelector = '[style*="--blog-title-color"] *'; -export const notificationSelector = `${keyToCss('notification')}[role="listitem"]`; +export const notificationSelector = `:is(${keyToCss('notification')}[role="listitem"], ${keyToCss('activityItem')})`; const listTimelineObjectSelector = keyToCss('listTimelineObject'); const cellSelector = keyToCss('cell');