Fix InView creating div inside ul

Make it create li but only observe one of the skeleton instead
This commit is contained in:
Lim Chee Aun 2022-12-12 22:42:58 +08:00
parent 79f1b255d2
commit 3396aa2512

View file

@ -174,11 +174,18 @@ export default ({ hidden }) => {
); );
})} })}
{showMore && ( {showMore && (
<InView <>
onChange={(inView) => { <InView
if (inView) loadStatuses(); as="li"
}} style={{
> height: '20vh',
}}
onChange={(inView) => {
if (inView) loadStatuses();
}}
>
<Status skeleton />
</InView>
<li <li
style={{ style={{
height: '25vh', height: '25vh',
@ -186,14 +193,7 @@ export default ({ hidden }) => {
> >
<Status skeleton /> <Status skeleton />
</li> </li>
<li </>
style={{
height: '25vh',
}}
>
<Status skeleton />
</li>
</InView>
)} )}
</ul> </ul>
</> </>