refactor: split app into modular src architecture

src/components/ItemCard.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import { Image, Pressable, Text, View } from 'react-native';
+import { STATUS_COLORS } from '../constants';
+import { styles } from '../styles';
+
+function statusAccent(status) {
+  return STATUS_COLORS[status] || '#64748b';
+}
+
+export default function ItemCard({ item, onEdit, onDelete }) {
+  return (
+    <View style={styles.itemCard}>
+      <View style={[styles.itemAccent, { backgroundColor: statusAccent(item.status) }]} />
+      <View style={styles.itemMain}>
+        <View style={styles.cardRow}>
+          <View style={styles.flex}>
+            <Text style={styles.itemTitle}>{item.name}</Text>
+            <Text style={styles.itemMeta}>{item.category || 'uncategorized'} · {item.status}</Text>
+            <Text style={styles.itemMeta}>Location: {item.placement}</Text>
+            {item.status === 'lent-to' && !!item.lentTo ? <Text style={styles.itemMeta}>Lent to: {item.lentTo}</Text> : null}
+            {!!item.description ? <Text style={styles.itemMeta}>{item.description}</Text> : null}
+          </View>
+          <View style={styles.stackButtons}>
+            <Pressable style={styles.miniBtn} onPress={() => onEdit(item)}>
+              <Text style={styles.miniBtnText}>Edit</Text>
+            </Pressable>
+            <Pressable style={styles.miniBtnDanger} onPress={() => onDelete(item.id)}>
+              <Text style={styles.miniBtnText}>Delete</Text>
+            </Pressable>
+          </View>
+        </View>
+        {item.imageUri ? <Image source={{ uri: item.imageUri }} style={styles.previewImageSmall} /> : null}
+      </View>
+    </View>
+  );
+}