From 6150ab41d233024cb10c3f6c2c47bc712ae76f8a Mon Sep 17 00:00:00 2001
From: cosmos-explorer <lian.yang.work@gmail.com>
Date: Fri, 5 Jun 2026 15:32:53 +0200
Subject: [PATCH 1/2] Rename TestComponent to RobotComponent

---
 examples/ExpoApp/app/(tabs)/index.tsx                         | 4 ++--
 .../ExpoApp/app/{TestComponent.tsx => RobotComponent.tsx}     | 3 +--
 2 files changed, 3 insertions(+), 4 deletions(-)
 rename examples/ExpoApp/app/{TestComponent.tsx => RobotComponent.tsx} (88%)

diff --git a/examples/ExpoApp/app/(tabs)/index.tsx b/examples/ExpoApp/app/(tabs)/index.tsx
index a192228..44e802b 100644
--- a/examples/ExpoApp/app/(tabs)/index.tsx
+++ b/examples/ExpoApp/app/(tabs)/index.tsx
@@ -4,7 +4,7 @@ import { HelloWave } from '@/components/HelloWave';
 import ParallaxScrollView from '@/components/ParallaxScrollView';
 import { ThemedText } from '@/components/ThemedText';
 import { ThemedView } from '@/components/ThemedView';
-import TestCompoment from '../TestComponent';
+import RobotComponent from '../RobotComponent';
 
 export default function HomeScreen() {
   return (
@@ -21,7 +21,7 @@ export default function HomeScreen() {
         <HelloWave />
       </ThemedView>
       <ThemedView style={styles.stepContainer}>
-      <TestCompoment/>
+        <RobotComponent/>
         <ThemedText type="subtitle">Step 1: Try it</ThemedText>
         <ThemedText>
           Edit <ThemedText type="defaultSemiBold">app/(tabs)/index.tsx</ThemedText> to see changes.
diff --git a/examples/ExpoApp/app/TestComponent.tsx b/examples/ExpoApp/app/RobotComponent.tsx
similarity index 88%
rename from examples/ExpoApp/app/TestComponent.tsx
rename to examples/ExpoApp/app/RobotComponent.tsx
index ff845de..290f60f 100644
--- a/examples/ExpoApp/app/TestComponent.tsx
+++ b/examples/ExpoApp/app/RobotComponent.tsx
@@ -1,8 +1,7 @@
-import React from 'react';
 import {Text, View} from 'react-native';
 import {useFlags} from '@featbit/react-client-sdk';
 
-export default function TestCompoment() {
+export default function RobotComponent() {
   const {robot} = useFlags();
   return (
     <View

From 59699dfe6cd46b5cca74bf8ce673c582245ae33b Mon Sep 17 00:00:00 2001
From: cosmos-explorer <lian.yang.work@gmail.com>
Date: Tue, 9 Jun 2026 15:49:21 +0200
Subject: [PATCH 2/2] added two flag example

---
 examples/ExpoApp/app/(tabs)/index.tsx      |  2 +
 examples/ExpoApp/app/TwoFlagsComponent.tsx | 52 ++++++++++++++++++++++
 examples/ExpoApp/app/_layout.tsx           | 16 ++++---
 3 files changed, 63 insertions(+), 7 deletions(-)
 create mode 100644 examples/ExpoApp/app/TwoFlagsComponent.tsx

diff --git a/examples/ExpoApp/app/(tabs)/index.tsx b/examples/ExpoApp/app/(tabs)/index.tsx
index 44e802b..a34888e 100644
--- a/examples/ExpoApp/app/(tabs)/index.tsx
+++ b/examples/ExpoApp/app/(tabs)/index.tsx
@@ -5,6 +5,7 @@ import ParallaxScrollView from '@/components/ParallaxScrollView';
 import { ThemedText } from '@/components/ThemedText';
 import { ThemedView } from '@/components/ThemedView';
 import RobotComponent from '../RobotComponent';
+import TwoFlagsComponent from '../TwoFlagsComponent';
 
 export default function HomeScreen() {
   return (
@@ -21,6 +22,7 @@ export default function HomeScreen() {
         <HelloWave />
       </ThemedView>
       <ThemedView style={styles.stepContainer}>
+        <TwoFlagsComponent/>
         <RobotComponent/>
         <ThemedText type="subtitle">Step 1: Try it</ThemedText>
         <ThemedText>
diff --git a/examples/ExpoApp/app/TwoFlagsComponent.tsx b/examples/ExpoApp/app/TwoFlagsComponent.tsx
new file mode 100644
index 0000000..499fe10
--- /dev/null
+++ b/examples/ExpoApp/app/TwoFlagsComponent.tsx
@@ -0,0 +1,52 @@
+import React, { useEffect } from 'react';
+import {Text, View} from 'react-native';
+import {useFbClient, useFlags, UserBuilder} from '@featbit/react-client-sdk';
+
+export default function TwoFlagsComponent() {
+  const flags = useFlags();
+  const flagA = flags["flag-a"];
+  const flagB = flags["flag-b"];
+  const fbClient = useFbClient();
+
+  useEffect(() => {
+    const variationId = `203:${flagA}:exclusive`;
+    const user = new UserBuilder("fb-demo-user-key")
+      .name("the user name")
+      .custom("loggedIn", "true")
+      .custom("variationId", variationId)
+      .build();
+
+    fbClient?.identify(user);
+  }, [flagA]);
+
+  return (
+    <View
+      style={[
+        {
+          marginTop: 32,
+          paddingHorizontal: 24,
+        },
+      ]}>
+      <Text
+        style={[
+          {
+            textAlign: 'center',
+            fontSize: 30,
+            fontWeight: '700',
+          },
+        ]}>
+        flagA: {flagA}
+      </Text>
+      <Text
+        style={[
+          {
+            textAlign: 'center',
+            fontSize: 30,
+            fontWeight: '700',
+          },
+        ]}>
+        flagB: {flagB}
+      </Text>
+    </View>
+  );
+}
diff --git a/examples/ExpoApp/app/_layout.tsx b/examples/ExpoApp/app/_layout.tsx
index af81a30..34438b4 100644
--- a/examples/ExpoApp/app/_layout.tsx
+++ b/examples/ExpoApp/app/_layout.tsx
@@ -6,7 +6,7 @@ import 'react-native-reanimated';
 
 import { useColorScheme } from '@/hooks/useColorScheme';
 
-import {buildConfig, withFbProvider} from '@featbit/react-native-sdk';
+import {buildConfig, UserBuilder, withFbProvider} from '@featbit/react-native-sdk';
 
 // Prevent the splash screen from auto-hiding before asset loading is complete.
 SplashScreen.preventAutoHideAsync();
@@ -37,13 +37,15 @@ function RootLayout() {
   );
 }
 
+const user = new UserBuilder("fb-demo-user-key")
+  .name("the user name")
+  .custom("loggedIn", "true")
+  .custom("variationId", "203:b:exclusive")
+  .build();
+
 const options = {
-  user: {
-    name: 'the user name',
-    keyId: 'fb-demo-user-key',
-    customizedProperties: [],
-  },
-  sdkKey: 'Obg68EqYZk27JTxphPgy7At1aJ8GaAtEaIA1fb3IpuEA',
+  user,
+  sdkKey: '3QFLBQibTE6i1duL1WAK2A227SK-9N8k-9VqurJDE_Qw',
   streamingUri: 'wss://app-eval.featbit.co',
   eventsUri: 'https://app-eval.featbit.co',
 };