### Install react-native-update CLI and SDK

Source: https://github.com/reactnativecn/react-native-update-skill/blob/main/skill/react-native-update/references/integration-playbook.md

Installs the necessary command-line interface and SDK for react-native-update. Ensure you are in the app's root directory before running these commands.

```bash
npm i -g react-native-update-cli
npm i react-native-update
```

--------------------------------

### iOS Pod Install for react-native-update

Source: https://github.com/reactnativecn/react-native-update-skill/blob/main/skill/react-native-update/references/integration-playbook.md

Navigates to the iOS directory and installs the necessary CocoaPods dependencies after adding react-native-update to your project.

```bash
cd ios && pod install
```

--------------------------------

### Configure Update Strategies in React Native

Source: https://context7.com/reactnativecn/react-native-update-skill/llms.txt

Initialize the Pushy client in your React Native application and configure automatic update checking and applying strategies. This example demonstrates setting check and update strategies.

```tsx
import { Pushy } from 'react-native-update';

// Check strategy options:
// - 'both': Check on app start AND resume
// - 'onAppStart': Check only when app launches
// - 'onAppResume': Check only when app returns from background
// - null: Manual check only via useUpdate().checkUpdate()

// Update strategy options:
// - 'alwaysAlert': Always show update dialog
// - 'alertUpdateAndIgnoreError': Show dialog, suppress errors
// - 'silentAndNow': Download and apply immediately without prompts
// - 'silentAndLater': Download silently, apply on next restart
// - null: Manual handling via useUpdate() hook

const pushyClient = new Pushy({
  appKey: 'your-app-key',
  checkStrategy: 'both',
  updateStrategy: 'alwaysAlert',
});
```

--------------------------------

### Initialize Pushy Client with UpdateProvider (React Native)

Source: https://context7.com/reactnativecn/react-native-update-skill/llms.txt

Initializes the Pushy client with specified app keys and update strategies, then wraps the application root with `UpdateProvider` to enable automatic update handling. This example uses functional components.

```tsx
import React from 'react';
import { Platform } from 'react-native';
import { Pushy, UpdateProvider } from 'react-native-update';
import App from './App';
import _updateConfig from './update.json';

const { appKey } = _updateConfig[Platform.OS];

const pushyClient = new Pushy({
  appKey,
  checkStrategy: 'onAppStart',  // 'both' | 'onAppStart' | 'onAppResume' | null
  updateStrategy: 'alertUpdateAndIgnoreError',  // 'alwaysAlert' | 'silentAndNow' | 'silentAndLater' | null
});

export default function Root() {
  return (
    <UpdateProvider client={pushyClient}>
      <App />
    </UpdateProvider>
  );
}
```

--------------------------------

### Expo Project Integration Steps

Source: https://context7.com/reactnativecn/react-native-update-skill/llms.txt

Steps to integrate React Native Update into an Expo project. This involves running prebuild, installing the necessary dependencies, and crucially, removing `expo-updates` to prevent conflicts.

```bash
# Generate native directories for Expo managed workflow
npx expo prebuild

# Install react-native-update
npm i react-native-update

# Install iOS pods
cd ios && pod install

# IMPORTANT: Remove expo-updates if present (causes conflicts)
npm uninstall expo-updates

# Then initialize Pushy client as shown in previous examples
```

--------------------------------

### Install React Native Update Dependencies

Source: https://context7.com/reactnativecn/react-native-update-skill/llms.txt

Installs the React Native Update CLI globally and the SDK package in your project's root directory. For iOS projects, it also installs CocoaPods dependencies.

```bash
# Install CLI globally
npm i -g react-native-update-cli

# Install SDK in project
npm i react-native-update

# For iOS, install CocoaPods dependencies
cd ios && pod install
```

--------------------------------

### Whitelist-Based Gray Release with useUpdate Hook

Source: https://context7.com/reactnativecn/react-native-update-skill/llms.txt

Implements phased rollouts for updates using `metaInfo` to control user access. This example checks a user ID against an allow list provided in the `metaInfo` before downloading and applying the update.

```tsx
import { useEffect } from 'react';
import { useUpdate } from 'react-native-update';

function useWhitelistGate(currentUserId: string) {
  const { checkUpdate, updateInfo, downloadUpdate, switchVersionLater } = useUpdate();

  useEffect(() => {
    (async () => {
      await checkUpdate();
      if (!updateInfo?.update) return;

      // Check whitelist from server-provided metaInfo
      const allowList: string[] = updateInfo.metaInfo?.allowUsers ?? [];
      if (!allowList.includes(currentUserId)) return; // Not in whitelist

      const ok = await downloadUpdate();
      if (ok) switchVersionLater();
    })();
  }, [currentUserId, checkUpdate, updateInfo, downloadUpdate, switchVersionLater]);
}

// Usage: useWhitelistGate('user-123');
// metaInfo on server: { "allowUsers": ["user-123", "user-456"] }
```

--------------------------------

### Custom Whitelist Gate using useUpdate Hook

Source: https://github.com/reactnativecn/react-native-update-skill/blob/main/skill/react-native-update/references/integration-playbook.md

Provides an example of a custom whitelist gate using the `useUpdate` hook from react-native-update. This allows for phased rollouts by checking user IDs against a whitelist defined in metaInfo.

```tsx
import { useEffect } from 'react';
import { useUpdate } from 'react-native-update';

// example only: implement with your real uid / device tags
function useWhitelistGate(currentUserId: string) {
  const { checkUpdate, updateInfo, downloadUpdate, switchVersionLater } = useUpdate();

  useEffect(() => {
    (async () => {
      await checkUpdate();
      if (!updateInfo?.update) return;

      const allowList: string[] = updateInfo.metaInfo?.allowUsers ?? [];
      if (!allowList.includes(currentUserId)) return; // not in whitelist

      const ok = await downloadUpdate();
      if (ok) switchVersionLater();
    })();
  }, [currentUserId, checkUpdate, updateInfo, downloadUpdate, switchVersionLater]);
}
```

--------------------------------

### Run Integration Doctor Script

Source: https://context7.com/reactnativecn/react-native-update-skill/llms.txt

Execute the integration_doctor.sh script to validate your React Native Update integration setup. This script checks for necessary files, dependencies, and configurations, providing feedback on potential issues.

```bash
# Run from skill scripts directory
./integration_doctor.sh /path/to/your/app

# Example output:
# [doctor] app root: /path/to/your/app
# [ok] package.json found
# [ok] react-native-update dependency present
# [ok] update.json found
# [ok] update.json includes platform appKey
# [ok] ios/Podfile found
# [ok] android project found
# [doctor] done

# Possible warnings:
# [missing] react-native-update dependency missing
# [missing] update.json missing (run pushy createApp/selectApp)
# [warn] expo-updates detected; may conflict depending on integration mode
# [warn] update.json exists but appKey looks incomplete
```

--------------------------------

### Generate App Configuration with Pushy CLI

Source: https://context7.com/reactnativecn/react-native-update-skill/llms.txt

Uses the Pushy CLI to create or select an app configuration, generating the `update.json` file which contains platform-specific app keys required for updates.

```bash
# Create a new app on Pushy service
pushy createApp

# Or select an existing app
pushy selectApp

# This generates update.json with structure:
# {
#   "ios": { "appKey": "your-ios-app-key" },
#   "android": { "appKey": "your-android-app-key" }
# }
```

--------------------------------

### Prebuild Expo Project for react-native-update

Source: https://github.com/reactnativecn/react-native-update-skill/blob/main/skill/react-native-update/references/integration-playbook.md

Runs the prebuild command for Expo projects to prepare the native projects for integration with react-native-update. This is required for modern Expo workflows.

```bash
npx expo prebuild
```

--------------------------------

### Integration Verification Checklist

Source: https://context7.com/reactnativecn/react-native-update-skill/llms.txt

A markdown checklist to verify the successful integration of React Native Update. It covers essential steps from build success to update application and rollback behavior.

```markdown
## Integration Verification Checklist

- [ ] Release build succeeds on target platform (iOS/Android)
- [ ] App can call checkUpdate and returns structured update state
- [ ] Update package download succeeds
- [ ] App can switch to new version (now/later behavior as expected)
- [ ] Rollback behavior understood/tested for crash scenarios

## Common Issues to Check:
- Missing/incorrect update.json appKey by platform
- Expecting apply-update behavior in DEBUG builds (only works in release)
- Expo project still has expo-updates installed
- iOS pods not installed after dependency update
- Native file edits not followed by full rebuild
```

--------------------------------

### Class Component Integration with UpdateProvider

Source: https://github.com/reactnativecn/react-native-update-skill/blob/main/skill/react-native-update/references/integration-playbook.md

Demonstrates how to integrate react-native-update within a React Native class component. It initializes the Pushy client with configuration from update.json and wraps the application with UpdateProvider.

```tsx
import React from 'react';
import { Platform } from 'react-native';
import { Pushy, UpdateProvider } from 'react-native-update';
import App from './App';
import _updateConfig from './update.json';

const { appKey } = _updateConfig[Platform.OS];

const pushyClient = new Pushy({
  appKey,
  checkStrategy: 'onAppStart',
  updateStrategy: 'alertUpdateAndIgnoreError',
});

export default class Root extends React.Component {
  render() {
    return (
      <UpdateProvider client={pushyClient}>
        <App />
      </UpdateProvider>
    );
  }
}
```

--------------------------------

### Custom Update UI with useUpdate Hook

Source: https://context7.com/reactnativecn/react-native-update-skill/llms.txt

Demonstrates how to implement a custom update user interface by setting `updateStrategy: null` and utilizing the `useUpdate()` hook to manually control the update process, including checking, downloading, and applying updates.

```tsx
import { useEffect } from 'react';
import { useUpdate } from 'react-native-update';

function useCustomUpdateHandler() {
  const {
    checkUpdate,
    updateInfo,
    downloadUpdate,
    switchVersionLater,
    switchVersionNow
  } = useUpdate();

  useEffect(() => {
    (async () => {
      // Check for available updates
      await checkUpdate();

      if (!updateInfo?.update) return;

      // Download the update package
      const downloadSuccess = await downloadUpdate();

      if (downloadSuccess) {
        // Apply update on next app restart
        switchVersionLater();
        // Or apply immediately: switchVersionNow();
      }
    })();
  }, [checkUpdate, updateInfo, downloadUpdate, switchVersionLater]);
}
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.