Add CartItem component to display individual items in the cart with quantity adjustment

1 files changed, 26 insertions, 0 deletions

diff --git a/src/components/CartItem.js b/src/components/CartItem.js
index e69de29..da56fbc 100644
--- a/src/components/CartItem.js
+++ b/src/components/CartItem.js
@@ -0,0 +1,26 @@
+import React from 'react';
+import { View, Text, Button, StyleSheet } from 'react-native';
+import QuantityAdjuster from './QuantityAdjuster';
+
+const CartItem = ({ item, onUpdateQuantity }) => (
+  <View style={styles.container}>
+    <Text style={styles.name}>{item.name}</Text>
+    <Text style={styles.price}>${item.price.toFixed(2)}</Text>
+    <QuantityAdjuster quantity={item.quantity} onChange={(newQuantity) => onUpdateQuantity(item.id, newQuantity)} />
+  </View>
+);
+
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    padding: 10,
+    borderBottomWidth: 1,
+    borderColor: '#ccc'
+  },
+  name: { fontSize: 18 },
+  price: { fontSize: 16, color: '#888' },
+});
+
+export default CartItem;