Mobile module implementation (#472)

* feat(mobile-new): add Metro React Native app with demo mode

* feat(mobile-new): refine demo app screens and theme support

* refactor(mobile): move updated app into mobile folder

* fix(mobile): correct monorepo package paths

* docs(mobile): add Android build notes

* fix(mobile): rename native app to DevCard

* docs(mobile): clean up Android README

Author: blankirigaya

apps/mobile/Gemfile

@@ -14,3 +14,4 @@ gem 'bigdecimal'
 gem 'logger'
 gem 'benchmark'
 gem 'mutex_m'
+gem 'nkf'

apps/mobile/README.md

@@ -1,51 +1,97 @@
-# DevCard Mobile
+This is a new [**React Native**](https://reactnative.dev) project, bootstrapped using [`@react-native-community/cli`](https://github.com/react-native-community/cli).
 
-The mobile application for DevCard, built with bare **React Native** and **React Navigation**.
+# Getting Started
 
-This app provides:
-- Profile and context card management
-- Per-Platform OAuth Connections for silent API follows
-- Advanced analytics for tracking profile views
-- The Hybrid Follow Engine (API, WebView, Link)
+> **Note**: Make sure you have completed the [Set Up Your Environment](https://reactnative.dev/docs/set-up-your-environment) guide before proceeding.
 
-## Getting Started
+## Step 1: Start Metro
 
-> **Note**: Make sure you have completed the [React Native Environment Setup](https://reactnative.dev/docs/environment-setup) guide before proceeding.
+First, you will need to run **Metro**, the JavaScript build tool for React Native.
 
-### Install Dependencies
+To start the Metro dev server, run the following command from the root of your React Native project:
 
-```bash
-pnpm install
+```sh
+# Using npm
+npm start
+
+# OR using Yarn
+yarn start
 ```
 
-### Start Metro Bundler
+## Step 2: Build and run your app
+
+With Metro running, open a new terminal window/pane from the root of your React Native project, and use one of the following commands to build and run your Android or iOS app:
+
+### Android
 
-First, start Metro, the JavaScript bundler:
+```sh
+# Using npm
+npm run android
 
-```bash
-pnpm start
+# OR using Yarn
+yarn android
 ```
 
-### Run on Android
+### iOS
 
-In a new terminal:
+For iOS, remember to install CocoaPods dependencies (this only needs to be run on first clone or after updating native deps).
 
-```bash
-pnpm android
+The first time you create a new project, run the Ruby bundler to install CocoaPods itself:
+
+```sh
+bundle install
 ```
 
-### Run on iOS
+Then, and every time you update your native dependencies, run:
+
+```sh
+bundle exec pod install
+```
 
-For iOS, you must install CocoaPods dependencies first (Mac only):
+For more information, please visit [CocoaPods Getting Started guide](https://guides.cocoapods.org/using/getting-started.html).
 
-```bash
-cd ios && pod install && cd ..
-pnpm ios
+```sh
+# Using npm
+npm run ios
+
+# OR using Yarn
+yarn ios
 ```
 
-## Architecture
+If everything is set up correctly, you should see your new app running in the Android Emulator, iOS Simulator, or your connected device.
+
+This is one way to run your app — you can also build it directly from Android Studio or Xcode.
+
+## Step 3: Modify your app
+
+Now that you have successfully run the app, let's make changes!
+
+Open `App.tsx` in your text editor of choice and make some changes. When you save, your app will automatically update and reflect these changes — this is powered by [Fast Refresh](https://reactnative.dev/docs/fast-refresh).
+
+When you want to forcefully reload, for example to reset the state of your app, you can perform a full reload:
+
+- **Android**: Press the <kbd>R</kbd> key twice or select **"Reload"** from the **Dev Menu**, accessed via <kbd>Ctrl</kbd> + <kbd>M</kbd> (Windows/Linux) or <kbd>Cmd ⌘</kbd> + <kbd>M</kbd> (macOS).
+- **iOS**: Press <kbd>R</kbd> in iOS Simulator.
+
+## Congratulations! :tada:
+
+You've successfully run and modified your React Native App. :partying_face:
+
+### Now what?
+
+- If you want to add this new React Native code to an existing application, check out the [Integration guide](https://reactnative.dev/docs/integration-with-existing-apps).
+- If you're curious to learn more about React Native, check out the [docs](https://reactnative.dev/docs/getting-started).
+
+# Troubleshooting
+
+If you're having issues getting the above steps to work, see the [Troubleshooting](https://reactnative.dev/docs/troubleshooting) page.
+
+# Learn More
+
+To learn more about React Native, take a look at the following resources:
 
-- **Screens**: Located in `src/screens`
-- **Navigation**: Managed via `src/navigation/MainTabs.tsx`
-- **Context API**: Handles global authentication and token management
-- **Theme**: Tokens are strictly defined in `src/theme/tokens.ts`
+- [React Native Website](https://reactnative.dev) - learn more about React Native.
+- [Getting Started](https://reactnative.dev/docs/environment-setup) - an **overview** of React Native and how setup your environment.
+- [Learn the Basics](https://reactnative.dev/docs/getting-started) - a **guided tour** of the React Native **basics**.
+- [Blog](https://reactnative.dev/blog) - read the latest official React Native **Blog** posts.
+- [`@facebook/react-native`](https://github.com/facebook/react-native) - the Open Source; GitHub **repository** for React Native.

apps/mobile/android/README.md

@@ -0,0 +1,111 @@
+# DevCard Android
+
+Native Android project for the DevCard React Native app.
+
+Use this folder for Android-specific Gradle builds, native configuration, emulator installs, and troubleshooting. For normal development, run commands from `apps/mobile` unless a command below says otherwise.
+
+## Quick Start
+
+Start Metro from `apps/mobile`:
+
+```cmd
+npx react-native start --reset-cache
+```
+
+Open a second terminal and run the Android app:
+
+```cmd
+cd /d D:\DC\apps\mobile
+npx react-native run-android -- --active-arch-only
+```
+
+`--active-arch-only` builds only the connected emulator/device architecture, which is much faster during local development.
+
+## Requirements
+
+- Node.js `>= 22.11.0`
+- Android Studio with Android SDK and emulator support
+- Java version compatible with the Android Gradle Plugin used by this project
+- npm dependencies installed from `apps/mobile`
+- An Android emulator running, or a physical device connected with USB debugging enabled
+
+Install mobile dependencies from `apps/mobile`:
+
+```cmd
+npm install --legacy-peer-deps
+```
+
+## Useful Gradle Commands
+
+Run these from `apps/mobile/android`.
+
+Build a debug APK:
+
+```cmd
+gradlew.bat app:packageDebug -PreactNativeArchitectures=x86_64
+```
+
+Install the debug build on a connected emulator/device:
+
+```cmd
+gradlew.bat app:installDebug -PreactNativeArchitectures=x86_64
+```
+
+Get detailed output for a failing build:
+
+```cmd
+gradlew.bat app:packageDebug --stacktrace -PreactNativeArchitectures=x86_64
+```
+
+## Architecture Builds
+
+`gradle.properties` currently sets:
+
+```properties
+reactNativeArchitectures=x86_64
+```
+
+This keeps Windows emulator builds smaller and faster. Override it when targeting another device architecture:
+
+```cmd
+gradlew.bat app:packageDebug -PreactNativeArchitectures=arm64-v8a
+```
+
+Use all common Android ABIs only when needed:
+
+```cmd
+gradlew.bat app:packageDebug -PreactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
+```
+
+## Troubleshooting
+
+### Metro Watches `D:\packages`
+
+If Metro reports `ENOENT` for `D:\packages`, check `apps/mobile/metro.config.js`. The monorepo root should resolve to `D:\DC`, not `D:\`.
+
+### Gradle Fails At `:app:packageDebug`
+
+Rerun the package task with `--stacktrace` so the real error appears:
+
+```cmd
+gradlew.bat app:packageDebug --stacktrace -PreactNativeArchitectures=x86_64
+```
+
+### Builds Are Slow
+
+Use one of these faster local options:
+
+- `npx react-native run-android -- --active-arch-only`
+- `gradlew.bat app:packageDebug -PreactNativeArchitectures=x86_64`
+
+Avoid building every ABI unless you are preparing a broader test or release build.
+
+### Windows Long Path Errors
+
+If Windows reports paths longer than 260 characters, enable long paths from an Administrator PowerShell:
+
+```powershell
+New-ItemProperty -Path "HKLM:\SYSTEM\CurrentControlSet\Control\FileSystem" -Name "LongPathsEnabled" -Value 1 -PropertyType DWORD -Force
+```
+
+Restart the terminal after changing this setting.

apps/mobile/android/app/src/main/AndroidManifest.xml

@@ -0,0 +1,27 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+
+    <uses-permission android:name="android.permission.INTERNET" />
+
+    <application
+      android:name=".MainApplication"
+      android:label="@string/app_name"
+      android:icon="@mipmap/ic_launcher"
+      android:roundIcon="@mipmap/ic_launcher_round"
+      android:allowBackup="false"
+      android:theme="@style/AppTheme"
+      android:usesCleartextTraffic="${usesCleartextTraffic}"
+      android:supportsRtl="true">
+      <activity
+        android:name=".MainActivity"
+        android:label="@string/app_name"
+        android:configChanges="keyboard|keyboardHidden|orientation|screenLayout|screenSize|smallestScreenSize|uiMode"
+        android:launchMode="singleTask"
+        android:windowSoftInputMode="adjustResize"
+        android:exported="true">
+        <intent-filter>
+            <action android:name="android.intent.action.MAIN" />
+            <category android:name="android.intent.category.LAUNCHER" />
+        </intent-filter>
+      </activity>
+    </application>
+</manifest>

apps/mobile/android/gradle.properties

@@ -25,14 +25,14 @@ android.useAndroidX=true
 # Use this property to specify which architecture you want to build.
 # You can also override it from the CLI using
 # ./gradlew <task> -PreactNativeArchitectures=x86_64
-reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
+reactNativeArchitectures=x86_64
 
 # Use this property to enable support to the new architecture.
 # This will allow you to use TurboModules and the Fabric render in
 # your application. You should enable this flag either if you want
 # to write custom TurboModules/Fabric components OR use libraries that
 # are providing them.
-newArchEnabled=false
+newArchEnabled=true
 
 # Use this property to enable or disable the Hermes JS engine.
 # If set to false, you will be using JSC instead.

apps/mobile/android/gradle/wrapper/gradle-wrapper.jar

@@ -1,6 +1,6 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
-distributionUrl=https\://services.gradle.org/distributions/gradle-9.0.0-bin.zip
+distributionUrl=https\://services.gradle.org/distributions/gradle-9.3.1-bin.zip
 networkTimeout=10000
 validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME

apps/mobile/android/gradle/wrapper/gradle-wrapper.properties

@@ -1,6 +1,6 @@
 pluginManagement { includeBuild("../node_modules/@react-native/gradle-plugin") }
 plugins { id("com.facebook.react.settings") }
 extensions.configure(com.facebook.react.ReactSettingsExtension){ ex -> ex.autolinkLibrariesFromCommand() }
-rootProject.name = 'com.devcard.app'
+rootProject.name = 'DevCard'
 include ':app'
 includeBuild('../node_modules/@react-native/gradle-plugin')