React Native Upgrader MCP

Instructions

Implementation Reference

• src/tools.ts:89-161 (registration)

  Registers the 'get-react-native-diff' tool, including schema, description, and the handler function.
  server.registerTool('get-react-native-diff', { title: "Get React Native Diff", description: `Gets the React Native diff between the current version and the user provided version. OVERVIEW: This diff will show all changes needed to upgrade React Native, including: • Package.json dependencies and their versions • iOS configuration changes (Podfile, xcodeproj settings) • Android configuration (build.gradle, settings.gradle) • Project structure changes • Binary files that need to be updated • Template files modifications • Native code changes • Troubleshooting steps if any USAGE: • If no fromVersion is provided, the current version from package.json will be used • The diff follows standard git diff format and should be carefully analyzed ANALYSIS STEPS: 1. Review the diff to identify dependency version changes 2. Carefully analyze configuration changes in iOS and Android files • Preserve custom settings in Podfile, build.gradle, etc. • Keep user-defined code blocks intact • Only update version numbers and required configurations 3. Handle binary and template file updates • Note which binary files need updating • Back up modified template files before updating • Merge changes while preserving customizations 4. Maintain code integrity • Preserve custom code in native iOS/Android files • Keep modifications in JavaScript/TypeScript files (App.tsx, etc.) • Only update required React Native specific code 5. Update build tooling • Match Gradle version from diff • Update CocoaPods version if specified • Keep existing build customizations 6. Package management • Only update versions of existing dependencies • Do not add new packages • Maintain current package structure • Preserve custom package configurations • Existing package version should be the same in all package.json files • DO NOT fall back to rc versions, always use the stable version of React Native unless the user explicitly asks for a rc version. TROUBLESHOOTING STEPS: At the end of the process, provide instructions for troubleshooting steps (detect user's package manager and run the correct command): • DELETE Pod and Podfile.lock file in iOS folder • Run pod install to prevent errors in iOS folder • Run this command to update android binary: ./gradlew wrapper --gradle-version {{CURRENT_GRADLE_VERSION_FROM_DIFF}} --distribution-type {{DISTRIBUTION_TYPE_FROM_DIFF}} in android folder • Run {{CURRENT_PACKAGE_MANAGER}} install to install the correct version of the dependencies IMPORTANT NOTES: • Make sure not to edit existing ts/js files unless it's necessary. • Make sure not to add new packages, only update the existing ones based on the diff. • Make sure to only update package.json for dependencies which are defined in the diff. • YOU MUST call "get-stable-version" tool to get the stable version of React Native before calling this tool. • DO NOT fallback to rc versions, always use the stable version of React Native unless the user explicitly asks for a rc version. • If no diff exit and inform the user that the diff is empty, you can't proceed with the upgrade. • If a user asked to provide a version, call the "get-user-version" tool to get the version of React Native that the user wants to upgrade to. `, inputSchema: { fromVersion: z.string().describe("The current React Native version to compare from (defaults to version in package.json)"), toVersion: z.string().describe("The target React Native version to upgrade to") } }, async ({ fromVersion, toVersion }) => { const diffData = await getDiff(fromVersion, toVersion); return { content: [{ type: "text", text: diffData }] } })
• src/tools.ts:155-161 (handler)

  The handler function for the 'get-react-native-diff' tool. It takes fromVersion and toVersion, calls getDiff service, and returns the diff as text content.
  async ({ fromVersion, toVersion }) => { const diffData = await getDiff(fromVersion, toVersion); return { content: [{ type: "text", text: diffData }] } })
• src/tools.ts:150-153 (schema)

  Input schema for the tool using Zod: fromVersion and toVersion as strings.
  inputSchema: { fromVersion: z.string().describe("The current React Native version to compare from (defaults to version in package.json)"), toVersion: z.string().describe("The target React Native version to upgrade to") }
• src/services.ts:11-21 (helper)

  Core helper function that fetches the React Native upgrade diff from the rn-diff-purge GitHub repository. Handles fetch errors by swapping versions.
  export const getDiff = async (currentVersion: string, toVersion: string): Promise<string> => { const url = `https://raw.githubusercontent.com/react-native-community/rn-diff-purge/diffs/diffs/${currentVersion}..${toVersion}.diff` const response = await fetch(url); if (!response.ok) { console.error(`Failed to fetch diff for ${currentVersion} to ${toVersion} let's try getting diff for ${toVersion} to ${currentVersion}`); const diff = await getDiff(toVersion, currentVersion); return diff; } const diffData = await response.text(); return diffData; }