購入報告一覧ページの isDisabled のスタイルが正常に当たらない問題を解決

[YushiroDodo63]

対応Issue

resolve #492

概要

購入報告ページの編集・削除ボタンの isDisabeld やそのスタイルが正常に当たらない問題があったので、それを解決しました。

原因

おそらく、Recoil で管理している user を使っていることが原因でした。
Recoil で管理している値はレンダリング後に保持される値で、SSR時に仮想DOMを作成した時は user が undefined なので編集・削除ボタンは isDisabled が false になるが、CSR時には user が存在しているので、その部分で問題が発生していた。（場合によっては Hydration Error が出たりしていた。）

解決方法

user を使用した条件分岐を行う際は、手間だが currentUser を取得するAPIを叩き、取得した currentUser を用いて条件分岐を行うことで解決できる。

画面スクリーンショット等

2023-04-09.16.06.26.mov

テスト項目

• http://localhost:3000/purchasereports にて新規購入報告を作成し、作成した購入報告の編集・削除できるか
• 作成した購入報告の編集・削除ボタンのスタイルが上記動画と同じように active になっているか

備考

[YushiroDodo63]

学内募金の動作

2023-04-09.20.38.06.mov

購入申請の動作

2023-04-09.20.35.12.mov

[imaimai17468]

LGTM!
コード、動作ともに問題なしです！