add expo-cng demo app

- having some issues with the expo-cng demo app and the workspace, so we remove it from the workspace entirely right now so it manages its own deps.

Author: zibs

app.json

@@ -0,0 +1,5 @@
+{
+  "ios": {
+    "bundleIdentifier": "com.anonymous.rnaa"
+  }
+}

examples/expo-cng/.gitignore

@@ -0,0 +1,39 @@
+# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
+
+# dependencies
+node_modules/
+
+/android
+/ios
+# Expo
+.expo/
+dist/
+web-build/
+expo-env.d.ts
+
+# Native
+.kotlin/
+*.orig.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+
+# Metro
+.metro-health-check*
+
+# debug
+npm-debug.*
+yarn-debug.*
+yarn-error.*
+
+# macOS
+.DS_Store
+*.pem
+
+# local env files
+.env*.local
+
+# typescript
+*.tsbuildinfo

examples/expo-cng/App.tsx

@@ -0,0 +1,115 @@
+import React, { useState } from 'react';
+import { StatusBar } from 'expo-status-bar';
+import { StyleSheet, Text, View, Button, Alert, ScrollView } from 'react-native';
+import { authorize, AuthConfiguration, AuthorizeResult } from 'react-native-app-auth';
+
+// Demo configuration using Duende IdentityServer demo
+// For production, replace with your OAuth provider details
+const config: AuthConfiguration = {
+  issuer: 'https://demo.duendesoftware.com',
+  clientId: 'interactive.public',
+  redirectUrl: 'com.example.expo-cng://oauth',
+  scopes: ['openid', 'profile', 'email', 'api'],
+  additionalParameters: {},
+  useNonce: true,
+  usePKCE: true,
+};
+
+export default function App() {
+  const [authState, setAuthState] = useState<AuthorizeResult | null>(null);
+  const [loading, setLoading] = useState<boolean>(false);
+
+  const handleAuthorize = async (): Promise<void> => {
+    try {
+      setLoading(true);
+      const result = await authorize(config);
+      setAuthState(result);
+      Alert.alert('Success', 'Authentication successful!');
+    } catch (error) {
+      console.error('Auth error:', error);
+      Alert.alert('Error', `Authentication failed: ${(error as Error).message}`);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleLogout = (): void => {
+    setAuthState(null);
+    Alert.alert('Logged out', 'You have been logged out successfully');
+  };
+
+  return (
+    <ScrollView contentContainerStyle={styles.container}>
+      <Text style={styles.title}>React Native App Auth - Expo CNG Demo</Text>
+      
+      <View style={styles.section}>
+        <Text style={styles.sectionTitle}>Authentication Status</Text>
+        <Text style={styles.status}>
+          {authState ? 'Authenticated' : 'Not authenticated'}
+        </Text>
+      </View>
+
+      {!authState ? (
+        <Button
+          title={loading ? 'Authenticating...' : 'Authorize'}
+          onPress={handleAuthorize}
+          disabled={loading}
+        />
+      ) : (
+        <View style={styles.section}>
+          <Text style={styles.sectionTitle}>User Info</Text>
+          <Text style={styles.info}>Access Token: {authState.accessToken.substring(0, 20)}...</Text>
+          <Text style={styles.info}>Token Type: {authState.tokenType}</Text>
+          <Text style={styles.info}>Scopes: {authState.scopes.join(', ')}</Text>
+          <Button title="Logout" onPress={handleLogout} />
+        </View>
+      )}
+
+      <View style={styles.section}>
+        <Text style={styles.sectionTitle}>Plugin Configuration</Text>
+        <Text style={styles.info}>Redirect URL: {config.redirectUrl}</Text>
+        <Text style={styles.info}>Issuer: {config.issuer}</Text>
+        <Text style={styles.info}>Scopes: {config.scopes.join(', ')}</Text>
+      </View>
+
+      <StatusBar style="auto" />
+    </ScrollView>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flexGrow: 1,
+    backgroundColor: '#fff',
+    alignItems: 'center',
+    justifyContent: 'center',
+    padding: 20,
+  },
+  title: {
+    fontSize: 24,
+    fontWeight: 'bold',
+    marginBottom: 30,
+    textAlign: 'center',
+  },
+  section: {
+    marginVertical: 20,
+    padding: 15,
+    backgroundColor: '#f5f5f5',
+    borderRadius: 8,
+    width: '100%',
+  },
+  sectionTitle: {
+    fontSize: 18,
+    fontWeight: 'bold',
+    marginBottom: 10,
+  },
+  status: {
+    fontSize: 16,
+    color: '#666',
+  },
+  info: {
+    fontSize: 14,
+    marginBottom: 5,
+    color: '#666',
+  },
+});

examples/expo-cng/README.md

@@ -0,0 +1,137 @@
+# Expo CNG TypeScript Example for react-native-app-auth
+
+This example demonstrates how to use the `react-native-app-auth` Expo config plugin with Continuous Native Generation (CNG) in a TypeScript project.
+
+## What This Example Tests
+
+1. **Config Plugin Integration**: Validates that the plugin properly configures native projects
+2. **TypeScript Support**: Demonstrates full type safety with react-native-app-auth
+3. **URL Scheme Configuration**: Tests that OAuth redirect URLs are correctly configured
+4. **Platform-specific Setup**: Ensures both iOS and Android native configurations work
+5. **CNG Compatibility**: Validates the plugin works with Expo's continuous native generation
+
+## Setup Instructions
+
+### 1. Install Dependencies
+
+From the repository root:
+```bash
+yarn install
+```
+
+### 2. Generate Native Code
+
+Since this is a CNG (Continuous Native Generation) project, you need to generate the native code:
+
+```bash
+cd examples/expo-cng
+npx expo prebuild
+```
+
+This will:
+- Generate the `ios/` and `android/` directories
+- Apply the react-native-app-auth config plugin
+- Configure URL schemes and native project settings
+
+### 3. Run the App
+
+For iOS:
+```bash
+npx expo run:ios
+```
+
+For Android:
+```bash
+npx expo run:android
+```
+
+## TypeScript Benefits
+
+This example showcases:
+
+- **Type-safe Configuration**: `AuthConfiguration` interface ensures correct config
+- **Typed Results**: `AuthorizeResult` provides IntelliSense for auth responses
+- **Error Handling**: Proper TypeScript error handling with type assertions
+- **IDE Support**: Full autocomplete and type checking in development
+
+## What the Plugin Should Configure
+
+### iOS Configuration
+- **URL Schemes**: Adds the redirect URL scheme to `Info.plist`
+- **Bridging Header**: Configures Objective-C bridging for React Native
+- **Build Settings**: Adds necessary Xcode build settings
+- **App Delegate**: Configures the app delegate to handle OAuth callbacks
+
+### Android Configuration
+- **Manifest Placeholders**: Adds URL scheme handling to `AndroidManifest.xml`
+- **Build Gradle**: Configures the app-level build.gradle file
+
+## Validation Steps
+
+To validate the plugin is working correctly:
+
+1. **Check Native Files**: After running `npx expo prebuild`, inspect the generated native files:
+   - iOS: Check `ios/expocng/Info.plist` for URL schemes containing `com.example.expo-cng`
+   - Android: Check `android/app/build.gradle` for `appAuthRedirectScheme: 'com.example.expo-cng'`
+
+2. **TypeScript Compilation**: The app should compile without TypeScript errors
+
+3. **Build Verification**: The app should build successfully without manual native configuration
+
+## Troubleshooting
+
+### Plugin Not Applied
+If the plugin doesn't seem to be working:
+```bash
+# Clean and regenerate
+npx expo prebuild --clean
+```
+
+### TypeScript Errors
+If you see TypeScript errors related to react-native-app-auth:
+- Ensure the library is properly installed: `yarn install`
+- Check that types are imported correctly from the main library
+
+### URL Scheme Issues
+The example uses a demo OAuth provider. For production use, configure your own OAuth provider and update the `config` object in `App.tsx`.
+
+### Build Errors
+If you encounter build errors:
+1. Ensure all dependencies are installed: `yarn install`
+2. Clean and rebuild: `npx expo prebuild --clean`
+3. Check that the plugin version matches the library version
+
+## Plugin Configuration Options
+
+The plugin accepts these options in `app.json`:
+
+```json
+{
+  "expo": {
+    "plugins": [
+      [
+        "react-native-app-auth",
+        {
+          "redirectUrls": ["your-app-scheme://oauth"]
+        }
+      ]
+    ]
+  }
+}
+```
+
+Currently, only `redirectUrls` is configurable. The plugin will automatically set up all necessary native configurations based on this URL scheme.
+
+## TypeScript Types
+
+The example imports and uses these types from react-native-app-auth:
+
+```typescript
+import { 
+  authorize, 
+  AuthConfiguration, 
+  AuthorizeResult 
+} from 'react-native-app-auth';
+```
+
+This ensures full type safety throughout the authentication flow.

examples/expo-cng/app.json

@@ -0,0 +1,41 @@
+{
+  "expo": {
+    "name": "expo-cng",
+    "slug": "expo-cng",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/icon.png",
+    "userInterfaceStyle": "light",
+    "newArchEnabled": true,
+    "splash": {
+      "image": "./assets/splash-icon.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "ios": {
+      "supportsTablet": true,
+      "bundleIdentifier": "com.anonymous.expocng"
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/adaptive-icon.png",
+        "backgroundColor": "#ffffff"
+      },
+      "edgeToEdgeEnabled": true,
+      "package": "com.anonymous.expocng"
+    },
+    "web": {
+      "favicon": "./assets/favicon.png"
+    },
+    "plugins": [
+      [
+        "react-native-app-auth",
+        {
+          "redirectUrls": [
+            "com.example.expo-cng://oauth"
+          ]
+        }
+      ]
+    ]
+  }
+}

examples/expo-cng/assets/adaptive-icon.png

@@ -0,0 +1,8 @@
+import { registerRootComponent } from 'expo';
+
+import App from './App';
+
+// registerRootComponent calls AppRegistry.registerComponent('main', () => App);
+// It also ensures that whether you load the app in Expo Go or in a native build,
+// the environment is set up appropriately
+registerRootComponent(App);