This is a massive PR, so apologies for the poor performance viewing it!
This merges in the content of Mastodon 4.3.0. *This PR isn't ready to
deploy to production*, and I don't recommend trying it in a production
environment. Since I started by merging 4.3.0, this will likely have
reverted at least some of the content of the post-4.3.0 security patches
in the 4.2.x series; those will be brought back as I merge in 4.4.0 and
4.5.0.
I haven't yet tested this PR, so it may not actually run without
additional tweaks. I'm putting it up now for discussion and so multiple
people can test if we want.
---
Here's a few notes on things I ran into and thoughts I had while working
on it:
* We may want to look at `server_banner.jsx,` where I ended up undoing
the v3-style rewrite due to the new react component being used. I'm not
sure what the current goal for it is.
* I may not have 100% merged in all content from `status_action_bar`
correctly.
* There's a number of places where I updated the links for remote
usernames, and they should be tested to make sure they work. They're all
`<Permalink>` elements. I have in my notes that `status_content` might
need double-checking.
* I may also not have gotten the spoiler display right in
`status_content`.
* It looks like previous versions of Hometown had customizations to the
`media_item` display, not all of which was preserved as-is due to
surrounding rewrites. I'm not sure what the vision is and could use
another set of eyes.
* The character count rendering clashed with the newly-introduced
handling of a character count variable upstream, and I'm not sure if the
version I've got here 100% works or not.
* The navigation bar was completely rewritten and no longer has the
components Hometown was customizing; did I properly catch any
replacements? Did we handle all links to accounts to make sure they go
to the remote instance?
* Polls: I reverted the single/multiple choice toggle because upstream
has an actual proper UI for this that should be integrated in one of the
versions we’re merging in. Please double-check that the current version
looks fine to you.
* The font icons will need double-checking. Hometown made some custom
use of the font-awesome icons, while Mastodon 4.3.0 replaced
font-awesome with something else. I may not have caught all places that
font-awesome icons were being used.
* We’ll want to make sure the post display is correct, including
Hometown customizations, because the previous static post page has been
replaced with the React one.
---------
Co-authored-by: Claire <claire.github-309c@sitedethib.com>
Co-authored-by: Matt Jankowski <matt@jankowski.online>
Co-authored-by: Renaud Chaput <renchap@gmail.com>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: David Roetzel <david@roetzel.de>
Co-authored-by: Emelia Smith <ThisIsMissEm@users.noreply.github.com>
Co-authored-by: Jeong Arm <kjwonmail@gmail.com>
Co-authored-by: Christian Schmidt <github@chsc.dk>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: GitHub Actions <noreply@github.com>
Co-authored-by: Eugen Rochko <eugen@zeonfederated.com>
Co-authored-by: Darius Kazemi <darius.kazemi@gmail.com>
Co-authored-by: diondiondion <mail@diondiondion.com>
Co-authored-by: Echo <ChaosExAnima@users.noreply.github.com>
Co-authored-by: Shugo Maeda <shugo.maeda@gmail.com>
Co-authored-by: emilweth <7402764+emilweth@users.noreply.github.com>
Co-authored-by: Shlee <github@shl.ee>
Co-authored-by: Joshua Rogers <MegaManSec@users.noreply.github.com>
Co-authored-by: Jessica Stokes <hello@jessicastokes.net>
Co-authored-by: PGray <77597544+PGrayCS@users.noreply.github.com>
* Refactor shouldUpdateScroll passing
So far, shouldUpdateScroll has been manually passed down from the very top of
the React component hierarchy even though it is a static function common to
all ScrollContainer instances, so replaced that with a custom class extending
ScrollContainer.
* Generalize “press back to close modal” to any modal and to public pages
* Fix boost confirmation modal closing media modal
* Refactor shouldUpdateScroll passing
So far, shouldUpdateScroll has been manually passed down from the very top of
the React component hierarchy even though it is a static function common to
all ScrollContainer instances, so replaced that with a custom class extending
ScrollContainer.
* Generalize “press back to close modal” to any modal and to public pages
* Fix boost confirmation modal closing media modal
* Revert "persist last-intersected status update and restore when ScrollableList is restored"
This reverts commit 07e26142ef6a8e74bd2ac5e9b461a5a1699bd4c8.
accidentally merged spurious code in https://github.com/tootsuite/mastodon/pull/12661. https://github.com/tootsuite/mastodon/pull/12735 removes the slowdown that this code was trying to solve; and other functionality successfully restores the view state of the list
* Revert "cache currently-viewing status id to avoid calling redux with identical value"
This reverts commit c93df2159fbd3888a5c48d8a8b8ae61dbbc54b89.
accidentally merged spurious code in https://github.com/tootsuite/mastodon/pull/12661. https://github.com/tootsuite/mastodon/pull/12735 removes the slowdown that this code was trying to solve; and other functionality successfully restores the view state of the list
* Summary: fix slowness due to layout thrashing when reloading a large set of status updates
in order to limit the maximum size of a status in a list view (e.g. the home timeline), so as to avoid having to scroll all the way through an abnormally large status update (see https://github.com/tootsuite/mastodon/pull/8205), the following steps are taken:
•the element containing the status is rendered in the browser
•its height is calculated, to determine if it exceeds the maximum height threshold.
Unfortunately for performance, these steps are carried out in the componentDidMount(/Update) method, which also performs style modifications on the element. The combination of height request and style modification during javascript evaluation in the browser leads to layout-thrashing, where the elements are repeatedly re-laid-out (see https://developers.google.com/web/fundamentals/performance/rendering/avoid-large-complex-layouts-and-layout-thrashing & https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Performance_best_practices_for_Firefox_fe_engineers).
The solution implemented here is to memoize the collapsed state in Redux the first time the status is seen (e.g. when fetched as part of a small batch, to populate the home timeline) , so that on subsequent re-renders, the value can be queried, rather than recalculated. This strategy is derived from https://github.com/tootsuite/mastodon/pull/4439 & https://github.com/tootsuite/mastodon/pull/4909, and should resolve https://github.com/tootsuite/mastodon/issues/12455.
Andrew Lin (https://github.com/onethreeseven) is thanked for his assistance in root cause analysis and solution brainstorming
* remove getSnapshotBeforeUpdate from status
* remove componentWillUnmount from status
* persist last-intersected status update and restore when ScrollableList is restored
e.g. when navigating from home-timeline to a status conversational thread and <Back again
* cache currently-viewing status id to avoid calling redux with identical value
* refactor collapse toggle to pass explicit boolean
* Fix weird scroll-jumping behavior with pending items
* Treat pending items as unread items
* Fix scroll position being altered because of the “X new items” button
* Avoid two-step rendering of statuses as much as possible
Cache width shared by Video player, MediaGallery and Cards at the
ScrollableList level, pass it down through StatusList and Notifications.
* Adjust scroll when new preview cards appear
* Adjust scroll when statuses above the current scroll position are deleted
* Avoid two-step rendering of statuses as much as possible
Cache width shared by Video player, MediaGallery and Cards at the
ScrollableList level, pass it down through StatusList and Notifications.
* Adjust scroll when new preview cards appear
* Adjust scroll when statuses above the current scroll position are deleted
* Always use the scrollable class for the ScrollList component
Fixes#9499 as well as empty timelines' scrollbar “blinking”
between loading state and empty state.
* Do not display empty message when the list is known to have more elements
Fixes#9500
* Fix LoadMore usage in account media gallery
(Even though that codepath is probably never actually used…)
* Make account media gallery more consistent with account timeline
Fixes#9498
Display “load more” more consistently, add a loading indicator on first load.
* Fix “load more” button when no data has been fetched
So that opening a profile feels faster. Also, pinned toots are not
shown before other toots have loaded. Also, if no toots are loaded,
added empty message
- Use object properties rather than component state for
mouseMovedRecently and scrollToTopOnMouseIdle flags
- Remove redundant scrollToTop prop call, also fixing an attempt to call
an undefined prop.
Fixes#9217
- On recent mouse movement, hold timeline position so statuses remain in
place for interactions in progress.
- If the timeline had been scrolled to the top before mouse movement,
restore scroll on mouse idle.
* Revert "Do not re-position scroll when loading more (inserting items from below) (#7344)"
This reverts commit 8c601b54cc.
* Revert "Prevent timeline from moving when cursor is hovering over it (fixes#7278) (#7327)"
This reverts commit 58852695c8.
onScrollToBottom was a function to run instead of onScrollToTop and
onScroll when scrolling to the bottom. The behavior to prevent
onScrollToTop was inconvenient because the viewport can be at the bottom
and at the top at the same time if the viewport is larger than the
container.
onScrollToBottom was also called when the button to load more is clicked
on contray to the name suggests, which led notifications and
status_list_container components to mark the scrolled location is not at
the top mistakenly.
onLoadMore is a replacement for onScrollToBottom. It will be called
independently from onScrollToTop and onScroll.
* Fix#2102 - Implement hotkeys
Hotkeys on status list:
- r to reply
- m to mention author
- f to favourite
- b to boost
- enter to open status
- p to open author's profile
- up or k to move up in the list
- down or j to move down in the list
- 1-9 to focus a status in one of the columns
- n to focus the compose textarea
- alt+n to start a brand new toot
- backspace to navigate back
* Add navigational hotkeys
The key g followed by:
- s: start
- h: home
- n: notifications
- l: local timeline
- t: federated timeline
- f: favourites
- u: own profile
- p: pinned toots
- b: blocked users
- m: muted users
* Add hotkey for focusing search, make escape un-focus compose/search
* Fix focusing notifications column, fix hotkeys in compose textarea
* Fix behavior while the button is invisible
e.g. pointer cursor, couldn't open contextmenu
* Avoid rendering the button to remove blank space if no more items are available or no items are rendered