chore(example): app restructure (#119)

Restructures example apps into organized sections:

- **demos/** - User-facing tutorials with marketplace links
- **exercisers/** - Developer testing, edge cases, stress tests  
- **tests/** - Test runner UI (integrated from #106)
- **reproducers/** - Bug reproduction (`local/` gitignored for throwaway
files)

Also wires up the 🔧 wrench menu "Run Tests" to navigate to TestsPage in
both example and expo-example.

<img width="300" alt="image"
src="https://github.com/user-attachments/assets/c9afbfe3-cb68-4957-9256-2bdfb47d22d6"
/>

<img width="300" alt="image"
src="https://github.com/user-attachments/assets/5e33696a-14f1-4d31-8f7e-681ba4a4ec63"
/>

Author: mfazekas

.gitignore

@@ -86,3 +86,7 @@ android/generated
 
 # ktlint binary cache
 .ktlint/
+
+# Local reproducers (not checked in)
+example/src/reproducers/local/*
+!example/src/reproducers/local/.gitkeep

example/__tests__/rive.harness.ts

@@ -13,7 +13,7 @@ describe('RiveFile Loading', () => {
 
   it('fromURL works', async () => {
     const file = await RiveFileFactory.fromURL(
-      'http://localhost:8081/assets/assets/rive/viewmodelproperty.riv',
+      'https://cdn.rive.app/animations/vehicles.riv',
       undefined
     );
     expect(file).toBeDefined();

example/ios/Podfile.lock

@@ -1755,6 +1755,30 @@ PODS:
     - React-perflogger (= 0.79.2)
     - React-utils (= 0.79.2)
   - RiveRuntime (6.13.0)
+  - RNCAsyncStorage (2.2.0):
+    - DoubleConversion
+    - glog
+    - hermes-engine
+    - RCT-Folly (= 2024.11.18.00)
+    - RCTRequired
+    - RCTTypeSafety
+    - React-Core
+    - React-debug
+    - React-Fabric
+    - React-featureflags
+    - React-graphics
+    - React-hermes
+    - React-ImageManager
+    - React-jsi
+    - React-NativeModulesApple
+    - React-RCTFabric
+    - React-renderercss
+    - React-rendererdebug
+    - React-utils
+    - ReactCodegen
+    - ReactCommon/turbomodule/bridging
+    - ReactCommon/turbomodule/core
+    - Yoga
   - RNCPicker (2.11.4):
     - DoubleConversion
     - glog
@@ -1880,7 +1904,7 @@ PODS:
     - ReactCommon/turbomodule/core
     - RNWorklets
     - Yoga
-  - RNRive (0.1.4):
+  - RNRive (0.1.5):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -2057,6 +2081,7 @@ DEPENDENCIES:
   - ReactAppDependencyProvider (from `build/generated/ios`)
   - ReactCodegen (from `build/generated/ios`)
   - ReactCommon/turbomodule/core (from `../node_modules/react-native/ReactCommon`)
+  - "RNCAsyncStorage (from `../node_modules/@react-native-async-storage/async-storage`)"
   - "RNCPicker (from `../node_modules/@react-native-picker/picker`)"
   - RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
   - RNReanimated (from `../node_modules/react-native-reanimated`)
@@ -2213,6 +2238,8 @@ EXTERNAL SOURCES:
     :path: build/generated/ios
   ReactCommon:
     :path: "../node_modules/react-native/ReactCommon"
+  RNCAsyncStorage:
+    :path: "../node_modules/@react-native-async-storage/async-storage"
   RNCPicker:
     :path: "../node_modules/@react-native-picker/picker"
   RNGestureHandler:
@@ -2234,78 +2261,79 @@ SPEC CHECKSUMS:
   fmt: a40bb5bd0294ea969aaaba240a927bd33d878cdd
   glog: 5683914934d5b6e4240e497e0f4a3b42d1854183
   hermes-engine: 314be5250afa5692b57b4dd1705959e1973a8ebe
-  NitroModules: 0af9a8516f3d8f101976d60e1f34e2a22f401600
-  RCT-Folly: e78785aa9ba2ed998ea4151e314036f6c49e6d82
+  NitroModules: 7f50ee216f8403e8eb243acfc504f3f856d6914c
+  RCT-Folly: 36fe2295e44b10d831836cc0d1daec5f8abcf809
   RCTDeprecation: 83ffb90c23ee5cea353bd32008a7bca100908f8c
   RCTRequired: eb7c0aba998009f47a540bec9e9d69a54f68136e
   RCTTypeSafety: 659ae318c09de0477fd27bbc9e140071c7ea5c93
   React: c2d3aa44c49bb34e4dfd49d3ee92da5ebacc1c1c
   React-callinvoker: 1bdfb7549b5af266d85757193b5069f60659ef9d
-  React-Core: 10597593fdbae06f0089881e025a172e51d4a769
-  React-CoreModules: 6907b255529dd46895cf687daa67b24484a612c2
-  React-cxxreact: a9f5b8180d6955bc3f6a3fcd657c4d9b4d95c1f6
+  React-Core: 7150cf9b6a5af063b37003062689f1691e79c020
+  React-CoreModules: 15a85e6665d61678942da6ae485b351f4c699049
+  React-cxxreact: 74f9de59259ac951923f5726aa14f0398f167af9
   React-debug: e74e76912b91e08d580c481c34881899ccf63da9
-  React-defaultsnativemodule: 11f6ee2cf69bf3af9d0f28a6253def33d21b5266
-  React-domnativemodule: f940bbc4fa9e134190acbf3a4a9f95621b5a8f51
-  React-Fabric: 6f5c357bf3a42ff11f8844ad3fc7a1eb04f4b9de
-  React-FabricComponents: 10e0c0209822ac9e69412913a8af1ca33573379b
-  React-FabricImage: f582e764072dfa4715ae8c42979a5bace9cbcc12
+  React-defaultsnativemodule: 628285212bbd65417d40ad6a9f8781830fda6c98
+  React-domnativemodule: 185d9808198405c176784aaf33403d713bd24fb7
+  React-Fabric: c814804affbe1952e16149ddd20256e1bccae67e
+  React-FabricComponents: 81ef47d596966121784afec9924f9562a29b1691
+  React-FabricImage: f14f371d678aa557101def954ac3ba27e48948ff
   React-featureflags: d5facceff8f8f6de430e0acecf4979a9a0839ba9
-  React-featureflagsnativemodule: a7dd141f1ef4b7c1331af0035689fbc742a49ff4
-  React-graphics: 36ae3407172c1c77cea29265d2b12b90aaef6aa0
-  React-hermes: 9116d4e6d07abeb519a2852672de087f44da8f12
-  React-idlecallbacksnativemodule: ae7f5ffc6cf2d2058b007b78248e5b08172ad5c3
-  React-ImageManager: 9daee0dc99ad6a001d4b9e691fbf37107e2b7b54
-  React-jserrorhandler: 1e6211581071edaf4ecd5303147328120c73f4dc
-  React-jsi: 753ba30c902f3a41fa7f956aca8eea3317a44ee6
-  React-jsiexecutor: 47520714aa7d9589c51c0f3713dfbfca4895d4f9
-  React-jsinspector: cfd27107f6d6f1076a57d88c932401251560fe5f
-  React-jsinspectortracing: 76a7d791f3c0c09a0d2bf6f46dfb0e79a4fcc0ac
-  React-jsitooling: 995e826570dd58f802251490486ebd3244a037ab
-  React-jsitracing: 094ae3d8c123cea67b50211c945b7c0443d3e97b
-  React-logger: 8edfcedc100544791cd82692ca5a574240a16219
-  React-Mapbuffer: c3f4b608e4a59dd2f6a416ef4d47a14400194468
-  React-microtasksnativemodule: 054f34e9b82f02bd40f09cebd4083828b5b2beb6
-  react-native-safe-area-context: 0b8555c40461feb7198e999912a3446602e7c601
-  React-NativeModulesApple: 2c4377e139522c3d73f5df582e4f051a838ff25e
+  React-featureflagsnativemodule: 96f0ab285382d95c90f663e02526a5ceefa95a11
+  React-graphics: 1a66ee0a3f093b125b853f6370296fadcaf6f233
+  React-hermes: 8b86e5f54a65ecb69cdf22b3a00a11562eda82d2
+  React-idlecallbacksnativemodule: 5c25ab145c602264d00cb26a397ab52e0efa031c
+  React-ImageManager: 15e34bd5ef1ac4a18e96660817ef70a7f99ee8c2
+  React-jserrorhandler: 02cdf2cd45350108be1ffd2b164578936dbbdff7
+  React-jsi: 6af1987cfbb1b6621664fdbf6c7b62bd4d38c923
+  React-jsiexecutor: 51f372998e0303585cb0317232b938d694663cbd
+  React-jsinspector: 3539ad976d073bfaa8a7d2fa9bef35e70e55033e
+  React-jsinspectortracing: e8dbacaf67c201f23052ca1c2bae2f7b84dec443
+  React-jsitooling: 95a34f41e3c249d42181de13b4f8d854f178ca9f
+  React-jsitracing: 25b029cf5cad488252d46da19dd8c4c134fd5fe4
+  React-logger: 368570a253f00879a1e4fea24ed4047e72e7bbf3
+  React-Mapbuffer: c04fcda1c6281fc0a6824c7dcc1633dd217ac1ec
+  React-microtasksnativemodule: ca2804a25fdcefffa0aa942aa23ab53b99614a34
+  react-native-safe-area-context: bc59472155ffb889a1ffe16c19a04c0cd451562b
+  React-NativeModulesApple: 452b86b29fae99ed0a4015dca3ad9cd222f88abf
   React-oscompat: ef5df1c734f19b8003e149317d041b8ce1f7d29c
-  React-perflogger: 9a151e0b4c933c9205fd648c246506a83f31395d
-  React-performancetimeline: 5b0dfc0acba29ea0269ddb34cd6dd59d3b8a1c66
+  React-perflogger: 6fd2f6811533e9c19a61e855c3033eecbf4ad2a0
+  React-performancetimeline: abf31259d794c9274b3ea19c5016186925eec6c4
   React-RCTActionSheet: a499b0d6d9793886b67ba3e16046a3fef2cdbbc3
-  React-RCTAnimation: cc64adc259aabc3354b73065e2231d796dfce576
-  React-RCTAppDelegate: 9d523da768f1c9e84c5f3b7e3624d097dfb0e16b
-  React-RCTBlob: e727f53eeefded7e6432eb76bd22b57bc880e5d1
-  React-RCTFabric: 58590aa4fdb4ad546c06a7449b486cf6844e991f
-  React-RCTFBReactNativeSpec: 9064c63d99e467a3893e328ba3612745c3c3a338
-  React-RCTImage: 7159cbdbb18a09d97ba1a611416eced75b3ccb29
-  React-RCTLinking: 46293afdb859bccc63e1d3dedc6901a3c04ef360
-  React-RCTNetwork: 4a6cd18f5bcd0363657789c64043123a896b1170
-  React-RCTRuntime: 5ab904fd749aa52f267ef771d265612582a17880
-  React-RCTSettings: 61e361dc85136d1cb0e148b7541993d2ee950ea7
-  React-RCTText: abd1e196c3167175e6baef18199c6d9d8ac54b4e
-  React-RCTVibration: 490e0dcb01a3fe4a0dfb7bc51ad5856d8b84f343
+  React-RCTAnimation: 2595dcb10a82216a511b54742f8c28d793852ac6
+  React-RCTAppDelegate: f03604b70f57c9469a84a159d8abecf793a5bcff
+  React-RCTBlob: e00f9b4e2f151938f4d9864cf33ebf24ac03328a
+  React-RCTFabric: 3945d116fd271598db262d4e6ed5691d431ed9e8
+  React-RCTFBReactNativeSpec: 0f4d4f0da938101f2ca9d5333a8f46e527ad2819
+  React-RCTImage: dac5e9f8ec476aefe6e60ee640ebc1dfaf1a4dbe
+  React-RCTLinking: 494b785a40d952a1dfbe712f43214376e5f0e408
+  React-RCTNetwork: b3d7c30cd21793e268db107dd0980cb61b3c1c44
+  React-RCTRuntime: a8ff419d437228e7b8a793b14f9d711e1cbb82af
+  React-RCTSettings: a060c7e381a3896104761b8eed7e284d95e37df3
+  React-RCTText: 4f272b72dbb61f390d8c8274528f9fdbff983806
+  React-RCTVibration: 0e5326220719aca12473d703aa46693e3b4ce67a
   React-rendererconsistency: 351fdbc5c1fe4da24243d939094a80f0e149c7a1
-  React-renderercss: 3438814bee838ae7840a633ab085ac81699fd5cf
-  React-rendererdebug: 0ac2b9419ad6f88444f066d4b476180af311fb1e
+  React-renderercss: d333f2ada83969591100d91ec6b23ca2e17e1507
+  React-rendererdebug: 039e5949b72ba63c703de020701e3fd152434c61
   React-rncore: 57ed480649bb678d8bdc386d20fee8bf2b0c307c
-  React-RuntimeApple: 8b7a9788f31548298ba1990620fe06b40de65ad7
-  React-RuntimeCore: e03d96fbd57ce69fd9bca8c925942194a5126dbc
+  React-RuntimeApple: 344a5e1105256000afabaa8df12c3e4cab880340
+  React-RuntimeCore: 0e48fb5e5160acc0334c7a723a42d42cef4b58b6
   React-runtimeexecutor: d60846710facedd1edb70c08b738119b3ee2c6c2
-  React-RuntimeHermes: aab794755d9f6efd249b61f3af4417296904e3ba
-  React-runtimescheduler: c3cd124fa5db7c37f601ee49ca0d97019acd8788
+  React-RuntimeHermes: 064286a03871d932c99738e0f8ef854962ab4b99
+  React-runtimescheduler: e917ab17ae08c204af1ebf8f669b7e411b0220c8
   React-timing: a90f4654cbda9c628614f9bee68967f1768bd6a5
-  React-utils: a612d50555b6f0f90c74b7d79954019ad47f5de6
-  ReactAppDependencyProvider: 04d5eb15eb46be6720e17a4a7fa92940a776e584
-  ReactCodegen: c63eda03ba1d94353fb97b031fc84f75a0d125ba
-  ReactCommon: 76d2dc87136d0a667678668b86f0fca0c16fdeb0
+  React-utils: 51c4e71608b8133fecc9a15801d244ae7bdf3758
+  ReactAppDependencyProvider: d5dcc564f129632276bd3184e60f053fcd574d6b
+  ReactCodegen: fda99a79c866370190e162083a35602fdc314e5d
+  ReactCommon: 4d0da92a5eb8da86c08e3ec34bd23ab439fb2461
   RiveRuntime: 903690a5ba698b2a7e8d462e8aa7ceeba862614c
-  RNCPicker: 28c076ae12a1056269ec0305fe35fac3086c477d
-  RNGestureHandler: 6b39f4e43e4b3a0fb86de9531d090ff205a011d5
-  RNReanimated: 66b68ebe3baf7ec9e716bd059d700726f250d344
-  RNRive: 18b5afca5883b3511187e5024bb58849f74e49fa
-  RNWorklets: b1faafefb82d9f29c4018404a0fb33974b494a7b
+  RNCAsyncStorage: 2cf7d05f5b1bc38680b6c83971e535a6ae9c5bc7
+  RNCPicker: 83c74db2de8274d8a8f3e18d91dea174a708f8c4
+  RNGestureHandler: bff91bb5ab5688265c70f74180ef718b94f33fe3
+  RNReanimated: 9a24892f34ea317264883806d2e3de7ce34eab90
+  RNRive: 73aa1ec7d3ef4da1030e81643808adb538bc05ca
+  RNWorklets: ddf16938b1ed7e878563a4fc8a690968ef3d27f1
   SocketRocket: d4aabe649be1e368d1318fdf28a022d714d65748
-  Yoga: c758bfb934100bb4bf9cbaccb52557cee35e8bdf
+  Yoga: 9f110fc4b7aa538663cba3c14cbb1c335f43c13f
 
 PODFILE CHECKSUM: 6974e58448067deb1048e3b4490e929f624eea3c
 

example/package.json

@@ -12,6 +12,7 @@
     "test:harness:android": "react-native-harness --harnessRunner android"
   },
   "dependencies": {
+    "@react-native-async-storage/async-storage": "^2.1.2",
     "@react-native-picker/picker": "^2.11.4",
     "@react-navigation/native": "^7.1.9",
     "@react-navigation/stack": "^7.3.2",

example/src/App.tsx

@@ -1,13 +1,20 @@
+import { useEffect, useState } from 'react';
 import {
   View,
   Text,
   StyleSheet,
   TouchableOpacity,
-  ScrollView,
+  ActionSheetIOS,
+  Platform,
+  Alert,
 } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
+import { NavigationContainer, useNavigation } from '@react-navigation/native';
 import { createStackNavigator } from '@react-navigation/stack';
-import { PagesList } from './PagesList';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import { PagesList, type PageItem } from './PagesList';
+import { HomeMenu } from './shared/HomeMenu';
+
+const LAST_OPENED_KEY = '@rive_example_last_opened';
 
 type RootStackParamList = {
   Home: undefined;
@@ -17,22 +24,74 @@ type RootStackParamList = {
 
 const Stack = createStackNavigator<RootStackParamList>();
 
+function invokeGC() {
+  if (typeof global.gc === 'function') {
+    global.gc();
+    Alert.alert('GC', 'Garbage collection invoked');
+  } else {
+    Alert.alert('GC', 'GC not available (Hermes debugger not attached)');
+  }
+}
+
+function HeaderMenuButton() {
+  const navigation = useNavigation<any>();
+
+  const openTests = () => {
+    navigation.navigate('TestsPage');
+  };
+
+  const showDevMenu = () => {
+    const options = ['Run Tests', 'Invoke GC', 'Cancel'];
+    const cancelButtonIndex = 2;
+
+    if (Platform.OS === 'ios') {
+      ActionSheetIOS.showActionSheetWithOptions(
+        { options, cancelButtonIndex },
+        (buttonIndex) => {
+          if (buttonIndex === 0) {
+            openTests();
+          } else if (buttonIndex === 1) {
+            invokeGC();
+          }
+        }
+      );
+    } else {
+      Alert.alert('Dev Menu', undefined, [
+        { text: 'Run Tests', onPress: openTests },
+        { text: 'Invoke GC', onPress: invokeGC },
+        { text: 'Cancel', style: 'cancel' },
+      ]);
+    }
+  };
+
+  return (
+    <TouchableOpacity onPress={showDevMenu} style={styles.headerButton}>
+      <Text style={styles.headerButtonText}>🔧</Text>
+    </TouchableOpacity>
+  );
+}
+
 function HomeScreen({ navigation }: { navigation: any }) {
+  const [lastOpened, setLastOpened] = useState<PageItem | null>(null);
+
+  useEffect(() => {
+    AsyncStorage.getItem(LAST_OPENED_KEY).then((id) => {
+      if (id) {
+        const page = PagesList.find((p) => p.id === id);
+        if (page) setLastOpened(page);
+      }
+    });
+  }, []);
+
+  const handleNavigate = (id: string) => {
+    AsyncStorage.setItem(LAST_OPENED_KEY, id);
+    navigation.navigate(id);
+  };
+
   return (
-    <ScrollView style={styles.container}>
-      <Text style={styles.header}>Rive React Native Examples</Text>
-      <View style={styles.buttonContainer}>
-        {PagesList.map(({ id, name }) => (
-          <TouchableOpacity
-            key={id}
-            style={styles.button}
-            onPress={() => navigation.navigate(id)}
-          >
-            <Text style={styles.buttonText}>{name}</Text>
-          </TouchableOpacity>
-        ))}
-      </View>
-    </ScrollView>
+    <View style={styles.container}>
+      <HomeMenu lastOpened={lastOpened} onNavigate={handleNavigate} />
+    </View>
   );
 }
 
@@ -53,7 +112,10 @@ export default function App() {
         <Stack.Screen
           name="Home"
           component={HomeScreen}
-          options={{ title: 'Rive Examples' }}
+          options={{
+            title: 'Rive Examples',
+            headerRight: HeaderMenuButton,
+          }}
         />
         {PagesList.map(({ id, component, name }) => (
           <Stack.Screen
@@ -73,26 +135,12 @@ const styles = StyleSheet.create({
     flex: 1,
     backgroundColor: '#fff',
   },
-  header: {
-    fontSize: 28,
-    fontWeight: 'bold',
-    textAlign: 'center',
-    marginTop: 40,
-    marginBottom: 30,
-  },
-  buttonContainer: {
-    padding: 20,
-  },
-  button: {
-    backgroundColor: '#007AFF',
-    padding: 15,
-    borderRadius: 10,
-    marginBottom: 15,
+  headerButton: {
+    marginRight: 16,
+    padding: 4,
   },
-  buttonText: {
+  headerButtonText: {
+    fontSize: 22,
     color: '#fff',
-    fontSize: 16,
-    fontWeight: 'bold',
-    textAlign: 'center',
   },
 });