Add open action for editors

[AlexAndBear]

Description

Related Issue

• Fixes [Web] Open file from within tab bar #11013

Motivation and Context

How Has This Been Tested?

• test environment:
• test case 1:
• test case 2:
• ...

Screenshots (if appropriate):

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)
• Technical debt
• Tests
• Documentation
• Maintenance (e.g. dependency updates or tooling)

Open tasks:

• ...

[update-docs]

Thanks for opening this pull request! The maintainers of this repository would appreciate it if you would create a changelog item based on your changes.

[AlexAndBear]

TBD:

• Fix for shares ✅
• Display disabled mode in tiles view ✅
• Make actionable in tiles view ✅
• Make work with external apps and preview app
• Fix as type any conversions ✅ ** known issue*
• Add documentation ✅
• Add tests

[kulmann]

Nice progress! I noticed some things:

• if I have the right sidebar open in the main window, the embed mode in the modal starts with visible right sidebar. I'd like the embed mode to always start with closed sidebar
• paddings are somehow off in the right sidebar. E.g. the x button for closing the right sidebar floats out of the sidebar, into the blue border on the right.
• visually it makes a quite heavy impression, that the embed mode has the dark blue frame and is placed in an otherwise white modal.

Functionality already works flawlessly 💯

[AlexAndBear]

Nice progress! I noticed some things:

• if I have the right sidebar open in the main window, the embed mode in the modal starts with visible right sidebar. I'd like the embed mode to always start with closed sidebar

Since the sidebar will be controlled by localStorage, this is a little hard to achieve, maybe in a followup

• paddings are somehow off in the right sidebar. E.g. the x button for closing the right sidebar floats out of the sidebar, into the blue border on the right.

Not reproducible, could you check again and upload a screenshot?

• visually it makes a quite heavy impression, that the embed mode has the dark blue frame and is placed in an otherwise white modal.

@tbsbdr remarked this as well, and proposed a blue modal, @kulmann is against that, can you please propose something you both are fine with?

Functionality already works flawlessly 💯

:)

[CLAassistant]

All committers have signed the CLA.

[JammingBen]

Only a few tiny remarks, otherwise awesome stuff!

Did you try what happens if token renewal takes places during the modal being open? I noticed the iFrame spawns another web worker for the token renewal... I hope it doesn't have a negative effect 🙈

[AlexAndBear]

Only a few tiny remarks, otherwise awesome stuff!

Did you try what happens if token renewal takes places during the modal being open? I noticed the iFrame spawns another web worker for the token renewal... I hope it doesn't have a negative effect 🙈

I didn't 🙈

[AlexAndBear]

Changelog is missing

[kulmann]

This is working perfectly, so I'm just gonna go ahead and approve this.

For the visuals I have one proposal though: could you drop the modal footer and instead of the cancel button add an X in the top right of the modal for closing the modal? That could/should look like the following screenshot and IMO that makes it look much better already, because the white frame at the bottom disappears. Still not happy with the header section, but IMO this would be an improvement.

[AlexAndBear]

@kulmann Unfortunately I can't easily, we use the dispatchModal function here to display the modal, and our FilePickerModal component will be just the rendered content. I only have the possibility to adjust CSS but injecting elements would end up in spaghetti code.

Another possibility could be:
Add the cancel button to the bottom like we have it in other file picker modes and just disable the header and top of the modal via CSS

[kulmann]

Another possibility could be: Add the cancel button to the bottom like we have it in other file picker modes and just disable the header and top of the modal via CSS

Yes, sounds good. But as a followup please. :-)

[sonarcloud]

Quality Gate passed

Issues
3 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

[JammingBen]

Noice 👍

[AlexAndBear]

Another possibility could be: Add the cancel button to the bottom like we have it in other file picker modes and just disable the header and top of the modal via CSS

Yes, sounds good. But as a followup please. :-)

I'll merge this and open a follow up pr, so we can show it tomorrow

Toodalo!