Mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2025-03-23 22:14:42 +01:00
Code Issues Projects Releases Packages Wiki Activity

Bring back intersection observer for 'show more'

Browse source 
Sometimes the scroll thing doesn't really work
This commit is contained in:
Lim Chee Aun 2023-02-24 01:27:46 +08:00
parent 2ced21c9dd
commit cbb09e1b5d
1 changed files with 16 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
src/components/timeline.jsx
View file

@ -1,5 +1,6 @@
import { useEffect, useRef, useState } from 'preact/hooks'; import { useEffect, useRef, useState } from 'preact/hooks';
import { useHotkeys } from 'react-hotkeys-hook'; import { useHotkeys } from 'react-hotkeys-hook';
import { InView } from 'react-intersection-observer';
import { useDebouncedCallback } from 'use-debounce'; import { useDebouncedCallback } from 'use-debounce';
import useInterval from '../utils/useInterval'; import useInterval from '../utils/useInterval';
@ -376,14 +377,22 @@ function Timeline({
</ul> </ul>
{uiState === 'default' && {uiState === 'default' &&
(showMore ? ( (showMore ? (
<button <InView
type="button" onChange={(inView) => {
class="plain block" if (inView) {
onClick={() => loadItems()} loadItems();
style={{ marginBlockEnd: '6em' }} }
}}
> >
Show more&hellip; <button
</button> type="button"
class="plain block"
onClick={() => loadItems()}
style={{ marginBlockEnd: '6em' }}
>
Show more&hellip;
</button>
</InView>
) : ( ) : (
<p class="ui-state insignificant">The end.</p> <p class="ui-state insignificant">The end.</p>
))} ))}