Skip to content

Commit

Permalink
Update x-ago timestamps on page load. (#7166)
Browse files Browse the repository at this point in the history
  • Loading branch information
@isoos
isoos authored Nov 6, 2023
1 parent 84e3e21 commit 4125694
Show file tree
Hide file tree
Showing 49 changed files with 163 additions and 122 deletions.
4 changes: 3 additions & 1 deletion app/lib/frontend/dom/dom.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,11 @@

import 'dart:convert';

import 'package:_pub_shared/format/x_ago_format.dart';
import 'package:clock/clock.dart';

import '../../shared/markdown.dart';
import '../../shared/utils.dart' show formatXAgo, shortDateFormat;
import '../../shared/utils.dart' show shortDateFormat;

final _attributeEscape = HtmlEscape(HtmlEscapeMode.attribute);
final _attributeRegExp = RegExp(r'^[a-z](?:[a-z0-9\-\_]*[a-z0-9]+)?$');
Expand Down Expand Up @@ -108,6 +109,7 @@ Node xAgoTimestamp(DateTime timestamp, {String? datePrefix}) {
attributes: {
'aria-label': 'Switch between date and elapsed time.',
'aria-role': 'button',
'data-timestamp': timestamp.millisecondsSinceEpoch.toString(),
},
text: formatXAgo(clock.now().difference(timestamp)),
);
Expand Down
2 changes: 1 addition & 1 deletion app/lib/frontend/templates/views/pkg/package_list.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
// for details. All rights reserved. Use of this source code is governed by a
// BSD-style license that can be found in the LICENSE file.

import 'package:_pub_shared/format/x_ago_format.dart';
import 'package:_pub_shared/search/search_form.dart';
import 'package:_pub_shared/search/tags.dart';
import 'package:clock/clock.dart';
Expand All @@ -11,7 +12,6 @@ import '../../../../package/models.dart';
import '../../../../package/screenshots/backend.dart';
import '../../../../search/search_service.dart';
import '../../../../shared/urls.dart' as urls;
import '../../../../shared/utils.dart' show formatXAgo;
import '../../../dom/dom.dart' as d;

import '../../../static_files.dart' show staticUrls;
Expand Down
22 changes: 0 additions & 22 deletions app/lib/shared/utils.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,28 +38,6 @@ final DateFormat shortDateFormat = DateFormat.yMMMd();
final jsonUtf8Encoder = JsonUtf8Encoder();
final utf8JsonDecoder = utf8.decoder.fuse(json.decoder);

/// Formats an [age] duration with `<amount> <unit> ago` or `in the last hour`.
String formatXAgo(Duration age) {
if (age.inDays > 365 * 2) {
final years = age.inDays ~/ 365;
return '$years years ago';
}
if (age.inDays > 30 * 2) {
final months = age.inDays ~/ 30;
return '$months months ago';
}
if (age.inDays > 1) {
return '${age.inDays} days ago';
}
if (age.inHours > 1) {
return '${age.inHours} hours ago';
}
if (age.inHours == 1) {
return '${age.inHours} hour ago';
}
return 'in the last hour';
}

Future<T> withTempDirectory<T>(Future<T> Function(Directory dir) func,
{String prefix = 'dart-tempdir'}) {
return Directory.systemTemp.createTemp(prefix).then((Directory dir) {
Expand Down
18 changes: 9 additions & 9 deletions app/test/frontend/golden/my_activity_log_page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ <h1 class="title">admin</h1>
<p>admin@pub.dev</p>
<p>
Joined
<a class="-x-ago" href="" title="on %%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="on %%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</p>
</div>
</div>
Expand Down Expand Up @@ -186,7 +186,7 @@ <h1 class="title">admin</h1>
<tbody>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -204,7 +204,7 @@ <h1 class="title">admin</h1>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -222,7 +222,7 @@ <h1 class="title">admin</h1>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -240,7 +240,7 @@ <h1 class="title">admin</h1>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -258,7 +258,7 @@ <h1 class="title">admin</h1>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -276,7 +276,7 @@ <h1 class="title">admin</h1>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -294,7 +294,7 @@ <h1 class="title">admin</h1>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -312,7 +312,7 @@ <h1 class="title">admin</h1>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand Down
6 changes: 3 additions & 3 deletions app/test/frontend/golden/my_liked_packages.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -148,7 +148,7 @@ <h1 class="title">user</h1>
<p>user@pub.dev</p>
<p>
Joined
<a class="-x-ago" href="" title="on %%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="on %%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</p>
</div>
</div>
Expand Down Expand Up @@ -193,7 +193,7 @@ <h3 class="packages-title">
</div>
<p class="packages-metadata">
Liked
<a class="-x-ago" href="" title="on %%liked1-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="on %%liked1-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</p>
</div>
<div class="packages-item">
Expand All @@ -211,7 +211,7 @@ <h3 class="packages-title">
</div>
<p class="packages-metadata">
Liked
<a class="-x-ago" href="" title="on %%liked1-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="on %%liked1-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</p>
</div>
</div>
Expand Down
8 changes: 4 additions & 4 deletions app/test/frontend/golden/my_packages.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ <h1 class="title">user</h1>
<p>user@pub.dev</p>
<p>
Joined
<a class="-x-ago" href="" title="on %%oxygen-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="on %%oxygen-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</p>
</div>
</div>
Expand Down Expand Up @@ -226,11 +226,11 @@ <h3 class="packages-title">
v
<a href="/packages/oxygen">1.2.0</a>
(
<a class="-x-ago" href="" title="%%oxygen-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%oxygen-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
) /
<a href="/packages/oxygen/versions/2.0.0-dev">2.0.0-dev</a>
(
<a class="-x-ago" href="" title="%%oxygen-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%oxygen-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
)
</span>
<span class="packages-metadata-block">
Expand Down Expand Up @@ -302,7 +302,7 @@ <h3 class="packages-title">
v
<a href="/packages/neon">1.0.0</a>
(
<a class="-x-ago" href="" title="%%oxygen-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%oxygen-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
)
</span>
<span class="packages-metadata-block">
Expand Down
4 changes: 2 additions & 2 deletions app/test/frontend/golden/my_publishers.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ <h1 class="title">user</h1>
<p>user@pub.dev</p>
<p>
Joined
<a class="-x-ago" href="" title="on %%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="on %%user-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</p>
</div>
</div>
Expand Down Expand Up @@ -182,7 +182,7 @@ <h3 class="publishers-item-title">
</h3>
<p>
Registered
<a class="-x-ago" href="" title="on %%publisher-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="on %%publisher-created-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
.
</p>
</div>
Expand Down
12 changes: 6 additions & 6 deletions app/test/frontend/golden/pkg_activity_log_page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -154,7 +154,7 @@ <h1 class="title">
<div class="metadata">
Published
<span>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</span>
• Latest:
<span>
Expand Down Expand Up @@ -257,7 +257,7 @@ <h3 class="detail-lead-title">Metadata</h3>
<tbody>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -271,7 +271,7 @@ <h3 class="detail-lead-title">Metadata</h3>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -289,7 +289,7 @@ <h3 class="detail-lead-title">Metadata</h3>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -307,7 +307,7 @@ <h3 class="detail-lead-title">Metadata</h3>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand All @@ -325,7 +325,7 @@ <h3 class="detail-lead-title">Metadata</h3>
</tr>
<tr>
<td class="date">
<a class="-x-ago" href="" title="%%activity-4-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%activity-4-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</td>
<td class="summary">
<div class="markdown-body">
Expand Down
2 changes: 1 addition & 1 deletion app/test/frontend/golden/pkg_admin_page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -154,7 +154,7 @@ <h1 class="title">
<div class="metadata">
Published
<span>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</span>
• Latest:
<span>
Expand Down
2 changes: 1 addition & 1 deletion app/test/frontend/golden/pkg_changelog_page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,7 @@ <h1 class="title">
<div class="metadata">
Published
<span>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</span>
• Latest:
<span>
Expand Down
2 changes: 1 addition & 1 deletion app/test/frontend/golden/pkg_example_page.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,7 @@ <h1 class="title">
<div class="metadata">
Published
<span>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button">%%x-ago%%</a>
<a class="-x-ago" href="" title="%%published-date%%" aria-label="Switch between date and elapsed time." aria-role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
</span>
• Latest:
<span>
Expand Down
Loading

0 comments on commit 4125694

Please sign in to comment.