-
Notifications
You must be signed in to change notification settings - Fork 6
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[FE] モーダル UX 改善 #442
[FE] モーダル UX 改善 #442
Conversation
8f78117
to
da27db2
Compare
@imamiya-masaki @narirou レビューお願いいたします。 |
selectorModalRef.current.close(); | ||
} | ||
}, []); | ||
// internalState: AppRequestContext.status をもとに決定する内部 status |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
コメントは書かなくて大丈夫です! 変数名を明示的にしたり、コードをシンプルにすることで担保してもらえたらと
それでもわからないWhyがあるときだけ記載をお願いします 🙇
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
return; | ||
} | ||
setInternalStatus("MATCHING"); | ||
await fetchAppPostRides({ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
try-catchにしてエラーハンドリングしてもらえると助かります!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
}); | ||
}, [currentLocation, destLocation]); | ||
// 少し時間をおいた後、Modal 要素を DOM から外す | ||
setTimeout(() => setStatusModalOpen(false), 300); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
(IMO) animationendイベントがあるのでこちらを見ても良いです
https://developer.mozilla.org/en-US/docs/Web/API/Element/animationend_event
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
なるほど、ありがとうございます!
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM
relates: #241
上記の対応を実施しました。
加えてモーダルクローズ時のアニメーション関連処理を修正しました。
トップの配車ボタン押下時に、API完了を待たずにモーダルをすぐ表示する
improve-modal-01.mov
到着画面で評価を押した後に、API完了を待たずにモーダルをすぐ閉じる
improve-modal-02.mov