OneDrive / samples

Contains samples, scenarios, and guidance for integrating with OneDrive and SharePoint drives, drive items, and files.
MIT License
49 stars 48 forks source link

File Browser: Mobile support? #72

Open ottD opened 3 months ago

ottD commented 3 months ago

Is your feature request related to a problem? Please describe. I've been using the FileBrowser component and find it frustrating that there does not seem to be a documented way to configure a mobile view. There is nothing in the documented Browser Configuration object.

Describe the solution you'd like I'd like to know whether and how the FileBrowser can be rendered for a mobile device. Either by passing an additional parameter in the Browser Configuration options or through an additional query string parameter. The native Teams file list renders differently on a mobile device compared to a non-mobile device and I'd like to replicate the same behaviour for my own app that uses the FileBrowser component.

FileBrowser on mobile device:

mobile

FileBrowser on non-mobile device:

desktop

Describe alternatives you've considered As an alternative, we have enabled a tiled list layout as default for mobile devices but this is not ideal from a UX/UI point of view and it'd be better to show the mobile view of the FileBrowser.

Screenshot_20240327-115532

Additional context The code samples and File Browser documentation do not show how to render the FileBrowser for mobile devices. Can the documentation or samples be updated to cover this scenario?

JCrew0 commented 3 months ago

@ottD File Browser should work properly on mobile without any additional configuration.

That being said, Teams Mobile actually uses their own version of the File Browser because of some auth issues that they encountered awhile back. They will likely switch over to File Browser at some point in the future though.

What issues are you seeing on mobile when trying to use the file browser? It sounds like there's something wrong when you're not in the tiles view?

ottD commented 3 months ago

@JCrew0 Thanks for your quick response. Much appreciated. We are building a Teams tab application that uses the FileBrowser and were just wondering how we can make it look more like the Teams native file browser on mobile but we weren't aware that Teams Mobile uses a different file browser component so thanks for clarifying that 👍

The FileBrowser generally works fine on mobile, we just felt that defaulting to tiles view on mobile makes it more user and touch-friendly but the list view works OK as well. The only (minor) issue we have encountered so far is when configuring the FileBrowser to use the Recent view. As you can see in the below screenshot, long path and file names are cut off and require the user to scroll to the right to read the file names while there is plenty of empty space on the left.

Screenshot_20240402-093852