Skip to content
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

traQ上のメッセージの投稿・編集日時に年月日を適宜省略しつつ付け足す #4338

Merged
merged 8 commits into from
Jul 22, 2024

Conversation

kitsne241
Copy link
Contributor

#3746

↑に関連していますが、当初のIssueが求める通りの実装ではありません。

  • 去年以前のメッセージには年月日を
  • 今年のメッセージには月日のみを
  • 昨日と今日のメッセージには『昨日』『今日』と

表示するよう date.ts内の関数getDisplayDate を書き換えました。
開発環境ではうまくいっているように見えましたが、この変更がtraQに表示されるメッセージの日付以外に影響を与える可能性について把握し切れていないのでレビューをお願いしたいです。

スクリーンショット 2024-07-01 15 56 59

Copy link

github-actions bot commented Jul 1, 2024

Copy link
Contributor

@nokhnaton nokhnaton left a comment

Choose a reason for hiding this comment

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

変更自体は問題ないと思います!
古いメッセージがいつ投稿されたものなのかわかりやすくなって嬉しいです
現状、testが落ちてしまっているので、その修正と、「今日の場合」「昨日の場合」「今年の場合」のtestも追加してほしいです!
testの修正・追加でわからないことがあったら気軽にtraQなどで質問してください!

@kitsne241
Copy link
Contributor Author

kitsne241 commented Jul 4, 2024

変更自体は問題ないと思います! 古いメッセージがいつ投稿されたものなのかわかりやすくなって嬉しいです 現状、testが落ちてしまっているので、その修正と、「今日の場合」「昨日の場合」「今年の場合」のtestも追加してほしいです! testの修正・追加でわからないことがあったら気軽にtraQなどで質問してください!

ありがとうございます!testを修正しました。

  • もとの実装では日付表示が『送信日時』と『編集日時』によって変更されていましたが、
  • 新しい実装ではこれに加えて関数内部で取得する『現在日時』をも参照して日付表示が変更されるようになりました。

具体的には、現在日時と編集日時との関係によって日付表示が『YYYY/MM/DD』『MM/DD』『昨日』『今日』の4通りに変化するので、それぞれについて正しく日付表示が場合分けされているかを検証するように書き換えました。現在日時を考慮してテストケースを作成する必要があるので多少コードが煩雑になってしまいました(とくに『MM/DD』の表示条件に合致する日付を常に生成するために工夫が必要でした)

Copy link
Contributor

@nokhnaton nokhnaton left a comment

Choose a reason for hiding this comment

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

ごめんなさい!私もこういう機能があるのすっかり忘れてたんですけど、テストの時に日付を固定して実行させることができて、こっちのほうがシンプルに書けるのでこっちを使って書いてみてほしいです。:pray:
せっかくコードを書いてくれたのに申し訳ないです
:person_bowing:

https://vitest.dev/guide/mocking.html#dates

@kitsne241
Copy link
Contributor Author

なるほど、現在時刻を動かせるんですね…。勉強になります。確かにシンプルに書けました

Copy link
Contributor

@cp-20 cp-20 left a comment

Choose a reason for hiding this comment

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

めちゃめちゃシンプルなコードで良さそうに見えます!
ちょっとだけコードをシンプルにするコメントを残しておきました

Comment on lines 45 to 48
let displayDate = new Date(createdAt)
if (createdAt !== updatedAt) {
displayDate = new Date(updatedAt)
}
Copy link
Contributor

Choose a reason for hiding this comment

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

imo: 3項演算子使った方がシンプルに書けそうな気がします:eyes:

Copy link
Contributor

Choose a reason for hiding this comment

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

というかこれ常にnew Date(updatedAt)で良くないですか?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

確かに三項演算子は使えますね。修正前のコードの構造に気を取られて気付かなかったです。
メッセージの投稿直後に updatedAt = createdAt として定義してくれているなら単に1行

displayDate = new Date(updatedAt)

でも良さそうには思えたのですが、その確証がなかったので残しました。これを採用すると createdAt を引数にとる必要がなくなります

Comment on lines 51 to 52
const yesterday = new Date(today)
yesterday.setDate(today.getDate() - 1)
Copy link
Contributor

Choose a reason for hiding this comment

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

imo: あんまり再代入したくない気持ちがある

const yesterday = new Date(today.getTime() - 1000 * 60 * 60 * 24)

Comment on lines 54 to 64
if (getFullDayString(displayDate) === getFullDayString(today)) {
return '今日' + ' ' + timeString
}
if (getFullDayString(displayDate) === getFullDayString(yesterday)) {
return '昨日' + ' ' + timeString
}
if (displayDate.getFullYear() === today.getFullYear()) {
return getDayString(displayDate) + ' ' + timeString
} else {
const updatedDate = new Date(updatedAt)
return getDateRepresentationWithoutSameDate(updatedDate, createdDate)
return getFullDayString(displayDate) + ' ' + timeString
}
Copy link
Member

Choose a reason for hiding this comment

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

ここはフォーマット後の文字列を比較するより素直に年月日を比較してフォーマットを決めるのが他の関数の中身を読む手間を減らせて分かりやすそうです

) {
return '昨日' + ' ' + timeString
}
if (displayDate.getFullYear() === today.getFullYear()) {
Copy link
Member

Choose a reason for hiding this comment

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

ここから上は年が同じである条件はおなじなのでネストは増えるけど条件をまとめられそうです

Copy link
Contributor Author

Choose a reason for hiding this comment

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

文意をうまく汲み取れていないかもですが、こういうことですか…?

if (
  displayDate.getFullYear() === yesterday.getFullYear() &&
  displayDate.getMonth() === yesterday.getMonth() &&
  displayDate.getDate() === yesterday.getDate()
) {
  return '昨日' + ' ' + timeString
}
if (displayDate.getFullYear() === today.getFullYear()) {
  if (
    displayDate.getMonth() === today.getMonth() &&
    displayDate.getDate() === today.getDate()
  ) {
    return '今日' + ' ' + timeString
  }
  return getDayString(displayDate) + ' ' + timeString
}
return getFullDayString(displayDate) + ' ' + timeString

大晦日のメッセージを元日に閲覧する時には『20XX/12/31』ではなく『昨日』と表示されてほしいので、年が同じである条件をまとめるならばそれより先に『昨日』の判定を書くことになります。

しかし個人的には、メッセージの投稿日時が
『今日』かどうか →『昨日』かどうか →『今年』かどうか
と順に遡りつつ判定していく構造を保った方が整理された実装に見えるような気がします…。どうでしょうか?

Copy link
Member

Choose a reason for hiding this comment

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

↑のコードの想定でした
todayとyesterday混同しててもう少し単純なコードになると勘違いしてました🙏

それを踏まえても個人的にはtodayの比較とyesterdayの比較が交互に来るよりもyesterdayの比較→todayの比較の順に比較できる↑の実装が見やすいと感じますが、さっきの文字列で比較しないで欲しいという指摘ほど強い思いはないので任せます

Copy link
Member

Choose a reason for hiding this comment

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

や、共通化のことだけを考えてたんですが拡張性が低くなるのでやっぱり現在に近い順に記述するままでいいです🙇🙇🙇

Copy link
Contributor Author

Choose a reason for hiding this comment

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

了解です。レビューありがとうございます!

Copy link
Member

@ras0q ras0q left a comment

Choose a reason for hiding this comment

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

optionalなコメント残しましたが全体的な処理は良さそうです👍

@kitsne241 kitsne241 merged commit 43f1d5d into master Jul 22, 2024
9 checks passed
@kitsne241 kitsne241 deleted the show_full_date_of_message branch July 22, 2024 09:45
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.

4 participants