Patrones de AsyncStorage

npx expo install @react-native-async-storage/async-storage

// src/storage/keys.ts
export const STORAGE_KEYS = {
  meta: "app:storage:meta:v1",
  preferences: "user:preferences:v1",
  outbox: "sync:outbox:v1",
} as const;
 
export type StorageMeta = { schemaVersion: number };

// src/storage/safeJson.ts
export function safeParse<T>(raw: string | null, fallback: T): T {
  if (!raw) return fallback;
  try {
    return JSON.parse(raw) as T;
  } catch {
    return fallback;
  }
}

// src/storage/preferences.ts
import AsyncStorage from "@react-native-async-storage/async-storage";
import { STORAGE_KEYS } from "./keys";
import { safeParse } from "./safeJson";
 
export type Preferences = { theme: "light" | "dark"; locale: string };
 
const DEFAULTS: Preferences = { theme: "light", locale: "en" };
 
export async function loadPreferences(): Promise<Preferences> {
  const raw = await AsyncStorage.getItem(STORAGE_KEYS.preferences);
  return safeParse(raw, DEFAULTS);
}
 
export async function savePreferences(prefs: Preferences) {
  await AsyncStorage.setItem(STORAGE_KEYS.preferences, JSON.stringify(prefs));
}

npx expo install @react-native-async-storage/async-storage

// src/storage/keys.ts
export const STORAGE_KEYS = {
  meta: "app:storage:meta:v1",
  preferences: "user:preferences:v1",
  outbox: "sync:outbox:v1",
} as const;
 
export const CURRENT_SCHEMA_VERSION = 2;
 
export type StorageMeta = { schemaVersion: number };

// src/storage/migrations.ts
import AsyncStorage from "@react-native-async-storage/async-storage";
import { CURRENT_SCHEMA_VERSION, STORAGE_KEYS, type StorageMeta } from "./keys";
import { safeParse } from "./safeJson";
 
async function readMeta(): Promise<StorageMeta> {
  const raw = await AsyncStorage.getItem(STORAGE_KEYS.meta);
  return safeParse(raw, { schemaVersion: 0 });
}
 
async function writeMeta(meta: StorageMeta) {
  await AsyncStorage.setItem(STORAGE_KEYS.meta, JSON.stringify(meta));
}
 
async function migrateV0ToV1() {
  // v0 tenía clave "preferences" sin versionar
  const legacy = await AsyncStorage.getItem("preferences");
  if (legacy) {
    await AsyncStorage.setItem(STORAGE_KEYS.preferences, legacy);
    await AsyncStorage.removeItem("preferences");
  }
}
 
async function migrateV1ToV2() {
  const raw = await AsyncStorage.getItem(STORAGE_KEYS.preferences);
  const prefs = safeParse(raw, { theme: "light" });
  const next = { ...prefs, locale: prefs.locale ?? "en" };
  await AsyncStorage.setItem(STORAGE_KEYS.preferences, JSON.stringify(next));
}
 
const STEPS: Record<number, () => Promise<void>> = {
  0: migrateV0ToV1,
  1: migrateV1ToV2,
};
 
export async function runStorageMigrations() {
  const meta = await readMeta();
  let version = meta.schemaVersion;
 
  while (version < CURRENT_SCHEMA_VERSION) {
    const step = STEPS[version];
    if (!step) throw new Error(`Missing migration for schema v${version}`);
    await step();
    version += 1;
    await writeMeta({ schemaVersion: version });
  }
}

// app/_layout.tsx (fragmento)
import AsyncStorage from "@react-native-async-storage/async-storage";
import { useEffect, useState } from "react";
import { runStorageMigrations } from "@/storage/migrations";
 
export default function RootLayout() {
  const [ready, setReady] = useState(false);
 
  useEffect(() => {
    runStorageMigrations()
      .then(() => setReady(true))
      .catch(async () => {
        // Recuperación de corrupción: reinicia claves no críticas e inicia
        await AsyncStorage.clear();
        setReady(true);
      });
  }, []);
 
  if (!ready) return null;
  return <Stack />;
}

// src/storage/outbox.ts
import AsyncStorage from "@react-native-async-storage/async-storage";
import { STORAGE_KEYS } from "./keys";
import { safeParse } from "./safeJson";
 
export type OutboxItem = {
  id: string;
  type: string;
  payload: unknown;
  idempotencyKey: string;
  createdAt: number;
};
 
export async function readOutbox(): Promise<OutboxItem[]> {
  const raw = await AsyncStorage.getItem(STORAGE_KEYS.outbox);
  return safeParse(raw, []);
}
 
export async function appendOutbox(item: OutboxItem) {
  const queue = await readOutbox();
  queue.push(item);
  await AsyncStorage.setItem(STORAGE_KEYS.outbox, JSON.stringify(queue));
}
 
export async function writeOutbox(queue: OutboxItem[]) {
  await AsyncStorage.setItem(STORAGE_KEYS.outbox, JSON.stringify(queue));
}

# Opcional: persistencia de TanStack Query
npx expo install @tanstack/react-query-persist-client @tanstack/query-async-storage-persister

Secuencia de inicio:
 
1. Lee app:storage:meta:v1 → schemaVersion (predeterminado 0)
2. Mientras version < CURRENT_SCHEMA_VERSION:
     ejecuta STEPS[version]()
     version++
     persiste meta
3. La aplicación se renderiza - ninguna pantalla lee claves sin migrar

export async function loadWithRecovery<T>(
  key: string,
  fallback: T,
  onCorrupt?: () => void
): Promise<T> {
  try {
    const raw = await AsyncStorage.getItem(key);
    return safeParse(raw, fallback);
  } catch {
    onCorrupt?.();
    await AsyncStorage.removeItem(key);
    return fallback;
  }
}

import AsyncStorage from "@react-native-async-storage/async-storage";
 
export async function saveDraftBundle(draft: object, updatedAt: number) {
  await AsyncStorage.multiSet([
    ["draft:composer:v1", JSON.stringify(draft)],
    ["draft:composer:meta:v1", JSON.stringify({ updatedAt })],
  ]);
}