@multiplayer-app/session-recorder-react-native 0.0.1-alpha.1 → 0.0.1-alpha.10

package/examples/sample-expo-app/package.json

@@ -1,59 +0,0 @@
-{
-  "name": "sample-expo-app",
-  "main": "expo-router/entry",
-  "version": "1.0.0",
-  "scripts": {
-    "start": "expo start",
-    "reset-project": "node ./scripts/reset-project.js",
-    "android": "expo start --android",
-    "ios": "expo start --ios",
-    "web": "expo start --web",
-    "lint": "expo lint",
-    "postinstall": "expo-yarn-workspaces check workspaces"
-  },
-  "dependencies": {
-    "@expo/vector-icons": "^14.1.0",
-    "@multiplayer-app/session-recorder-react-native": "file:../..",
-    "@react-native-async-storage/async-storage": "2.1.2",
-    "@react-native-community/netinfo": "^11.1.0",
-    "@react-navigation/bottom-tabs": "^7.3.10",
-    "@react-navigation/elements": "^2.3.8",
-    "@react-navigation/native": "^7.1.6",
-    "axios": "^1.6.0",
-    "expo": "~53.0.22",
-    "expo-blur": "~14.1.5",
-    "expo-constants": "~17.1.7",
-    "expo-font": "~13.3.2",
-    "expo-haptics": "~14.1.4",
-    "expo-image": "~2.4.0",
-    "expo-linking": "~7.1.7",
-    "expo-router": "~5.1.5",
-    "expo-splash-screen": "~0.30.10",
-    "expo-status-bar": "~2.2.3",
-    "expo-symbols": "~0.4.5",
-    "expo-system-ui": "~5.0.11",
-    "expo-web-browser": "~14.2.0",
-    "react": "19.0.0",
-    "react-dom": "19.0.0",
-    "react-native": "^0.79.5",
-    "react-native-gesture-handler": "~2.24.0",
-    "react-native-mmkv": "^2.11.0",
-    "react-native-reanimated": "~3.17.4",
-    "react-native-safe-area-context": "5.4.0",
-    "react-native-screens": "~4.11.1",
-    "react-native-screenshot": "^1.0.0",
-    "react-native-view-shot": "^4.0.3",
-    "react-native-web": "~0.20.0",
-    "react-native-webview": "13.13.5"
-  },
-  "devDependencies": {
-    "@babel/core": "^7.25.2",
-    "@react-native/metro-config": "^0.81.1",
-    "@types/react": "~19.0.10",
-    "eslint": "^9.25.0",
-    "eslint-config-expo": "~9.2.0",
-    "expo-yarn-workspaces": "^2.3.2",
-    "typescript": "~5.8.3"
-  },
-  "private": true
-}

package/examples/sample-expo-app/scripts/reset-project.js

@@ -1,112 +0,0 @@
-#!/usr/bin/env node
-
-/**
- * This script is used to reset the project to a blank state.
- * It deletes or moves the /app, /components, /hooks, /scripts, and /constants directories to /app-example based on user input and creates a new /app directory with an index.tsx and _layout.tsx file.
- * You can remove the `reset-project` script from package.json and safely delete this file after running it.
- */
-
-const fs = require("fs");
-const path = require("path");
-const readline = require("readline");
-
-const root = process.cwd();
-const oldDirs = ["app", "components", "hooks", "constants", "scripts"];
-const exampleDir = "app-example";
-const newAppDir = "app";
-const exampleDirPath = path.join(root, exampleDir);
-
-const indexContent = `import { Text, View } from "react-native";
-
-export default function Index() {
-  return (
-    <View
-      style={{
-        flex: 1,
-        justifyContent: "center",
-        alignItems: "center",
-      }}
-    >
-      <Text>Edit app/index.tsx to edit this screen.</Text>
-    </View>
-  );
-}
-`;
-
-const layoutContent = `import { Stack } from "expo-router";
-
-export default function RootLayout() {
-  return <Stack />;
-}
-`;
-
-const rl = readline.createInterface({
-  input: process.stdin,
-  output: process.stdout,
-});
-
-const moveDirectories = async (userInput) => {
-  try {
-    if (userInput === "y") {
-      // Create the app-example directory
-      await fs.promises.mkdir(exampleDirPath, { recursive: true });
-      console.log(`📁 /${exampleDir} directory created.`);
-    }
-
-    // Move old directories to new app-example directory or delete them
-    for (const dir of oldDirs) {
-      const oldDirPath = path.join(root, dir);
-      if (fs.existsSync(oldDirPath)) {
-        if (userInput === "y") {
-          const newDirPath = path.join(root, exampleDir, dir);
-          await fs.promises.rename(oldDirPath, newDirPath);
-          console.log(`➡️ /${dir} moved to /${exampleDir}/${dir}.`);
-        } else {
-          await fs.promises.rm(oldDirPath, { recursive: true, force: true });
-          console.log(`❌ /${dir} deleted.`);
-        }
-      } else {
-        console.log(`➡️ /${dir} does not exist, skipping.`);
-      }
-    }
-
-    // Create new /app directory
-    const newAppDirPath = path.join(root, newAppDir);
-    await fs.promises.mkdir(newAppDirPath, { recursive: true });
-    console.log("\n📁 New /app directory created.");
-
-    // Create index.tsx
-    const indexPath = path.join(newAppDirPath, "index.tsx");
-    await fs.promises.writeFile(indexPath, indexContent);
-    console.log("📄 app/index.tsx created.");
-
-    // Create _layout.tsx
-    const layoutPath = path.join(newAppDirPath, "_layout.tsx");
-    await fs.promises.writeFile(layoutPath, layoutContent);
-    console.log("📄 app/_layout.tsx created.");
-
-    console.log("\n✅ Project reset complete. Next steps:");
-    console.log(
-      `1. Run \`npx expo start\` to start a development server.\n2. Edit app/index.tsx to edit the main screen.${
-        userInput === "y"
-          ? `\n3. Delete the /${exampleDir} directory when you're done referencing it.`
-          : ""
-      }`
-    );
-  } catch (error) {
-    console.error(`❌ Error during script execution: ${error.message}`);
-  }
-};
-
-rl.question(
-  "Do you want to move existing files to /app-example instead of deleting them? (Y/n): ",
-  (answer) => {
-    const userInput = answer.trim().toLowerCase() || "y";
-    if (userInput === "y" || userInput === "n") {
-      moveDirectories(userInput).finally(() => rl.close());
-    } else {
-      console.log("❌ Invalid input. Please enter 'Y' or 'N'.");
-      rl.close();
-    }
-  }
-);

package/examples/sample-expo-app/services/api.ts

@@ -1,98 +0,0 @@
-import axios from 'axios';
-
-const API_BASE_URL = 'https://jsonplaceholder.typicode.com';
-
-export interface Post {
-  id: number;
-  title: string;
-  body: string;
-  userId: number;
-}
-
-export interface User {
-  id: number;
-  name: string;
-  username: string;
-  email: string;
-  phone: string;
-  website: string;
-  company: {
-    name: string;
-    catchPhrase: string;
-    bs: string;
-  };
-  address: {
-    street: string;
-    suite: string;
-    city: string;
-    zipcode: string;
-    geo: {
-      lat: string;
-      lng: string;
-    };
-  };
-}
-
-export interface Comment {
-  id: number;
-  postId: number;
-  name: string;
-  email: string;
-  body: string;
-}
-
-class ApiService {
-  private api = axios.create({
-    baseURL: API_BASE_URL,
-    timeout: 10000,
-  });
-
-  // Posts
-  async getPosts(): Promise<Post[]> {
-    const response = await this.api.get('/posts');
-    return response.data;
-  }
-
-  async getPost(id: number): Promise<Post> {
-    const response = await this.api.get(`/posts/${id}`);
-    return response.data;
-  }
-
-  async getPostComments(postId: number): Promise<Comment[]> {
-    const response = await this.api.get(`/posts/${postId}/comments`);
-    return response.data;
-  }
-
-  // Users
-  async getUsers(): Promise<User[]> {
-    const response = await this.api.get('/users');
-    return response.data;
-  }
-
-  async getUser(id: number): Promise<User> {
-    const response = await this.api.get(`/users/${id}`);
-    return response.data;
-  }
-
-  async getUserPosts(userId: number): Promise<Post[]> {
-    const response = await this.api.get(`/users/${userId}/posts`);
-    return response.data;
-  }
-
-  // Create/Update/Delete operations (for demo purposes)
-  async createPost(post: Omit<Post, 'id'>): Promise<Post> {
-    const response = await this.api.post('/posts', post);
-    return response.data;
-  }
-
-  async updatePost(id: number, post: Partial<Post>): Promise<Post> {
-    const response = await this.api.put(`/posts/${id}`, post);
-    return response.data;
-  }
-
-  async deletePost(id: number): Promise<void> {
-    await this.api.delete(`/posts/${id}`);
-  }
-}
-
-export const apiService = new ApiService();

package/examples/sample-expo-app/tsconfig.json

@@ -1,17 +0,0 @@
-{
-  "extends": "expo/tsconfig.base",
-  "compilerOptions": {
-    "strict": true,
-    "paths": {
-      "@/*": [
-        "./*"
-      ]
-    }
-  },
-  "include": [
-    "**/*.ts",
-    "**/*.tsx",
-    ".expo/types/**/*.ts",
-    "expo-env.d.ts"
-  ]
-}

package/examples/sample-expo-app/utils/navigation.ts

@@ -1,19 +0,0 @@
-// Navigation utility to avoid router import issues
-export const navigateTo = {
-  post: (id: number) => {
-    // This will be handled by the router in the component
-    return `/post/${id}`
-  },
-  user: (id: number) => {
-    return `/user/${id}`
-  },
-  posts: () => {
-    return '/(tabs)/posts'
-  },
-  users: () => {
-    return '/(tabs)/users'
-  },
-  home: () => {
-    return '/(tabs)/'
-  },
-}

package/src/otel/instrumentations/gestureInstrumentation.ts

@@ -1,141 +0,0 @@
-import { InstrumentationBase } from '@opentelemetry/instrumentation'
-import { trace, SpanStatusCode } from '@opentelemetry/api'
-
-export class GestureInstrumentation extends InstrumentationBase {
-  private _isEnabled = false
-
-  constructor() {
-    super('react-native-gesture', '1.0.0', {})
-  }
-
-  init(): void {
-    // Initialize the instrumentation
-  }
-
-  enable(): void {
-    this._isEnabled = true
-  }
-
-  disable(): void {
-    this._isEnabled = false
-  }
-
-  isEnabled(): boolean {
-    return this._isEnabled
-  }
-
-  // Manual gesture tracking methods
-  recordTap(x: number, y: number, target?: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan('Gesture.tap', {
-      attributes: {
-        'gesture.type': 'tap',
-        'gesture.coordinates.x': x,
-        'gesture.coordinates.y': y,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    if (target) {
-      span.setAttribute('gesture.target', target)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  recordSwipe(direction: string, target?: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan('Gesture.swipe', {
-      attributes: {
-        'gesture.type': 'swipe',
-        'gesture.direction': direction,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    if (target) {
-      span.setAttribute('gesture.target', target)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  recordPinch(scale: number, target?: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan('Gesture.pinch', {
-      attributes: {
-        'gesture.type': 'pinch',
-        'gesture.scale': scale,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    if (target) {
-      span.setAttribute('gesture.target', target)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  recordPan(deltaX: number, deltaY: number, target?: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan('Gesture.pan', {
-      attributes: {
-        'gesture.type': 'pan',
-        'gesture.delta_x': deltaX,
-        'gesture.delta_y': deltaY,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    if (target) {
-      span.setAttribute('gesture.target', target)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  recordLongPress(duration: number, target?: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan('Gesture.longPress', {
-      attributes: {
-        'gesture.type': 'longPress',
-        'gesture.duration': duration,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    if (target) {
-      span.setAttribute('gesture.target', target)
-    }
-
-    span.setStatus({ code: SpanStatusCode.OK })
-    span.end()
-  }
-
-  // Error tracking for gesture failures
-  recordGestureError(error: Error, gestureType: string) {
-    if (!this._isEnabled) return
-
-    const span = trace.getTracer('gesture').startSpan(`Gesture.${gestureType}.error`, {
-      attributes: {
-        'gesture.type': gestureType,
-        'gesture.error': true,
-        'gesture.timestamp': Date.now(),
-      },
-    })
-
-    span.setStatus({ code: SpanStatusCode.ERROR, message: error.message })
-    span.recordException(error)
-    span.end()
-  }
-}

package/src/otel/instrumentations/reactNativeInstrumentation.ts

@@ -1,164 +0,0 @@
-import { InstrumentationBase } from '@opentelemetry/instrumentation'
-import { trace, SpanStatusCode } from '@opentelemetry/api'
-
-export class ReactNativeInstrumentation extends InstrumentationBase {
-  constructor() {
-    super('react-native', '1.0.0', {})
-  }
-
-  init(): void {
-    // Initialize the instrumentation
-  }
-
-  enable(): void {
-    // Try to wrap AsyncStorage if it's available
-    try {
-      const asyncStorage = require('@react-native-async-storage/async-storage')
-      if (asyncStorage) {
-        this._wrap(asyncStorage, 'AsyncStorage', this._wrapAsyncStorage)
-      }
-    } catch (error) {
-      console.warn('@react-native-async-storage/async-storage is not available. AsyncStorage instrumentation will be disabled.')
-    }
-  }
-
-  disable(): void {
-    // Try to unwrap AsyncStorage if it was wrapped
-    try {
-      const asyncStorage = require('@react-native-async-storage/async-storage')
-      if (asyncStorage) {
-        this._unwrap(asyncStorage, 'AsyncStorage')
-      }
-    } catch (error) {
-      // AsyncStorage was not available, nothing to unwrap
-    }
-  }
-
-  private _wrapAsyncStorage(originalModule: any) {
-    const self = this
-
-    // Wrap setItem
-    const originalSetItem = originalModule.setItem
-    originalModule.setItem = async function (key: string, value: string) {
-      const startTime = Date.now()
-      try {
-        const result = await originalSetItem.call(this, key, value)
-
-        const span = trace.getTracer('react-native').startSpan('AsyncStorage.setItem', {
-          attributes: {
-            'storage.operation': 'setItem',
-            'storage.key': key,
-            'storage.value_length': value.length,
-            'storage.duration': Date.now() - startTime,
-          },
-        })
-
-        span.setStatus({ code: SpanStatusCode.OK })
-        span.end()
-
-        return result
-      } catch (error) {
-        const span = trace.getTracer('react-native').startSpan('AsyncStorage.setItem', {
-          attributes: {
-            'storage.operation': 'setItem',
-            'storage.key': key,
-            'storage.error': true,
-            'storage.duration': Date.now() - startTime,
-          },
-        })
-
-        const errorMessage = error instanceof Error ? error.message : String(error)
-        span.setStatus({ code: SpanStatusCode.ERROR, message: errorMessage })
-        if (error instanceof Error) {
-          span.recordException(error)
-        }
-        span.end()
-
-        throw error
-      }
-    }
-
-    // Wrap getItem
-    const originalGetItem = originalModule.getItem
-    originalModule.getItem = async function (key: string) {
-      const startTime = Date.now()
-      try {
-        const result = await originalGetItem.call(this, key)
-
-        const span = trace.getTracer('react-native').startSpan('AsyncStorage.getItem', {
-          attributes: {
-            'storage.operation': 'getItem',
-            'storage.key': key,
-            'storage.value_length': result ? result.length : 0,
-            'storage.duration': Date.now() - startTime,
-          },
-        })
-
-        span.setStatus({ code: SpanStatusCode.OK })
-        span.end()
-
-        return result
-      } catch (error) {
-        const span = trace.getTracer('react-native').startSpan('AsyncStorage.getItem', {
-          attributes: {
-            'storage.operation': 'getItem',
-            'storage.key': key,
-            'storage.error': true,
-            'storage.duration': Date.now() - startTime,
-          },
-        })
-
-        const errorMessage = error instanceof Error ? error.message : String(error)
-        span.setStatus({ code: SpanStatusCode.ERROR, message: errorMessage })
-        if (error instanceof Error) {
-          span.recordException(error)
-        }
-        span.end()
-
-        throw error
-      }
-    }
-
-    // Wrap removeItem
-    const originalRemoveItem = originalModule.removeItem
-    originalModule.removeItem = async function (key: string) {
-      const startTime = Date.now()
-      try {
-        const result = await originalRemoveItem.call(this, key)
-
-        const span = trace.getTracer('react-native').startSpan('AsyncStorage.removeItem', {
-          attributes: {
-            'storage.operation': 'removeItem',
-            'storage.key': key,
-            'storage.duration': Date.now() - startTime,
-          },
-        })
-
-        span.setStatus({ code: SpanStatusCode.OK })
-        span.end()
-
-        return result
-      } catch (error) {
-        const span = trace.getTracer('react-native').startSpan('AsyncStorage.removeItem', {
-          attributes: {
-            'storage.operation': 'removeItem',
-            'storage.key': key,
-            'storage.error': true,
-            'storage.duration': Date.now() - startTime,
-          },
-        })
-
-        const errorMessage = error instanceof Error ? error.message : String(error)
-        span.setStatus({ code: SpanStatusCode.ERROR, message: errorMessage })
-        if (error instanceof Error) {
-          span.recordException(error)
-        }
-        span.end()
-
-        throw error
-      }
-    }
-
-    return originalModule
-  }
-}