reatom-async

Reatom Async

タスクの主な内容が Reatom の非同期動作に関する場合に、このスキルを使用してください。同梱されている非同期処理の信頼できる情報源として、REFERENCE.md を参照してください。

使用方法

1. タスクに該当する REFERENCE.md のセクションだけを読んでください。
2. debounce ライブラリ、マウント時のフェッチ、ref、コンポーネントローカルの Promise 状態、手動での AbortController 管理よりも、Reatom の非同期パターンを優先してください。
3. Reatom の一般的なモデリングには reatom スキルを、@reatom/jsx の DOM JSX 固有の内容には reatom-jsx を使用してください。レビューには、このスキルと reatom-review を組み合わせてください。
4. ドキュメント、ソース、テストの内容が食い違う場合は、ソースとテストを優先し、古くなっているドキュメントや例を修正してください。

セクション一覧

• クエリとミューテーション：Choosing the Primitive、withAsyncData、withAsync
• await 後のコンテキスト：wrap Rules
• キャンセル：withAbort、abortVar and Fetch Signals
• デバウンス、スロットル、待機、競合：Sampling and Procedural Async
• Redux-saga からの移行：Redux-Saga Mapping
• ローディング UI と再試行：Status, Retry, Reset
• Suspense：Suspense Boundaries
• コードレビュー：Common Mistakes、Tested Edge Cases

実装時のデフォルト

• クエリ／データの読み取り：computed(async () => ...).extend(withAsyncData({ initState }))。
• コマンド／ミューテーション：action(async () => ...).extend(withAsync(...))。古くなった呼び出しを停止する必要がある場合は、withAbort(...) を追加してください。
• Reatom フレームを抜けるすべての非同期境界では、await wrap(promise) を使用します。
• Reatom の状態／アクションを呼び出す外部コールバックは、wrap(fn) として渡すか、onEvent に接続します。
• キャンセル可能なフェッチでは、signal: abortVar.require().signal またはスコープ付きの abortVar.subscribe() を使用します。
• デバウンスとスロットルはサンプリングのドキュメントに従います。フロー内で await wrap(sleep(ms)) を使用し、withAbort() の戦略と組み合わせます。分離したデバウンス用ヘルパーは使用しません。
• ルート／ページのデータは、コンポーネントのエフェクトではなく、ルートローダーまたは非同期 computed に配置します。
• フォーム送信は非同期ミューテーションです。手書きの送信アクションやデバウンス付きバリデーターを使う代わりに、reatomForm({ onSubmit }) に設定し、非同期／依存関係のあるチェックにはフィールドの validate を使用してください（デバウンスには await wrap(sleep(ms)) を使用します）。
• Suspense は動的なページデータではなく、グローバルな一度きりの初期化に使用します。

レビュー時のデフォルト

• アトム／アクションの呼び出し前に wrap されていない await があれば、指摘してください。
• クエリデータには .data を管理する withAsyncData を使うべきところで、withAsync を使っている場合は指摘してください。
• 古くなったコマンド呼び出しが状態を更新する可能性があるのに、withAbort なしで withAsync を使っている場合は指摘してください。
• { status: true } を指定せずに .status() を使っている場合は指摘してください。
• { cacheParams: true } を指定せずにアクションの .retry() を使っている場合は指摘してください。
• withAsync()／withAsyncData() より前に withCache() を使っている場合は指摘してください。
• 中断を業務エラーとして表示している場合は指摘してください。
• 敗者側のクリーンアップが必要なのに、生の Promise.race を使っている場合は指摘してください。