Свернули и вернулись: процесс вместо вкладки

declare function leaveApp(): void;
declare function backToApp(): void;
const { AppState } = ReactNative;

console.log("isAvailable:", AppState.isAvailable, "| currentState:", AppState.currentState);

const sub = AppState.addEventListener("change", (state) => {
  console.log("change:", state, "| currentState:", AppState.currentState);
});

// в песочнице это уход со вкладки, на телефоне — кнопка «домой» и возврат
leaveApp();
backToApp();

sub.remove();
leaveApp();
console.log("после remove | currentState:", AppState.currentState);
backToApp();

type Status = "active" | "inactive" | "background";
type Listener = (state: Status) => void;

// эмиттер с последовательностью iPhone: react-native-web её показать не может
function createPhoneAppState(start: Status) {
  let current = start;
  const listeners = new Set<Listener>();
  return {
    get currentState(): Status {
      return current;
    },
    addEventListener(type: "change", listener: Listener) {
      listeners.add(listener);
      return { remove: () => { listeners.delete(listener); } };
    },
    go(next: Status) {
      current = next;
      listeners.forEach((listener) => listener(next));
    },
  };
}

const phone = createPhoneAppState("active");
let syncs = 0;
const sub = phone.addEventListener("change", (state) => {
  console.log("состояние:", state);
  // синхронизируемся на возврате, а не на любом изменении
  if (state !== "active") return;
  syncs += 1;
  console.log("sync #" + syncs);
});

// свернули приложение и вернулись — так это выглядит на iPhone
for (const state of ["inactive", "background", "inactive", "active"] as const) phone.go(state);
sub.remove();
console.log("синхронизаций:", syncs, "| сейчас:", phone.currentState);

type Fields = Record<string, string | number | boolean>;
type Row = Fields & { id: string };
type Op = { opId: string; rowId: string; fields: Fields; at: number };
type Verdict = { opId: string; status: "applied" | "duplicate" | "rejected"; reason?: string };
interface Server {
  rows: Map<string, Row>;
  net: { offline: boolean; loseResponse: boolean; unauthorized: boolean };
}
declare function createServer(): Server;
interface Store {
  visible(): Row[];
  subscribe(listener: () => void): () => void;
}
interface Journal {
  newId(): string;
  change(rowId: string, fields: Fields): void;
}
interface Client {
  store: Store;
  journal: Journal;
  queue(): Op[];
  sync(): Verdict[];
}
declare function createClient(device: string, server: Server): Client;
declare function leaveApp(): void;
declare function backToApp(): void;
const { View, Text, Pressable, AppState } = ReactNative;

const server = createServer();
const client = createClient("A", server);
// в зале сети нет
server.net.offline = true;

function Diary() {
  const rows = React.useSyncExternalStore(client.store.subscribe, client.store.visible);
  const [failure, setFailure] = React.useState("");
  React.useEffect(() => {
    const sub = AppState.addEventListener("change", (state) => {
      console.log("AppState:", state);
      if (state !== "active") return;
      try {
        client.sync();
        setFailure("");
      } catch (error) {
        setFailure((error as Error).message);
      }
    });
    // уборка эффекта как в части IV, только подписка снимается своим remove
    return () => sub.remove();
  }, []);
  const pending = client.queue().length;
  const label = failure !== "" ? failure : pending > 0 ? "ждут отправки: " + pending : "сохранено на телефоне";
  console.log("индикатор:", label, "| подходов:", rows.length);
  return (
    <View style={{ gap: 6 }}>
      <Text testID="label">{label}</Text>
      <Pressable
        testID="add"
        onPress={() => client.journal.change(client.journal.newId(), { exercise: "жим", weightKg: 80, reps: 5 })}
      >
        <Text>+ подход</Text>
      </Pressable>
    </View>
  );
}

mount(<Diary />);
setTimeout(() => fireEvent.press("add"), 50);
// свернули телефон в раздевалке и открыли снова — сети всё ещё нет
setTimeout(() => { leaveApp(); backToApp(); }, 100);
// вышли на улицу и открыли приложение
setTimeout(() => { server.net.offline = false; leaveApp(); backToApp(); }, 150);

// app/_layout.tsx — одна подписка на всё приложение
React.useEffect(() => {
  const sub = AppState.addEventListener("change", (state) => {
    if (state !== "active") return;
    // schedule() из «Цикла синхронизации»: попытка сейчас,
    // а при сетевой ошибке — повтор с отсрочкой
    schedule(0);
  });
  return () => sub.remove();
}, []);

type Fields = Record<string, string | number | boolean>;
type Row = Fields & { id: string };
type Op = { opId: string; rowId: string; fields: Fields; at: number };
type Verdict = { opId: string; status: "applied" | "duplicate" | "rejected"; reason?: string };
interface Server {
  rows: Map<string, Row>;
  journal: (Op & { seq: number })[];
  net: { offline: boolean; loseResponse: boolean; unauthorized: boolean };
}
declare function createServer(): Server;
interface Journal {
  newId(): string;
  change(rowId: string, fields: Fields): void;
  outbox(): Op[];
}
interface Client {
  journal: Journal;
  queue(): Op[];
  sync(): Verdict[];
}
declare function createClient(device: string, server: Server): Client;

const server = createServer();
const phone = createClient("A", server);
for (const set of [
  { exercise: "жим", weightKg: 80, reps: 5 },
  { exercise: "присед", weightKg: 100, reps: 5 },
]) {
  phone.journal.change(phone.journal.newId(), set);
}
// сетевых вызовов ещё не было ни одного
console.log("на диске операций:", phone.journal.outbox().length, "| ждут отправки:", phone.queue().length);

// уход в фон: не «успеть сохранить», а подтолкнуть отправку.
// Система убила процесс, пока пачка была в пути
server.net.loseResponse = true;
try {
  phone.sync();
} catch (error) {
  console.log("фон:", (error as Error).message, "| ждут отправки:", phone.queue().length);
}
console.log("у сервера строк:", server.rows.size, "| записей журнала:", server.journal.length);

// приложение открыли снова
server.net.loseResponse = false;
phone.sync();
console.log("после запуска: у сервера строк:", server.rows.size, "| записей журнала:", server.journal.length);
console.log("ждут отправки:", phone.queue().length);

type Fields = Record<string, string | number | boolean>;
type Row = Fields & { id: string };
type Op = { opId: string; rowId: string; fields: Fields; at: number };
type Verdict = { opId: string; status: "applied" | "duplicate" | "rejected"; reason?: string };
interface Server {
  rows: Map<string, Row>;
  net: { offline: boolean; loseResponse: boolean; unauthorized: boolean };
}
declare function createServer(): Server;
interface Journal {
  newId(): string;
  change(rowId: string, fields: Fields): void;
}
interface Client {
  journal: Journal;
  queue(): Op[];
  sync(): Verdict[];
}
declare function createClient(device: string, server: Server): Client;
// то, что отдаёт NetInfo: поля настоящие, значения — наши
type NetState = { type: "none" | "wifi" | "cellular"; isConnected: boolean; isInternetReachable: boolean | null };

const server = createServer();
const phone = createClient("A", server);
phone.journal.change(phone.journal.newId(), { exercise: "жим", weightKg: 80, reps: 5 });

const BACKOFF = [1000, 2000, 4000, 8000, 15000, 30000, 60000];
let attempt = 0;

function tryOnce(where: string, net: NetState) {
  if (!net.isConnected) {
    console.log(where + ": NetInfo говорит «сети нет» — попытки не делаем");
    return;
  }
  try {
    phone.sync();
    // получилось — лестница отсрочек сбрасывается
    attempt = 0;
    console.log(where + ": отправлено | ждут отправки " + phone.queue().length);
  } catch (error) {
    const delay = BACKOFF[Math.min(attempt, BACKOFF.length - 1)];
    attempt += 1;
    console.log(where + ": " + (error as Error).message + " | ещё попытка через " + delay + " мс, ждут отправки " + phone.queue().length);
  }
}

const none: NetState = { type: "none", isConnected: false, isInternetReachable: false };
// Wi-Fi зала со страницей входа: подключение есть, интернета нет
const portal: NetState = { type: "wifi", isConnected: true, isInternetReachable: false };
const lte: NetState = { type: "cellular", isConnected: true, isInternetReachable: true };

server.net.offline = true;
tryOnce("подвал", none);
tryOnce("зал, Wi-Fi с порталом", portal);
tryOnce("зал, Wi-Fi с порталом", portal);
server.net.offline = false;
tryOnce("улица, LTE", lte);

// sync/network.ts — @react-native-community/netinfo 12.0.1
import NetInfo from "@react-native-community/netinfo";

// подписка отдаёт функцию отписки, а не объект с remove: это не AppState
const unsubscribe = NetInfo.addEventListener((state) => {
  // появилась сеть — попробовать сразу, не дожидаясь следующей отсрочки
  if (state.isConnected) schedule(0);
});

// по умолчанию библиотека ходит HEAD-запросом на
// https://clients3.google.com/generate_204 и ждёт статус 204.
// Свой адрес честнее: он отвечает за ваш сервер, а не за интернет вообще
NetInfo.configure({
  reachabilityUrl: "https://api.podhod.app/health",
  reachabilityTest: (response) => Promise.resolve(response.status === 204),
  reachabilityShortTimeout: 5 * 1000,
  reachabilityLongTimeout: 60 * 1000,
});

// stack-starter/apps/mobile/src/app/providers/providers.tsx, сокращено
const onUnauthorized = () => {
  if (!useSession.getState().token) return;
  void stopPushDelivery();
  useSession.getState().signOut();
  // кэш переживает выход (gcTime — полчаса), поэтому чистим его руками:
  // иначе первый кадр после входа другим пользователем — чужие данные
  queryClient.clear();
};

type Fields = Record<string, string | number | boolean>;
type Row = Fields & { id: string };
type Op = { opId: string; rowId: string; fields: Fields; at: number };
type Verdict = { opId: string; status: "applied" | "duplicate" | "rejected"; reason?: string };
interface Server {
  rows: Map<string, Row>;
  net: { offline: boolean; loseResponse: boolean; unauthorized: boolean };
}
declare function createServer(): Server;
interface Store {
  visible(): Row[];
}
interface Journal {
  newId(): string;
  change(rowId: string, fields: Fields): void;
}
interface Client {
  store: Store;
  journal: Journal;
  queue(): Op[];
  sync(): Verdict[];
}
declare function createClient(device: string, server: Server): Client;

// вечер в зале: два подхода записаны, а токен за это время протух
function gymEvening() {
  const server = createServer();
  const phone = createClient("A", server);
  for (const set of [
    { exercise: "жим", weightKg: 80, reps: 5 },
    { exercise: "присед", weightKg: 100, reps: 5 },
  ]) {
    phone.journal.change(phone.journal.newId(), set);
  }
  server.net.unauthorized = true;
  return { server, phone };
}

// как чистят кеш запросов: выйти и стереть локальное
const wiped = gymEvening();
const afterSignOut = createClient("A", wiped.server);
console.log(
  "уборка при 401: на экране", afterSignOut.store.visible().length,
  "| ждут отправки", afterSignOut.queue().length,
  "| у сервера строк", wiped.server.rows.size,
);

// пауза: очередь не трогаем
const kept = gymEvening();
let paused = false;
try {
  kept.phone.sync();
} catch (error) {
  paused = (error as { code?: number }).code === 401;
  console.log("пауза при 401:", (error as Error).message, "| пауза", paused, "| ждут отправки", kept.phone.queue().length);
}
// человек вошёл снова
kept.server.net.unauthorized = false;
paused = false;
kept.phone.sync();
console.log("после входа: у сервера строк", kept.server.rows.size, "| ждут отправки", kept.phone.queue().length);