diff --git a/app/javascript/mastodon/components/account/index.tsx b/app/javascript/mastodon/components/account/index.tsx
index 5c0716412..8397695a4 100644
--- a/app/javascript/mastodon/components/account/index.tsx
+++ b/app/javascript/mastodon/components/account/index.tsx
@@ -3,6 +3,7 @@ import { useCallback, useMemo } from 'react';
 import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
 
 import classNames from 'classnames';
+import { Link } from 'react-router-dom';
 
 import MoreHorizIcon from '@/material-icons/400-24px/more_horiz.svg?react';
 import {
@@ -24,7 +25,6 @@ import { FollowersCounter } from 'mastodon/components/counters';
 import { DisplayName } from 'mastodon/components/display_name';
 import { Dropdown } from 'mastodon/components/dropdown_menu';
 import { FollowButton } from 'mastodon/components/follow_button';
-import { Permalink } from 'mastodon/components/permalink';
 import { RelativeTimestamp } from 'mastodon/components/relative_timestamp';
 import { ShortNumber } from 'mastodon/components/short_number';
 import { Skeleton } from 'mastodon/components/skeleton';
@@ -293,10 +293,9 @@ export const Account: React.FC<AccountProps> = ({
         })}
       >
         <div className='account__info-wrapper'>
-          <Permalink
+          <Link
             className='account__display-name'
             title={account?.acct}
-            href={account?.get('url')}
             to={`/@${account?.acct}`}
             data-hover-card-account={id}
           >
@@ -327,7 +326,7 @@ export const Account: React.FC<AccountProps> = ({
                 </div>
               )}
             </div>
-          </Permalink>
+          </Link>
 
           {account &&
             withBio &&
diff --git a/app/javascript/mastodon/components/permalink.jsx b/app/javascript/mastodon/components/permalink.jsx
deleted file mode 100644
index 4279efba8..000000000
--- a/app/javascript/mastodon/components/permalink.jsx
+++ /dev/null
@@ -1,40 +0,0 @@
-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 (
-      <a target='_blank' href={href} onClick={this.handleClick} {...other} className={`permalink${className ? ' ' + className : ''}`}>
-        {children}
-      </a>
-    );
-  }
-
-}
diff --git a/app/javascript/mastodon/features/compose/components/reply_indicator.jsx b/app/javascript/mastodon/features/compose/components/reply_indicator.jsx
index 4392ea772..da352589f 100644
--- a/app/javascript/mastodon/features/compose/components/reply_indicator.jsx
+++ b/app/javascript/mastodon/features/compose/components/reply_indicator.jsx
@@ -2,12 +2,13 @@ import { FormattedMessage } from 'react-intl';
 
 import { useSelector } from 'react-redux';
 
+import { Link } from 'react-router-dom';
+
 import BarChart4BarsIcon from '@/material-icons/400-24px/bar_chart_4_bars.svg?react';
 import PhotoLibraryIcon from '@/material-icons/400-24px/photo_library.svg?react';
 import { Avatar } from 'mastodon/components/avatar';
 import { DisplayName } from 'mastodon/components/display_name';
 import { Icon } from 'mastodon/components/icon';
-import { Permalink } from 'mastodon/components/permalink';
 import { EmbeddedStatusContent } from 'mastodon/features/notifications_v2/components/embedded_status_content';
 
 export const ReplyIndicator = () => {
@@ -23,14 +24,14 @@ export const ReplyIndicator = () => {
     <div className='reply-indicator'>
       <div className='reply-indicator__line' />
 
-      <Permalink href={account.get('url')} to={`/@${account.get('acct')}`} className='detailed-status__display-avatar'>
+      <Link to={`/@${account.get('acct')}`} className='detailed-status__display-avatar'>
         <Avatar account={account} size={46} />
-      </Permalink>
+      </Link>
 
       <div className='reply-indicator__main'>
-        <Permalink href={account.get('url')} to={`/@${account.get('acct')}`} className='detailed-status__display-name'>
+        <Link to={`/@${account.get('acct')}`} className='detailed-status__display-name'>
           <DisplayName account={account} />
-        </Permalink>
+        </Link>
 
         <EmbeddedStatusContent
           className='reply-indicator__content translate'
diff --git a/app/javascript/mastodon/features/direct_timeline/components/conversation.jsx b/app/javascript/mastodon/features/direct_timeline/components/conversation.jsx
index 4f4520d6c..c27cd3727 100644
--- a/app/javascript/mastodon/features/direct_timeline/components/conversation.jsx
+++ b/app/javascript/mastodon/features/direct_timeline/components/conversation.jsx
@@ -4,7 +4,7 @@ import { useCallback } from 'react';
 import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
 
 import classNames from 'classnames';
-import { useHistory } from 'react-router-dom';
+import { Link, useHistory } from 'react-router-dom';
 
 import { createSelector } from '@reduxjs/toolkit';
 import ImmutablePropTypes from 'react-immutable-proptypes';
@@ -22,7 +22,6 @@ import { muteStatus, unmuteStatus, toggleStatusSpoilers } from 'mastodon/actions
 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 { Dropdown } from 'mastodon/components/dropdown_menu';
@@ -151,14 +150,14 @@ export const Conversation = ({ conversation, scrollKey, onMoveUp, onMoveDown })
   menu.push({ text: intl.formatMessage(messages.delete), action: handleDelete });
 
   const names = accounts.map(a => (
-    <Permalink to={`/@${a.get('acct')}`} href={a.get('url')} key={a.get('id')} data-hover-card-account={a.get('id')}>
+    <Link to={`/@${a.get('acct')}`} key={a.get('id')} data-hover-card-account={a.get('id')}>
       <bdi>
         <strong
           className='display-name__html'
           dangerouslySetInnerHTML={{ __html: a.get('display_name_html') }}
         />
       </bdi>
-    </Permalink>
+    </Link>
   )).reduce((prev, cur) => [prev, ', ', cur]);
 
   const handlers = {
diff --git a/app/javascript/mastodon/features/directory/components/account_card.tsx b/app/javascript/mastodon/features/directory/components/account_card.tsx
index 0eabf6c56..2a0470bb7 100644
--- a/app/javascript/mastodon/features/directory/components/account_card.tsx
+++ b/app/javascript/mastodon/features/directory/components/account_card.tsx
@@ -4,6 +4,7 @@ import { useCallback } from 'react';
 import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
 
 import classNames from 'classnames';
+import { Link } from 'react-router-dom';
 
 import {
   followAccount,
@@ -14,7 +15,6 @@ 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 } from 'mastodon/initial_state';
 import type { Account } from 'mastodon/models/account';
@@ -165,11 +165,7 @@ export const AccountCard: React.FC<{ accountId: string }> = ({ accountId }) => {
 
   return (
     <div className='account-card'>
-      <Permalink
-        href={account.get('url')}
-        to={`/@${account.get('acct')}`}
-        className='account-card__permalink'
-      >
+      <Link to={`/@${account.get('acct')}`} className='account-card__permalink'>
         <div className='account-card__header'>
           <img
             src={
@@ -185,7 +181,7 @@ export const AccountCard: React.FC<{ accountId: string }> = ({ accountId }) => {
           </div>
           <DisplayName account={account as Account} />
         </div>
-      </Permalink>
+      </Link>
 
       {account.get('note').length > 0 && (
         <div
diff --git a/app/javascript/mastodon/features/follow_requests/components/account_authorize.jsx b/app/javascript/mastodon/features/follow_requests/components/account_authorize.jsx
index 3fc3b96da..dd308c87c 100644
--- a/app/javascript/mastodon/features/follow_requests/components/account_authorize.jsx
+++ b/app/javascript/mastodon/features/follow_requests/components/account_authorize.jsx
@@ -2,11 +2,11 @@ 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 { Permalink } from 'mastodon/components/permalink';
-
 import CheckIcon from '@/material-icons/400-24px/check.svg?react';
 import CloseIcon from '@/material-icons/400-24px/close.svg?react';
 
@@ -35,10 +35,10 @@ class AccountAuthorize extends ImmutablePureComponent {
     return (
       <div className='account-authorize__wrapper'>
         <div className='account-authorize'>
-          <Permalink href={account.get('url')} to={`/@${account.get('acct')}`} className='detailed-status__display-name'>
+          <Link to={`/@${account.get('acct')}`} className='detailed-status__display-name'>
             <div className='account-authorize__avatar'><Avatar account={account} size={48} /></div>
             <DisplayName account={account} />
-          </Permalink>
+          </Link>
 
           <div className='account__header__content translate' dangerouslySetInnerHTML={content} />
         </div>
diff --git a/app/javascript/mastodon/features/notifications/components/follow_request.jsx b/app/javascript/mastodon/features/notifications/components/follow_request.jsx
index dadfb2943..4024455cb 100644
--- a/app/javascript/mastodon/features/notifications/components/follow_request.jsx
+++ b/app/javascript/mastodon/features/notifications/components/follow_request.jsx
@@ -2,6 +2,8 @@ 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';
 
@@ -10,7 +12,6 @@ import CloseIcon from '@/material-icons/400-24px/close.svg?react';
 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' },
@@ -45,10 +46,10 @@ class FollowRequest extends ImmutablePureComponent {
     return (
       <div className='account'>
         <div className='account__wrapper'>
-          <Permalink key={account.get('id')} className='account__display-name' title={account.get('acct')} href={account.get('url')} to={`/@${account.get('acct')}`}>
+          <Link key={account.get('id')} className='account__display-name' title={account.get('acct')} to={`/@${account.get('acct')}`}>
             <div className='account__avatar-wrapper'><Avatar account={account} size={36} /></div>
             <DisplayName account={account} />
-          </Permalink>
+          </Link>
 
           <div className='account__relationship'>
             <IconButton title={intl.formatMessage(messages.authorize)} icon='check' iconComponent={CheckIcon} onClick={onAuthorize} />
diff --git a/app/javascript/mastodon/features/notifications/components/notification.jsx b/app/javascript/mastodon/features/notifications/components/notification.jsx
index f0302e4d5..4629bb3a4 100644
--- a/app/javascript/mastodon/features/notifications/components/notification.jsx
+++ b/app/javascript/mastodon/features/notifications/components/notification.jsx
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import { injectIntl, FormattedMessage, defineMessages } from 'react-intl';
 
 import classNames from 'classnames';
-import { withRouter } from 'react-router-dom';
+import { Link, withRouter } from 'react-router-dom';
 
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
@@ -20,7 +20,6 @@ import RepeatIcon from '@/material-icons/400-24px/repeat.svg?react';
 import StarIcon from '@/material-icons/400-24px/star-fill.svg?react';
 import { Account } from 'mastodon/components/account';
 import { Icon }  from 'mastodon/components/icon';
-import { Permalink } from 'mastodon/components/permalink';
 import { StatusQuoteManager } from 'mastodon/components/status_quoted';
 import { me } from 'mastodon/initial_state';
 import { WithRouterPropTypes } from 'mastodon/utils/react_router';
@@ -436,7 +435,7 @@ class Notification extends ImmutablePureComponent {
 
     const targetAccount = report.get('target_account');
     const targetDisplayNameHtml = { __html: targetAccount.get('display_name_html') };
-    const targetLink = <bdi><Permalink className='notification__display-name' title={targetAccount.get('acct')} data-hover-card-account={targetAccount.get('id')} href={targetAccount.get('url')} to={`/@${targetAccount.get('acct')}`} dangerouslySetInnerHTML={targetDisplayNameHtml} /></bdi>;
+    const targetLink = <bdi><Link className='notification__display-name' title={targetAccount.get('acct')} data-hover-card-account={targetAccount.get('id')} to={`/@${targetAccount.get('acct')}`} dangerouslySetInnerHTML={targetDisplayNameHtml} /></bdi>;
 
     return (
       <HotKeys handlers={this.getHandlers()}>
@@ -459,7 +458,7 @@ class Notification extends ImmutablePureComponent {
     const { notification } = this.props;
     const account          = notification.get('account');
     const displayNameHtml  = { __html: account.get('display_name_html') };
-    const link             = <bdi><Permalink className='notification__display-name' to={`/@${account.get('acct')}`} title={account.get('acct')} data-hover-card-account={account.get('id')} href={account.get('url')} dangerouslySetInnerHTML={displayNameHtml} /></bdi>;
+    const link             = <bdi><Link className='notification__display-name' to={`/@${account.get('acct')}`} title={account.get('acct')} data-hover-card-account={account.get('id')} dangerouslySetInnerHTML={displayNameHtml} /></bdi>;
 
     switch(notification.get('type')) {
     case 'follow':
diff --git a/app/javascript/mastodon/features/status/components/detailed_status.tsx b/app/javascript/mastodon/features/status/components/detailed_status.tsx
index 272547483..27aef300f 100644
--- a/app/javascript/mastodon/features/status/components/detailed_status.tsx
+++ b/app/javascript/mastodon/features/status/components/detailed_status.tsx
@@ -24,7 +24,6 @@ import { getHashtagBarForStatus } from 'mastodon/components/hashtag_bar';
 import { Icon } from 'mastodon/components/icon';
 import { IconLogo } from 'mastodon/components/logo';
 import MediaGallery from 'mastodon/components/media_gallery';
-import { Permalink } from 'mastodon/components/permalink';
 import { PictureInPicturePlaceholder } from 'mastodon/components/picture_in_picture_placeholder';
 import StatusContent from 'mastodon/components/status_content';
 import { QuotedStatus } from 'mastodon/components/status_quoted';
@@ -332,9 +331,8 @@ export const DetailedStatus: React.FC<{
             />
           </div>
         )}
-        <Permalink
+        <Link
           to={`/@${status.getIn(['account', 'acct'])}`}
-          href={status.getIn(['account', 'url'])}
           data-hover-card-account={status.getIn(['account', 'id'])}
           className='detailed-status__display-name'
         >
@@ -352,7 +350,7 @@ export const DetailedStatus: React.FC<{
               <IconLogo />
             </>
           )}
-        </Permalink>
+        </Link>
 
         {matchedFilters && (
           <FilterWarning