chore: updated rn-sb-demo to use expo environment variables

Ensured EAS works with monorepo's packages
updated lock file

Author: Christiaan Landman

app.json

@@ -0,0 +1,3 @@
+{
+  "expo": {}
+}

demos/react-native-supabase-group-chat/.env

@@ -1,5 +1,6 @@
-# Replace the credentials below with you Supabase, PowerSync and Expo project details.
+# Copy this template: `cp .env.template .env`
+# Edit .env and enter your Supabase and PowerSync project details.
 EXPO_PUBLIC_SUPABASE_URL=https://foo.supabase.co
 EXPO_PUBLIC_SUPABASE_ANON_KEY=foo
 EXPO_PUBLIC_POWERSYNC_URL=https://foo.powersync.journeyapps.com
-EXPO_PUBLIC_EAS_PROJECT_ID=foo
+EXPO_PUBLIC_EAS_PROJECT_ID=foo # Optional. Only required when using EAS.

demos/react-native-supabase-group-chat/.gitignore

@@ -16,7 +16,9 @@ web-build/
 # Temporary files created by Metro to check the health of the file watcher
 .metro-health-check*
 
-# .env
+# local env files
+.env*.local
+
 *.ipa
 *.tar.gz
 .tamagui

demos/react-native-supabase-todolist/.env

@@ -0,0 +1,6 @@
+# Edit and enter your Supabase and PowerSync project details.
+EXPO_PUBLIC_SUPABASE_URL=https://foo.supabase.co
+EXPO_PUBLIC_SUPABASE_ANON_KEY=foo
+EXPO_PUBLIC_SUPABASE_BUCKET= // Optional. Only required when syncing attachments and using Supabase Storage. See packages/powersync-attachments.
+EXPO_PUBLIC_POWERSYNC_URL=https://foo.powersync.journeyapps.com
+EXPO_PUBLIC_EAS_PROJECT_ID=foo # Optional. Only required when using EAS.

demos/react-native-supabase-todolist/.gitignore

@@ -1,8 +1,5 @@
 # Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
 
-# Credentials
-library/supabase/AppConfig.ts
-
 # dependencies
 node_modules/
 
@@ -31,7 +28,6 @@ npm-debug.*
 
 # local env files
 .env*.local
-.env
 
 # typescript
 *.tsbuildinfo

demos/react-native-supabase-todolist/README.md

@@ -36,14 +36,7 @@ bucket_definitions:
 ```
 
 ## Configure The App
-
-Copy the `AppConfig.template.ts` to a usable file
-
-```bash
-cp library/supabase/AppConfig.template.ts library/supabase/AppConfig.ts
-```
-
-Insert the necessary credentials.
+Replace the necessary credentials in the [.env](./.env) file.
 
 ## Run the App
 
@@ -64,3 +57,16 @@ Run on Android
 ```sh
 pnpm android
 ```
+
+## EAS Setup
+To use EAS for builds you need to ensure that your [eas.json](./eas.json) file is configured.
+This may lead to some duplication of variables between `.env` files and `eas.json` build profiles but makes it easier to see what variables will be applied across all environments. Read more on this [here](https://docs.expo.dev/build-reference/variables/#can-eas-build-use-env-files).
+
+
+## Here are some helpful links:
+
+- [PowerSync Website](https://www.powersync.com/)
+- [PowerSync Docs](https://docs.powersync.com/)
+- [PowerSync React Native Client SDK](https://github.com/journeyapps/powersync-js/tree/main/packages/powersync-sdk-react-native)
+- [Supabase Docs](https://supabase.com/docs)
+- [Expo Docs](https://docs.expo.dev/)

demos/react-native-supabase-todolist/app.config.ts

@@ -0,0 +1,61 @@
+import { type ExpoConfig } from "expo/config";
+
+const projectId = process.env.EXPO_PUBLIC_EAS_PROJECT_ID;
+
+const config: ExpoConfig = {
+    name: 'powersync-example',
+    slug: 'powersync-example',
+    version: '1.0.0',
+    orientation: 'portrait',
+    icon: './assets/icon.png',
+    userInterfaceStyle: 'light',
+    scheme: 'powersync',
+    splash: {
+        image: './assets/splash.png',
+        resizeMode: 'contain',
+        backgroundColor: '#ffffff',
+    },
+    updates: {
+        url: `https://u.expo.dev/${projectId}`,
+    },
+    assetBundlePatterns: ['**/*'],
+    ios: {
+        supportsTablet: true,
+        bundleIdentifier: 'com.powersync.example',
+    },
+    android: {
+        adaptiveIcon: {
+            foregroundImage: './assets/adaptive-icon.png',
+            backgroundColor: '#ffffff',
+        },
+        package: 'com.powersync.example',
+    },
+    web: {
+        favicon: './assets/favicon.png',
+    },
+    extra: {
+        eas: {
+            projectId
+        },
+    },
+    plugins: [
+        'expo-router',
+        [
+            'expo-camera',
+            {
+                cameraPermission: 'Allow $(PRODUCT_NAME) to access your camera.',
+            },
+        ],
+        [
+            'expo-build-properties',
+            {
+                ios: {
+                    deploymentTarget: '13.4',
+                },
+            },
+        ],
+        'expo-secure-store',
+    ],
+};
+
+export default config;

demos/react-native-supabase-todolist/app.json

@@ -0,0 +1,26 @@
+{
+  "cli": {
+    "version": ">= 3.13.3",
+    "promptToConfigurePushNotifications": false
+  },
+  "build": {
+    "development": {
+      "developmentClient": true,
+      "distribution": "internal",
+      "channel": "preview"
+    },
+    "preview": {
+      "channel": "preview",
+      "distribution": "internal"
+    },
+    "production": {
+      "channel": "production",
+      "env": {
+        "EXPO_PUBLIC_SUPABASE_URL": "https://foo.supabase.co",
+        "EXPO_PUBLIC_SUPABASE_ANON_KEY": "foo",
+        "EXPO_PUBLIC_POWERSYNC_URL": "https://foo.powersync.journeyapps.com",
+        "EXPO_PUBLIC_EAS_PROJECT_ID": "foo"
+      }
+    }
+  }
+}