diff --git a/lib/model/content.dart b/lib/model/content.dart
index c22970a1aa..dd29341c0a 100644
--- a/lib/model/content.dart
+++ b/lib/model/content.dart
@@ -1,4 +1,5 @@
import 'package:flutter/foundation.dart';
+import 'package:flutter/rendering.dart';
import 'package:html/dom.dart' as dom;
import 'package:html/parser.dart';
@@ -533,6 +534,28 @@ class MathInlineNode extends InlineContentNode {
}
}
+class GlobalTimeNode extends InlineContentNode {
+ const GlobalTimeNode({super.debugHtmlNode, required this.datetime});
+
+ // `datetime` is always in UTC, this is enforced
+ // in [parseInlineContent].
+ final DateTime datetime;
+
+ @override
+ bool operator ==(Object other) {
+ return other is GlobalTimeNode && other.datetime == datetime;
+ }
+
+ @override
+ int get hashCode => Object.hash('GlobalTimeNode', datetime);
+
+ @override
+ void debugFillProperties(DiagnosticPropertiesBuilder properties) {
+ super.debugFillProperties(properties);
+ properties.add(DiagnosticsProperty('datetime', datetime));
+ }
+}
+
////////////////////////////////////////////////////////////////
// Ported from https://github.com/zulip/zulip-mobile/blob/c979530d6804db33310ed7d14a4ac62017432944/src/emoji/data.js#L108-L112
@@ -717,6 +740,21 @@ class _ZulipContentParser {
return ImageEmojiNode(src: src, alt: alt, debugHtmlNode: debugHtmlNode);
}
+ if (localName == 'time' && classes.isEmpty) {
+ final attr = element.attributes['datetime'];
+ if (attr == null) return unimplemented();
+ try {
+ // This attribute is always in ISO 8601 format with a Z suffix;
+ // see `Timestamp` in zulip:zerver/lib/markdown/__init__.py .
+ final datetime = DateTime.parse(attr);
+ if (!datetime.isUtc) return unimplemented();
+
+ return GlobalTimeNode(datetime: datetime, debugHtmlNode: debugHtmlNode);
+ } on FormatException {
+ return unimplemented();
+ }
+ }
+
if (localName == 'span'
&& classes.length == 1
&& classes.contains('katex')) {
diff --git a/lib/widgets/content.dart b/lib/widgets/content.dart
index 1954b3931f..dfe7845273 100644
--- a/lib/widgets/content.dart
+++ b/lib/widgets/content.dart
@@ -2,6 +2,7 @@ import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:html/dom.dart' as dom;
+import 'package:intl/intl.dart';
import '../api/core.dart';
import '../api/model/model.dart';
@@ -11,6 +12,7 @@ import '../model/internal_link.dart';
import '../model/store.dart';
import 'code_block.dart';
import 'dialog.dart';
+import 'icons.dart';
import 'lightbox.dart';
import 'message_list.dart';
import 'store.dart';
@@ -523,6 +525,9 @@ class _InlineContentBuilder {
} else if (node is MathInlineNode) {
return TextSpan(style: _kInlineMathStyle,
children: [TextSpan(text: node.texSource)]);
+ } else if (node is GlobalTimeNode) {
+ return WidgetSpan(alignment: PlaceholderAlignment.middle,
+ child: GlobalTime(node: node));
} else if (node is UnimplementedInlineContentNode) {
return _errorUnimplemented(node);
} else {
@@ -681,6 +686,38 @@ class UserMention extends StatelessWidget {
// borderRadius: BorderRadius.all(Radius.circular(3))));
}
+class GlobalTime extends StatelessWidget {
+ const GlobalTime({super.key, required this.node});
+
+ final GlobalTimeNode node;
+
+ static final _backgroundColor = const HSLColor.fromAHSL(1, 0, 0, 0.93).toColor();
+ static final _borderColor = const HSLColor.fromAHSL(1, 0, 0, 0.8).toColor();
+ static final _dateFormat = DateFormat('EEE, MMM d, y, h:mm a'); // TODO(intl): localize date
+
+ @override
+ Widget build(BuildContext context) {
+ final text = _dateFormat.format(node.datetime.toLocal());
+ return Padding(
+ padding: const EdgeInsets.symmetric(horizontal: 2),
+ child: DecoratedBox(
+ decoration: BoxDecoration(
+ color: _backgroundColor,
+ border: Border.all(width: 1, color: _borderColor),
+ borderRadius: BorderRadius.circular(3)),
+ child: Padding(
+ padding: const EdgeInsets.symmetric(horizontal: 2.8),
+ child: Row(
+ mainAxisSize: MainAxisSize.min,
+ children: [
+ const Icon(ZulipIcons.clock, size: 14),
+ Text(text, style: Paragraph.getTextStyle(context)),
+ ]
+ ))),
+ );
+ }
+}
+
class MessageImageEmoji extends StatelessWidget {
const MessageImageEmoji({super.key, required this.node});
diff --git a/test/model/content_test.dart b/test/model/content_test.dart
index 87c6c182e6..b1fb5b5607 100644
--- a/test/model/content_test.dart
+++ b/test/model/content_test.dart
@@ -176,6 +176,33 @@ void main() {
'λ
',
const MathInlineNode(texSource: r'\lambda'));
+ group('global times', () {
+ final datetime = DateTime.parse('2024-01-30T17:33Z');
+ testParseInline('smoke',
+ // ""
+ '',
+ GlobalTimeNode(datetime: datetime),
+ );
+
+ testParseInline('handles missing attribute',
+ // No markdown, this is unexpected response
+ '',
+ inlineUnimplemented(''),
+ );
+
+ testParseInline('handles DateTime.parse failure',
+ // No markdown, this is unexpected response
+ '',
+ inlineUnimplemented(''),
+ );
+
+ testParseInline('handles unexpected timezone',
+ // No markdown, this is unexpected response
+ '',
+ inlineUnimplemented(''),
+ );
+ });
+
//
// Block content.
//
diff --git a/test/widgets/content_test.dart b/test/widgets/content_test.dart
index 645d07155e..b1bc77512e 100644
--- a/test/widgets/content_test.dart
+++ b/test/widgets/content_test.dart
@@ -93,6 +93,17 @@ void main() {
tester.widget(find.text(r'\lambda'));
});
+ testWidgets('GlobalTime smoke', (tester) async {
+ // ""
+ await tester.pumpWidget(MaterialApp(home: BlockContentList(nodes: parseContent(
+ ''
+ ).nodes)));
+ // The time is shown in the user's timezone and the result will depend on
+ // the timezone of the environment running this test. Accept here a wide
+ // range of times.
+ tester.widget(find.textContaining(RegExp(r'^Tue, Jan 30, 2024, \d+:\d\d [AP]M$')));
+ });
+
Future tapText(WidgetTester tester, Finder textFinder) async {
final height = tester.getSize(textFinder).height;
final target = tester.getTopLeft(textFinder)