Set minimum height of horizontal items

This commit is contained in:
Zoe Roux 2023-12-12 14:21:56 +01:00
parent dab297413f
commit cdccc9bc8b
2 changed files with 14 additions and 2 deletions

View File

@ -21,7 +21,16 @@
import { Page, QueryIdentifier, useInfiniteFetch } from "@kyoo/models"; import { Page, QueryIdentifier, useInfiniteFetch } from "@kyoo/models";
import { useBreakpointMap, HR } from "@kyoo/primitives"; import { useBreakpointMap, HR } from "@kyoo/primitives";
import { ContentStyle, FlashList } from "@shopify/flash-list"; import { ContentStyle, FlashList } from "@shopify/flash-list";
import { ComponentProps, ComponentType, isValidElement, ReactElement, useRef } from "react"; import {
ComponentProps,
ComponentType,
isValidElement,
ReactElement,
useCallback,
useReducer,
useRef,
useState,
} from "react";
import { EmptyView, ErrorView, Layout, WithLoading, addHeader } from "./fetch"; import { EmptyView, ErrorView, Layout, WithLoading, addHeader } from "./fetch";
import { FlatList, View, ViewStyle } from "react-native"; import { FlatList, View, ViewStyle } from "react-native";
@ -122,6 +131,7 @@ export const InfiniteFetchList = <Data, Props, _, Kind>({
layout.layout === "horizontal" && { layout.layout === "horizontal" && {
width: width:
size * (getItemType && getItemSize ? getItemSize(getItemType(item, index)) : 1), size * (getItemType && getItemSize ? getItemSize(getItemType(item, index)) : 1),
height: size * 2,
}, },
]} ]}
> >

View File

@ -150,6 +150,7 @@ export const InfiniteFetchList = <Data, _, HeaderProps, Kind>({
Header, Header,
headerProps, headerProps,
getItemType, getItemType,
nested,
...props ...props
}: { }: {
query: ReturnType<typeof useInfiniteFetch<_, Data>>; query: ReturnType<typeof useInfiniteFetch<_, Data>>;
@ -165,9 +166,10 @@ export const InfiniteFetchList = <Data, _, HeaderProps, Kind>({
Header?: ComponentType<{ children: JSX.Element } & HeaderProps> | ReactElement; Header?: ComponentType<{ children: JSX.Element } & HeaderProps> | ReactElement;
headerProps: HeaderProps; headerProps: HeaderProps;
getItemType?: (item: WithLoading<Data>, index: number) => Kind; getItemType?: (item: WithLoading<Data>, index: number) => Kind;
getItemSize?: (kind: Kind) => number getItemSize?: (kind: Kind) => number;
fetchMore?: boolean; fetchMore?: boolean;
contentContainerStyle?: ContentStyle; contentContainerStyle?: ContentStyle;
nested?: boolean;
}): JSX.Element | null => { }): JSX.Element | null => {
const oldItems = useRef<Data[] | undefined>(); const oldItems = useRef<Data[] | undefined>();
const { items, error, fetchNextPage, hasNextPage, isFetching } = query; const { items, error, fetchNextPage, hasNextPage, isFetching } = query;