mirror of
https://github.com/jakejarvis/sofa.git
synced 2026-08-29 05:05:38 -04:00
Replace ad-hoc useState/useEffect fetch patterns with Jotai atoms and loadables in StatsDisplay, FilterableTitleRow, BackupScheduleSection, IntegrationsSection, and CommandPalette. Each component now gets a scoped Jotai Provider with a pre-initialized store so server-rendered initial values hydrate correctly. Async data fetching moves into atom-level loadables, eliminating manual loading flags and cancellation logic throughout.
30 lines
935 B
TypeScript
30 lines
935 B
TypeScript
import { atom } from "jotai";
|
|
import { loadable } from "jotai/utils";
|
|
import type { HistoryBucket, TimePeriod } from "@/lib/services/discovery";
|
|
|
|
export const moviePeriodAtom = atom<TimePeriod>("this_month");
|
|
export const episodePeriodAtom = atom<TimePeriod>("this_week");
|
|
|
|
async function fetchStats(
|
|
type: "movies" | "episodes",
|
|
period: TimePeriod,
|
|
): Promise<{ count: number; history: HistoryBucket[] }> {
|
|
const res = await fetch(
|
|
`/api/stats?type=${type}&period=${period}&history=true`,
|
|
);
|
|
return res.json();
|
|
}
|
|
|
|
const movieStatsAsyncAtom = atom(async (get) => {
|
|
const period = get(moviePeriodAtom);
|
|
return fetchStats("movies", period);
|
|
});
|
|
|
|
const episodeStatsAsyncAtom = atom(async (get) => {
|
|
const period = get(episodePeriodAtom);
|
|
return fetchStats("episodes", period);
|
|
});
|
|
|
|
export const movieStatsLoadable = loadable(movieStatsAsyncAtom);
|
|
export const episodeStatsLoadable = loadable(episodeStatsAsyncAtom);
|