Profile My skills Saved My plugins Edit profile Submit a skill

Kk0ga Employee Time Attendance Frontend Server State Tanstack Query

TanStack Query Skill

tomevault-io Updated
Web & Frontend

File contents

TanStack Query Skill

目的

「どこで取得して、どこで更新して、いつ再取得するか」を統一する。

標準パターン

  • QueryKeyは docs/frontend-data-contract.md が正
  • 一覧：ページング/無限スクロールのどちらかに統一（docsに明記）
  • Mutation：成功時は invalidate か setQueryData で整合性を取る
  • 失敗時：ユーザーに短いメッセージ＋詳細ログ

勤怠でよくある実装指針

  • 打刻：mutation → 該当日の time_entries を即更新（setQueryData）→ 背後で invalidate
  • 月次申請：status を更新 → approvals と time_entries（該当月）を invalidate
  • 5分間隔反映が許容なら、refetchInterval は “必要な画面だけ” に限定

必須アウトプット

  • queryKey一覧（timeEntries/approvals/employees）
  • 主要mutation（clockIn/clockOut/submit/approve/reject）のinvalidate方針
  • 429/一時失敗時のリトライ方針

依頼例

  • 「time_entries の queryKey と invalidate 設計を決めたい」
  • 「打刻は楽観更新したい。UI/データ整合性の設計を出して」

References

Converted and distributed by TomeVault — claim your Tome and manage your conversions.

tomevault-io/skills-registry/tree/main/kk0ga--employee-time-attendance--frontend-server-state-tanstack-query commit 01c3823ee8

Browse category

Frequently asked questions

npx skillmds@latest add tomevault-io/kk0ga-employee-time-attendance-frontend-server-state-tanstac