Attachment upload with file dialog

Cargo.toml

@@ -44,10 +44,12 @@ hashbrown = { version = "0.16", features = ["raw-entry"] }
 htmlize = "1.0.5"
 indexmap = "2.6.0"
 imghdr = "0.7.0"
+image = { version = "0.25", default-features = false, features = ["jpeg", "png"] }
 linkify = "0.10.0"
 matrix-sdk-base = { git = "https://github.com/matrix-org/matrix-rust-sdk", branch = "main" }
 matrix-sdk = { git = "https://github.com/matrix-org/matrix-rust-sdk", branch = "main", default-features = false, features = [ "e2e-encryption", "automatic-room-key-forwarding", "markdown", "sqlite", "rustls-tls", "bundled-sqlite", "sso-login" ] }
 matrix-sdk-ui = { git = "https://github.com/matrix-org/matrix-rust-sdk", branch = "main", default-features = false, features = [ "rustls-tls" ] }
+mime_guess = "2.0.5"
 ## Use the same ruma version as what's specified in matrix-sdk's Cargo.toml.
 ## Enable a few extra features:
 ## * "compat-optional" feature to allow missing body field in m.room.tombstone event.
@@ -64,7 +66,7 @@ tokio = { version = "1.43.1", features = ["macros", "rt-multi-thread"] }
 tracing-subscriber = "0.3.17"
 unicode-segmentation = "1.11.0"
 url = "2.5.0"
-
+rfd = { version = "0.15.3", features = ["ashpd", "urlencoding", "xdg-portal"] }
 
 ## Dependencies for TSP support.
 ## Commit "f0bc4625dcd729e07e4a36257df2f1d94c81cef4" is the most recent one without the invalid change to pin serde to 1.0.219.
@@ -270,4 +272,4 @@ doc_overindented_list_items = "allow"
 module_name_repetitions = "allow"
 too_many_arguments = "allow"
 uninlined_format_args = "allow"
-used_underscore_binding = "allow"
+used_underscore_binding = "allow"

src/app.rs

@@ -14,7 +14,7 @@ use crate::{
     }, login::login_screen::LoginAction, logout::logout_confirm_modal::{LogoutAction, LogoutConfirmModalAction, LogoutConfirmModalWidgetRefExt}, persistence, profile::user_profile_cache::clear_user_profile_cache, room::BasicRoomDetails, shared::{callout_tooltip::{
         CalloutTooltipWidgetRefExt,
         TooltipAction,
-    }, confirmation_modal::{ConfirmationModalContent, ConfirmationModalWidgetRefExt}, image_viewer::{ImageViewerAction, LoadState}, popup_list::{PopupKind, enqueue_popup_notification}}, sliding_sync::{DirectMessageRoomAction, MatrixRequest, current_user_id, submit_async_request}, utils::RoomNameId, verification::VerificationAction, verification_modal::{
+    }, confirmation_modal::{ConfirmationModalContent, ConfirmationModalWidgetRefExt}, file_upload_modal::FilePreviewerAction, image_viewer::{ImageViewerAction, LoadState}, popup_list::{PopupKind, enqueue_popup_notification}}, sliding_sync::{DirectMessageRoomAction, MatrixRequest, current_user_id, submit_async_request}, utils::RoomNameId, verification::VerificationAction, verification_modal::{
         VerificationModalAction,
         VerificationModalWidgetRefExt,
     }
@@ -39,6 +39,7 @@ live_design! {
     use crate::home::event_source_modal::EventSourceModal;
     use crate::shared::callout_tooltip::CalloutTooltip;
     use crate::shared::image_viewer::ImageViewer;
+    use crate::shared::file_upload_modal::FileUploadModal;
     use link::tsp_link::TspVerificationModal;
 
 
@@ -101,6 +102,13 @@ live_design! {
                                 image_viewer_modal_inner = <ImageViewer> {}
                             }
                         }
+                        file_upload_modal = <Modal> {
+                            content: {
+                                height: Fill, width: Fill,
+                                align: {x: 0.5, y: 0.5},
+                                file_upload_modal_inner = <FileUploadModal> {}
+                            }
+                        }
 
                         // Context menus should be shown in front of other UI elements,
                         // but behind verification modals.
@@ -508,6 +516,17 @@ impl MatchEvent for App {
                 }
                 _ => {}
             }
+            match action.downcast_ref() {
+                Some(FilePreviewerAction::Show(_)) => {
+                    self.ui.modal(ids!(file_upload_modal)).open(cx);
+                    continue;
+                }
+                Some(FilePreviewerAction::Hide) => {
+                    self.ui.modal(ids!(file_upload_modal)).close(cx);
+                    continue;
+                }
+                _ => {}
+            }
             // Handle actions to open/close the TSP verification modal.
             #[cfg(feature = "tsp")] {
                 use std::ops::Deref;

src/home/mod.rs

@@ -29,6 +29,8 @@ pub mod new_message_context_menu;
 pub mod room_context_menu;
 pub mod link_preview;
 pub mod room_image_viewer;
+pub mod thumbnail_loading;
+pub mod upload_progress;
 
 pub fn live_design(cx: &mut Cx) {
     search_messages::live_design(cx);
@@ -59,4 +61,6 @@ pub fn live_design(cx: &mut Cx) {
     light_themed_dock::live_design(cx);
     event_reaction_list::live_design(cx);
     link_preview::live_design(cx);
+    thumbnail_loading::live_design(cx);
+    upload_progress::live_design(cx);
 }

src/home/room_screen.rs

@@ -957,6 +957,7 @@ impl Widget for RoomScreen {
                     timeline_kind: tl.kind.clone(),
                     room_members,
                     room_avatar_url,
+                    timeline_update_sender: Some(tl.update_sender.clone()),
                 }
             } else if let Some(room_name) = &self.room_name_id {
                 // Fallback case: we have a room_name but no tl_state yet
@@ -967,6 +968,7 @@ impl Widget for RoomScreen {
                         .expect("BUG: room_name_id was set but timeline_kind was missing"),
                     room_members: None,
                     room_avatar_url: None,
+                    timeline_update_sender: None,
                 }
             } else {
                 // No room selected yet, skip event handling that requires room context
@@ -982,6 +984,7 @@ impl Widget for RoomScreen {
                     timeline_kind: TimelineKind::MainRoom { room_id },
                     room_members: None,
                     room_avatar_url: None,
+                    timeline_update_sender: None,
                 }
             };
             let mut room_scope = Scope::with_props(&room_props);
@@ -1617,6 +1620,28 @@ impl RoomScreen {
                     tl.tombstone_info = Some(successor_room_details);
                 }
                 TimelineUpdate::LinkPreviewFetched => {}
+                TimelineUpdate::FileUploadConfirmed(file_data) => {
+                    // Handle file upload confirmation from the file upload modal.
+                    // This ensures the upload is associated with the correct timeline.
+                    let room_input_bar = self.view.room_input_bar(ids!(room_input_bar));
+                    if let Some(replied_to) = room_input_bar.handle_file_upload_confirmed(cx) {
+                        submit_async_request(MatrixRequest::SendAttachment {
+                            timeline_kind: tl.kind.clone(),
+                            file_data,
+                            replied_to,
+                            #[cfg(feature = "tsp")]
+                            sign_with_tsp: room_input_bar.is_tsp_signing_enabled(cx),
+                        });
+                    }
+                }
+                TimelineUpdate::FileUploadUpdate { current, total } => {
+                    let room_input_bar = self.view.room_input_bar(ids!(room_input_bar));
+                    room_input_bar.set_progress_value(cx, current, total);
+                }
+                TimelineUpdate::FileUploadAbortHandle(handle) => {
+                    let room_input_bar = self.view.room_input_bar(ids!(room_input_bar));
+                    room_input_bar.set_abort_handle(handle);
+                }
             }
         }
 
@@ -2274,6 +2299,7 @@ impl RoomScreen {
                 content_drawn_since_last_update: RangeSet::new(),
                 profile_drawn_since_last_update: RangeSet::new(),
                 update_receiver,
+                update_sender: update_sender.clone(),
                 request_sender,
                 media_cache: MediaCache::new(Some(update_sender.clone())),
                 link_preview_cache: LinkPreviewCache::new(Some(update_sender)),
@@ -2631,6 +2657,10 @@ pub struct RoomScreenProps {
     pub timeline_kind: TimelineKind,
     pub room_members: Option<Arc<Vec<RoomMember>>>,
     pub room_avatar_url: Option<OwnedMxcUri>,
+    /// The sender for timeline updates, used for operations like file uploads
+    /// that need to notify this specific timeline.
+    /// This is `None` in fallback cases where the timeline state isn't fully loaded yet.
+    pub timeline_update_sender: Option<crossbeam_channel::Sender<TimelineUpdate>>,
 }
 
 
@@ -2759,6 +2789,17 @@ pub enum TimelineUpdate {
     Tombstoned(SuccessorRoomDetails),
     /// A notice that link preview data for a URL has been fetched and is now available.
     LinkPreviewFetched,
+    /// A file upload was confirmed from the file upload modal.
+    FileUploadConfirmed(crate::shared::file_upload_modal::FileData),
+    /// An update on the progress of a file upload that is currently in-flight.
+    FileUploadUpdate {
+        /// Current progress value (e.g., bytes uploaded).
+        current: u64,
+        /// Total value to reach (e.g., total file size in bytes).
+        total: u64,
+    },
+    /// A notice that a file upload in this timeline was aborted.
+    FileUploadAbortHandle(tokio::task::AbortHandle),
 }
 
 thread_local! {
@@ -2820,6 +2861,10 @@ struct TimelineUiState {
     /// which is okay because a sender on an unbounded channel never needs to block.
     update_receiver: crossbeam_channel::Receiver<TimelineUpdate>,
 
+    /// The channel sender for timeline updates for this room.
+    /// This is passed to child widgets that need to send updates to this timeline.
+    update_sender: crossbeam_channel::Sender<TimelineUpdate>,
+
     /// The sender for timeline requests from a RoomScreen showing this room
     /// to the background async task that handles this room's timeline updates.
     request_sender: TimelineRequestSender,

src/home/thumbnail_loading.rs

@@ -0,0 +1,40 @@
+//! A simple loading view displayed while generating thumbnails for file uploads.
+
+use makepad_widgets::*;
+
+live_design! {
+    use link::theme::*;
+    use link::shaders::*;
+    use link::widgets::*;
+    use crate::shared::styles::*;
+
+    // A view that displays a loading spinner and text while generating thumbnails.
+    pub ThumbnailLoadingView = <View> {
+        visible: false,
+        width: Fill,
+        height: Fit,
+        padding: {top: 8, bottom: 8, left: 10, right: 10}
+        flow: Right,
+        spacing: 10,
+        align: {y: 0.5}
+
+        loading_spinner = <LoadingSpinner> {
+            width: 25,
+            height: 25,
+            draw_bg: {
+                color: (COLOR_ACTIVE_PRIMARY)
+                border_size: 3.0,
+            }
+        }
+
+        loading_text = <Label> {
+            width: Fit,
+            height: Fit,
+            draw_text: {
+                text_style: <REGULAR_TEXT>{font_size: 11},
+                color: #666
+            }
+            text: "Generating thumbnail..."
+        }
+    }
+}