50 lines
2.7 KiB
TypeScript
50 lines
2.7 KiB
TypeScript
// Metro module 14621 (f14622).
|
|
import { useMemo } from "react";
|
|
import { ScrollView, View } from "react-native";
|
|
import CollectiblesCategoryStore from "../CollectiblesCategoryStore";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import CollectiblesShopCardV2, { COLLECTIBLES_SHOP_CARD_GAP } from "./CollectiblesShopCardV2";
|
|
import { CollectiblesAnalyticsProvider } from "../CollectiblesAnalyticsContext";
|
|
import { useCardLayout } from "./hooks/useCardLayout";
|
|
import Module12 from "../../../_bundle/Module12";
|
|
let useStyles;
|
|
const ShopCardGridItem = function ShopCardGridItem(props) {
|
|
const { product, index, cardWidth: cardWidth2, preferVCPrice: preferVCPrice2, unpublishedAt, disableBundleStaticBackground: disableBundleStaticBackground2, muteBundleStaticBackground: muteBundleStaticBackground2 } = props;
|
|
return <CollectiblesAnalyticsProvider newValue={useMemo(() => ({
|
|
tilePosition: index
|
|
}), [index])}>
|
|
<CollectiblesShopCardV2 unpublishedAt={unpublishedAt} product={product} cardWidth={cardWidth2} preferVCPrice={preferVCPrice2} disableBundleStaticBackground={disableBundleStaticBackground2} muteBundleStaticBackground={muteBundleStaticBackground2} />
|
|
</CollectiblesAnalyticsProvider>;
|
|
};
|
|
useStyles = createStyles({
|
|
rowContainer: {
|
|
justifyContent: "center",
|
|
flexDirection: "row",
|
|
gap: COLLECTIBLES_SHOP_CARD_GAP
|
|
}
|
|
});
|
|
export default function CollectiblesShopCardsGrid(props) {
|
|
const { products, accessibilityLabel, category, preferVCPrice, scrollEnabled = false, onScroll, paddingTop, paddingBottom, disableBundleStaticBackground, muteBundleStaticBackground } = props;
|
|
const styles = useStyles();
|
|
const cardLayout = useCardLayout();
|
|
const { columns, cardWidth } = cardLayout;
|
|
return <ScrollView accessibilityLabel={accessibilityLabel} accessibilityRole="list" scrollEnabled={scrollEnabled} showsVerticalScrollIndicator={false} onScroll={onScroll} contentContainerStyle={{
|
|
gap: COLLECTIBLES_SHOP_CARD_GAP,
|
|
paddingTop,
|
|
paddingBottom
|
|
}}>
|
|
{useMemo(() => Module12.chunk(products, columns), [products, columns]).map((a0, a1) => {
|
|
let c27784_0 = a1;
|
|
return <View key={a1} style={styles.rowContainer}>
|
|
{a0.map((item, a1) => {
|
|
let r8 = category;
|
|
if (category == null) {
|
|
r8 = CollectiblesCategoryStore.getCategoryForProduct(item.skuId);
|
|
}
|
|
return <ShopCardGridItem key={item.skuId} product={item} index={c27784_0 * columns + a1} cardWidth={cardWidth} unpublishedAt={r8?.unpublishedAt} preferVCPrice={preferVCPrice} disableBundleStaticBackground={disableBundleStaticBackground} muteBundleStaticBackground={muteBundleStaticBackground} />;
|
|
})}
|
|
</View>;
|
|
})}
|
|
</ScrollView>;
|
|
};
|