Fix notification target for some types (#1790)
## Ticket "1742 Notification popup: incorrect target" Commentron uses old links for some of the notification types. ## Change Factored out the code that determines the new target and use it both Notifications Page and Popup Menu.
This commit is contained in:
parent
02d017d415
commit
769b1cdabb
3 changed files with 68 additions and 46 deletions
|
@ -9,7 +9,6 @@ import Icon from 'component/common/icon';
|
|||
import NotificationBubble from 'component/notificationBubble';
|
||||
import React from 'react';
|
||||
import Tooltip from 'component/common/tooltip';
|
||||
import { formatLbryUrlForWeb } from 'util/url';
|
||||
import Notification from 'component/notification';
|
||||
import DateTime from 'component/dateTime';
|
||||
import ChannelThumbnail from 'component/channelThumbnail';
|
||||
|
@ -18,6 +17,7 @@ import Button from 'component/button';
|
|||
import ClickAwayListener from '@mui/material/ClickAwayListener';
|
||||
import { RULE } from 'constants/notifications';
|
||||
import UriIndicator from 'component/uriIndicator';
|
||||
import { getNotificationLink } from '../notification/helpers/target';
|
||||
import { generateNotificationTitle } from '../notification/helpers/title';
|
||||
import { generateNotificationText } from '../notification/helpers/text';
|
||||
import { parseURI } from 'util/lbryURI';
|
||||
|
@ -106,26 +106,18 @@ export default function NotificationHeaderButton(props: Props) {
|
|||
if (!notificationsEnabled) return null;
|
||||
|
||||
function handleNotificationClick(notification) {
|
||||
const { id, notification_parameters, is_read } = notification;
|
||||
const { id, is_read } = notification;
|
||||
|
||||
if (!is_read) {
|
||||
seeNotification([id]);
|
||||
readNotification([id]);
|
||||
}
|
||||
let notificationLink = formatLbryUrlForWeb(notification_parameters.device.target);
|
||||
if (notification_parameters.dynamic?.hash) {
|
||||
notificationLink += '?lc=' + notification_parameters.dynamic.hash + '&view=discussion';
|
||||
}
|
||||
push(notificationLink);
|
||||
|
||||
push(getNotificationLink(notification));
|
||||
}
|
||||
|
||||
function getWebUri(notification) {
|
||||
const { notification_parameters } = notification;
|
||||
let notificationLink = formatLbryUrlForWeb(notification_parameters.device.target);
|
||||
if (notification_parameters.dynamic?.hash) {
|
||||
notificationLink += '?lc=' + notification_parameters.dynamic.hash + '&view=discussion';
|
||||
}
|
||||
return notificationLink;
|
||||
return getNotificationLink(notification);
|
||||
}
|
||||
|
||||
function menuEntry(notification) {
|
||||
|
|
59
ui/component/notification/helpers/target.jsx
Normal file
59
ui/component/notification/helpers/target.jsx
Normal file
|
@ -0,0 +1,59 @@
|
|||
// @flow
|
||||
import { LINKED_COMMENT_QUERY_PARAM } from 'constants/comment';
|
||||
import { RULE } from 'constants/notifications';
|
||||
import * as PAGES from 'constants/pages';
|
||||
import { DISCUSSION_PAGE, PAGE_VIEW_QUERY } from 'page/channel/view'; // TODO: move into const to avoid lazy-load problems
|
||||
import { parseURI } from 'util/lbryURI';
|
||||
import { formatLbryUrlForWeb } from 'util/url';
|
||||
|
||||
export function getNotificationTarget(notification: WebNotification) {
|
||||
const { notification_rule, notification_parameters } = notification;
|
||||
|
||||
switch (notification_rule) {
|
||||
case RULE.WEEKLY_WATCH_REMINDER:
|
||||
case RULE.DAILY_WATCH_AVAILABLE:
|
||||
case RULE.DAILY_WATCH_REMIND:
|
||||
return `/$/${PAGES.CHANNELS_FOLLOWING}`;
|
||||
case RULE.MISSED_OUT:
|
||||
case RULE.REWARDS_APPROVAL_PROMPT:
|
||||
return `/$/${PAGES.REWARDS_VERIFY}?redirect=/$/${PAGES.REWARDS}`;
|
||||
case RULE.FIAT_TIP:
|
||||
return `/$/${PAGES.WALLET}?fiatType=incoming&tab=fiat-payment-history¤cy=fiat`;
|
||||
default:
|
||||
return notification_parameters.device.target;
|
||||
}
|
||||
}
|
||||
|
||||
function getUrlParams(notification, notificationTarget) {
|
||||
const { notification_rule, notification_parameters } = notification;
|
||||
|
||||
const isCommentNotification =
|
||||
notification_rule === RULE.COMMENT ||
|
||||
notification_rule === RULE.COMMENT_REPLY ||
|
||||
notification_rule === RULE.CREATOR_COMMENT;
|
||||
|
||||
const urlParams = new URLSearchParams();
|
||||
|
||||
if (isCommentNotification && notification_parameters.dynamic.hash) {
|
||||
urlParams.append(LINKED_COMMENT_QUERY_PARAM, notification_parameters.dynamic.hash);
|
||||
}
|
||||
|
||||
try {
|
||||
const { isChannel } = parseURI(notificationTarget);
|
||||
if (isChannel) urlParams.append(PAGE_VIEW_QUERY, DISCUSSION_PAGE);
|
||||
} catch (e) {}
|
||||
|
||||
return urlParams;
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param notification
|
||||
* @param target Optional (minor optimization if pre-calculated outside). Must be value from getNotificationTarget().
|
||||
* @returns {string}
|
||||
*/
|
||||
export function getNotificationLink(notification: WebNotification, target: ?string) {
|
||||
const notificationTarget = target || getNotificationTarget(notification);
|
||||
const urlParams = getUrlParams(notification, notificationTarget);
|
||||
return `${formatLbryUrlForWeb(notificationTarget)}?${urlParams.toString()}`;
|
||||
}
|
|
@ -1,14 +1,11 @@
|
|||
// @flow
|
||||
import { lazyImport } from 'util/lazyImport';
|
||||
import { formatLbryUrlForWeb } from 'util/url';
|
||||
import { Menu, MenuList, MenuButton, MenuItem } from '@reach/menu-button';
|
||||
import { NavLink } from 'react-router-dom';
|
||||
import { PAGE_VIEW_QUERY, DISCUSSION_PAGE } from 'page/channel/view';
|
||||
import { parseURI } from 'util/lbryURI';
|
||||
import { RULE } from 'constants/notifications';
|
||||
import { useHistory } from 'react-router';
|
||||
import * as ICONS from 'constants/icons';
|
||||
import * as PAGES from 'constants/pages';
|
||||
import Button from 'component/button';
|
||||
import ChannelThumbnail from 'component/channelThumbnail';
|
||||
import classnames from 'classnames';
|
||||
|
@ -18,9 +15,9 @@ import Icon from 'component/common/icon';
|
|||
import NotificationContentChannelMenu from 'component/notificationContentChannelMenu';
|
||||
import React from 'react';
|
||||
import UriIndicator from 'component/uriIndicator';
|
||||
import { getNotificationLink, getNotificationTarget } from './helpers/target';
|
||||
import { generateNotificationTitle } from './helpers/title';
|
||||
import { generateNotificationText } from './helpers/text';
|
||||
import { LINKED_COMMENT_QUERY_PARAM } from 'constants/comment';
|
||||
|
||||
const CommentCreate = lazyImport(() => import('component/commentCreate' /* webpackChunkName: "comments" */));
|
||||
const CommentReactions = lazyImport(() => import('component/commentReactions' /* webpackChunkName: "comments" */));
|
||||
|
@ -46,7 +43,9 @@ export default function Notification(props: Props) {
|
|||
notification_rule === RULE.COMMENT ||
|
||||
notification_rule === RULE.COMMENT_REPLY ||
|
||||
notification_rule === RULE.CREATOR_COMMENT;
|
||||
const notificationTarget = getNotificationTarget();
|
||||
|
||||
const notificationTarget = getNotificationTarget(notification);
|
||||
const notificationLink = getNotificationLink(notification, notificationTarget);
|
||||
|
||||
const creatorIcon = (channelUrl, channelThumbnail) => (
|
||||
<UriIndicator uri={channelUrl} link showAtSign channelInfo={{ uri: channelUrl, name: '' }}>
|
||||
|
@ -91,12 +90,6 @@ export default function Notification(props: Props) {
|
|||
icon = <Icon icon={ICONS.NOTIFICATION} sectionIcon />;
|
||||
}
|
||||
|
||||
let notificationLink = formatLbryUrlForWeb(notificationTarget);
|
||||
let urlParams = new URLSearchParams();
|
||||
if (isCommentNotification && notification_parameters.dynamic.hash) {
|
||||
urlParams.append(LINKED_COMMENT_QUERY_PARAM, notification_parameters.dynamic.hash);
|
||||
}
|
||||
|
||||
let channelName;
|
||||
if (channelUrl) {
|
||||
try {
|
||||
|
@ -104,30 +97,8 @@ export default function Notification(props: Props) {
|
|||
} catch (e) {}
|
||||
}
|
||||
|
||||
try {
|
||||
const { isChannel } = parseURI(notificationTarget);
|
||||
if (isChannel) urlParams.append(PAGE_VIEW_QUERY, DISCUSSION_PAGE);
|
||||
} catch (e) {}
|
||||
|
||||
notificationLink += `?${urlParams.toString()}`;
|
||||
const navLinkProps = { to: notificationLink, onClick: (e) => e.stopPropagation() };
|
||||
|
||||
function getNotificationTarget() {
|
||||
switch (notification_rule) {
|
||||
case RULE.WEEKLY_WATCH_REMINDER:
|
||||
case RULE.DAILY_WATCH_AVAILABLE:
|
||||
case RULE.DAILY_WATCH_REMIND:
|
||||
return `/$/${PAGES.CHANNELS_FOLLOWING}`;
|
||||
case RULE.MISSED_OUT:
|
||||
case RULE.REWARDS_APPROVAL_PROMPT:
|
||||
return `/$/${PAGES.REWARDS_VERIFY}?redirect=/$/${PAGES.REWARDS}`;
|
||||
case RULE.FIAT_TIP:
|
||||
return `/$/${PAGES.WALLET}?fiatType=incoming&tab=fiat-payment-history¤cy=fiat`;
|
||||
default:
|
||||
return notification_parameters.device.target;
|
||||
}
|
||||
}
|
||||
|
||||
function handleNotificationClick() {
|
||||
if (!is_read) readNotification();
|
||||
if (menuButton && notificationLink) push(notificationLink);
|
||||
|
|
Loading…
Reference in a new issue