File preview updates

[FSM1]

closes #1909

---

Submission checklist:

Layout

• Change looks good in the desktop web ui
• Change looks good in the mobile web ui

Theme

• Components / elements inspected in light mode
• Components / elements inspected in dark mode

[render]

Your Render PR Server URL is https://chainsafe-components-stage-pr-1960.onrender.com.

Follow its progress at https://dashboard.render.com/static/srv-c89lj6d0mal3pbpk2770.

[render]

Your Render PR Server URL is https://storage-ui-stage-pr-1960.onrender.com.

Follow its progress at https://dashboard.render.com/static/srv-c89lj6t0mal3pbpk27bg.

[render]

Your Render PR Server URL is https://files-ui-stage-pr-1960.onrender.com.

Follow its progress at https://dashboard.render.com/static/srv-c89lj7d0mal3pbpk27o0.

[lgtm-com]

This pull request introduces 1 alert when merging c7f11e4 into f645120 - view on LGTM.com

new alerts:

• 1 for Unused variable, import, function or class

[lgtm-com]

This pull request introduces 1 alert when merging c7d3bb8 into f645120 - view on LGTM.com

new alerts:

• 1 for Unused variable, import, function or class

[Tbaut]

I've had some small issues with the "active" state of buttons.
like below on the "go back to overall view" button

Or the next button

next.mp4

[FSM1]

I've had some small issues with the "active" state of buttons. like below on the "go back to overall view" button

Or the next button

next.mp4

Yeah the active state does mess things up, but this is out of the scope of this issue. The problem should be resolved in the button component in my mind.

[Tbaut]

yeah the problem I mentioned are all on the active state of buttons, both the arrow and the "back to overall view"

[tanmoyAtb]

All previews seem to be working great,

Only for html files, I found the zoom buttons on top right appearing behind,
Here's a preview -

[FSM1]

All previews seem to be working great,

Only for html files, I found the zoom buttons on top right appearing behind, Here's a preview -

ahhh whoops, I may have completely forgotten to look at the text file renderer. let me check that out again. will ping you when I have tested that

[FSM1]

All previews seem to be working great,
Only for html files, I found the zoom buttons on top right appearing behind, Here's a preview -

ahhh whoops, I may have completely forgotten to look at the text file renderer. let me check that out again. will ping you when I have tested that

Fixed in the latest commit. Great catch @tanmoyAtb.

[asnaith]

Looking good for the most part on the files I tested but I did find a few issues (1 of which is pre-existing though so I've logged a separate issue for it).

1. One issue that is an introduction is the text size options on mobile - they're not working as intended. It looks like we don't show the increase/decrease options on our current release so perhaps the fix is just to omit them from being displayed on mobile?

Video:

RPReplay_Final1645561086.MP4

2. Another introduction is specific to iOS. When I opened an .mp4 and then tried to close the preview modal it would show me empty video controls from the OS instead of the drive page. I recorded a video of the actual interaction because it's easier to see rather than on a screen recording. It doesn't do this on iOS with the current stage / prod builds.

Video:

video-preview-issue-ios.mov

[FSM1]

1. One issue that is an introduction is the text size options on mobile - they're not working as intended. It looks like we don't show the increase/decrease options on our current release so perhaps the fix is just to omit them from being displayed on mobile?

Resolved this. Great catch.

2. Another introduction is specific to iOS. When I opened an .mp4 and then tried to close the preview modal it would show me empty video controls from the OS instead of the drive page. I recorded a video of the actual interaction because it's easier to see rather than on a screen recording. It doesn't do this on iOS with the current stage / prod builds.

The video uploaded does not seem to be showing anything. Which browser were you using on iOS when testing this? There were no changes made to the video preview so I am not too sure why the behavior would be any different.

[tanmoyAtb]

Working great on all formats I could think of.

[asnaith]

As we discussed in planning, I've created a separate issue for the iOS / Safari video issue #1970.

Everything else looks good.