diff --git a/examples/unified/react-native-app/.bundle/config b/examples/unified/react-native-app/.bundle/config new file mode 100644 index 0000000000..848943bb52 --- /dev/null +++ b/examples/unified/react-native-app/.bundle/config @@ -0,0 +1,2 @@ +BUNDLE_PATH: "vendor/bundle" +BUNDLE_FORCE_RUBY_PLATFORM: 1 diff --git a/examples/unified/react-native-app/.eslintrc.js b/examples/unified/react-native-app/.eslintrc.js new file mode 100644 index 0000000000..187894b6af --- /dev/null +++ b/examples/unified/react-native-app/.eslintrc.js @@ -0,0 +1,4 @@ +module.exports = { + root: true, + extends: '@react-native', +}; diff --git a/examples/unified/react-native-app/.gitignore b/examples/unified/react-native-app/.gitignore new file mode 100644 index 0000000000..fbaf02d4fa --- /dev/null +++ b/examples/unified/react-native-app/.gitignore @@ -0,0 +1,76 @@ +# OSX +# +.DS_Store + +# Xcode +# +build/ +build-old-arch/ +build-new-arch/ +.harness-pods-arch +*.pbxuser +!default.pbxuser +*.mode1v3 +!default.mode1v3 +*.mode2v3 +!default.mode2v3 +*.perspectivev3 +!default.perspectivev3 +xcuserdata +*.xccheckout +*.moved-aside +DerivedData +*.hmap +*.ipa +*.xcuserstate +**/.xcode.env.local + +# Android/IntelliJ +# +build/ +.idea +.gradle +local.properties +*.iml +*.hprof +.cxx/ +*.keystore +!debug.keystore + +# node.js +# +node_modules/ +npm-debug.log +yarn-error.log + +# fastlane +# +# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the +# screenshots whenever they are needed. +# For more information about the recommended setup visit: +# https://docs.fastlane.tools/best-practices/source-control/ + +**/fastlane/report.xml +**/fastlane/Preview.html +**/fastlane/screenshots +**/fastlane/test_output + +# Bundle artifact +*.jsbundle + +# Ruby / CocoaPods +**/Pods/ +/vendor/bundle/ + +# Temporary files created by Metro to check the health of the file watcher +.metro-health-check* + +# testing +/coverage + +# Yarn +.yarn/* +!.yarn/patches +!.yarn/plugins +!.yarn/sdks +!.yarn/versions diff --git a/examples/unified/react-native-app/.prettierrc.js b/examples/unified/react-native-app/.prettierrc.js new file mode 100644 index 0000000000..2b540746a7 --- /dev/null +++ b/examples/unified/react-native-app/.prettierrc.js @@ -0,0 +1,7 @@ +module.exports = { + arrowParens: 'avoid', + bracketSameLine: true, + bracketSpacing: false, + singleQuote: true, + trailingComma: 'all', +}; diff --git a/examples/unified/react-native-app/.watchmanconfig b/examples/unified/react-native-app/.watchmanconfig new file mode 100644 index 0000000000..0967ef424b --- /dev/null +++ b/examples/unified/react-native-app/.watchmanconfig @@ -0,0 +1 @@ +{} diff --git a/examples/unified/react-native-app/App.tsx b/examples/unified/react-native-app/App.tsx new file mode 100644 index 0000000000..5c1c38afe8 --- /dev/null +++ b/examples/unified/react-native-app/App.tsx @@ -0,0 +1,113 @@ +import React from 'react'; +import { + Button, + SafeAreaView, + ScrollView, + StatusBar, + StyleSheet, + Text, + useColorScheme, + View, +} from 'react-native'; +import {init, Types} from '@amplitude/unified-react-native'; + +const getApiKey = (): string => { + const apiKey = process.env.VITE_AMPLITUDE_API_KEY; + if (!apiKey || apiKey.startsWith('<')) { + throw new Error( + 'Set VITE_AMPLITUDE_API_KEY in the repository-root .env file, then restart Metro.', + ); + } + return apiKey; +}; + +const API_KEY = getApiKey(); + +function App(): React.JSX.Element { + const isDarkMode = useColorScheme() === 'dark'; + const [status, setStatus] = React.useState( + 'Attach Android Studio Network Inspector, then initialize all SDK blades.', + ); + const [isInitializing, setIsInitializing] = React.useState(false); + const [isInitialized, setIsInitialized] = React.useState(false); + + const initializeAll = async () => { + setIsInitializing(true); + setStatus('Initializing all SDK blades…'); + await init(API_KEY, { + logLevel: Types.LogLevel.Warn, + analytics: {userId: 'unified-example-user'}, + sessionReplay: { + enableRemoteConfig: false, + logLevel: Types.LogLevel.Debug, + sampleRate: 1, + }, + }); + setIsInitialized(true); + setIsInitializing(false); + setStatus( + 'Initialization completed. Check Metro or Logcat for any blade errors.', + ); + }; + + const colors = isDarkMode + ? { + background: '#111827', + card: '#1f2937', + text: '#f9fafb', + muted: '#d1d5db', + } + : { + background: '#f3f4f6', + card: '#ffffff', + text: '#111827', + muted: '#4b5563', + }; + + return ( + + + + AMPLITUDE + + Unified React Native SDK + + + This app directly installs one Amplitude package and uses its + autolinking preset for every native blade. + + + +