From cea84abb03fa4eb3a44d86c28830a19995809e3f Mon Sep 17 00:00:00 2001 From: nachtjasmin Date: Wed, 27 Dec 2023 01:15:47 +0100 Subject: [PATCH] Add Mastodon v3 click behaviour back This reverts commit 2bf1233a7e96263f84ff994cbcb9c8b80db7a73f. --- .../mastodon/components/account.jsx | 6 +-- .../mastodon/components/hashtag.jsx | 6 +-- .../mastodon/components/permalink.jsx | 40 +++++++++++++++++++ .../mastodon/components/status_content.jsx | 6 +-- .../components/moved_note.jsx | 10 ++--- .../compose/components/navigation_bar.jsx | 12 +++--- .../components/conversation.jsx | 4 +- .../directory/components/account_card.jsx | 6 +-- .../components/account_authorize.jsx | 8 ++-- .../components/follow_request.jsx | 7 ++-- .../notifications/components/notification.jsx | 6 +-- 11 files changed, 75 insertions(+), 36 deletions(-) create mode 100644 app/javascript/mastodon/components/permalink.jsx diff --git a/app/javascript/mastodon/components/account.jsx b/app/javascript/mastodon/components/account.jsx index fd5ea6040..f6e2ba124 100644 --- a/app/javascript/mastodon/components/account.jsx +++ b/app/javascript/mastodon/components/account.jsx @@ -3,12 +3,12 @@ import PropTypes from 'prop-types'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import classNames from 'classnames'; -import { Link } from 'react-router-dom'; import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; import { EmptyAccount } from 'mastodon/components/empty_account'; +import { Permalink } from 'mastodon/components/permalink'; import { ShortNumber } from 'mastodon/components/short_number'; import { VerifiedBadge } from 'mastodon/components/verified_badge'; @@ -151,7 +151,7 @@ class Account extends ImmutablePureComponent { return (
- +
@@ -164,7 +164,7 @@ class Account extends ImmutablePureComponent {
)}
- + {!minimal && (
diff --git a/app/javascript/mastodon/components/hashtag.jsx b/app/javascript/mastodon/components/hashtag.jsx index f35f862fc..aa2d43bbd 100644 --- a/app/javascript/mastodon/components/hashtag.jsx +++ b/app/javascript/mastodon/components/hashtag.jsx @@ -5,12 +5,12 @@ import { Component } from 'react'; import { FormattedMessage } from 'react-intl'; import classNames from 'classnames'; -import { Link } from 'react-router-dom'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { Sparklines, SparklinesCurve } from 'react-sparklines'; +import { Permalink } from 'mastodon/components/permalink'; import { ShortNumber } from 'mastodon/components/short_number'; import { Skeleton } from 'mastodon/components/skeleton'; @@ -74,9 +74,9 @@ ImmutableHashtag.propTypes = { const Hashtag = ({ name, href, to, people, uses, history, className, description, withGraph }) => (
- + {name ? <>#{name} : } - + {description ? ( {description} diff --git a/app/javascript/mastodon/components/permalink.jsx b/app/javascript/mastodon/components/permalink.jsx new file mode 100644 index 000000000..4279efba8 --- /dev/null +++ b/app/javascript/mastodon/components/permalink.jsx @@ -0,0 +1,40 @@ +import PropTypes from 'prop-types'; +import { PureComponent } from 'react'; + +export class Permalink extends 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_content.jsx b/app/javascript/mastodon/components/status_content.jsx index 02ef29f11..d8735b0a5 100644 --- a/app/javascript/mastodon/components/status_content.jsx +++ b/app/javascript/mastodon/components/status_content.jsx @@ -4,12 +4,12 @@ import { PureComponent } from 'react'; import { FormattedMessage, injectIntl } from 'react-intl'; import classnames from 'classnames'; -import { Link } from 'react-router-dom'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { connect } from 'react-redux'; import { Icon } from 'mastodon/components/icon'; +import { Permalink } from 'mastodon/components/permalink'; import PollContainer from 'mastodon/containers/poll_container'; import { autoPlayGif, languages as preloadedLanguages, expandUsernames } from 'mastodon/initial_state'; @@ -284,9 +284,9 @@ class StatusContent extends PureComponent { let mentionsPlaceholder = ''; const mentionLinks = status.get('mentions').map(item => ( - + @{expandUsernames ? item.get('acct') : item.get('username')} - + )).reduce((aggregate, item) => [...aggregate, item, ' '], []); const toggleText = hidden ? : ; diff --git a/app/javascript/mastodon/features/account_timeline/components/moved_note.jsx b/app/javascript/mastodon/features/account_timeline/components/moved_note.jsx index b5fda1c8e..8094b26c3 100644 --- a/app/javascript/mastodon/features/account_timeline/components/moved_note.jsx +++ b/app/javascript/mastodon/features/account_timeline/components/moved_note.jsx @@ -1,10 +1,10 @@ import { FormattedMessage } from 'react-intl'; -import { Link } from 'react-router-dom'; - import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; +import { Permalink } from 'mastodon/components/permalink'; + import { AvatarOverlay } from '../../../components/avatar_overlay'; import { DisplayName } from '../../../components/display_name'; @@ -25,12 +25,12 @@ export default class MovedNote extends ImmutablePureComponent {
- +
- + - +
); diff --git a/app/javascript/mastodon/features/compose/components/navigation_bar.jsx b/app/javascript/mastodon/features/compose/components/navigation_bar.jsx index ad3f523ce..6e14ba34b 100644 --- a/app/javascript/mastodon/features/compose/components/navigation_bar.jsx +++ b/app/javascript/mastodon/features/compose/components/navigation_bar.jsx @@ -2,11 +2,11 @@ import PropTypes from 'prop-types'; import { FormattedMessage } from 'react-intl'; -import { Link } from 'react-router-dom'; - import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; +import { Permalink } from 'mastodon/components/permalink'; + import { Avatar } from '../../../components/avatar'; import ActionBar from './action_bar'; @@ -24,16 +24,16 @@ export default class NavigationBar extends ImmutablePureComponent { const url = this.props.account.get('url') return (
- + {username} - +
- + @{username} - + diff --git a/app/javascript/mastodon/features/direct_timeline/components/conversation.jsx b/app/javascript/mastodon/features/direct_timeline/components/conversation.jsx index 31a48fb7f..2c0cb9376 100644 --- a/app/javascript/mastodon/features/direct_timeline/components/conversation.jsx +++ b/app/javascript/mastodon/features/direct_timeline/components/conversation.jsx @@ -3,7 +3,6 @@ import PropTypes from 'prop-types'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import classNames from 'classnames'; -import { Link } from 'react-router-dom'; import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; @@ -13,6 +12,7 @@ import { HotKeys } from 'react-hotkeys'; import AttachmentList from 'mastodon/components/attachment_list'; import AvatarComposite from 'mastodon/components/avatar_composite'; import { IconButton } from 'mastodon/components/icon_button'; +import { Permalink } from 'mastodon/components/permalink'; import { RelativeTimestamp } from 'mastodon/components/relative_timestamp'; import StatusContent from 'mastodon/components/status_content'; import DropdownMenuContainer from 'mastodon/containers/dropdown_menu_container'; @@ -136,7 +136,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.jsx b/app/javascript/mastodon/features/directory/components/account_card.jsx index 4ec1c1878..6806898b0 100644 --- a/app/javascript/mastodon/features/directory/components/account_card.jsx +++ b/app/javascript/mastodon/features/directory/components/account_card.jsx @@ -3,7 +3,6 @@ import PropTypes from 'prop-types'; import { FormattedMessage, injectIntl, defineMessages } from 'react-intl'; import classNames from 'classnames'; -import { Link } from 'react-router-dom'; import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; @@ -19,6 +18,7 @@ import { openModal } from 'mastodon/actions/modal'; import { Avatar } from 'mastodon/components/avatar'; import Button from 'mastodon/components/button'; import { DisplayName } from 'mastodon/components/display_name'; +import { Permalink } from 'mastodon/components/permalink'; import { ShortNumber } from 'mastodon/components/short_number'; import { autoPlayGif, me, unfollowModal } from 'mastodon/initial_state'; import { makeGetAccount } from 'mastodon/selectors'; @@ -174,7 +174,7 @@ class AccountCard extends ImmutablePureComponent { return (
- +
- + {account.get('note').length > 0 && (
- +
- +
diff --git a/app/javascript/mastodon/features/notifications/components/follow_request.jsx b/app/javascript/mastodon/features/notifications/components/follow_request.jsx index c43efd558..1eec1edd9 100644 --- a/app/javascript/mastodon/features/notifications/components/follow_request.jsx +++ b/app/javascript/mastodon/features/notifications/components/follow_request.jsx @@ -2,14 +2,13 @@ import PropTypes from 'prop-types'; import { defineMessages, injectIntl } from 'react-intl'; -import { Link } from 'react-router-dom'; - import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; import { Avatar } from 'mastodon/components/avatar'; import { DisplayName } from 'mastodon/components/display_name'; import { IconButton } from 'mastodon/components/icon_button'; +import { Permalink } from 'mastodon/components/permalink'; const messages = defineMessages({ authorize: { id: 'follow_request.authorize', defaultMessage: 'Authorize' }, @@ -44,10 +43,10 @@ class FollowRequest extends ImmutablePureComponent { return (
- +
- +
diff --git a/app/javascript/mastodon/features/notifications/components/notification.jsx b/app/javascript/mastodon/features/notifications/components/notification.jsx index 4b8fcf4af..b25e5696b 100644 --- a/app/javascript/mastodon/features/notifications/components/notification.jsx +++ b/app/javascript/mastodon/features/notifications/components/notification.jsx @@ -3,7 +3,6 @@ import PropTypes from 'prop-types'; import { injectIntl, FormattedMessage, defineMessages } from 'react-intl'; import classNames from 'classnames'; -import { Link } from 'react-router-dom'; import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; @@ -11,6 +10,7 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; import { HotKeys } from 'react-hotkeys'; import { Icon } from 'mastodon/components/icon'; +import { Permalink } from 'mastodon/components/permalink'; import AccountContainer from 'mastodon/containers/account_container'; import StatusContainer from 'mastodon/containers/status_container'; import { me } from 'mastodon/initial_state'; @@ -398,7 +398,7 @@ class Notification extends ImmutablePureComponent { const targetAccount = report.get('target_account'); const targetDisplayNameHtml = { __html: targetAccount.get('display_name_html') }; - const targetLink = ; + const targetLink = ; return ( @@ -423,7 +423,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':