45 lines
No EOL
1.1 KiB
TypeScript
45 lines
No EOL
1.1 KiB
TypeScript
import React from 'react';
|
|
import { View, ScrollView } from 'react-native';
|
|
import { BottomDialog, MyText, tw } from 'common-ui';
|
|
|
|
interface VendorSnippetProduct {
|
|
id: number;
|
|
name: string;
|
|
}
|
|
|
|
interface ProductListDialogProps {
|
|
open: boolean;
|
|
onClose: () => void;
|
|
products: VendorSnippetProduct[];
|
|
}
|
|
|
|
export const ProductListDialog: React.FC<ProductListDialogProps> = ({
|
|
open,
|
|
onClose,
|
|
products,
|
|
}) => {
|
|
return (
|
|
<BottomDialog open={open} onClose={onClose}>
|
|
<View style={tw`pt-4 pb-8`}>
|
|
<MyText style={tw`text-lg font-bold mb-4 text-slate-900`}>
|
|
Products ({products.length})
|
|
</MyText>
|
|
<ScrollView style={{ maxHeight: 400 }}>
|
|
{products.map((product, index) => (
|
|
<View
|
|
key={product.id}
|
|
style={[
|
|
tw`py-3 border-b border-slate-100`,
|
|
index === products.length - 1 && tw`border-b-0`,
|
|
]}
|
|
>
|
|
<MyText style={tw`text-sm text-slate-800 font-medium`}>
|
|
{product.name}
|
|
</MyText>
|
|
</View>
|
|
))}
|
|
</ScrollView>
|
|
</View>
|
|
</BottomDialog>
|
|
);
|
|
}; |