From f8e4be9b36a16969ac53bd9ce12ce8064be10196 Mon Sep 17 00:00:00 2001
From: nsfisis <nsfisis@gmail.com>
Date: Sun, 4 Jan 2026 17:43:59 +0900
Subject: refactor(client): migrate state management from React Context to
 Jotai
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Replace AuthProvider and SyncProvider with Jotai atoms for more granular
state management and better performance. This migration:

- Creates atoms for auth, sync, decks, cards, noteTypes, and study state
- Uses atomFamily for parameterized state (e.g., cards by deckId)
- Introduces StoreInitializer component for subscription initialization
- Updates all components and pages to use useAtomValue/useSetAtom
- Updates all tests to use Jotai Provider with createStore pattern

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 src/client/atoms/study.ts | 59 +++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 59 insertions(+)
 create mode 100644 src/client/atoms/study.ts

(limited to 'src/client/atoms/study.ts')

diff --git a/src/client/atoms/study.ts b/src/client/atoms/study.ts
new file mode 100644
index 0000000..2e3e1ea
--- /dev/null
+++ b/src/client/atoms/study.ts
@@ -0,0 +1,59 @@
+import { apiClient } from "../api/client";
+import { shuffle } from "../utils/shuffle";
+import { createReloadableAtomFamily } from "./utils";
+
+export interface StudyCard {
+	id: string;
+	deckId: string;
+	noteId: string;
+	isReversed: boolean;
+	front: string;
+	back: string;
+	state: number;
+	due: string;
+	stability: number;
+	difficulty: number;
+	reps: number;
+	lapses: number;
+	noteType: {
+		frontTemplate: string;
+		backTemplate: string;
+	};
+	fieldValuesMap: Record<string, string>;
+}
+
+export interface StudyDeck {
+	id: string;
+	name: string;
+}
+
+export interface StudyData {
+	deck: StudyDeck;
+	cards: StudyCard[];
+}
+
+// =====================
+// Study Session - Suspense-compatible
+// =====================
+
+export const studyDataAtomFamily = createReloadableAtomFamily(
+	async (deckId: string): Promise<StudyData> => {
+		// Fetch deck and due cards in parallel
+		const [deckRes, cardsRes] = await Promise.all([
+			apiClient.rpc.api.decks[":id"].$get({ param: { id: deckId } }),
+			apiClient.rpc.api.decks[":deckId"].study.$get({ param: { deckId } }),
+		]);
+
+		const deckData = await apiClient.handleResponse<{ deck: StudyDeck }>(
+			deckRes,
+		);
+		const cardsData = await apiClient.handleResponse<{ cards: StudyCard[] }>(
+			cardsRes,
+		);
+
+		return {
+			deck: deckData.deck,
+			cards: shuffle(cardsData.cards),
+		};
+	},
+);
-- 
cgit v1.2.3-70-g09d2