Show last event time in RoomDelegate

Also respect locale for message times

src/qml/Chat/Timeline/EventContent.qml

@@ -70,7 +70,7 @@ Row {
                       // time
                       "&nbsp;&nbsp;<font size=" + theme.fontSize.small +
                       "px color=" + theme.chat.message.date + ">" +
-                      Qt.formatDateTime(model.date, "hh:mm:ss") +
+                      Utils.formatTime(model.date) +
                       "</font>" +
                       // local echo icon
                       (model.is_local_echo ?

src/qml/SidePane/RoomDelegate.qml

@@ -15,7 +15,7 @@ HInteractiveRectangle {
         id: rowLayout
         x: sidePane.currentSpacing
         width: parent.width - sidePane.currentSpacing * 1.5
-        height: roomLabel.height + subtitleLabel.height +
+        height: roomName.height + subtitle.height +
                 sidePane.currentSpacing / 1.5
         spacing: sidePane.currentSpacing
 
@@ -28,8 +28,11 @@ HInteractiveRectangle {
         HColumnLayout {
             Layout.fillWidth: true
 
+            HRowLayout {
+                spacing: theme.spacing / 2
+
                 HLabel {
-                id: roomLabel
+                    id: roomName
                     color: theme.sidePane.room.name
                     text: model.display_name || "<i>Empty room</i>"
                     textFormat:
@@ -40,11 +43,38 @@ HInteractiveRectangle {
                     Layout.fillWidth: true
                 }
 
+                HLabel {
+                    readonly property var evDate:
+                        model.last_event ? model.last_event.date : null
+
+                    id: lastEventDate
+                    font.pixelSize: theme.fontSize.small
+                    color: theme.sidePane.room.lastEventDate
+
+                    text: ! evDate ?  "" :
+
+                          Utils.dateIsToday(evDate) ?
+                          Utils.formatTime(evDate, false) :  // no seconds
+
+                          Utils.dateIsYesterday(evDate) ? qsTr("Yesterday") :
+
+                          Qt.formatDate(evDate, "dd MMM") // e.g. "24 Nov"
+
+                    visible: Layout.maximumWidth > 0
+                    Layout.maximumWidth:
+                        text && roomDelegate.width >= 200 ? implicitWidth : 0
+                    Behavior on Layout.maximumWidth { HNumberAnimation {} }
+
+                }
+            }
+
             HRichLabel {
-                id: subtitleLabel
+                id: subtitle
                 color: theme.sidePane.room.subtitle
                 visible: Boolean(text)
                 textFormat: Text.StyledText
+                font.pixelSize: theme.fontSize.small
+                elide: Text.ElideRight
 
                 text: {
                     if (! model.last_event) { return "" }
@@ -61,10 +91,6 @@ HInteractiveRectangle {
                     ) + ": " + ev.inline_content
                 }
 
-
-                font.pixelSize: theme.fontSize.small
-                elide: Text.ElideRight
-
                 Layout.fillWidth: true
             }
         }

src/qml/utils.js

@@ -123,6 +123,38 @@ function minutesBetween(date1, date2) {
 }
 
 
+function dateIsDay(date, dayDate) {
+    return date.getDate() == dayDate.getDate() &&
+           date.getMonth() == dayDate.getMonth() &&
+           date.getFullYear() == dayDate.getFullYear()
+}
+
+
+function dateIsToday(date) {
+    return dateIsDay(date, new Date())
+}
+
+
+function dateIsYesterday(date) {
+    const yesterday = new Date()
+    yesterday.setDate(yesterday.getDate() - 1)
+    return dateIsDay(date, yesterday)
+}
+
+
+function formatTime(time, seconds=true) {
+    return Qt.formatTime(
+        time,
+
+        Qt.locale().timeFormat(
+            seconds ? Locale.LongFormat : Locale.NarrowFormat
+        ).replace(/\./g, ":").replace(/ t$/, "")
+        // en_DK.UTF-8 locale wrongfully gives "." separators;
+        // remove the timezone at the end
+    )
+}
+
+
 function getItem(array, mainKey, value) {
     for (let i = 0; i < array.length; i++) {
         if (array[i][mainKey] === value) { return array[i] }

src/themes/Default.qpl

@@ -50,6 +50,7 @@ colors:
 
     color brightText:  hsluv(0, 0, intensity * 100)
     color text:        hsluv(0, 0, intensity * 80)
+    color halfDimText: hsluv(0, 0, intensity * 70)
     color dimText:     hsluv(0, 0, intensity * 55)
     color dimmerText:  hsluv(0, 0, intensity * 30)
     color accentText:  hsluv(hue - 10, saturation * 2.25, 60)
@@ -162,6 +163,7 @@ sidePane:
         color background:    "transparent"
         color name:          colors.text
         color subtitle:      colors.dimText
+        color lastEventDate: colors.halfDimText
 
     settingsButton:
         color background: colors.inputBackground