lbry-desktop/ui/util
infinite-persistence 3b47edc3b9
Livestream category improvements (#7115)
*  Remove old method of displaying active livestreams

Completely remove it for now to make the commit deltas clearer.
We'll replace it with the new method at the end.

* Fetch and store active-livestream info in redux

* Tiles can now query active-livestream state from redux instead of getting from parent.

*  ClaimTilesDiscover: revert and cleanup

## Simplify
- Simplify to just `uris` instead of having multiple arrays (`uris`, `modifiedUris`, `prevUris`)
- The `prevUris` is for CLS prevention. With this removal, the CLS issue is back, but we'll handle it differently later.
- Temporarily disable the view-count fetching. Code is left there so that I don't forget.

## Fix
- `shouldPerformSearch` was never true when `prefixUris` is present. Corrected the logic.
- Aside: prefix and pin is so similar in function. Hm ....

* ClaimTilesDiscover: factor out options

## Change
Move the `option` code outside and passed in as a pre-calculated prop.

## Reason
To skip rendering while waiting for `claim_search`, we need to add `React.memo(areEqual)`. However, the flag that determines if we are fetching `claim_search` (fetchingClaimSearchByQuery[]) depends on the derived options as the key.

Instead of calculating `options` twice, we moved it to the props so both sides can use it.

It also makes the component a bit more readable.

The downside is that the prop-passing might not be clear.

* ClaimTilesDiscover: reduce ~17 renders at startup to just 2.

* ClaimTilesDiscover: fill with placeholder while waiting for claim_search

## Issue
Livestream claims are fetched seperately, so they might already exists. While claim_search is running, the list only consists of livestreams (collapsed).

## Fix
Fill up the space with placeholders to prevent layout shift.

* Add 'useFetchViewCount' to handle fetching from lists

This effect also stashes fetched uris, so that we won't re-fetch the same uris during the same instance (e.g. during infinite scroll).

*  ClaimListDiscover: revert and cleanup

## Revert
- Removed the 'finalUris' stuff that was meant to "pause" visual changes when fetching. I think it'll be cleaner to use React.memo to achieve that.

## Alterations
- Added `renderUri` to make it clear which array that this component will render.
- Re-do the way we fetch view counts now that 'finalUris' is gone. Not the best method, but at least correct for now.

* ClaimListDiscover: add prefixUris, similar to ClaimTilesDiscover

This will be initially used to append livestreams at the top.

*  Re-enable active livestream tiles using the new method

* doFetchActiveLivestreams: add interval check

- Added a default minimum of 5 minutes between fetches. Clients can bypass this through `forceFetch` if needed.

* doFetchActiveLivestreams: add option check

We'll need to support different 'orderBy', so adding an "options check" when determining if we just made the same fetch.

* WildWest: limit livestream tiles + add ability to show more

Most likely this behavior will change in the future, so we'll leave `ClaimListDiscover` untouched and handle the logic at the page level.

This solution uses 2 `ClaimListDiscover` -- if the reduced livestream list is visible, it handles the header; else the normal list handles the header.

* Use better tile-count on larger screens.

Used the same method as how the homepage does it.
2021-09-24 10:26:21 -04:00
..
autoLaunch.js fix autolaunch after changing linux cmd capitalization 2019-12-17 13:38:09 -05:00
buildHomepage.js no limit on stream types for following 2021-08-02 16:14:33 -04:00
claim.js Explain that "Block" leads to modal with more options. (#7039) 2021-09-08 12:31:45 -04:00
comments.js Restore comment pagination 2021-07-16 10:54:12 -04:00
context-menu.js Clear dev-web warnings and lint 2021-02-19 14:18:44 -05:00
country.js Util to get list of countries 2021-04-21 10:49:31 -04:00
debounce.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
deep-equal.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
default-languages.js Sort all language dropdowns, not just in the Settings Page. 2021-06-07 10:15:07 +08:00
detect-typing.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
downloadClaim.js Move 'Download' and 'Report Content' into overflow menu. 2021-06-18 15:50:13 -04:00
enhanced-layout.js mobile view 2019-12-20 15:03:18 -05:00
fetch.js add 10 second timeout to lbrytv status call 2020-03-16 17:59:24 -04:00
form-validation.js allow sending directly to a channel or content address (#5990) 2021-05-20 15:30:40 -04:00
format-bytes.js use new buffer analytics api 2020-08-07 22:54:29 -04:00
formatAriaLabel.js fix typo 2021-07-29 11:52:34 -05:00
formatMediaDuration.js add more info for claim-preview-tile aria label 2021-07-15 18:12:11 -05:00
full-screen.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
generate-thumbnail-name.js style pass for channel edit 2020-07-01 22:04:23 -04:00
handle-fetch.js send recsys powered-by (#6875) 2021-08-17 10:03:25 -04:00
hex.js hyperchats 2021-04-23 16:20:17 -04:00
lazyImport.js Fix broken embeds in incognito 2021-07-23 00:50:02 +08:00
livestream.js Livestream category improvements (#7115) 2021-09-24 10:26:21 -04:00
number.js show total balance on wallet page/header 2021-01-22 11:46:27 -05:00
object.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
parse-data.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
publish.js wip 2021-06-08 13:25:52 -04:00
query-params.js Recommended changes (#7089) 2021-09-16 16:00:44 -04:00
redux-utils.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
remark-lbry.js flow fixes 2020-12-16 10:52:22 -05:00
remark-timestamp.js Fix timestamp regex error 2021-03-09 16:05:00 -05:00
saved-passwords.js allow signin on local using non-production SameSite=Lax 2020-07-24 16:48:05 -04:00
search.js Livestream category improvements (#7115) 2021-09-24 10:26:21 -04:00
set-operations.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
shuffle-array.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
string.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
stripe.js Chore desktop cleanup (#6896) 2021-08-17 18:34:16 -04:00
swap-json.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
sync-settings.js all settings constants come from redux 2020-07-27 11:53:14 -04:00
throttle.js refactor lbrytv web server 2019-11-11 13:27:29 -05:00
thumbnail.js 100% compression doesn't work with current CDN url 2021-07-20 02:34:25 +08:00
time.js Allow video sharing with start timestamp 2020-05-08 14:00:59 -04:00
url.js Playlist fall out fixes (#7032) 2021-09-10 13:27:21 -04:00
web-file-system.js Support drag-and-drop file publishing (#4170) 2020-05-25 10:27:36 -04:00
web.js rss tests 2021-08-06 17:05:36 -04:00
zoomWindow.js Make zoom level persistent on Desktop 2021-01-26 10:20:59 -05:00