From 408d4710ed0e7f0414947105afa286cfe8981e88 Mon Sep 17 00:00:00 2001 From: Claire Date: Sat, 9 Dec 2023 20:26:57 +0100 Subject: [PATCH 1/4] Further reduce differences with upstream --- .../flavours/glitch/components/account.jsx | 14 ++----------- .../flavours/glitch/components/column.jsx | 5 ++--- .../features/account_timeline/index.jsx | 2 +- .../flavours/glitch/features/blocks/index.jsx | 2 +- .../features/bookmarked_statuses/index.jsx | 2 +- .../features/community_timeline/index.jsx | 10 +++++----- .../features/favourited_statuses/index.jsx | 2 +- .../glitch/features/favourites/index.jsx | 3 ++- .../glitch/features/follow_requests/index.jsx | 2 +- .../glitch/features/getting_started/index.jsx | 2 +- .../glitch/features/home_timeline/index.jsx | 2 +- .../flavours/glitch/features/mutes/index.jsx | 2 +- .../glitch/features/notifications/index.jsx | 1 - .../glitch/features/onboarding/share.jsx | 2 +- .../glitch/features/public_timeline/index.jsx | 2 +- .../features/status/components/action_bar.jsx | 14 ++++++------- .../features/status/components/card.jsx | 20 ++++++++++--------- .../status/components/detailed_status.jsx | 2 +- .../features/ui/components/columns_area.jsx | 2 +- .../features/ui/components/media_modal.jsx | 1 + 20 files changed, 42 insertions(+), 50 deletions(-) diff --git a/app/javascript/flavours/glitch/components/account.jsx b/app/javascript/flavours/glitch/components/account.jsx index 6342ef6f4..00bf537bb 100644 --- a/app/javascript/flavours/glitch/components/account.jsx +++ b/app/javascript/flavours/glitch/components/account.jsx @@ -17,7 +17,6 @@ import { Avatar } from './avatar'; import { Button } from './button'; import { FollowersCounter } from './counters'; import { DisplayName } from './display_name'; -import { IconButton } from './icon_button'; import Permalink from './permalink'; import { RelativeTimestamp } from './relative_timestamp'; @@ -45,10 +44,7 @@ class Account extends ImmutablePureComponent { intl: PropTypes.object.isRequired, hidden: PropTypes.bool, minimal: PropTypes.bool, - actionIcon: PropTypes.string, - actionTitle: PropTypes.string, defaultAction: PropTypes.string, - onActionClick: PropTypes.func, withBio: PropTypes.bool, }; @@ -76,12 +72,8 @@ class Account extends ImmutablePureComponent { this.props.onMuteNotifications(this.props.account, false); }; - handleAction = () => { - this.props.onActionClick(this.props.account); - }; - render () { - const { account, intl, hidden, withBio, onActionClick, actionIcon, actionTitle, defaultAction, size, minimal } = this.props; + const { account, intl, hidden, withBio, defaultAction, size, minimal } = this.props; if (!account) { return ; @@ -98,9 +90,7 @@ class Account extends ImmutablePureComponent { let buttons; - if (actionIcon && onActionClick) { - buttons = ; - } else if (!actionIcon && account.get('id') !== me && account.get('relationship', null) !== null) { + if (account.get('id') !== me && account.get('relationship', null) !== null) { const following = account.getIn(['relationship', 'following']); const requested = account.getIn(['relationship', 'requested']); const blocking = account.getIn(['relationship', 'blocking']); diff --git a/app/javascript/flavours/glitch/components/column.jsx b/app/javascript/flavours/glitch/components/column.jsx index e42a53905..22d6eabed 100644 --- a/app/javascript/flavours/glitch/components/column.jsx +++ b/app/javascript/flavours/glitch/components/column.jsx @@ -12,7 +12,6 @@ export default class Column extends PureComponent { static propTypes = { children: PropTypes.node, extraClasses: PropTypes.string, - name: PropTypes.string, label: PropTypes.string, bindToDocument: PropTypes.bool, }; @@ -62,10 +61,10 @@ export default class Column extends PureComponent { } render () { - const { children, extraClasses, name, label } = this.props; + const { label, children, extraClasses } = this.props; return ( -
+
{children}
); diff --git a/app/javascript/flavours/glitch/features/account_timeline/index.jsx b/app/javascript/flavours/glitch/features/account_timeline/index.jsx index 45a599f24..d86951fcd 100644 --- a/app/javascript/flavours/glitch/features/account_timeline/index.jsx +++ b/app/javascript/flavours/glitch/features/account_timeline/index.jsx @@ -184,7 +184,7 @@ class AccountTimeline extends ImmutablePureComponent { const remoteMessage = remote ? : null; return ( - + ; return ( - + ; return ( - + { class CommunityTimeline extends PureComponent { - static defaultProps = { - onlyMedia: false, - }; - static contextTypes = { identity: PropTypes.object, }; + static defaultProps = { + onlyMedia: false, + }; + static propTypes = { dispatch: PropTypes.func.isRequired, columnId: PropTypes.string, @@ -128,7 +128,7 @@ class CommunityTimeline extends PureComponent { const pinned = !!columnId; return ( - + ; return ( - + + )} /> + + +
{!multiColumn && signedIn && } diff --git a/app/javascript/flavours/glitch/features/home_timeline/index.jsx b/app/javascript/flavours/glitch/features/home_timeline/index.jsx index d3547ed3b..20351833a 100644 --- a/app/javascript/flavours/glitch/features/home_timeline/index.jsx +++ b/app/javascript/flavours/glitch/features/home_timeline/index.jsx @@ -196,7 +196,7 @@ class HomeTimeline extends PureComponent { } return ( - + ; return ( - + diff --git a/app/javascript/flavours/glitch/features/onboarding/share.jsx b/app/javascript/flavours/glitch/features/onboarding/share.jsx index a313ee2e8..488096654 100644 --- a/app/javascript/flavours/glitch/features/onboarding/share.jsx +++ b/app/javascript/flavours/glitch/features/onboarding/share.jsx @@ -13,7 +13,7 @@ import SwipeableViews from 'react-swipeable-views'; import Column from 'flavours/glitch/components/column'; import ColumnBackButton from 'flavours/glitch/components/column_back_button'; -import { Icon } from 'flavours/glitch/components/icon'; +import { Icon } from 'flavours/glitch/components/icon'; import { me, domain } from 'flavours/glitch/initial_state'; import ArrowSmallRight from './components/arrow_small_right'; diff --git a/app/javascript/flavours/glitch/features/public_timeline/index.jsx b/app/javascript/flavours/glitch/features/public_timeline/index.jsx index 8c373d99a..79719fd2d 100644 --- a/app/javascript/flavours/glitch/features/public_timeline/index.jsx +++ b/app/javascript/flavours/glitch/features/public_timeline/index.jsx @@ -133,7 +133,7 @@ class PublicTimeline extends PureComponent { const pinned = !!columnId; return ( - + { - this.props.onMuteConversation(this.props.status); - }; - handleBlockClick = () => { this.props.onBlock(this.props.status); }; + handleConversationMuteClick = () => { + this.props.onMuteConversation(this.props.status); + }; + handleReport = () => { this.props.onReport(this.props.status); }; diff --git a/app/javascript/flavours/glitch/features/status/components/card.jsx b/app/javascript/flavours/glitch/features/status/components/card.jsx index a64314efa..4e7ccf96f 100644 --- a/app/javascript/flavours/glitch/features/status/components/card.jsx +++ b/app/javascript/flavours/glitch/features/status/components/card.jsx @@ -3,13 +3,13 @@ import { PureComponent } from 'react'; import { FormattedMessage } from 'react-intl'; -import classnames from 'classnames'; +import classNames from 'classnames'; import Immutable from 'immutable'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { Blurhash } from 'flavours/glitch/components/blurhash'; -import { Icon } from 'flavours/glitch/components/icon'; +import { Icon } from 'flavours/glitch/components/icon'; import { useBlurhash } from 'flavours/glitch/initial_state'; import { decode as decodeIDNA } from 'flavours/glitch/utils/idna'; @@ -148,7 +148,7 @@ export default class Card extends PureComponent { const provider = card.get('provider_name').length === 0 ? decodeIDNA(getHostname(card.get('url'))) : card.get('provider_name'); const horizontal = (!compact && card.get('width') > card.get('height')) || card.get('type') !== 'link' || embedded; const interactive = card.get('type') !== 'link'; - const className = classnames('status-card', { horizontal, compact, interactive }); + const className = classNames('status-card', { horizontal, compact, interactive }); const title = interactive ? {card.get('title')} : {card.get('title')}; const language = card.get('language') || ''; @@ -171,15 +171,17 @@ export default class Card extends PureComponent { let embed = ''; let canvas = ( ); + const thumbnailDescription = card.get('image_description'); const thumbnail = {thumbnailDescription}; + let spoilerButton = ( ); + spoilerButton = ( -
+
{spoilerButton}
); @@ -209,15 +212,14 @@ export default class Card extends PureComponent { {canvas} {thumbnail} - {revealed && ( + {revealed ? (
- + {horizontal && }
- )} - {!revealed && spoilerButton} + ) : spoilerButton}
); } diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx index bf41aa931..a5908e6da 100644 --- a/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx +++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx @@ -12,7 +12,7 @@ import { AnimatedNumber } from 'flavours/glitch/components/animated_number'; import AttachmentList from 'flavours/glitch/components/attachment_list'; import EditedTimestamp from 'flavours/glitch/components/edited_timestamp'; import { getHashtagBarForStatus } from 'flavours/glitch/components/hashtag_bar'; -import { Icon } from 'flavours/glitch/components/icon'; +import { Icon } from 'flavours/glitch/components/icon'; import PictureInPicturePlaceholder from 'flavours/glitch/components/picture_in_picture_placeholder'; import VisibilityIcon from 'flavours/glitch/components/status_visibility_icon'; import PollContainer from 'flavours/glitch/containers/poll_container'; diff --git a/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx b/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx index f1e7baf8d..05a02ae6c 100644 --- a/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx +++ b/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx @@ -75,7 +75,7 @@ export default class ColumnsArea extends ImmutablePureComponent { this.isRtlLayout = document.getElementsByTagName('body')[0].classList.contains('rtl'); } - componentWillUpdate(nextProps) { + UNSAFE_componentWillUpdate(nextProps) { if (this.props.singleColumn !== nextProps.singleColumn && nextProps.singleColumn) { this.node.removeEventListener('wheel', this.handleWheel); } diff --git a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx index 676659c53..9fc51e620 100644 --- a/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx +++ b/app/javascript/flavours/glitch/features/ui/components/media_modal.jsx @@ -96,6 +96,7 @@ class MediaModal extends ImmutablePureComponent { componentDidMount () { window.addEventListener('keydown', this.handleKeyDown, false); + this._sendBackgroundColor(); } From 4b2ddaf106fdfa89304933363c8fea124b040319 Mon Sep 17 00:00:00 2001 From: Claire Date: Sat, 9 Dec 2023 20:29:53 +0100 Subject: [PATCH 2/4] Further reduce differences with upstream --- .../flavours/glitch/components/status.jsx | 2 +- .../flavours/glitch/containers/mastodon.jsx | 5 ++- .../account/components/featured_tags.jsx | 2 +- .../features/account/components/header.jsx | 2 +- .../account_gallery/components/media_item.jsx | 2 +- .../flavours/glitch/features/audio/index.jsx | 2 +- .../compose/components/navigation_bar.jsx | 10 +++-- .../features/compose/components/search.jsx | 38 +++++++++---------- .../compose/components/search_results.jsx | 3 +- 9 files changed, 33 insertions(+), 33 deletions(-) diff --git a/app/javascript/flavours/glitch/components/status.jsx b/app/javascript/flavours/glitch/components/status.jsx index 81cd30fd2..fe1229d8d 100644 --- a/app/javascript/flavours/glitch/components/status.jsx +++ b/app/javascript/flavours/glitch/components/status.jsx @@ -79,6 +79,7 @@ class Status extends ImmutablePureComponent { previousId: PropTypes.string, nextInReplyToId: PropTypes.string, rootId: PropTypes.string, + onClick: PropTypes.func, onReply: PropTypes.func, onFavourite: PropTypes.func, onReblog: PropTypes.func, @@ -109,7 +110,6 @@ class Status extends ImmutablePureComponent { intl: PropTypes.object.isRequired, cacheMediaWidth: PropTypes.func, cachedMediaWidth: PropTypes.number, - onClick: PropTypes.func, scrollKey: PropTypes.string, deployPictureInPicture: PropTypes.func, settings: ImmutablePropTypes.map.isRequired, diff --git a/app/javascript/flavours/glitch/containers/mastodon.jsx b/app/javascript/flavours/glitch/containers/mastodon.jsx index 1ab20d022..070e94fe8 100644 --- a/app/javascript/flavours/glitch/containers/mastodon.jsx +++ b/app/javascript/flavours/glitch/containers/mastodon.jsx @@ -22,6 +22,7 @@ import { store } from 'flavours/glitch/store'; const title = process.env.NODE_ENV === 'production' ? siteTitle : `${siteTitle} (Dev)`; const hydrateAction = hydrateStore(initialState); + store.dispatch(hydrateAction); // check for deprecated local settings @@ -71,8 +72,8 @@ export default class Mastodon extends PureComponent { } } - shouldUpdateScroll (_, { location }) { - return !(location.state?.mastodonModalKey); + shouldUpdateScroll (prevRouterProps, { location }) { + return !(location.state?.mastodonModalKey && location.state?.mastodonModalKey !== prevRouterProps?.location?.state?.mastodonModalKey); } render () { diff --git a/app/javascript/flavours/glitch/features/account/components/featured_tags.jsx b/app/javascript/flavours/glitch/features/account/components/featured_tags.jsx index 4ddf0dc52..720acab43 100644 --- a/app/javascript/flavours/glitch/features/account/components/featured_tags.jsx +++ b/app/javascript/flavours/glitch/features/account/components/featured_tags.jsx @@ -38,7 +38,7 @@ class FeaturedTags extends ImmutablePureComponent { name={featuredTag.get('name')} href={featuredTag.get('url')} to={`/@${account.get('acct')}/tagged/${featuredTag.get('name')}`} - uses={featuredTag.get('statuses_count')} + uses={featuredTag.get('statuses_count') * 1} withGraph={false} description={((featuredTag.get('statuses_count') * 1) > 0) ? intl.formatMessage(messages.lastStatusAt, { date: intl.formatDate(featuredTag.get('last_status_at'), { month: 'short', day: '2-digit' }) }) : intl.formatMessage(messages.empty)} /> diff --git a/app/javascript/flavours/glitch/features/account/components/header.jsx b/app/javascript/flavours/glitch/features/account/components/header.jsx index c64bfb3b5..f0cfa0f81 100644 --- a/app/javascript/flavours/glitch/features/account/components/header.jsx +++ b/app/javascript/flavours/glitch/features/account/components/header.jsx @@ -11,7 +11,7 @@ import ImmutablePureComponent from 'react-immutable-pure-component'; import { Avatar } from 'flavours/glitch/components/avatar'; import { Button } from 'flavours/glitch/components/button'; -import { Icon } from 'flavours/glitch/components/icon'; +import { Icon } from 'flavours/glitch/components/icon'; import { IconButton } from 'flavours/glitch/components/icon_button'; import DropdownMenuContainer from 'flavours/glitch/containers/dropdown_menu_container'; import { autoPlayGif, me, domain } from 'flavours/glitch/initial_state'; diff --git a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx index aaa872b0a..87189ecf1 100644 --- a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx +++ b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.jsx @@ -76,7 +76,7 @@ export default class MediaItem extends ImmutablePureComponent { if (['audio', 'video'].includes(attachment.get('type'))) { content = ( {attachment.get('description')} - - {this.props.account.get('acct')} - + + {username} +
- @{this.props.account.get('acct')} + @{username} { profileLink !== undefined && ( diff --git a/app/javascript/flavours/glitch/features/compose/components/search.jsx b/app/javascript/flavours/glitch/features/compose/components/search.jsx index ed717f215..64732068e 100644 --- a/app/javascript/flavours/glitch/features/compose/components/search.jsx +++ b/app/javascript/flavours/glitch/features/compose/components/search.jsx @@ -92,25 +92,6 @@ class Search extends PureComponent { } }; - handleBlur = () => { - this.setState({ expanded: false, selectedOption: -1 }); - }; - - handleFocus = () => { - const { onShow, singleColumn } = this.props; - - this.setState({ expanded: true, selectedOption: -1 }); - onShow(); - - if (this.searchForm && !singleColumn) { - const { left, right } = this.searchForm.getBoundingClientRect(); - - if (left < 0 || right > (window.innerWidth || document.documentElement.clientWidth)) { - this.searchForm.scrollIntoView(); - } - } - }; - handleKeyDown = (e) => { const { selectedOption } = this.state; const options = searchEnabled ? this._getOptions().concat(this.defaultOptions) : this._getOptions(); @@ -161,8 +142,23 @@ class Search extends PureComponent { } }; - findTarget = () => { - return this.searchForm; + handleFocus = () => { + const { onShow, singleColumn } = this.props; + + this.setState({ expanded: true, selectedOption: -1 }); + onShow(); + + if (this.searchForm && !singleColumn) { + const { left, right } = this.searchForm.getBoundingClientRect(); + + if (left < 0 || right > (window.innerWidth || document.documentElement.clientWidth)) { + this.searchForm.scrollIntoView(); + } + } + }; + + handleBlur = () => { + this.setState({ expanded: false, selectedOption: -1 }); }; handleHashtagClick = () => { diff --git a/app/javascript/flavours/glitch/features/compose/components/search_results.jsx b/app/javascript/flavours/glitch/features/compose/components/search_results.jsx index e8379a932..af7b8a6c7 100644 --- a/app/javascript/flavours/glitch/features/compose/components/search_results.jsx +++ b/app/javascript/flavours/glitch/features/compose/components/search_results.jsx @@ -5,7 +5,7 @@ import { FormattedMessage } from 'react-intl'; import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; -import { Icon } from 'flavours/glitch/components/icon'; +import { Icon } from 'flavours/glitch/components/icon'; import { LoadMore } from 'flavours/glitch/components/load_more'; import { SearchSection } from 'flavours/glitch/features/explore/components/search_section'; @@ -69,6 +69,7 @@ class SearchResults extends ImmutablePureComponent { ); } + return (
From cc1d68ace82666cbcc9604b2141b2fa8817bd431 Mon Sep 17 00:00:00 2001 From: Claire Date: Sat, 9 Dec 2023 20:34:55 +0100 Subject: [PATCH 3/4] [Glitch] Show announcements in reverse chronological order Port f1f0400adcd667b8ea558dad0bf42236f12530f4 and 8e2530ea16332f389edaeba7e87d7447c077bb00 to glitch-soc Co-Authored-By: Darius Kazemi --- .../features/getting_started/components/announcements.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/javascript/flavours/glitch/features/getting_started/components/announcements.jsx b/app/javascript/flavours/glitch/features/getting_started/components/announcements.jsx index 5d1a518cc..3ccbd9dfd 100644 --- a/app/javascript/flavours/glitch/features/getting_started/components/announcements.jsx +++ b/app/javascript/flavours/glitch/features/getting_started/components/announcements.jsx @@ -394,7 +394,7 @@ class Announcements extends ImmutablePureComponent { _markAnnouncementAsRead () { const { dismissAnnouncement, announcements } = this.props; const { index } = this.state; - const announcement = announcements.get(index); + const announcement = announcements.get(announcements.size - 1 - index); if (!announcement.get('read')) dismissAnnouncement(announcement.get('id')); } @@ -435,7 +435,7 @@ class Announcements extends ImmutablePureComponent { selected={index === idx} disabled={disableSwiping} /> - ))} + )).reverse()} {announcements.size > 1 && ( From df5c64fe5761a49f23d84478172eed16853b4ea5 Mon Sep 17 00:00:00 2001 From: Claire Date: Sat, 9 Dec 2023 20:58:31 +0100 Subject: [PATCH 4/4] Further reduce differences with upstream --- .../features/picture_in_picture/components/footer.jsx | 6 +++--- .../features/report/components/status_check_box.jsx | 8 ++++++-- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/app/javascript/flavours/glitch/features/picture_in_picture/components/footer.jsx b/app/javascript/flavours/glitch/features/picture_in_picture/components/footer.jsx index 51d7c1066..28dab45dc 100644 --- a/app/javascript/flavours/glitch/features/picture_in_picture/components/footer.jsx +++ b/app/javascript/flavours/glitch/features/picture_in_picture/components/footer.jsx @@ -122,8 +122,8 @@ class Footer extends ImmutablePureComponent { } }; - _performReblog = (privacy) => { - const { dispatch, status } = this.props; + _performReblog = (status, privacy) => { + const { dispatch } = this.props; dispatch(reblog(status, privacy)); }; @@ -135,7 +135,7 @@ class Footer extends ImmutablePureComponent { if (status.get('reblogged')) { dispatch(unreblog(status)); } else if ((e && e.shiftKey) || !boostModal) { - this._performReblog(); + this._performReblog(status); } else { dispatch(initBoostModal({ status, onReblog: this._performReblog })); } diff --git a/app/javascript/flavours/glitch/features/report/components/status_check_box.jsx b/app/javascript/flavours/glitch/features/report/components/status_check_box.jsx index 533970a8c..a368c41ce 100644 --- a/app/javascript/flavours/glitch/features/report/components/status_check_box.jsx +++ b/app/javascript/flavours/glitch/features/report/components/status_check_box.jsx @@ -12,7 +12,7 @@ import VisibilityIcon from 'flavours/glitch/components/status_visibility_icon'; import Option from './option'; -export default class StatusCheckBox extends PureComponent { +class StatusCheckBox extends PureComponent { static propTypes = { id: PropTypes.string.isRequired, @@ -40,7 +40,9 @@ export default class StatusCheckBox extends PureComponent {
-
·
+
+ · +
} /> @@ -61,3 +63,5 @@ export default class StatusCheckBox extends PureComponent { } } + +export default StatusCheckBox;