Premium Product Card

1import React from 'react';
2import {
3    StyleSheet,
4    View,
5    Text,
6    Image,
7    TouchableOpacity,
8    Dimensions,
9    ImageSourcePropType,
10} from 'react-native';
11import { Ionicons, Feather } from '@expo/vector-icons';
12
13const { width } = Dimensions.get('window');
14
15interface PremiumCardProps {
16    theme?: 'light' | 'dark';
17    title?: string;
18    price?: string;
19    description?: string;
20    image: ImageSourcePropType;

import React from 'react';
import { StyleSheet, View, ScrollView, StatusBar } from 'react-native';
import PremiumCard from './components/ProductCard';

const ICE_CREAM_IMG = "https://images.unsplash.com/photo-1563805042-7684c019e1cb?q=80&w=1000&auto=format&fit=crop";

export default function App() {
    return (
        <View style={styles.container}>
            <StatusBar barStyle="dark-content" />
            <ScrollView contentContainerStyle={styles.scroll}>

                {/* LIGHT THEME: Image sits inside a white padded frame */}
                <PremiumCard
                    theme="light"
                    image={{ uri: ICE_CREAM_IMG }}
                />

                {/* DARK THEME: Image sits inside a brown padded frame */}
                <PremiumCard