97 lines
3.0 KiB
TypeScript
97 lines
3.0 KiB
TypeScript
// Metro module 7975 (f7976).
|
|
import * as Module19 from "react";
|
|
import { useState, useCallback, useMemo } from "react";
|
|
import { ActivityIndicator, View } from "react-native";
|
|
import { createStyles } from "../../../design/components/Styles/native/createStyles";
|
|
import { GUTTER_SIZE, ROW_SIZE } from "./useCollectibleListLayout";
|
|
import { Heading } from "../../../design/components/Text/native/Text";
|
|
import { chunk } from "../../../_bundle/Module12";
|
|
import { BottomSheetFlashList } from "../../../_bundle/noop_6676";
|
|
const useStyles = createStyles({
|
|
list: {
|
|
flex: 1,
|
|
marginTop: 12
|
|
},
|
|
listContent: {
|
|
paddingBottom: 88
|
|
},
|
|
loadingContainer: {
|
|
paddingVertical: 80,
|
|
alignItems: "center"
|
|
},
|
|
header: {
|
|
paddingHorizontal: GUTTER_SIZE,
|
|
paddingTop: 10,
|
|
paddingBottom: 5
|
|
}
|
|
});
|
|
let Component = Module19.memo(function({ header }) {
|
|
return <View style={useStyles().header}>
|
|
<Heading variant="heading-sm/medium" color="mobile-text-heading-primary">{header}</Heading>
|
|
</View>;
|
|
});
|
|
export function EditCollectiblesPickerList(props) {
|
|
let props2;
|
|
let size;
|
|
const { sections, selectedSkuId, renderRow, isFetching = false } = props;
|
|
let c16138_3 = isFetching;
|
|
let contentContainerStyle = props.contentContainerStyle;
|
|
size = void 0;
|
|
const styles = useStyles();
|
|
let r0 = 0;
|
|
const [state, setState] = useState(0);
|
|
const callback = useCallback((a0) => {
|
|
setState(a0.nativeEvent.layout.width);
|
|
}, []);
|
|
if (state > 0) {
|
|
r0 = (state - 4 * GUTTER_SIZE) / ROW_SIZE;
|
|
}
|
|
size = r0;
|
|
const memo = useMemo(() => {
|
|
const r0 = [];
|
|
if (c16138_3) {
|
|
return r0;
|
|
}
|
|
let c26067_0 = r0;
|
|
sections.forEach((section) => {
|
|
c26067_0.push({
|
|
type: "header",
|
|
key: `header-${section.section}`,
|
|
header: section.header
|
|
});
|
|
chunk(section.items, ROW_SIZE).forEach((item, index) => {
|
|
c26067_0.push({
|
|
type: "row",
|
|
key: `row-${section.section}-${index}`,
|
|
items: item
|
|
});
|
|
});
|
|
});
|
|
return r0;
|
|
}, [sections, isFetching]);
|
|
const callback2 = useCallback(({ item }) => item.type === "header" ? <Component header={item.header} /> : renderRow({
|
|
items: item.items,
|
|
size,
|
|
selectedSkuId
|
|
}), [renderRow, size, selectedSkuId]);
|
|
const callback3 = useCallback((a0) => a0.type, []);
|
|
const callback4 = useCallback((a0) => a0.key, []);
|
|
const r54 = {
|
|
style: null,
|
|
children: null
|
|
};
|
|
if (isFetching) {
|
|
r54.style = styles.loadingContainer;
|
|
r54.children = <ActivityIndicator animating size="large" />;
|
|
props2 = r54;
|
|
} else {
|
|
r54.style = styles.list;
|
|
if (contentContainerStyle == null) {
|
|
contentContainerStyle = styles.listContent;
|
|
}
|
|
r54.children = <BottomSheetFlashList data={memo} renderItem={callback2} getItemType={callback3} keyExtractor={callback4} extraData={selectedSkuId} contentContainerStyle={contentContainerStyle} onLayout={callback} keyboardShouldPersistTaps="always" />;
|
|
props2 = r54;
|
|
}
|
|
return <View {...props2} />;
|
|
}
|