feat: expo 55 demo app parity with 54 demo app

Author: artus9033

apps/ExpoApp54/RNApp.tsx

@@ -1,8 +1,9 @@
 import { SafeAreaView } from 'react-native-safe-area-context';
 import { Button, StyleSheet, Text, View } from 'react-native';
-import Counter from './components/counter';
 import BrownfieldNavigation from '@callstack/brownfield-navigation';
 
+import Counter from './components/counter';
+
 export default function RNApp() {
   return (
     <SafeAreaView style={styles.container}>

apps/ExpoApp54/app/(tabs)/postMessage.tsx

@@ -9,7 +9,7 @@ import { ThemedText } from '@/components/themed-text';
 import type { Message } from '@/components/postMessage/Message';
 import { MessageBubble } from '@/components/postMessage/MessageBubble';
 
-export default function HomeScreen() {
+export default function PostMessageTab() {
   const [messages, setMessages] = useState<Message[]>([]);
   const flatListRef = useRef<FlatList<Message>>(null);
 

apps/ExpoApp55/RNApp.tsx

@@ -1,5 +1,7 @@
 import { SafeAreaView } from 'react-native-safe-area-context';
-import { StyleSheet, Text, View } from 'react-native';
+import { Button, StyleSheet, Text, View } from 'react-native';
+import BrownfieldNavigation from '@callstack/brownfield-navigation';
+
 import Counter from './components/counter';
 
 export default function RNApp() {
@@ -9,6 +11,15 @@ export default function RNApp() {
 
       <View style={styles.content}>
         <Counter />
+
+        <Button
+          title="Navigate to Settings"
+          onPress={() => BrownfieldNavigation.navigateToSettings()}
+        />
+        <Button
+          title="Navigate to Referrals"
+          onPress={() => BrownfieldNavigation.navigateToReferrals('123')}
+        />
       </View>
     </SafeAreaView>
   );

apps/ExpoApp55/brownfield.navigation.ts

@@ -0,0 +1,12 @@
+export interface BrownfieldNavigationSpec {
+  /**
+   * Navigate to the native settings screen
+   */
+  navigateToSettings(): void;
+
+  /**
+   * Navigate to the native referrals screen
+   * @param userId - The user's unique identifier
+   */
+  navigateToReferrals(userId: string): void;
+}

apps/ExpoApp55/package.json

@@ -15,6 +15,7 @@
     "brownfield:package:ios": "brownfield package:ios --scheme BrownfieldLib --configuration Release"
   },
   "dependencies": {
+    "@callstack/brownfield-navigation": "workspace:^",
     "@callstack/brownie": "workspace:^",
     "@callstack/react-native-brownfield": "workspace:^",
     "@expo/vector-icons": "^15.0.2",

apps/ExpoApp55/src/app/postMessage.tsx

@@ -9,7 +9,7 @@ import { ThemedText } from '@/components/themed-text';
 import type { Message } from '@/components/postMessage/Message';
 import { MessageBubble } from '@/components/postMessage/MessageBubble';
 
-export default function HomeScreen() {
+export default function PostMessageTab() {
   const [messages, setMessages] = useState<Message[]>([]);
   const flatListRef = useRef<FlatList<Message>>(null);
 

apps/ExpoApp55/src/components/counter/index.ios.tsx

@@ -0,0 +1,33 @@
+import { StyleSheet, Text, Button } from 'react-native';
+import { useStore } from '@callstack/brownie';
+
+const Counter = () => {
+  const [counter, setState] = useStore('BrownfieldStore', (s) => s.counter);
+
+  return (
+    <>
+      <Text style={styles.text}>Count: {counter}</Text>
+
+      <Button
+        onPress={() => setState((prev) => ({ counter: prev.counter + 1 }))}
+        title="Increment"
+      />
+    </>
+  );
+};
+
+export default Counter;
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+    padding: 20,
+  },
+  text: {
+    fontSize: 30,
+    fontWeight: 'bold',
+    margin: 10,
+  },
+});

apps/ExpoApp55/src/components/counter/index.tsx

@@ -0,0 +1,19 @@
+import { StyleSheet, Text } from 'react-native';
+
+const Counter = () => {
+  return (
+    <>
+      <Text style={styles.text}>Brownie: To be implemented</Text>
+    </>
+  );
+};
+
+export default Counter;
+
+const styles = StyleSheet.create({
+  text: {
+    fontSize: 18,
+    fontWeight: 'bold',
+    margin: 10,
+  },
+});

yarn.lock

@@ -2402,6 +2402,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@callstack/brownfield-example-expo-app-55@workspace:apps/ExpoApp55"
   dependencies:
+    "@callstack/brownfield-navigation": "workspace:^"
     "@callstack/brownie": "workspace:^"
     "@callstack/react-native-brownfield": "workspace:^"
     "@expo/vector-icons": "npm:^15.0.2"