diff --git a/.gitignore b/.gitignore
index 43c1b2af7..0805051fa 100644
--- a/.gitignore
+++ b/.gitignore
@@ -411,3 +411,4 @@ samples/grpc-web/coverage/
web/dist/
connect/typescript/lib
connect/typescript/dist
+examples/connect/connect-react-native/app/(tabs)/SECRET.ts
diff --git a/examples/connect/connect-react-native/%ProgramData%/Microsoft/Windows/UUS/State/_active.uusver b/examples/connect/connect-react-native/%ProgramData%/Microsoft/Windows/UUS/State/_active.uusver
new file mode 100644
index 000000000..12c61b0dc
--- /dev/null
+++ b/examples/connect/connect-react-native/%ProgramData%/Microsoft/Windows/UUS/State/_active.uusver
@@ -0,0 +1 @@
+1305.2405.14022.0
\ No newline at end of file
diff --git a/examples/connect/connect-react-native/.gitignore b/examples/connect/connect-react-native/.gitignore
new file mode 100644
index 000000000..6623142a2
--- /dev/null
+++ b/examples/connect/connect-react-native/.gitignore
@@ -0,0 +1,20 @@
+node_modules/
+.expo/
+dist/
+npm-debug.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+*.orig.*
+web-build/
+
+# macOS
+.DS_Store
+
+# @generated expo-cli sync-2b81b286409207a5da26e14c78851eb30d8ccbdb
+# The following patterns were generated by expo-cli
+
+expo-env.d.ts
+# @end expo-cli
\ No newline at end of file
diff --git a/examples/connect/connect-react-native/README.md b/examples/connect/connect-react-native/README.md
new file mode 100644
index 000000000..cd4feb8a3
--- /dev/null
+++ b/examples/connect/connect-react-native/README.md
@@ -0,0 +1,50 @@
+# Welcome to your Expo app 👋
+
+This is an [Expo](https://expo.dev) project created with [`create-expo-app`](https://www.npmjs.com/package/create-expo-app).
+
+## Get started
+
+1. Install dependencies
+
+ ```bash
+ npm install
+ ```
+
+2. Start the app
+
+ ```bash
+ npx expo start
+ ```
+
+In the output, you'll find options to open the app in a
+
+- [development build](https://docs.expo.dev/develop/development-builds/introduction/)
+- [Android emulator](https://docs.expo.dev/workflow/android-studio-emulator/)
+- [iOS simulator](https://docs.expo.dev/workflow/ios-simulator/)
+- [Expo Go](https://expo.dev/go), a limited sandbox for trying out app development with Expo
+
+You can start developing by editing the files inside the **app** directory. This project uses [file-based routing](https://docs.expo.dev/router/introduction).
+
+## Get a fresh project
+
+When you're ready, run:
+
+```bash
+npm run reset-project
+```
+
+This command will move the starter code to the **app-example** directory and create a blank **app** directory where you can start developing.
+
+## Learn more
+
+To learn more about developing your project with Expo, look at the following resources:
+
+- [Expo documentation](https://docs.expo.dev/): Learn fundamentals, or go into advanced topics with our [guides](https://docs.expo.dev/guides).
+- [Learn Expo tutorial](https://docs.expo.dev/tutorial/introduction/): Follow a step-by-step tutorial where you'll create a project that runs on Android, iOS, and the web.
+
+## Join the community
+
+Join our community of developers creating universal apps.
+
+- [Expo on GitHub](https://github.com/expo/expo): View our open source platform and contribute.
+- [Discord community](https://chat.expo.dev): Chat with Expo users and ask questions.
diff --git a/examples/connect/connect-react-native/app.json b/examples/connect/connect-react-native/app.json
new file mode 100644
index 000000000..05f73bf10
--- /dev/null
+++ b/examples/connect/connect-react-native/app.json
@@ -0,0 +1,36 @@
+{
+ "expo": {
+ "name": "connect-react-native",
+ "slug": "connect-react-native",
+ "version": "1.0.0",
+ "orientation": "portrait",
+ "icon": "./assets/images/icon.png",
+ "scheme": "dev.ngrok.mewmba",
+ "userInterfaceStyle": "automatic",
+ "splash": {
+ "image": "./assets/images/splash.png",
+ "resizeMode": "contain",
+ "backgroundColor": "#ffffff"
+ },
+ "ios": {
+ "supportsTablet": true
+ },
+ "android": {
+ "adaptiveIcon": {
+ "foregroundImage": "./assets/images/adaptive-icon.png",
+ "backgroundColor": "#ffffff"
+ }
+ },
+ "web": {
+ "bundler": "metro",
+ "output": "static",
+ "favicon": "./assets/images/favicon.png"
+ },
+ "plugins": [
+ "expo-router"
+ ],
+ "experiments": {
+ "typedRoutes": true
+ }
+ }
+}
diff --git a/examples/connect/connect-react-native/app/(tabs)/SECRET._ts b/examples/connect/connect-react-native/app/(tabs)/SECRET._ts
new file mode 100644
index 000000000..f836b4bf8
--- /dev/null
+++ b/examples/connect/connect-react-native/app/(tabs)/SECRET._ts
@@ -0,0 +1,4 @@
+// Your connect RP auth token should come from your backend, not be hard coded in your application!
+// This is just here for simplicity.
+// Rename this file to `SECRET.ts`
+const CONNECT_RP_AUTH_TOKEN_DO_NOT_COMMIT = "CiVo...";
diff --git a/examples/connect/connect-react-native/app/(tabs)/_layout.tsx b/examples/connect/connect-react-native/app/(tabs)/_layout.tsx
new file mode 100644
index 000000000..22a49b62c
--- /dev/null
+++ b/examples/connect/connect-react-native/app/(tabs)/_layout.tsx
@@ -0,0 +1,37 @@
+import { Tabs } from 'expo-router';
+import React from 'react';
+
+import { TabBarIcon } from '@/components/navigation/TabBarIcon';
+import { Colors } from '@/constants/Colors';
+import { useColorScheme } from '@/hooks/useColorScheme';
+
+export default function TabLayout() {
+ const colorScheme = useColorScheme();
+
+ return (
+
+ (
+
+ ),
+ }}
+ />
+ (
+
+ ),
+ }}
+ />
+
+ );
+}
diff --git a/examples/connect/connect-react-native/app/(tabs)/explore.tsx b/examples/connect/connect-react-native/app/(tabs)/explore.tsx
new file mode 100644
index 000000000..e480218ad
--- /dev/null
+++ b/examples/connect/connect-react-native/app/(tabs)/explore.tsx
@@ -0,0 +1,102 @@
+import Ionicons from '@expo/vector-icons/Ionicons';
+import { StyleSheet, Image, Platform } from 'react-native';
+
+import { Collapsible } from '@/components/Collapsible';
+import { ExternalLink } from '@/components/ExternalLink';
+import ParallaxScrollView from '@/components/ParallaxScrollView';
+import { ThemedText } from '@/components/ThemedText';
+import { ThemedView } from '@/components/ThemedView';
+
+export default function TabTwoScreen() {
+ return (
+ }>
+
+ Explore
+
+ This app includes example code to help you get started.
+
+
+ This app has two screens:{' '}
+ app/(tabs)/index.tsx and{' '}
+ app/(tabs)/explore.tsx
+
+
+ The layout file in app/(tabs)/_layout.tsx{' '}
+ sets up the tab navigator.
+
+
+ Learn more
+
+
+
+
+ You can open this project on Android, iOS, and the web. To open the web version, press{' '}
+ w in the terminal running this project.
+
+
+
+
+ For static images, you can use the @2x and{' '}
+ @3x suffixes to provide files for
+ different screen densities
+
+
+
+ Learn more
+
+
+
+
+ Open app/_layout.tsx to see how to load{' '}
+
+ custom fonts such as this one.
+
+
+
+ Learn more
+
+
+
+
+ This template has light and dark mode support. The{' '}
+ useColorScheme() hook lets you inspect
+ what the user's current color scheme is, and so you can adjust UI colors accordingly.
+
+
+ Learn more
+
+
+
+
+ This template includes an example of an animated component. The{' '}
+ components/HelloWave.tsx component uses
+ the powerful react-native-reanimated library
+ to create a waving hand animation.
+
+ {Platform.select({
+ ios: (
+
+ The components/ParallaxScrollView.tsx{' '}
+ component provides a parallax effect for the header image.
+
+ ),
+ })}
+
+
+ );
+}
+
+const styles = StyleSheet.create({
+ headerImage: {
+ color: '#808080',
+ bottom: -90,
+ left: -35,
+ position: 'absolute',
+ },
+ titleContainer: {
+ flexDirection: 'row',
+ gap: 8,
+ },
+});
diff --git a/examples/connect/connect-react-native/app/(tabs)/index.tsx b/examples/connect/connect-react-native/app/(tabs)/index.tsx
new file mode 100644
index 000000000..e69ffa977
--- /dev/null
+++ b/examples/connect/connect-react-native/app/(tabs)/index.tsx
@@ -0,0 +1,84 @@
+import {Image, StyleSheet, Button, Linking} from 'react-native';
+
+import { HelloWave } from '@/components/HelloWave';
+import * as WebBrowser from 'expo-web-browser';
+import ParallaxScrollView from '@/components/ParallaxScrollView';
+import { ThemedText } from '@/components/ThemedText';
+import { ThemedView } from '@/components/ThemedView';
+import {CONNECT_RP_AUTH_TOKEN_DO_NOT_COMMIT} from "@/app/(tabs)/SECRET";
+import {DiscoveryDocument, makeRedirectUri, useAuthRequest} from "expo-auth-session";
+import React from "react";
+import {AuthRequestConfig} from "expo-auth-session/src/AuthRequest.types";
+
+
+// TODO - Do we want hard-coded dev?
+const redirectUriScheme = "exp";
+const redirectUri = `${redirectUriScheme}://mobilecomplete`;
+const url =
+ `https://mewmba.ngrok.dev/connect/launch-test?idvProviderSelection=trinsicfake&authToken=${encodeURIComponent(CONNECT_RP_AUTH_TOKEN_DO_NOT_COMMIT)}&redirect_uri=${encodeURIComponent(redirectUri)}`;
+
+
+const config: AuthRequestConfig = {
+ redirectUri: makeRedirectUri({scheme: redirectUriScheme}),
+ clientId: "N/A",
+ scopes: ['N/A'],
+ clientSecret: "N/A"
+};
+const discovery:DiscoveryDocument = {
+ authorizationEndpoint: url
+};
+
+WebBrowser.maybeCompleteAuthSession();
+
+export default function HomeScreen() {
+ const [request, response, promptAsync] = useAuthRequest(config,discovery);
+
+ React.useEffect(() => {
+ console.log('Response:', response);
+ if (response?.type === 'success') {
+ const { code } = response.params;
+ console.log('Code:', code);
+ }
+ }, [response]);
+
+ return (
+
+ }>
+
+ Open Trinsic Connect
+
+
+