Render current day formats in the client timezone (#21878)

* Fix remaining plain %time to %time.formatted

* Add %time.relative-formatted to client format dates on the current day

* Add missing comma dangle to formats

* Use client side message format instead of the server

* Add fallback message to relatve_format.today

* Remove unused translation key and fix js lint issue

Co-authored-by: Effy Elden <effy@effy.space>
This commit is contained in:
Francis Murillo 2022-12-15 15:35:25 +00:00 committed by GitHub
parent f0cebaee00
commit c50e9d078a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 46 additions and 17 deletions

View file

@ -461,6 +461,7 @@
"refresh": "Refresh",
"regeneration_indicator.label": "Loading…",
"regeneration_indicator.sublabel": "Your home feed is being prepared!",
"relative_format.today": "Today at {time}",
"relative_time.days": "{number}d",
"relative_time.full.days": "{number, plural, one {# day} other {# days}} ago",
"relative_time.full.hours": "{number, plural, one {# hour} other {# hours}} ago",

View file

@ -63,6 +63,18 @@ function main() {
minute: 'numeric',
});
const dateFormat = new Intl.DateTimeFormat(locale, {
year: 'numeric',
month: 'short',
day: 'numeric',
timeFormat: false,
});
const timeFormat = new Intl.DateTimeFormat(locale, {
timeStyle: 'short',
hour12: false,
});
[].forEach.call(document.querySelectorAll('.emojify'), (content) => {
content.innerHTML = emojify(content.innerHTML);
});
@ -75,6 +87,32 @@ function main() {
content.textContent = formattedDate;
});
const isToday = date => {
const today = new Date();
return date.getDate() === today.getDate() &&
date.getMonth() === today.getMonth() &&
date.getFullYear() === today.getFullYear();
};
const todayFormat = new IntlMessageFormat(messages['relative_format.today'] || 'Today at {time}', locale);
[].forEach.call(document.querySelectorAll('time.relative-formatted'), (content) => {
const datetime = new Date(content.getAttribute('datetime'));
let formattedContent;
if (isToday(datetime)) {
const formattedTime = timeFormat.format(datetime);
formattedContent = todayFormat.format({ time: formattedTime });
} else {
formattedContent = dateFormat.format(datetime);
}
content.title = formattedContent;
content.textContent = formattedContent;
});
[].forEach.call(document.querySelectorAll('time.time-ago'), (content) => {
const datetime = new Date(content.getAttribute('datetime'));
const now = new Date();

View file

@ -4,11 +4,8 @@
.report-notes__item__header
%span.username
= link_to report_note.account.username, admin_account_path(report_note.account_id)
%time{ datetime: report_note.created_at.iso8601, title: l(report_note.created_at) }
- if report_note.created_at.today?
= t('admin.report_notes.today_at', time: l(report_note.created_at, format: :time))
- else
= l report_note.created_at.to_date
%time.relative-formatted{ datetime: report_note.created_at }
= t('admin.report_notes.created_at')
.report-notes__item__content
= simple_format(h(report_note.content))

View file

@ -144,11 +144,8 @@
= link_to @report.account.username, admin_account_path(@report.account_id)
- else
= link_to @report.account.domain, admin_instance_path(@report.account.domain)
%time{ datetime: @report.created_at.iso8601, title: l(@report.created_at) }
- if @report.created_at.today?
= t('admin.report_notes.today_at', time: l(@report.created_at, format: :time))
- else
= l @report.created_at.to_date
%time.relative-formatted{ datetime: @report.created_at.iso8601 }
= t('admin.report_notes.created_at')
.report-notes__item__content
= simple_format(h(@report.comment))

View file

@ -110,11 +110,8 @@
.report-notes__item__header
%span.username
= link_to @appeal.account.username, can?(:show, @appeal.account) ? admin_account_path(@appeal.account_id) : short_account_url(@appeal.account)
%time{ datetime: @appeal.created_at.iso8601, title: l(@appeal.created_at) }
- if @appeal.created_at.today?
= t('admin.report_notes.today_at', time: l(@appeal.created_at, format: :time))
- else
= l @appeal.created_at.to_date
%time.relative-formatted{ datetime: @appeal.created_at.iso8601 }
= t('admin.report_notes.created_at')
.report-notes__item__content
= simple_format(h(@appeal.text))

View file

@ -26,6 +26,6 @@
- if featured_tag.last_status_at.nil?
= t('accounts.nothing_here')
- else
%time{ datetime: featured_tag.last_status_at.iso8601, title: l(featured_tag.last_status_at) }= l featured_tag.last_status_at
%time.formatted{ datetime: featured_tag.last_status_at.iso8601, title: l(featured_tag.last_status_at) }= l featured_tag.last_status_at
= table_link_to 'trash', t('filters.index.delete'), settings_featured_tag_path(featured_tag), method: :delete, data: { confirm: t('admin.accounts.are_you_sure') }
.trends__item__current= friendly_number_to_human featured_tag.statuses_count

View file

@ -563,7 +563,6 @@ en:
report_notes:
created_msg: Report note successfully created!
destroyed_msg: Report note successfully deleted!
today_at: Today at %{time}
reports:
account:
notes: