Skip to content

[fix] タスク一覧フィルターUIを修正#44

Draft
screana wants to merge 11 commits intomainfrom
fix/issue-32-admin-tasks-filter-ui-clean
Draft

[fix] タスク一覧フィルターUIを修正#44
screana wants to merge 11 commits intomainfrom
fix/issue-32-admin-tasks-filter-ui-clean

Conversation

@screana
Copy link
Copy Markdown
Collaborator

@screana screana commented May 7, 2026

概要

タスク一覧 / User画面のフィルターUIを修正しました。
場所フィルターでは中間階層を候補に出さず、末端の場所だけを選択できるようにしています。

変更点

  • Admin / User のタスク一覧場所フィルターで、場所階層の末端のみを選択候補にするよう修正
  • Admin タスク一覧テーブルで、長い場所名・物品名・指揮者名・備考が入ってもレイアウトが崩れないよう修正
  • User / Admin で将来フィルター設計が分岐できるよう、共通処理は場所階層の解釈だけに限定
  • 場所フィルターの設計意図が分かるように、日本語コメントを追加
  • React Doctor の指摘に対応し、純黒背景・CSS三角形・不要な state 更新検出などを修正

関連Issue

スクリーンショット(UI変更がある場合)

Before After

動作確認手順

  1. /admin/tasks にアクセスする
  2. From の場所フィルターを開き、親階層・中間階層の場所が選択候補として表示されず、末端の場所のみが表示されることを確認する
  3. To の場所フィルターでも同様に、末端の場所のみが表示されることを確認する
  4. 場所フィルターで任意の末端の場所を選択し、タスク一覧が選択した場所で絞り込まれることを確認する
  5. 場所フィルターを「すべて」に戻し、絞り込みが解除されることを確認する
  6. 長い場所名・物品名・指揮者名・備考を含むタスクがある場合でも、Admin タスク一覧テーブルの列幅や行レイアウトが崩れないことを確認する
  7. /tasks にアクセスする
  8. 絞り込みドロワーを開き、From / To の場所フィルターで末端の場所のみが表示されることを確認する
  9. User 側でも任意の末端の場所を選択し、タスク一覧が絞り込まれることを確認する
  10. フィルターを解除し、タスク一覧が元の表示に戻ることを確認する
  11. PR の Quality Check / React Doctor / Build が通っていることを確認する

レビューしてほしいポイント

  • 場所フィルターで中間階層を非表示にし、末端だけを選択候補にする設計で問題ないか
  • User / Admin で将来表示仕様が分岐できるようにした共通処理の粒度が適切か
  • 長い文字列を省略表示するテーブルUIが Figma の意図とずれていないか

セルフチェックリスト

  • ローカルでの動作確認を行った
  • Lint エラーが出ていない
  • テストコードを追加・修正した(必要な場合)

@github-actions
Copy link
Copy Markdown

github-actions Bot commented May 7, 2026

🩺 React Doctor

react-doctor v0.0.47

CI detected — scoring locally.

Scanning /home/runner/work/goods-go/goods-go...


No issues found!

  ┌─────┐
  │ ◠ ◠ │
  │  ▽  │
  └─────┘
  React Doctor (www.react.doctor)

  100 / 100  Great

  ██████████████████████████████████████████████████

@screana screana requested a review from TkymHrt May 7, 2026 10:41
Copy link
Copy Markdown
Member

@TkymHrt TkymHrt left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

修正ありがとー
概ね良さそうでした!
細かいとこだけコメントしました。

Comment thread docs/deployment.md
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ask

削除している理由あったりするー?

itemIds: [],
});
const [selectedTaskId, setSelectedTaskId] = useState<string | null>(null);
const [selectedTask, setSelectedTask] = useState<UserTask | null>(null);
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion

変更前のようにIDのみをStateに持って、実データはPropsから~の方が良さそうかな
router.refresh() かけてもStateの状態は更新されないから、更新漏れがでそう

Comment on lines -61 to -64
const selectedTask = useMemo(
() => tasks.find((task) => task.taskId === selectedTaskId) ?? null,
[selectedTaskId, tasks],
);
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion

毎度再レンダリングしたくないから、memo化はしたいね

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants