31 lines
861 B
TypeScript
31 lines
861 B
TypeScript
import React from 'react';
|
|
import { FlatGrid } from 'react-native-super-grid';
|
|
import { Heading, VStack } from 'native-base';
|
|
|
|
type CardGridCustomProps<T> = {
|
|
content: T[];
|
|
heading?: JSX.Element;
|
|
maxItemsPerRow?: number;
|
|
style?: Parameters<typeof FlatGrid>[0]['additionalRowStyle'];
|
|
cardComponent: React.ComponentType<T>;
|
|
};
|
|
|
|
const CardGridCustom = <T extends Record<string, unknown>>(props: CardGridCustomProps<T>) => {
|
|
const { content, heading, maxItemsPerRow, style, cardComponent: CardComponent } = props;
|
|
|
|
return (
|
|
<VStack space={5}>
|
|
{heading && <Heading>{heading}</Heading>}
|
|
<FlatGrid
|
|
maxItemsPerRow={maxItemsPerRow}
|
|
additionalRowStyle={style ?? { justifyContent: 'flex-start' }}
|
|
data={content}
|
|
renderItem={({ item }) => <CardComponent {...item} />}
|
|
spacing={10}
|
|
/>
|
|
</VStack>
|
|
);
|
|
};
|
|
|
|
export default CardGridCustom;
|