Update app and ignore local artifacts

components/ui/empty-state.tsx

@@ -0,0 +1,30 @@
+import { Ionicons } from '@expo/vector-icons';
+import type { ReactNode } from 'react';
+import { StyleSheet, View, type StyleProp, type ViewStyle } from 'react-native';
+import { AppText } from './app-text';
+import { Card } from './card';
+import { colors, radius, spacing } from './tokens';
+
+type Props = {
+  icon: keyof typeof Ionicons.glyphMap;
+  title: string;
+  message: string;
+  action?: ReactNode;
+  style?: StyleProp<ViewStyle>;
+};
+
+export function EmptyState({ icon, title, message, action, style }: Props) {
+  return <Card style={style} padding={spacing[7]}>
+    <View style={styles.icon}><Ionicons name={icon} size={24} color={colors.brand.cobalt} /></View>
+    <AppText variant="title" style={styles.title}>{title}</AppText>
+    <AppText variant="bodySmall" color={colors.neutral.textSecondary} style={styles.message}>{message}</AppText>
+    {action ? <View style={styles.action}>{action}</View> : null}
+  </Card>;
+}
+
+const styles = StyleSheet.create({
+  icon: { width: 48, height: 48, borderRadius: radius.control, backgroundColor: colors.brand.sky, alignItems: 'center', justifyContent: 'center', alignSelf: 'center' },
+  title: { marginTop: spacing[4], textAlign: 'center' },
+  message: { marginTop: spacing[2], textAlign: 'center' },
+  action: { marginTop: spacing[5], alignSelf: 'stretch' },
+});