Skip to content

Commit 1488c6e

Browse files
Add MixpanelStarter: Modern Sample App with TypeScript & Context API (#334)
* Add MixpanelStarter sample application Create a modern, production-ready React Native sample app that demonstrates Mixpanel SDK integration with TypeScript, Context API, and best practices. This sample bridges the gap between SimpleMixpanel (too basic) and MixpanelDemo (too complex), showcasing 80% of common Mixpanel use cases. Features: - Context API pattern with useMixpanel hook for app-wide access - TypeScript strict mode for type safety - React Navigation 7 with bottom tabs (3 screens) - 8 core SDK capabilities demonstrated: * User identification (identify, alias, anonymous-to-identified flow) * User profiles (getPeople().set, setOnce) * Event tracking with custom properties * Timed events (timeEvent for duration tracking) * Super properties (global context) * Privacy controls (optIn/Out, GDPR compliance) * Data management (reset for logout) * Manual flush Project structure: - src/contexts/MixpanelContext.tsx - Context provider + hook - src/screens/ - 3 educational screens (Onboarding, Home, Settings) - src/components/ - Reusable components (ErrorBoundary, ActionButton, InfoCard) - src/types/ - TypeScript definitions - src/constants/tracking.ts - Event names & property constants Documentation: - README.md - Comprehensive guide with quick start, patterns, Q&A - INTEGRATION_GUIDE.md - Step-by-step integration checklist - CLAUDE.md - AI assistant context for development Technical details: - React Native 0.82.1 with React 19.1.1 - Metro config optimized for parent package symlink resolution - iOS code signing disabled for simulator-only use - All dependencies properly configured - Tests passing (MixpanelContext unit tests) - TypeScript compilation successful with strict mode * bump test_android runner to macos-latest * Fix Android emulator boot timeout in CI workflow (#335) * Initial plan * Fix Android emulator boot timeout with increased timeout and proper configuration Co-authored-by: jaredmixpanel <10504508+jaredmixpanel@users.noreply.github.com> --------- Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com> Co-authored-by: jaredmixpanel <10504508+jaredmixpanel@users.noreply.github.com> * change arch in test_arndroid to match runner * change arch in test_arndroid to match runner * use ubuntu for android test --------- Co-authored-by: Copilot <198982749+Copilot@users.noreply.github.com> Co-authored-by: jaredmixpanel <10504508+jaredmixpanel@users.noreply.github.com>
1 parent 36ce38f commit 1488c6e

File tree

70 files changed

+19795
-1
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

70 files changed

+19795
-1
lines changed

.github/workflows/node.js.yml

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ jobs:
2727
- run: npm test
2828

2929
test_android:
30-
runs-on: macos-13
30+
runs-on: ubuntu-latest
3131
strategy:
3232
matrix:
3333
node-version: [18.x]
@@ -50,10 +50,16 @@ jobs:
5050
- name: Test Integration - Install dependencies
5151
working-directory: ./Samples/SimpleMixpanel
5252
run: yarn install
53+
- name: Enable KVM
54+
run: |
55+
echo 'KERNEL=="kvm", GROUP="kvm", MODE="0666", OPTIONS+="static_node=kvm"' | sudo tee /etc/udev/rules.d/99-kvm4all.rules
56+
sudo udevadm control --reload-rules
57+
sudo udevadm trigger --name-match=kvm
5358
- name: Setup Android
5459
uses: reactivecircus/android-emulator-runner@v2.32.0
5560
with:
5661
api-level: 34
62+
target: google_apis
5763
profile: Nexus 5X
5864
arch: x86_64
5965
working-directory: ./Samples/SimpleMixpanel/android
@@ -62,6 +68,7 @@ jobs:
6268
uses: reactivecircus/android-emulator-runner@v2.32.0
6369
with:
6470
api-level: 34
71+
target: google_apis
6572
profile: Nexus 5X
6673
arch: x86_64
6774
working-directory: ./Samples/SimpleMixpanel
Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
BUNDLE_PATH: "vendor/bundle"
2+
BUNDLE_FORCE_RUBY_PLATFORM: 1
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
# Mixpanel Configuration
2+
# Get your token from: https://mixpanel.com/project/YOUR_PROJECT_ID/settings#project
3+
4+
MIXPANEL_TOKEN="YOUR_MIXPANEL_PROJECT_TOKEN"
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
module.exports = {
2+
root: true,
3+
extends: '@react-native',
4+
};

Samples/MixpanelStarter/.gitignore

Lines changed: 75 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
# OSX
2+
#
3+
.DS_Store
4+
5+
# Xcode
6+
#
7+
build/
8+
*.pbxuser
9+
!default.pbxuser
10+
*.mode1v3
11+
!default.mode1v3
12+
*.mode2v3
13+
!default.mode2v3
14+
*.perspectivev3
15+
!default.perspectivev3
16+
xcuserdata
17+
*.xccheckout
18+
*.moved-aside
19+
DerivedData
20+
*.hmap
21+
*.ipa
22+
*.xcuserstate
23+
**/.xcode.env.local
24+
25+
# Android/IntelliJ
26+
#
27+
build/
28+
.idea
29+
.gradle
30+
local.properties
31+
*.iml
32+
*.hprof
33+
.cxx/
34+
*.keystore
35+
!debug.keystore
36+
.kotlin/
37+
38+
# node.js
39+
#
40+
node_modules/
41+
npm-debug.log
42+
yarn-error.log
43+
44+
# fastlane
45+
#
46+
# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
47+
# screenshots whenever they are needed.
48+
# For more information about the recommended setup visit:
49+
# https://docs.fastlane.tools/best-practices/source-control/
50+
51+
**/fastlane/report.xml
52+
**/fastlane/Preview.html
53+
**/fastlane/screenshots
54+
**/fastlane/test_output
55+
56+
# Bundle artifact
57+
*.jsbundle
58+
59+
# Ruby / CocoaPods
60+
**/Pods/
61+
/vendor/bundle/
62+
63+
# Temporary files created by Metro to check the health of the file watcher
64+
.metro-health-check*
65+
66+
# testing
67+
/coverage
68+
69+
# Yarn
70+
.yarn/*
71+
!.yarn/patches
72+
!.yarn/plugins
73+
!.yarn/releases
74+
!.yarn/sdks
75+
!.yarn/versions
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
module.exports = {
2+
arrowParens: 'avoid',
3+
singleQuote: true,
4+
trailingComma: 'all',
5+
};
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
{}

Samples/MixpanelStarter/App.tsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
/**
2+
* MixpanelStarter - Sample React Native App
3+
* Demonstrates Mixpanel SDK integration with modern patterns
4+
*
5+
* @format
6+
*/
7+
8+
import App from './src/App';
9+
10+
export default App;

0 commit comments

Comments
 (0)