A React Native app for the ultimate thinking partner.
cameron.stream
1/**
2 * EmptyStateIntro Component
3 *
4 * Displays the welcome message when the chat is empty (no messages yet).
5 *
6 * Features:
7 * - Large "co" text
8 * - Welcome message: "I'm co, your thinking partner."
9 * - Centered layout above the input box
10 *
11 * This creates a friendly first-time experience and guides users
12 * on what co is and what to expect.
13 */
14
15import React from 'react';
16import { View, Text, StyleSheet } from 'react-native';
17import type { Theme } from '../theme';
18
19interface EmptyStateIntroProps {
20 theme: Theme;
21}
22
23export const EmptyStateIntro: React.FC<EmptyStateIntroProps> = ({
24 theme,
25}) => {
26 return (
27 <View style={styles.container}>
28 {/* Large "co" text */}
29 <Text
30 style={[
31 styles.coText,
32 { color: theme.colors.text.primary },
33 ]}
34 >
35 co
36 </Text>
37
38 {/* Welcome message */}
39 <Text style={[styles.welcomeText, { color: theme.colors.text.primary }]}>
40 I'm co, your thinking partner.
41 </Text>
42 </View>
43 );
44};
45
46const styles = StyleSheet.create({
47 container: {
48 alignItems: 'center',
49 marginBottom: 0,
50 },
51 coText: {
52 fontSize: 72,
53 fontFamily: 'Lexend_700Bold',
54 marginBottom: 16,
55 textAlign: 'center',
56 },
57 welcomeText: {
58 fontSize: 18,
59 lineHeight: 28,
60 marginBottom: 32,
61 fontFamily: 'Lexend_400Regular',
62 textAlign: 'center',
63 },
64});
65
66export default EmptyStateIntro;