Cutlery/Kyoo
1
0
Fork 0
mirror of https://github.com/zoriya/Kyoo.git synced 2025-05-30 19:54:16 -04:00
Code Issues Packages Projects Releases Wiki Activity

Fix initial placeholders on mobile lists

Browse Source
This commit is contained in:
Zoe Roux 2024-01-10 14:26:20 +01:00
parent 1d6d27c0ee
commit b4281188d4
2 changed files with 4 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
front/packages/ui/src/fetch-infinite.tsx
View File

@ -30,7 +30,7 @@ const emulateGap = (
gap: number, gap: number,
numColumns: number, numColumns: number,
index: number, index: number,
itemsCount: number itemsCount: number,
): ViewStyle => { ): ViewStyle => {
let marginLeft = 0; let marginLeft = 0;
let marginRight = 0; let marginRight = 0;
@ -107,7 +107,7 @@ export const InfiniteFetchList = <Data, Props, _, Kind extends number | string>(
const placeholders = [...Array(count === 0 ? numColumns : count)].map( const placeholders = [...Array(count === 0 ? numColumns : count)].map(
(_, i) => ({ id: `gen${i}`, isLoading: true }) as Data, (_, i) => ({ id: `gen${i}`, isLoading: true }) as Data,
); );
const data = isFetching ? [...(items || []), ...placeholders] : items; const data = isFetching || !items ? [...(items || []), ...placeholders] : items;
const List = nested ? (FlatList as unknown as typeof FlashList) : FlashList; const List = nested ? (FlatList as unknown as typeof FlashList) : FlashList;
@ -122,7 +122,7 @@ export const InfiniteFetchList = <Data, Props, _, Kind extends number | string>(
renderItem={({ item, index }) => ( renderItem={({ item, index }) => (
<View <View
style={[ style={[
emulateGap(layout.layout, gap, numColumns, index, data?.length ?? 0), emulateGap(layout.layout, gap, numColumns, index, data.length),
layout.layout === "horizontal" && { layout.layout === "horizontal" && {
width: width:
size * (getItemType && getItemSize ? getItemSize(getItemType(item, index)) : 1), size * (getItemType && getItemSize ? getItemSize(getItemType(item, index)) : 1),

2
front/packages/ui/src/fetch.tsx
View File

@ -33,7 +33,7 @@ export type Layout = {
}; };
export type WithLoading<Item> = export type WithLoading<Item> =
| (Item & { isLoading?: false }) | (Item & { isLoading: false })
| (Partial<Item> & { isLoading: true }); | (Partial<Item> & { isLoading: true });
const isPage = <T = unknown,>(obj: unknown): obj is Page<T> => const isPage = <T = unknown,>(obj: unknown): obj is Page<T> =>