CSR テーブルの行に型の異なるデータを渡して処理するケース

r-sugi commented 3 months ago

[x] 型定義
[x] 型による処理の分岐
[x] ステータスごとにカラムが異なりすぎていて一覧表示した際に、共通のカラムがないステータスがあるなど少し違和感がある件（テーブル設計見直し？）
[x] Write Modelについて、フォーム送信を例に理解したい　https://speakerdeck.com/okunokentaro/frontend-conference-fukuoka-2018?slide=63
[x] dialogで決定orキャンセルの確認を出す(react portal?)
[x] もっとシンプルな設計にしたい図解: https://github.com/r-sugi/nextjs-tdd-template/issues/178#issue-2493256583 詳細図解: https://app.diagrams.net/#G1wH6KFSpZBESFkKEHfF5bH7-aBQKfozVK#%7B%22pageId%22%3A%2262Jl_v_xm0svm6KTwW8h%22%7D

List
  NormalListItem
      id status title popupMenu
  SpecialListItem
      id status title popupMenu

UpdateNormalListitemModal
UpdateSpecialListitemModal

みたいな階層を想定する。

リストアイテムのデータ構造に応じて、アクション系のボタン(と押下時のAPI操作)が変わる

r-sugi commented 3 months ago

スクリーンショット 2024-08-28 20 11 49

r-sugi commented 3 months ago

https://ui.shadcn.com/docs/components/data-table tanstack table使っている

r-sugi / nextjs-tdd-template

CSR テーブルの行に型の異なるデータを渡して処理するケース #167