From 4924ad9344c6754b768baafa021ef8cdb23f14cf Mon Sep 17 00:00:00 2001 From: Darius Kazemi Date: Mon, 24 Nov 2025 03:39:34 -0800 Subject: [PATCH] More merging Work to maintain - Permalinks (aka links outside the app instead of inside) - Alt badges and no-alt badges and media-description-missing class for audio/video - Federation dropdowns and icons (local-only UI) --- .../mastodon/components/account/index.tsx | 7 +- app/javascript/mastodon/components/status.jsx | 10 - .../mastodon/components/status_action_bar.jsx | 4 - .../account/components/featured_tags.jsx | 52 -- .../features/account/components/header.jsx | 520 --------------- .../components/moved_note.jsx | 39 -- .../mastodon/features/audio/index.jsx | 602 ------------------ .../mastodon/features/audio/index.tsx | 4 + .../compose/components/compose_form.jsx | 15 +- .../mastodon/features/compose/index.jsx | 159 ----- .../mastodon/features/explore/index.jsx | 114 ---- .../notifications/components/notification.jsx | 5 - .../picture_in_picture/components/footer.jsx | 186 ------ .../status/components/detailed_status.tsx | 40 +- .../features/ui/components/column_link.jsx | 59 -- .../features/ui/components/link_footer.tsx | 10 +- .../mastodon/features/video/index.tsx | 4 + app/javascript/mastodon/initial_state.js | 3 - 18 files changed, 26 insertions(+), 1807 deletions(-) delete mode 100644 app/javascript/mastodon/features/account/components/featured_tags.jsx delete mode 100644 app/javascript/mastodon/features/account/components/header.jsx delete mode 100644 app/javascript/mastodon/features/account_timeline/components/moved_note.jsx delete mode 100644 app/javascript/mastodon/features/audio/index.jsx delete mode 100644 app/javascript/mastodon/features/compose/index.jsx delete mode 100644 app/javascript/mastodon/features/explore/index.jsx delete mode 100644 app/javascript/mastodon/features/picture_in_picture/components/footer.jsx delete mode 100644 app/javascript/mastodon/features/ui/components/column_link.jsx diff --git a/app/javascript/mastodon/components/account/index.tsx b/app/javascript/mastodon/components/account/index.tsx index 8397695a4..ade17012d 100644 --- a/app/javascript/mastodon/components/account/index.tsx +++ b/app/javascript/mastodon/components/account/index.tsx @@ -3,7 +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 { Permalink } from 'react-router-dom'; import MoreHorizIcon from '@/material-icons/400-24px/more_horiz.svg?react'; import { @@ -293,9 +293,10 @@ export const Account: React.FC = ({ })} >
- @@ -326,7 +327,7 @@ export const Account: React.FC = ({
)} - + {account && withBio && diff --git a/app/javascript/mastodon/components/status.jsx b/app/javascript/mastodon/components/status.jsx index bf2f87d5b..f240e0183 100644 --- a/app/javascript/mastodon/components/status.jsx +++ b/app/javascript/mastodon/components/status.jsx @@ -412,11 +412,7 @@ class Status extends ImmutablePureComponent { prepend = (
-<<<<<<< HEAD - }} /> -======= }} /> ->>>>>>> v4.4.0
); @@ -567,14 +563,8 @@ class Status extends ImmutablePureComponent { > {(connectReply || connectUp || connectToRoot) &&
} -<<<<<<< HEAD - {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */} -
- -=======
->>>>>>> v4.4.0 {status.get('edited_at') && *} diff --git a/app/javascript/mastodon/components/status_action_bar.jsx b/app/javascript/mastodon/components/status_action_bar.jsx index f75d9cc48..8d8ba0b3e 100644 --- a/app/javascript/mastodon/components/status_action_bar.jsx +++ b/app/javascript/mastodon/components/status_action_bar.jsx @@ -392,14 +392,10 @@ class StatusActionBar extends ImmutablePureComponent {
-<<<<<<< HEAD { !federated && }
- >>>>>> v4.4.0 scrollKey={scrollKey} status={status} items={menu} diff --git a/app/javascript/mastodon/features/account/components/featured_tags.jsx b/app/javascript/mastodon/features/account/components/featured_tags.jsx deleted file mode 100644 index de0ef085c..000000000 --- a/app/javascript/mastodon/features/account/components/featured_tags.jsx +++ /dev/null @@ -1,52 +0,0 @@ -import PropTypes from 'prop-types'; - -import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; - -import ImmutablePropTypes from 'react-immutable-proptypes'; -import ImmutablePureComponent from 'react-immutable-pure-component'; - -import { Hashtag } from 'mastodon/components/hashtag'; - -const messages = defineMessages({ - lastStatusAt: { id: 'account.featured_tags.last_status_at', defaultMessage: 'Last post on {date}' }, - empty: { id: 'account.featured_tags.last_status_never', defaultMessage: 'No posts' }, -}); - -class FeaturedTags extends ImmutablePureComponent { - - static propTypes = { - account: ImmutablePropTypes.record, - featuredTags: ImmutablePropTypes.list, - tagged: PropTypes.string, - intl: PropTypes.object.isRequired, - }; - - render () { - const { account, featuredTags, intl } = this.props; - - if (!account || account.get('suspended') || featuredTags.isEmpty()) { - return null; - } - - return ( -
-

}} />

- - {featuredTags.take(3).map(featuredTag => ( - 0) ? intl.formatMessage(messages.lastStatusAt, { date: intl.formatDate(featuredTag.get('last_status_at'), { month: 'short', day: '2-digit' }) }) : intl.formatMessage(messages.empty)} - /> - ))} -
- ); - } - -} - -export default injectIntl(FeaturedTags); diff --git a/app/javascript/mastodon/features/account/components/header.jsx b/app/javascript/mastodon/features/account/components/header.jsx deleted file mode 100644 index 047d2a196..000000000 --- a/app/javascript/mastodon/features/account/components/header.jsx +++ /dev/null @@ -1,520 +0,0 @@ -import PropTypes from 'prop-types'; - -import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; - -import classNames from 'classnames'; -import { Helmet } from 'react-helmet'; -import { NavLink, withRouter } from 'react-router-dom'; - -import ImmutablePropTypes from 'react-immutable-proptypes'; -import ImmutablePureComponent from 'react-immutable-pure-component'; - -import CheckIcon from '@/material-icons/400-24px/check.svg?react'; -import LockIcon from '@/material-icons/400-24px/lock.svg?react'; -import MoreHorizIcon from '@/material-icons/400-24px/more_horiz.svg?react'; -import NotificationsIcon from '@/material-icons/400-24px/notifications.svg?react'; -import NotificationsActiveIcon from '@/material-icons/400-24px/notifications_active-fill.svg?react'; -import OpenInNewIcon from '@/material-icons/400-24px/open_in_new.svg?react'; -import ShareIcon from '@/material-icons/400-24px/share.svg?react'; -import { Avatar } from 'mastodon/components/avatar'; -import { Badge, AutomatedBadge, GroupBadge } from 'mastodon/components/badge'; -import { Button } from 'mastodon/components/button'; -import { CopyIconButton } from 'mastodon/components/copy_icon_button'; -import { FollowersCounter, FollowingCounter, StatusesCounter } from 'mastodon/components/counters'; -import { Icon } from 'mastodon/components/icon'; -import { IconButton } from 'mastodon/components/icon_button'; -import { LoadingIndicator } from 'mastodon/components/loading_indicator'; -import { ShortNumber } from 'mastodon/components/short_number'; -import DropdownMenuContainer from 'mastodon/containers/dropdown_menu_container'; -import { identityContextPropShape, withIdentity } from 'mastodon/identity_context'; -import { autoPlayGif, me, domain as localDomain } from 'mastodon/initial_state'; -import { PERMISSION_MANAGE_USERS, PERMISSION_MANAGE_FEDERATION } from 'mastodon/permissions'; -import { WithRouterPropTypes } from 'mastodon/utils/react_router'; - -import AccountNoteContainer from '../containers/account_note_container'; -import FollowRequestNoteContainer from '../containers/follow_request_note_container'; - -import { DomainPill } from './domain_pill'; - -const messages = defineMessages({ - unfollow: { id: 'account.unfollow', defaultMessage: 'Unfollow' }, - follow: { id: 'account.follow', defaultMessage: 'Follow' }, - followBack: { id: 'account.follow_back', defaultMessage: 'Follow back' }, - mutual: { id: 'account.mutual', defaultMessage: 'Mutual' }, - cancel_follow_request: { id: 'account.cancel_follow_request', defaultMessage: 'Withdraw follow request' }, - requested: { id: 'account.requested', defaultMessage: 'Awaiting approval. Click to cancel follow request' }, - unblock: { id: 'account.unblock', defaultMessage: 'Unblock @{name}' }, - edit_profile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' }, - linkVerifiedOn: { id: 'account.link_verified_on', defaultMessage: 'Ownership of this link was checked on {date}' }, - account_locked: { id: 'account.locked_info', defaultMessage: 'This account privacy status is set to locked. The owner manually reviews who can follow them.' }, - mention: { id: 'account.mention', defaultMessage: 'Mention @{name}' }, - direct: { id: 'account.direct', defaultMessage: 'Privately mention @{name}' }, - unmute: { id: 'account.unmute', defaultMessage: 'Unmute @{name}' }, - block: { id: 'account.block', defaultMessage: 'Block @{name}' }, - mute: { id: 'account.mute', defaultMessage: 'Mute @{name}' }, - report: { id: 'account.report', defaultMessage: 'Report @{name}' }, - share: { id: 'account.share', defaultMessage: 'Share @{name}\'s profile' }, - copy: { id: 'account.copy', defaultMessage: 'Copy link to profile' }, - media: { id: 'account.media', defaultMessage: 'Media' }, - blockDomain: { id: 'account.block_domain', defaultMessage: 'Block domain {domain}' }, - unblockDomain: { id: 'account.unblock_domain', defaultMessage: 'Unblock domain {domain}' }, - hideReblogs: { id: 'account.hide_reblogs', defaultMessage: 'Hide boosts from @{name}' }, - showReblogs: { id: 'account.show_reblogs', defaultMessage: 'Show boosts from @{name}' }, - enableNotifications: { id: 'account.enable_notifications', defaultMessage: 'Notify me when @{name} posts' }, - disableNotifications: { id: 'account.disable_notifications', defaultMessage: 'Stop notifying me when @{name} posts' }, - pins: { id: 'navigation_bar.pins', defaultMessage: 'Pinned posts' }, - preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' }, - follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' }, - favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favorites' }, - lists: { id: 'navigation_bar.lists', defaultMessage: 'Lists' }, - followed_tags: { id: 'navigation_bar.followed_tags', defaultMessage: 'Followed hashtags' }, - blocks: { id: 'navigation_bar.blocks', defaultMessage: 'Blocked users' }, - domain_blocks: { id: 'navigation_bar.domain_blocks', defaultMessage: 'Blocked domains' }, - mutes: { id: 'navigation_bar.mutes', defaultMessage: 'Muted users' }, - endorse: { id: 'account.endorse', defaultMessage: 'Feature on profile' }, - unendorse: { id: 'account.unendorse', defaultMessage: 'Don\'t feature on profile' }, - add_or_remove_from_list: { id: 'account.add_or_remove_from_list', defaultMessage: 'Add or Remove from lists' }, - admin_account: { id: 'status.admin_account', defaultMessage: 'Open moderation interface for @{name}' }, - admin_domain: { id: 'status.admin_domain', defaultMessage: 'Open moderation interface for {domain}' }, - languages: { id: 'account.languages', defaultMessage: 'Change subscribed languages' }, - openOriginalPage: { id: 'account.open_original_page', defaultMessage: 'Open original page' }, -}); - -const titleFromAccount = account => { - const displayName = account.get('display_name'); - const acct = account.get('acct') === account.get('username') ? `${account.get('username')}@${localDomain}` : account.get('acct'); - const prefix = displayName.trim().length === 0 ? account.get('username') : displayName; - - return `${prefix} (@${acct})`; -}; - -const messageForFollowButton = relationship => { - if(!relationship) return messages.follow; - - if (relationship.get('following') && relationship.get('followed_by')) { - return messages.mutual; - } else if (relationship.get('following') || relationship.get('requested')) { - return messages.unfollow; - } else if (relationship.get('followed_by')) { - return messages.followBack; - } else { - return messages.follow; - } -}; - -const dateFormatOptions = { - month: 'short', - day: 'numeric', - year: 'numeric', - hour: '2-digit', - minute: '2-digit', -}; - -class Header extends ImmutablePureComponent { - - static propTypes = { - identity: identityContextPropShape, - account: ImmutablePropTypes.record, - identity_props: ImmutablePropTypes.list, - onFollow: PropTypes.func.isRequired, - onBlock: PropTypes.func.isRequired, - onMention: PropTypes.func.isRequired, - onDirect: PropTypes.func.isRequired, - onReblogToggle: PropTypes.func.isRequired, - onNotifyToggle: PropTypes.func.isRequired, - onReport: PropTypes.func.isRequired, - onMute: PropTypes.func.isRequired, - onBlockDomain: PropTypes.func.isRequired, - onUnblockDomain: PropTypes.func.isRequired, - onEndorseToggle: PropTypes.func.isRequired, - onAddToList: PropTypes.func.isRequired, - onEditAccountNote: PropTypes.func.isRequired, - onChangeLanguages: PropTypes.func.isRequired, - onInteractionModal: PropTypes.func.isRequired, - onOpenAvatar: PropTypes.func.isRequired, - onOpenURL: PropTypes.func.isRequired, - intl: PropTypes.object.isRequired, - domain: PropTypes.string.isRequired, - hidden: PropTypes.bool, - ...WithRouterPropTypes, - }; - - setRef = c => { - this.node = c; - }; - - openEditProfile = () => { - window.open('/settings/profile', '_blank'); - }; - - isStatusesPageActive = (match, location) => { - if (!match) { - return false; - } - - return !location.pathname.match(/\/(followers|following)\/?$/); - }; - - handleMouseEnter = ({ currentTarget }) => { - if (autoPlayGif) { - return; - } - - const emojis = currentTarget.querySelectorAll('.custom-emoji'); - - for (var i = 0; i < emojis.length; i++) { - let emoji = emojis[i]; - emoji.src = emoji.getAttribute('data-original'); - } - }; - - handleMouseLeave = ({ currentTarget }) => { - if (autoPlayGif) { - return; - } - - const emojis = currentTarget.querySelectorAll('.custom-emoji'); - - for (var i = 0; i < emojis.length; i++) { - let emoji = emojis[i]; - emoji.src = emoji.getAttribute('data-static'); - } - }; - - handleAvatarClick = e => { - if (e.button === 0 && !(e.ctrlKey || e.metaKey)) { - e.preventDefault(); - this.props.onOpenAvatar(); - } - }; - - handleDisplayNameClick = () => window.open(this.props.account.get('url')); - - handleShare = () => { - const { account } = this.props; - - navigator.share({ - url: account.get('url'), - }).catch((e) => { - if (e.name !== 'AbortError') console.error(e); - }); - }; - - handleHashtagClick = e => { - const { history } = this.props; - const value = e.currentTarget.textContent.replace(/^#/, ''); - - if (history && e.button === 0 && !(e.ctrlKey || e.metaKey)) { - e.preventDefault(); - history.push(`/tags/${value}`); - } - }; - - handleMentionClick = e => { - const { history, onOpenURL } = this.props; - - if (history && e.button === 0 && !(e.ctrlKey || e.metaKey)) { - e.preventDefault(); - - const link = e.currentTarget; - - onOpenURL(link.href, history, () => { - window.location = link.href; - }); - } - }; - - _attachLinkEvents () { - const node = this.node; - - if (!node) { - return; - } - - const links = node.querySelectorAll('a'); - - let link; - - for (var i = 0; i < links.length; ++i) { - link = links[i]; - - if (link.textContent[0] === '#' || (link.previousSibling && link.previousSibling.textContent && link.previousSibling.textContent[link.previousSibling.textContent.length - 1] === '#')) { - link.addEventListener('click', this.handleHashtagClick, false); - } else if (link.classList.contains('mention')) { - link.addEventListener('click', this.handleMentionClick, false); - } - } - } - - componentDidMount () { - this._attachLinkEvents(); - } - - componentDidUpdate () { - this._attachLinkEvents(); - } - - render () { - const { account, hidden, intl } = this.props; - const { signedIn, permissions } = this.props.identity; - - if (!account) { - return null; - } - - const suspended = account.get('suspended'); - const isRemote = account.get('acct') !== account.get('username'); - const remoteDomain = isRemote ? account.get('acct').split('@')[1] : null; - - let actionBtn, bellBtn, lockedIcon, shareBtn; - - let info = []; - let menu = []; - - if (me !== account.get('id') && account.getIn(['relationship', 'blocking'])) { - info.push(); - } - - if (me !== account.get('id') && account.getIn(['relationship', 'muting'])) { - info.push(); - } else if (me !== account.get('id') && account.getIn(['relationship', 'domain_blocking'])) { - info.push(); - } - - if (account.getIn(['relationship', 'requested']) || account.getIn(['relationship', 'following'])) { - bellBtn = ; - } - - if ('share' in navigator) { - shareBtn = ; - } else { - shareBtn = ; - } - - if (me !== account.get('id')) { - if (signedIn && !account.get('relationship')) { // Wait until the relationship is loaded - actionBtn = ; - } else if (!account.getIn(['relationship', 'blocking'])) { - actionBtn = -
- - {(revealed || editable) && } - -
-
-
- - -
- -
-
-
- - - -
-
- - -
- - - {formatTime(Math.floor(currentTime))} - / - {formatTime(Math.floor(this.state.duration || this.props.duration))} - -
- -
- {alt && } - {!alt && } - {!editable && } - - - -
-
-
-
- ); - } - -} - -export default injectIntl(Audio); diff --git a/app/javascript/mastodon/features/audio/index.tsx b/app/javascript/mastodon/features/audio/index.tsx index a6a131c0d..1a0f43103 100644 --- a/app/javascript/mastodon/features/audio/index.tsx +++ b/app/javascript/mastodon/features/audio/index.tsx @@ -16,6 +16,8 @@ import VolumeUpIcon from '@/material-icons/400-24px/volume_up-fill.svg?react'; import { Blurhash } from 'mastodon/components/blurhash'; import { Icon } from 'mastodon/components/icon'; import { SpoilerButton } from 'mastodon/components/spoiler_button'; +import { AltTextBadge } from 'mastodon/components/alt_text_badge'; +import { NoAltTextBadge } from 'mastodon/components/no_alt_text_badge'; import { formatTime, getPointerPosition } from 'mastodon/features/video'; import { useAudioContext } from 'mastodon/hooks/useAudioContext'; import { useAudioVisualizer } from 'mastodon/hooks/useAudioVisualizer'; @@ -808,6 +810,8 @@ export const Audio: React.FC<{
+ {alt && } + {!alt && } {!editable && ( <> - ); - } else { - return ( - - {active ? activeIconElement : iconElement} - {text} - {badgeElement} - - ); - } -}; - -ColumnLink.propTypes = { - icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired, - iconComponent: PropTypes.func, - activeIcon: PropTypes.node, - activeIconComponent: PropTypes.func, - text: PropTypes.string.isRequired, - to: PropTypes.string, - href: PropTypes.string, - method: PropTypes.string, - badge: PropTypes.node, - transparent: PropTypes.bool, - button: PropTypes.bool, - onClick: PropTypes.func, - optional: PropTypes.bool, -}; - -export default ColumnLink; diff --git a/app/javascript/mastodon/features/ui/components/link_footer.tsx b/app/javascript/mastodon/features/ui/components/link_footer.tsx index cbfb6a311..c2717d9e1 100644 --- a/app/javascript/mastodon/features/ui/components/link_footer.tsx +++ b/app/javascript/mastodon/features/ui/components/link_footer.tsx @@ -70,6 +70,14 @@ export const LinkFooter: React.FC<{ )}

+

+ Hometown:{' '} + + + + + v{version} +

Mastodon:{' '} @@ -93,8 +101,6 @@ export const LinkFooter: React.FC<{ defaultMessage='View source code' /> - - v{version}

); diff --git a/app/javascript/mastodon/features/video/index.tsx b/app/javascript/mastodon/features/video/index.tsx index 65f26ceda..469a99f5f 100644 --- a/app/javascript/mastodon/features/video/index.tsx +++ b/app/javascript/mastodon/features/video/index.tsx @@ -20,6 +20,8 @@ import VolumeUpIcon from '@/material-icons/400-24px/volume_up-fill.svg?react'; import { Blurhash } from 'mastodon/components/blurhash'; import { Icon } from 'mastodon/components/icon'; import { SpoilerButton } from 'mastodon/components/spoiler_button'; +import { AltTextBadge } from 'mastodon/components/alt_text_badge'; +import { NoAltTextBadge } from 'mastodon/components/no_alt_text_badge'; import { isFullscreen, requestFullscreen, @@ -989,6 +991,8 @@ export const Video: React.FC<{
+ {alt && } + {!alt && } {!fullscreen && onOpenVideo && (