# React Native Security - Core Patterns

> Secure storage, certificate pinning, and biometric authentication. See [SKILL.md](../SKILL.md) for decision guidance and red flags.

**Prerequisites**: Familiarity with React Native development and async/await patterns.

---

## Pattern 1: Secure Storage with expo-secure-store

### Basic Token Storage

```typescript
import * as SecureStore from "expo-secure-store";

const AUTH_TOKEN_KEY = "auth-token";
const REFRESH_TOKEN_KEY = "refresh-token";

// ---- Store ----

async function storeTokens(
  accessToken: string,
  refreshToken: string,
): Promise<void> {
  await SecureStore.setItemAsync(AUTH_TOKEN_KEY, accessToken);
  await SecureStore.setItemAsync(REFRESH_TOKEN_KEY, refreshToken);
}

// ---- Retrieve ----

async function getAccessToken(): Promise<string | null> {
  return SecureStore.getItemAsync(AUTH_TOKEN_KEY);
}

// ---- Delete ----

async function clearTokens(): Promise<void> {
  await SecureStore.deleteItemAsync(AUTH_TOKEN_KEY);
  await SecureStore.deleteItemAsync(REFRESH_TOKEN_KEY);
}
```

**Why good:** each token has a named constant key, separate store/retrieve/delete functions, hardware-backed encryption on both platforms

### Biometric-Protected Storage

```typescript
import * as SecureStore from "expo-secure-store";

const BIOMETRIC_TOKEN_KEY = "biometric-protected-token";

async function storeBiometricProtectedToken(token: string): Promise<void> {
  await SecureStore.setItemAsync(BIOMETRIC_TOKEN_KEY, token, {
    requireAuthentication: true,
    authenticationPrompt: "Authenticate to save your credentials",
    keychainAccessible: SecureStore.WHEN_UNLOCKED_THIS_DEVICE_ONLY,
  });
}

async function getBiometricProtectedToken(): Promise<string | null> {
  try {
    return await SecureStore.getItemAsync(BIOMETRIC_TOKEN_KEY, {
      requireAuthentication: true,
      authenticationPrompt: "Authenticate to access your credentials",
    });
  } catch (error) {
    // User cancelled biometric prompt or auth failed
    return null;
  }
}
```

**Why good:** `requireAuthentication` gates reads behind biometric/passcode, `WHEN_UNLOCKED_THIS_DEVICE_ONLY` prevents backup extraction, error handling covers cancelled prompts

### Bad Example: AsyncStorage for Sensitive Data

```typescript
// BAD: AsyncStorage is a plain-text file on device
import AsyncStorage from "@react-native-async-storage/async-storage";

await AsyncStorage.setItem("auth-token", token); // Readable on rooted devices
await AsyncStorage.setItem("user-password", password); // NEVER do this
```

**Why bad:** AsyncStorage stores data as unencrypted JSON on the filesystem -- trivially readable on jailbroken/rooted devices, no encryption, no access control

---

## Pattern 2: Secure Storage with react-native-keychain

### Credential Storage with Biometric Protection

```typescript
import * as Keychain from "react-native-keychain";

const AUTH_SERVICE = "com.myapp.auth";

async function storeCredentials(
  username: string,
  token: string,
): Promise<boolean> {
  try {
    await Keychain.setGenericPassword(username, token, {
      service: AUTH_SERVICE,
      accessControl: Keychain.ACCESS_CONTROL.BIOMETRY_ANY_OR_DEVICE_PASSCODE,
      accessible: Keychain.ACCESSIBLE.WHEN_UNLOCKED_THIS_DEVICE_ONLY,
      authenticationType: Keychain.AUTHENTICATION_TYPE.BIOMETRICS,
    });
    return true;
  } catch (error) {
    return false;
  }
}

async function getCredentials(): Promise<{
  username: string;
  password: string;
} | null> {
  try {
    const credentials = await Keychain.getGenericPassword({
      service: AUTH_SERVICE,
      authenticationPrompt: {
        title: "Authenticate",
        subtitle: "Verify your identity to access credentials",
        cancel: "Cancel",
      },
    });
    if (credentials === false) return null;
    return { username: credentials.username, password: credentials.password };
  } catch (error) {
    // Biometric auth failed or was cancelled
    return null;
  }
}

async function clearCredentials(): Promise<void> {
  await Keychain.resetGenericPassword({ service: AUTH_SERVICE });
}
```

**Why good:** `BIOMETRY_ANY_OR_DEVICE_PASSCODE` provides fallback if biometrics unavailable, service name isolates credentials, `WHEN_UNLOCKED_THIS_DEVICE_ONLY` prevents backup extraction, error handling covers all failure paths

### Checking Biometric Availability

```typescript
import * as Keychain from "react-native-keychain";

async function getBiometricInfo(): Promise<{
  available: boolean;
  biometryType: string | null;
}> {
  const biometryType = await Keychain.getSupportedBiometryType();
  return {
    available: biometryType !== null,
    biometryType, // "TouchID" | "FaceID" | "Fingerprint" | "Face" | "Iris" | null
  };
}
```

---

## Pattern 3: expo-secure-store vs react-native-keychain Comparison

| Feature                   | expo-secure-store                     | react-native-keychain                             |
| ------------------------- | ------------------------------------- | ------------------------------------------------- |
| **Workflow**              | Expo managed + bare                   | Bare RN (+ Expo dev builds)                       |
| **API style**             | Key-value (string only)               | Username/password pairs                           |
| **Value size limit**      | ~2KB                                  | No practical limit                                |
| **Biometric gating**      | `requireAuthentication` option        | `ACCESS_CONTROL` enum (granular)                  |
| **Access control**        | Basic (unlock/passcode)               | Fine-grained (biometry types, current set vs any) |
| **iOS storage**           | Keychain (`kSecClassGenericPassword`) | Keychain (`kSecClassGenericPassword`)             |
| **Android storage**       | Keystore-encrypted SharedPreferences  | Keystore (RSA or AES)                             |
| **Persists on reinstall** | iOS: yes, Android: no                 | iOS: yes, Android: no                             |
| **Sync API**              | `setItem`/`getItem` (sync)            | No sync API                                       |
| **Internet credentials**  | No                                    | Yes (`setInternetCredentials`)                    |

**Use expo-secure-store when:** Expo managed workflow, simple token storage, values under 2KB.

**Use react-native-keychain when:** Need granular biometric access control, storing larger values, bare RN workflow, or need internet credential separation.

---

## Pattern 4: Certificate Pinning

### JS-Level Pinning with react-native-ssl-public-key-pinning

```typescript
import { initializeSslPinning } from "react-native-ssl-public-key-pinning";

const PIN_EXPIRATION = "2026-12-31";

// Call as early as possible in app entry (before any network requests)
async function setupCertificatePinning(): Promise<void> {
  try {
    await initializeSslPinning({
      "api.example.com": {
        includeSubdomains: true,
        publicKeyHashes: [
          // Primary certificate hash (current cert)
          "CLOmM1/OXvSPjw5UOYbAf9GKOxImEp9hhku9W90fHMk=",
          // Backup certificate hash (next cert -- REQUIRED on iOS)
          "hxqRlPTu1bMS/0DITB1SSu0vd4u/8l8TjPgfaAp63Gc=",
        ],
        expirationDate: PIN_EXPIRATION,
      },
    });
  } catch (error) {
    // Pinning failed to initialize -- block network access or alert
    throw new Error("Certificate pinning initialization failed");
  }
}
```

**Why good:** called at app entry before any requests, two hashes (primary + backup), expiration date prevents permanent bricking, error handling prevents silent failure

See [reference.md](../reference.md) for pin hash generation commands.

### Certificate Rotation Strategy

1. Generate hash for the NEW certificate before deploying it to the server
2. Ship an app update that pins BOTH the current and new certificate hashes
3. Deploy the new certificate to the server
4. After the app update has propagated, remove the old hash in the next release
5. Always keep `expirationDate` set -- it acts as a safety valve if rotation is missed

### Bad Example: Single Pin Without Expiration

```typescript
// BAD: single pin + no expiration
await initializeSslPinning({
  "api.example.com": {
    includeSubdomains: true,
    publicKeyHashes: [
      "CLOmM1/OXvSPjw5UOYbAf9GKOxImEp9hhku9W90fHMk=",
      // Missing backup hash -- iOS will THROW
    ],
    // Missing expirationDate -- app bricks if cert rotates
  },
});
```

**Why bad:** iOS (TrustKit) requires two hashes and throws with only one, no expiration date means the app permanently breaks when the certificate is rotated until users update

---

## Pattern 5: Biometric Authentication with expo-local-authentication

### Full Biometric Flow

```typescript
import * as LocalAuthentication from "expo-local-authentication";

type BiometricResult =
  | { success: true }
  | {
      success: false;
      reason: "no-hardware" | "not-enrolled" | "failed" | "cancelled";
    };

async function authenticateWithBiometrics(): Promise<BiometricResult> {
  const hasHardware = await LocalAuthentication.hasHardwareAsync();
  if (!hasHardware) {
    return { success: false, reason: "no-hardware" };
  }

  const isEnrolled = await LocalAuthentication.isEnrolledAsync();
  if (!isEnrolled) {
    return { success: false, reason: "not-enrolled" };
  }

  const result = await LocalAuthentication.authenticateAsync({
    promptMessage: "Verify your identity",
    cancelLabel: "Cancel",
    disableDeviceFallback: false, // Allow passcode as backup
    fallbackLabel: "Use passcode", // iOS only
  });

  if (result.success) {
    return { success: true };
  }

  return {
    success: false,
    reason: result.error === "user_cancel" ? "cancelled" : "failed",
  };
}
```

**Why good:** checks hardware and enrollment before prompting (prevents confusing errors), typed result discriminated union, passcode fallback enabled, handles cancellation distinctly from failure

### Checking Available Biometric Types

```typescript
import * as LocalAuthentication from "expo-local-authentication";

async function getAvailableBiometrics(): Promise<string[]> {
  const types = await LocalAuthentication.supportedAuthenticationTypesAsync();

  return types.map((type) => {
    switch (type) {
      case LocalAuthentication.AuthenticationType.FINGERPRINT:
        return "Fingerprint";
      case LocalAuthentication.AuthenticationType.FACIAL_RECOGNITION:
        return "Face Recognition";
      case LocalAuthentication.AuthenticationType.IRIS:
        return "Iris"; // Android only
      default:
        return "Unknown";
    }
  });
}
```

---

## Pattern 6: Combined Biometric + Secure Storage Flow

The most secure pattern: biometric-gated credential retrieval. The credentials never leave secure storage without biometric verification.

### With react-native-keychain

```typescript
import * as Keychain from "react-native-keychain";

const CREDENTIAL_SERVICE = "com.myapp.credentials";

async function setupBiometricLogin(
  username: string,
  token: string,
): Promise<boolean> {
  const biometryType = await Keychain.getSupportedBiometryType();
  if (!biometryType) return false;

  try {
    await Keychain.setGenericPassword(username, token, {
      service: CREDENTIAL_SERVICE,
      accessControl: Keychain.ACCESS_CONTROL.BIOMETRY_ANY_OR_DEVICE_PASSCODE,
      accessible: Keychain.ACCESSIBLE.WHEN_UNLOCKED_THIS_DEVICE_ONLY,
    });
    return true;
  } catch {
    return false;
  }
}

async function biometricLogin(): Promise<{
  username: string;
  token: string;
} | null> {
  try {
    const credentials = await Keychain.getGenericPassword({
      service: CREDENTIAL_SERVICE,
      authenticationPrompt: {
        title: "Sign In",
        subtitle: "Use biometrics to access your account",
        cancel: "Cancel",
      },
    });

    if (credentials === false) return null;
    return { username: credentials.username, token: credentials.password };
  } catch {
    // Biometric auth failed, cancelled, or credentials don't exist
    return null;
  }
}
```

**Why good:** credentials are stored once during initial login, subsequent logins require biometric verification to read them back, the OS handles the biometric prompt natively (no custom UI), `BIOMETRY_ANY_OR_DEVICE_PASSCODE` provides fallback

### With expo-secure-store

```typescript
import * as SecureStore from "expo-secure-store";
import * as LocalAuthentication from "expo-local-authentication";

const SECURE_TOKEN_KEY = "biometric-session-token";

async function setupBiometricSession(token: string): Promise<boolean> {
  const hasHardware = await LocalAuthentication.hasHardwareAsync();
  const isEnrolled = await LocalAuthentication.isEnrolledAsync();

  if (!hasHardware || !isEnrolled) return false;

  await SecureStore.setItemAsync(SECURE_TOKEN_KEY, token, {
    requireAuthentication: true,
    authenticationPrompt: "Authenticate to enable biometric login",
  });

  return true;
}

async function biometricSessionRetrieve(): Promise<string | null> {
  try {
    // The OS automatically prompts for biometric when requireAuthentication was set
    return await SecureStore.getItemAsync(SECURE_TOKEN_KEY, {
      requireAuthentication: true,
      authenticationPrompt: "Authenticate to sign in",
    });
  } catch {
    return null;
  }
}
```

**Why good:** `requireAuthentication` on both set and get ensures biometric gating, the OS handles prompt presentation, two-step check (hardware + enrollment) before setup

# React Native Security - App Hardening

> Code obfuscation, jailbreak detection, screenshot prevention, and network security configuration. See [SKILL.md](../SKILL.md) for decision guidance and red flags.

**Related**: [core.md](core.md) for secure storage, certificate pinning, and biometric auth.

---

## Pattern 1: Jailbreak/Root Detection

### Basic Detection with jail-monkey

```typescript
import JailMonkey from "jail-monkey";

interface DeviceSecurityReport {
  isCompromised: boolean;
  isJailbroken: boolean;
  canMockLocation: boolean;
  isDebugMode: boolean;
  isOnExternalStorage: boolean; // Android only
}

function assessDeviceSecurity(): DeviceSecurityReport {
  const isJailbroken = JailMonkey.isJailBroken();
  const canMockLocation = JailMonkey.canMockLocation();
  const isDebugMode = JailMonkey.isDebuggedMode();
  const isOnExternalStorage = JailMonkey.isOnExternalStorage();

  return {
    isCompromised: isJailbroken || isDebugMode,
    isJailbroken,
    canMockLocation,
    isDebugMode,
    isOnExternalStorage,
  };
}
```

**Why good:** checks multiple indicators, combines jailbreak + debug for `isCompromised` flag, structured return for logging/reporting

### Response Strategy

```typescript
import { Alert } from "react-native";

type SecurityAction = "block" | "warn" | "log";

const SECURITY_ACTIONS: Record<string, SecurityAction> = {
  jailbroken: "warn", // Alert user but allow access
  debugMode: "log", // Log only (may be legitimate dev use)
  mockLocation: "block", // Block for location-sensitive features
};

function handleCompromisedDevice(report: DeviceSecurityReport): void {
  if (report.isJailbroken && SECURITY_ACTIONS.jailbroken === "warn") {
    Alert.alert(
      "Security Notice",
      "This device appears to be modified. Some features may be restricted.",
      [{ text: "I Understand" }],
    );
  }

  if (report.canMockLocation && SECURITY_ACTIONS.mockLocation === "block") {
    // Disable location-dependent features
  }

  // Always report to server for monitoring
  reportSecurityEvent({
    type: "device-integrity",
    ...report,
    timestamp: Date.now(),
  });
}
```

**Why good:** configurable response per threat type (not blanket block), server-side reporting for monitoring, user-friendly messaging

### Bad Example: Blocking Without Server Validation

```typescript
// BAD: relying solely on client-side detection
if (JailMonkey.isJailBroken()) {
  // Attacker hooks JailMonkey.isJailBroken() to return false
  exitApp(); // Bypassed trivially with Frida
}
```

**Why bad:** client-side checks are bypassable with hooking frameworks (Frida, Objection), no server-side validation means the check provides false security assurance

---

## Pattern 2: Code Obfuscation

### Layer 1: Hermes Bytecode (Default)

Hermes is enabled by default since React Native 0.70. It compiles JavaScript to optimized bytecode at build time.

**Verify Hermes is enabled:**

```json
// app.json (Expo)
{
  "expo": {
    "jsEngine": "hermes"
  }
}
```

```groovy
// android/gradle.properties (bare RN)
hermesEnabled=true
```

Hermes bytecode is NOT encrypted -- tools like `hbctool` can decompile it. It raises the reverse engineering bar but is not a substitute for proper secret management.

### Layer 2: Metro Obfuscation Transformer

Adds JavaScript-level obfuscation (variable renaming, control flow flattening, dead code injection) on top of Hermes.

```javascript
// metro.config.js
const { getDefaultConfig } = require("@react-native/metro-config");

const config = getDefaultConfig(__dirname);

config.transformer = {
  ...config.transformer,
  babelTransformerPath: require.resolve("react-native-obfuscating-transformer"),
};

module.exports = config;
```

**Obfuscation config (obfuscating-transformer.config.js):**

```javascript
module.exports = {
  // Files to obfuscate (regex pattern)
  filter: (filename) => {
    return (
      filename.startsWith("src/") &&
      !filename.includes("__tests__") &&
      !filename.includes(".test.")
    );
  },
  // Safe options -- avoid stringArray (breaks builds)
  compact: true,
  controlFlowFlattening: true,
  controlFlowFlatteningThreshold: 0.5,
  deadCodeInjection: true,
  deadCodeInjectionThreshold: 0.2,
  identifierNamesGenerator: "hexadecimal",
  renameGlobals: false, // Renaming globals breaks RN module system
  // DO NOT enable stringArray -- known to break React Native builds
};
```

**Why good:** filter excludes test files, conservative thresholds balance security vs performance, `renameGlobals: false` prevents module resolution breaks, explicit warning about `stringArray`

### Layer 3: ProGuard/R8 for Android

R8 (ProGuard replacement) shrinks, obfuscates, and optimizes Android native/Java code.

```groovy
// android/app/build.gradle
android {
    buildTypes {
        release {
            minifyEnabled true
            shrinkResources true
            proguardFiles getDefaultProguardFile("proguard-android-optimize.txt"), "proguard-rules.pro"
        }
    }
}
```

```proguard
# android/app/proguard-rules.pro

# Keep React Native bridge classes
-keep class com.facebook.react.** { *; }
-keep class com.facebook.hermes.** { *; }
-keep class com.facebook.jni.** { *; }

# Keep classes used via reflection
-keepclassmembers class * {
    @com.facebook.react.uimanager.annotations.ReactProp <methods>;
}

# Keep native methods
-keepclasseswithmembernames class * {
    native <methods>;
}

# Keep serializable classes (if using)
-keepclassmembers class * implements java.io.Serializable {
    static final long serialVersionUID;
    private static final java.io.ObjectStreamField[] serialPersistentFields;
    !static !transient <fields>;
    private void writeObject(java.io.ObjectOutputStream);
    private void readObject(java.io.ObjectInputStream);
}

# Keep your app's model classes if accessed via reflection
# -keep class com.yourapp.models.** { *; }
```

**Why good:** `minifyEnabled true` activates R8, React Native bridge classes preserved, native methods preserved, reflection-accessed classes protected with `-keep` rules

**Important:** R8 only runs in release builds. Test release builds thoroughly -- crashes from missing classes only appear in production.

---

## Pattern 3: Screenshot and Screen Recording Prevention

### Expo ScreenCapture (Managed Workflow)

```typescript
import { useEffect } from "react";
import { useIsFocused } from "@react-navigation/native";
import * as ScreenCapture from "expo-screen-capture";

/**
 * Hook to prevent screen capture while a screen is focused.
 * Enables capture again when navigating away or unmounting.
 */
function usePreventCapture(): void {
  const isFocused = useIsFocused();

  useEffect(() => {
    if (isFocused) {
      ScreenCapture.preventScreenCaptureAsync();
    } else {
      ScreenCapture.allowScreenCaptureAsync();
    }

    return () => {
      ScreenCapture.allowScreenCaptureAsync();
    };
  }, [isFocused]);
}

// Usage in a sensitive screen
function BankingScreen() {
  usePreventCapture();
  return <AccountDetails />;
}
```

**Why good:** per-screen control (not global), cleanup restores capture on navigate away, isFocused integration with navigation lifecycle

### Screenshot Listener (Detection Instead of Prevention)

```typescript
import { useEffect } from "react";
import * as ScreenCapture from "expo-screen-capture";

function useScreenshotListener(onCapture: () => void): void {
  useEffect(() => {
    const subscription = ScreenCapture.addScreenshotListener(() => {
      onCapture();
    });

    return () => subscription.remove();
  }, [onCapture]);
}

// Usage: alert user and log event
function SensitiveScreen() {
  useScreenshotListener(() => {
    Alert.alert("Screenshot Detected", "Screenshots of this screen are monitored.");
    reportSecurityEvent({ type: "screenshot-detected", screen: "sensitive" });
  });

  return <SensitiveContent />;
}
```

**Why good:** useful when you cannot prevent screenshots (some iOS scenarios) but want to detect and log them, subscription cleanup prevents memory leaks

### Android FLAG_SECURE (Bare RN)

For bare React Native without Expo, use the native Android `FLAG_SECURE` flag:

```typescript
import { Platform, NativeModules } from "react-native";

// Requires a small native module that calls:
// getWindow().setFlags(WindowManager.LayoutParams.FLAG_SECURE, WindowManager.LayoutParams.FLAG_SECURE)

function enableSecureMode(): void {
  if (Platform.OS === "android") {
    NativeModules.ScreenSecurity?.enableSecureFlag();
  }
}

function disableSecureMode(): void {
  if (Platform.OS === "android") {
    NativeModules.ScreenSecurity?.disableSecureFlag();
  }
}
```

**Platform differences:**

| Platform              | Screenshots     | Screen Recording | App Switcher Thumbnail |
| --------------------- | --------------- | ---------------- | ---------------------- |
| iOS (ScreenCapture)   | Blocked (blank) | Blocked          | Not affected           |
| Android (FLAG_SECURE) | Blocked (black) | Blocked (black)  | Black thumbnail        |

---

## Pattern 4: Network Security Configuration

### iOS App Transport Security (ATS)

ATS enforces HTTPS by default since iOS 9. The correct production configuration is to NOT add exceptions.

```xml
<!-- ios/YourApp/Info.plist -->
<!-- PRODUCTION: Do NOT include NSAppTransportSecurity at all (defaults are secure) -->
<!-- OR explicitly enforce: -->
<key>NSAppTransportSecurity</key>
<dict>
  <key>NSAllowArbitraryLoads</key>
  <false/>
</dict>

<!-- Face ID permission (REQUIRED when using biometrics) -->
<key>NSFaceIDUsageDescription</key>
<string>Use Face ID to securely access your account</string>
```

**Development-only exception (NEVER ship this):**

```xml
<!-- For local development server only -->
<key>NSAppTransportSecurity</key>
<dict>
  <key>NSExceptionDomains</key>
  <dict>
    <key>localhost</key>
    <dict>
      <key>NSTemporaryExceptionAllowsInsecureHTTPLoads</key>
      <true/>
    </dict>
  </dict>
</dict>
```

**Why good:** no blanket `NSAllowArbitraryLoads`, development exceptions scoped to localhost only, includes `NSFaceIDUsageDescription` for biometric features

### Bad Example: Disabling ATS

```xml
<!-- BAD: disables ALL transport security -->
<key>NSAppTransportSecurity</key>
<dict>
  <key>NSAllowArbitraryLoads</key>
  <true/>
</dict>
```

**Why bad:** allows plain HTTP to any domain, Apple may reject apps with this in production, exposes all network traffic to interception

### Android Network Security Config

```xml
<!-- android/app/src/main/res/xml/network_security_config.xml -->
<network-security-config>
  <!-- Block all clear text traffic by default -->
  <base-config cleartextTrafficPermitted="false">
    <trust-anchors>
      <certificates src="system" />
    </trust-anchors>
  </base-config>

  <!-- Certificate pinning for your API -->
  <domain-config>
    <domain includeSubdomains="true">api.example.com</domain>
    <pin-set expiration="2026-12-31">
      <pin digest="SHA-256">CLOmM1/OXvSPjw5UOYbAf9GKOxImEp9hhku9W90fHMk=</pin>
      <pin digest="SHA-256">hxqRlPTu1bMS/0DITB1SSu0vd4u/8l8TjPgfaAp63Gc=</pin>
    </pin-set>
  </domain-config>

  <!-- Debug override: allow local dev server (debug builds only) -->
  <debug-overrides>
    <trust-anchors>
      <certificates src="user" />
    </trust-anchors>
  </debug-overrides>
</network-security-config>
```

**Reference the config in AndroidManifest.xml:**

```xml
<!-- android/app/src/main/AndroidManifest.xml -->
<application
  android:networkSecurityConfig="@xml/network_security_config"
  ...>
```

**Why good:** clear text blocked globally, native pinning as defense-in-depth alongside JS-level pinning, debug-overrides allow local dev without compromising release builds, expiration date on pins

### Expo Configuration (app.json)

```json
{
  "expo": {
    "plugins": [
      [
        "expo-build-properties",
        {
          "android": {
            "enableProguardInReleaseBuilds": true,
            "enableShrinkResourcesInReleaseBuilds": true
          }
        }
      ]
    ]
  }
}
```

---

## Pattern 5: Secure Data Serialization

Never store structured sensitive data as raw JSON strings. Use a wrapper that encrypts before storing and decrypts after retrieval.

```typescript
import * as SecureStore from "expo-secure-store";

const SESSION_KEY = "encrypted-session";
const MAX_SECURE_STORE_BYTES = 2048;

interface SecureSession {
  userId: string;
  accessToken: string;
  expiresAt: number;
}

async function storeSession(session: SecureSession): Promise<void> {
  const serialized = JSON.stringify(session);

  if (new Blob([serialized]).size > MAX_SECURE_STORE_BYTES) {
    throw new Error("Session data exceeds secure storage limit");
  }

  await SecureStore.setItemAsync(SESSION_KEY, serialized);
}

async function getSession(): Promise<SecureSession | null> {
  const raw = await SecureStore.getItemAsync(SESSION_KEY);
  if (!raw) return null;

  const session: SecureSession = JSON.parse(raw);

  // Check expiration
  if (session.expiresAt < Date.now()) {
    await SecureStore.deleteItemAsync(SESSION_KEY);
    return null;
  }

  return session;
}
```

**Why good:** size check before storing prevents silent failures, expiration check on retrieval prevents using stale tokens, typed session interface, automatic cleanup of expired sessions