Added timestamp display to image_viewer

Author: alanpoon

src/home/room_screen.rs

@@ -667,7 +667,6 @@ impl Widget for RoomScreen {
                     let texture = content_message.get_texture(cx);
                     let mut avatar_ref = wr.avatar(ids!(profile.avatar));
                     let mut display_name = wr.label(ids!(content.username_view.username)).text();
-                    let timestamp = wr.label(ids!(profile.timestamp)).text();
 
                     // If display_name is empty, look for a non-empty display_name and its avatar in previous items
                     if display_name.is_empty() {
@@ -680,7 +679,6 @@ impl Widget for RoomScreen {
                         std::rc::Rc::new(texture),
                         avatar_ref,
                         display_name,
-                        timestamp,
                         index,
                     );
                     continue;
@@ -1597,21 +1595,20 @@ impl RoomScreen {
         texture: std::rc::Rc<Option<Texture>>,
         avatar_ref: AvatarRef,
         display_name: String,
-        timestamp: String,
         index: usize,
     ) {
         let Some(mxc_uri_string) = mxc_uri else { return; };
         let Some(tl_state) = &mut self.tl_state else { return; };
         let Some(item) = tl_state.items.get(index) else { return; };
         let Some(event_tl_item) = item.as_event() else { return; };        
-        
+        let timestamp_millis = event_tl_item.timestamp();
         let (image_name, image_size) = extract_image_info(event_tl_item);
 
         cx.action(ImageViewerAction::Show(LoadState::Loading(texture.clone(), Some(MetaData{
             sender: display_name,
             image_name,
             image_size,
-            timestamp,
+            timestamp:  unix_time_millis_to_datetime(timestamp_millis),
             avatar_ref
         }))));
 

src/shared/image_viewer.rs

@@ -4,14 +4,15 @@
 //! ImageViewerRef has 4 public methods, `configure_zoom`, `display_using_background_thread`, `display_using_texture` and `reset`.
 use std::sync::{mpsc::Receiver, Arc};
 
+use chrono::{DateTime, Local};
 use makepad_widgets::{
     event::TouchUpdateEvent,
     image_cache::{ImageBuffer, ImageError},
     rotated_image::RotatedImageWidgetExt,
     *,
 };
 
-use crate::shared::avatar::{AvatarRef, AvatarWidgetRefExt};
+use crate::shared::{avatar::{AvatarRef, AvatarWidgetRefExt}, timestamp::TimestampWidgetRefExt};
 
 /// Loads the given image `data` into an `ImageBuffer` as either a PNG or JPEG, using the `imghdr` library to determine which format it is.
 ///
@@ -925,7 +926,13 @@ impl ImageViewer {
         let display_text = format!("{} ({})", truncated_name, human_readable_size);
         meta_view.label(ids!(image_name_and_size))
             .set_text(cx, &display_text);
+        if let Some(timestamp) = metadata.timestamp {
+            meta_view.view(ids!(top_left_container.content.timestamp_view)).set_visible(cx, true);
+            meta_view.timestamp(ids!(top_left_container.content.timestamp_view.timestamp)).set_date_time(cx, timestamp);
+        }
+
         meta_view.label(ids!(top_left_container.content.username)).set_text(cx, &metadata.sender);
+        
         metadata.avatar_ref.copy_content_to(cx, &mut meta_view.avatar(ids!(top_left_container.avatar)));
     }
 }
@@ -1013,7 +1020,7 @@ pub enum LoadState {
 pub struct MetaData {
     pub avatar_ref: AvatarRef,
     pub sender: String,
-    pub timestamp: String,
+    pub timestamp: Option<DateTime<Local>>,
     pub image_name: String,
     pub image_size: i32,
 }