From 07229089a63151a941e3bf9ff8e2fb5037b14b43 Mon Sep 17 00:00:00 2001 From: trwnh Date: Sun, 13 Nov 2022 14:10:20 -0600 Subject: [PATCH] Change in-app links to keep you in-app (#20540) * Change in-app links to keep you in-app * refactor Permalink into Link * rewrite link hrefs in status content * please linter * please linter again --- app/javascript/mastodon/components/account.js | 6 +-- .../mastodon/components/admin/Trends.js | 2 +- app/javascript/mastodon/components/hashtag.js | 10 ++--- .../mastodon/components/permalink.js | 40 ------------------- app/javascript/mastodon/components/status.js | 8 ++-- .../mastodon/components/status_content.js | 8 ++-- .../account/components/featured_tags.js | 1 - .../account_gallery/components/media_item.js | 2 +- .../account_timeline/components/moved_note.js | 8 ++-- .../compose/components/navigation_bar.js | 10 ++--- .../compose/components/reply_indicator.js | 2 +- .../components/conversation.js | 4 +- .../directory/components/account_card.js | 6 +-- .../components/account.js | 6 +-- .../components/account_authorize.js | 6 +-- .../components/follow_request.js | 6 +-- .../notifications/components/notification.js | 6 +-- .../picture_in_picture/components/footer.js | 2 +- .../status/components/detailed_status.js | 4 +- .../features/ui/components/boost_modal.js | 4 +- .../mastodon/features/ui/components/header.js | 5 +-- 21 files changed, 52 insertions(+), 94 deletions(-) delete mode 100644 app/javascript/mastodon/components/permalink.js diff --git a/app/javascript/mastodon/components/account.js b/app/javascript/mastodon/components/account.js index 51d2b8ba2c..7aebb124cb 100644 --- a/app/javascript/mastodon/components/account.js +++ b/app/javascript/mastodon/components/account.js @@ -3,13 +3,13 @@ import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import Avatar from './avatar'; import DisplayName from './display_name'; -import Permalink from './permalink'; import IconButton from './icon_button'; import { defineMessages, injectIntl } from 'react-intl'; import ImmutablePureComponent from 'react-immutable-pure-component'; import { me } from '../initial_state'; import RelativeTimestamp from './relative_timestamp'; import Skeleton from 'mastodon/components/skeleton'; +import { Link } from 'react-router-dom'; const messages = defineMessages({ follow: { id: 'account.follow', defaultMessage: 'Follow' }, @@ -140,11 +140,11 @@ class Account extends ImmutablePureComponent { return (
- +
{mute_expires_at} -
+
{buttons} diff --git a/app/javascript/mastodon/components/admin/Trends.js b/app/javascript/mastodon/components/admin/Trends.js index 635bdf37d5..9530c2a5be 100644 --- a/app/javascript/mastodon/components/admin/Trends.js +++ b/app/javascript/mastodon/components/admin/Trends.js @@ -50,7 +50,7 @@ export default class Trends extends React.PureComponent { day.uses)} diff --git a/app/javascript/mastodon/components/hashtag.js b/app/javascript/mastodon/components/hashtag.js index 75220211ec..e516fc0867 100644 --- a/app/javascript/mastodon/components/hashtag.js +++ b/app/javascript/mastodon/components/hashtag.js @@ -4,7 +4,7 @@ import { Sparklines, SparklinesCurve } from 'react-sparklines'; import { FormattedMessage } from 'react-intl'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; -import Permalink from './permalink'; +import { Link } from 'react-router-dom'; import ShortNumber from 'mastodon/components/short_number'; import Skeleton from 'mastodon/components/skeleton'; import classNames from 'classnames'; @@ -53,7 +53,6 @@ export const accountsCountRenderer = (displayNumber, pluralReady) => ( export const ImmutableHashtag = ({ hashtag }) => ( day.get('uses')).toArray()} @@ -64,12 +63,12 @@ ImmutableHashtag.propTypes = { hashtag: ImmutablePropTypes.map.isRequired, }; -const Hashtag = ({ name, href, to, people, uses, history, className, description, withGraph }) => ( +const Hashtag = ({ name, to, people, uses, history, className, description, withGraph }) => (
- + {name ? #{name} : } - + {description ? ( {description} @@ -98,7 +97,6 @@ const Hashtag = ({ name, href, to, people, uses, history, className, description Hashtag.propTypes = { name: PropTypes.string, - href: PropTypes.string, to: PropTypes.string, people: PropTypes.number, description: PropTypes.node, diff --git a/app/javascript/mastodon/components/permalink.js b/app/javascript/mastodon/components/permalink.js deleted file mode 100644 index b369e98126..0000000000 --- a/app/javascript/mastodon/components/permalink.js +++ /dev/null @@ -1,40 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -export default class Permalink extends React.PureComponent { - - static contextTypes = { - router: PropTypes.object, - }; - - static propTypes = { - className: PropTypes.string, - href: PropTypes.string.isRequired, - to: PropTypes.string.isRequired, - children: PropTypes.node, - onInterceptClick: PropTypes.func, - }; - - handleClick = e => { - if (this.props.onInterceptClick && this.props.onInterceptClick()) { - e.preventDefault(); - return; - } - - if (this.context.router && e.button === 0 && !(e.ctrlKey || e.metaKey)) { - e.preventDefault(); - this.context.router.history.push(this.props.to); - } - } - - render () { - const { href, children, className, onInterceptClick, ...other } = this.props; - - return ( - - {children} - - ); - } - -} diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js index d1235550fe..a1384ba583 100644 --- a/app/javascript/mastodon/components/status.js +++ b/app/javascript/mastodon/components/status.js @@ -378,7 +378,7 @@ class Status extends ImmutablePureComponent { prepend = (
- }} /> + }} />
); @@ -392,7 +392,7 @@ class Status extends ImmutablePureComponent { prepend = (
- }} /> + }} />
); } @@ -511,12 +511,12 @@ class Status extends ImmutablePureComponent {
- + {status.get('edited_at') && *} - +
{statusAvatar}
diff --git a/app/javascript/mastodon/components/status_content.js b/app/javascript/mastodon/components/status_content.js index 139e8ed16e..2a933c0a74 100644 --- a/app/javascript/mastodon/components/status_content.js +++ b/app/javascript/mastodon/components/status_content.js @@ -2,7 +2,7 @@ import React from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import { FormattedMessage, injectIntl } from 'react-intl'; -import Permalink from './permalink'; +import { Link } from 'react-router-dom'; import classnames from 'classnames'; import PollContainer from 'mastodon/containers/poll_container'; import Icon from 'mastodon/components/icon'; @@ -91,8 +91,10 @@ class StatusContent extends React.PureComponent { if (mention) { link.addEventListener('click', this.onMentionClick.bind(this, mention), false); link.setAttribute('title', mention.get('acct')); + link.setAttribute('href', `/@${mention.get('acct')}`); } else if (link.textContent[0] === '#' || (link.previousSibling && link.previousSibling.textContent && link.previousSibling.textContent[link.previousSibling.textContent.length - 1] === '#')) { link.addEventListener('click', this.onHashtagClick.bind(this, link.text), false); + link.setAttribute('href', `/tags/${link.text.slice(1)}`); } else { link.setAttribute('title', link.href); link.classList.add('unhandled-link'); @@ -242,9 +244,9 @@ class StatusContent extends React.PureComponent { let mentionsPlaceholder = ''; const mentionLinks = status.get('mentions').map(item => ( - + @{item.get('username')} - + )).reduce((aggregate, item) => [...aggregate, item, ' '], []); const toggleText = hidden ? : ; diff --git a/app/javascript/mastodon/features/account/components/featured_tags.js b/app/javascript/mastodon/features/account/components/featured_tags.js index 8194c063a2..24a3f21714 100644 --- a/app/javascript/mastodon/features/account/components/featured_tags.js +++ b/app/javascript/mastodon/features/account/components/featured_tags.js @@ -39,7 +39,6 @@ class FeaturedTags extends ImmutablePureComponent { -
+
- +
-
+ - +
); diff --git a/app/javascript/mastodon/features/compose/components/navigation_bar.js b/app/javascript/mastodon/features/compose/components/navigation_bar.js index 372765ca4d..be979af505 100644 --- a/app/javascript/mastodon/features/compose/components/navigation_bar.js +++ b/app/javascript/mastodon/features/compose/components/navigation_bar.js @@ -3,7 +3,7 @@ import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import ActionBar from './action_bar'; import Avatar from '../../../components/avatar'; -import Permalink from '../../../components/permalink'; +import { Link } from 'react-router-dom'; import IconButton from '../../../components/icon_button'; import { FormattedMessage } from 'react-intl'; import ImmutablePureComponent from 'react-immutable-pure-component'; @@ -19,15 +19,15 @@ export default class NavigationBar extends ImmutablePureComponent { render () { return (
- + {this.props.account.get('acct')} - + diff --git a/app/javascript/mastodon/features/compose/components/reply_indicator.js b/app/javascript/mastodon/features/compose/components/reply_indicator.js index 863defb768..fc236882ad 100644 --- a/app/javascript/mastodon/features/compose/components/reply_indicator.js +++ b/app/javascript/mastodon/features/compose/components/reply_indicator.js @@ -50,7 +50,7 @@ class ReplyIndicator extends ImmutablePureComponent {
- +
diff --git a/app/javascript/mastodon/features/direct_timeline/components/conversation.js b/app/javascript/mastodon/features/direct_timeline/components/conversation.js index 77ff2ce7b3..4a770970d0 100644 --- a/app/javascript/mastodon/features/direct_timeline/components/conversation.js +++ b/app/javascript/mastodon/features/direct_timeline/components/conversation.js @@ -7,7 +7,7 @@ import AttachmentList from 'mastodon/components/attachment_list'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import DropdownMenuContainer from 'mastodon/containers/dropdown_menu_container'; import AvatarComposite from 'mastodon/components/avatar_composite'; -import Permalink from 'mastodon/components/permalink'; +import { Link } from 'react-router-dom'; import IconButton from 'mastodon/components/icon_button'; import RelativeTimestamp from 'mastodon/components/relative_timestamp'; import { HotKeys } from 'react-hotkeys'; @@ -133,7 +133,7 @@ class Conversation extends ImmutablePureComponent { menu.push({ text: intl.formatMessage(messages.delete), action: this.handleDelete }); - const names = accounts.map(a => ).reduce((prev, cur) => [prev, ', ', cur]); + const names = accounts.map(a => ).reduce((prev, cur) => [prev, ', ', cur]); const handlers = { reply: this.handleReply, diff --git a/app/javascript/mastodon/features/directory/components/account_card.js b/app/javascript/mastodon/features/directory/components/account_card.js index e7eeb22548..977f0c32c9 100644 --- a/app/javascript/mastodon/features/directory/components/account_card.js +++ b/app/javascript/mastodon/features/directory/components/account_card.js @@ -6,7 +6,7 @@ import { connect } from 'react-redux'; import { makeGetAccount } from 'mastodon/selectors'; import Avatar from 'mastodon/components/avatar'; import DisplayName from 'mastodon/components/display_name'; -import Permalink from 'mastodon/components/permalink'; +import { Link } from 'react-router-dom'; import Button from 'mastodon/components/button'; import { FormattedMessage, injectIntl, defineMessages } from 'react-intl'; import { autoPlayGif, me, unfollowModal } from 'mastodon/initial_state'; @@ -169,7 +169,7 @@ class AccountCard extends ImmutablePureComponent { return (
- +
- + {account.get('note').length > 0 && (
- +
{getFirstSentence(account.get('note_plain'))}
-
+
{button} diff --git a/app/javascript/mastodon/features/follow_requests/components/account_authorize.js b/app/javascript/mastodon/features/follow_requests/components/account_authorize.js index 263a7ae162..d41f331e5e 100644 --- a/app/javascript/mastodon/features/follow_requests/components/account_authorize.js +++ b/app/javascript/mastodon/features/follow_requests/components/account_authorize.js @@ -1,7 +1,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; -import Permalink from '../../../components/permalink'; +import { Link } from 'react-router-dom'; import Avatar from '../../../components/avatar'; import DisplayName from '../../../components/display_name'; import IconButton from '../../../components/icon_button'; @@ -30,10 +30,10 @@ class AccountAuthorize extends ImmutablePureComponent { return (
- +
-
+
diff --git a/app/javascript/mastodon/features/notifications/components/follow_request.js b/app/javascript/mastodon/features/notifications/components/follow_request.js index 9ef3fde7eb..08de875e36 100644 --- a/app/javascript/mastodon/features/notifications/components/follow_request.js +++ b/app/javascript/mastodon/features/notifications/components/follow_request.js @@ -3,7 +3,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import Avatar from 'mastodon/components/avatar'; import DisplayName from 'mastodon/components/display_name'; -import Permalink from 'mastodon/components/permalink'; +import { Link } from 'react-router-dom'; import IconButton from 'mastodon/components/icon_button'; import { defineMessages, injectIntl } from 'react-intl'; import ImmutablePureComponent from 'react-immutable-pure-component'; @@ -42,10 +42,10 @@ class FollowRequest extends ImmutablePureComponent { return (
- +
-
+
diff --git a/app/javascript/mastodon/features/notifications/components/notification.js b/app/javascript/mastodon/features/notifications/components/notification.js index 5974e378e4..ea2c9c0a42 100644 --- a/app/javascript/mastodon/features/notifications/components/notification.js +++ b/app/javascript/mastodon/features/notifications/components/notification.js @@ -10,7 +10,7 @@ import AccountContainer from 'mastodon/containers/account_container'; import Report from './report'; import FollowRequestContainer from '../containers/follow_request_container'; import Icon from 'mastodon/components/icon'; -import Permalink from 'mastodon/components/permalink'; +import { Link } from 'react-router-dom'; import classNames from 'classnames'; const messages = defineMessages({ @@ -378,7 +378,7 @@ class Notification extends ImmutablePureComponent { const targetAccount = report.get('target_account'); const targetDisplayNameHtml = { __html: targetAccount.get('display_name_html') }; - const targetLink = ; + const targetLink = ; return ( @@ -403,7 +403,7 @@ class Notification extends ImmutablePureComponent { const { notification } = this.props; const account = notification.get('account'); const displayNameHtml = { __html: account.get('display_name_html') }; - const link = ; + const link = ; switch(notification.get('type')) { case 'follow': diff --git a/app/javascript/mastodon/features/picture_in_picture/components/footer.js b/app/javascript/mastodon/features/picture_in_picture/components/footer.js index 5b875dc302..0dff834c3d 100644 --- a/app/javascript/mastodon/features/picture_in_picture/components/footer.js +++ b/app/javascript/mastodon/features/picture_in_picture/components/footer.js @@ -184,7 +184,7 @@ class Footer extends ImmutablePureComponent { - {withOpenButton && } + {withOpenButton && }
); } diff --git a/app/javascript/mastodon/features/status/components/detailed_status.js b/app/javascript/mastodon/features/status/components/detailed_status.js index 1a2aab8192..c62910e0ee 100644 --- a/app/javascript/mastodon/features/status/components/detailed_status.js +++ b/app/javascript/mastodon/features/status/components/detailed_status.js @@ -261,7 +261,7 @@ class DetailedStatus extends ImmutablePureComponent { return (
- +
@@ -276,7 +276,7 @@ class DetailedStatus extends ImmutablePureComponent { {media}
- + {edited}{visibilityLink}{applicationLink}{reblogLink} ยท {favouriteLink}
diff --git a/app/javascript/mastodon/features/ui/components/boost_modal.js b/app/javascript/mastodon/features/ui/components/boost_modal.js index d7a6d711ea..077ce7b35c 100644 --- a/app/javascript/mastodon/features/ui/components/boost_modal.js +++ b/app/javascript/mastodon/features/ui/components/boost_modal.js @@ -98,12 +98,12 @@ class BoostModal extends ImmutablePureComponent {