search

r-sugi / nextjs-tdd-template

https://nextjs-tdd-templatestorybook-rsugis-projects.vercel.app
0 stars 0 forks source link

refactor: dialogコンポーネントを切り出す #194

Closed r-sugi closed 2 months ago

r-sugi commented 2 months ago

User description

186

PR Type

enhancement

Description

Changes walkthrough 📝

Relevant files
Enhancement
BanDialog.tsx
`BanDialog`コンポーネントの追加とフォーム実装                                                         
src/feature/admin/allMembers/index/dialog/BanDialog.tsx
  • 新しいBanDialogコンポーネントを追加
  • useBanMemberFormを利用してフォームを実装
  • onSubmitBan関数でデータ送信を処理
    		•  +73/-0   
    DisableDialog.tsx
    `DisableDialog`コンポーネントの追加と無効化処理                                                   
    src/feature/admin/allMembers/index/dialog/DisableDialog.tsx
  • 新しいDisableDialogコンポーネントを追加
  • メンバーの無効化ステータスを表示
  • onSubmitDisable関数で無効化処理を実装
    		•  +47/-0   
    MemberTableRow.tsx
    ダイアログコンポーネントの統合とロジックのリファクタリング                                                       
    src/feature/admin/allMembers/index/table/MemberTableRow.tsx
  • BanDialogとDisableDialogコンポーネントを使用
  • onSubmitBanとonSubmitDisable関数をリファクタリング
  • ダイアログの表示ロジックを簡素化
    		•  +42/-152
    type.ts
    新しいダイアログ用の型定義の追加                                                                                 
    src/feature/admin/allMembers/index/table/type.ts - `OnSubmitBan`と`OnSubmitDisable`型を追加 - 型定義を更新して新しいダイアログコンポーネントに対応
    		+9/-0     

    💡 PR-Agent usage: Comment /help on the PR to get a list of all available PR-Agent tools and their descriptions

    vercel[bot] commented 2 months ago

    The latest updates on your projects. Learn more about Vercel for Git ↗︎

    Name Status Preview Comments Updated (UTC)
    nextjs-tdd-template_storybook ✅ Ready (Inspect) Visit Preview 💬 Add feedback Sep 11, 2024 1:46pm
    github-actions[bot] commented 2 months ago

    PR Reviewer Guide 🔍

    ⏱️ Estimated effort to review: 3 🔵🔵🔵⚪⚪
    🧪 No relevant tests
    🔒 No security concerns identified
    ⚡ Key issues to review

    リファクタリングの提案
    `onSubmitDisable`関数は、関数を返すように設計されていますが、この設計は一貫性がなく、他の類似の関数と異なります。この関数がなぜこのように設計されたのか、または他の関数と同様に直接的なアプローチを採用するべきかどうかを再評価することをお勧めします。 パフォーマンスの懸念
    `onSubmitBan`関数内で`reset`を呼び出した後に`onSubmit`を呼び出していますが、これにより不要なレンダリングが発生する可能性があります。`reset`の呼び出し位置を`onSubmit`の後に変更することで、パフォーマンスを向上させることができます。
    github-actions[bot] commented 2 months ago

    PR Code Suggestions ✨

    CategorySuggestion                                                                                                                                    Score
    Possible bug
    イベントハンドラを正しく設定するために、関数でラップします。 ___ **
    onSubmitDisable関数が呼び出される際に、イベントハンドラが直接実行されてしまいます。これは、ボタンがクリックされたときではなく、コンポーネントがレンダリングされるたびにonSubmitDisableが呼び出されることを意味します。これを修正するために、イベントハンドラを関数でラップする必要があります。** [src/feature/admin/allMembers/index/dialog/DisableDialog.tsx [32-36]](https://github.com/r-sugi/nextjs-tdd-template/pull/194/files#diff-a995f21305bd1f3b3bcd4b6905c31a6f8724dad27b42617ce9776b97a20f9293R32-R36) ```diff ```
    Suggestion importance[1-10]: 9 Why: The suggestion correctly identifies a potential bug where the `onSubmitDisable` function is executed immediately upon rendering instead of on button click. Wrapping the function in an arrow function ensures it is called only when the button is clicked, which is crucial for correct functionality.
    		9