Upgrade external modal component

[Ngoakor12]

The current modal shows the text "Loading" which tricked me into waiting a few times but digging in the code just shows that it's a place holder text.

I think the modal should be updated in the following ways:

• update the text to something that tells the user that they are about to go to an external site, maybe: You're about to go to an external site. Continue?
• update the button labels to YES for going to an external site and NO for closing the modal
• add shortcuts for the two modal options
• make the modal look more presentable(increase modal text font size, add some padding and center the text, etc.)

Additional info:
The easiest way of triggering the modal for me was to use the shortcut: ctrl+k and try to go to any of the external links, you should see the modal

[mikhael28]

Maybe we can add another few things - we can have 'keyboard' shortcuts for accessing these actions quickly. For example, we can have 'N' or 'Enter' open the new tab, and 'esc' close the modal. We might have the text to the left of the text in each button maybe? There is a library called mousetrap I believe, which makes it pretty easy to assign these type of things.

BTW, do you know why the page isn't loading? Is the Cloudflare worker that scans the page timing out - what kind of errors/messages are you getting in the console/network tab? I just tried it on my machine, and everything seems to be working fine.

[Ngoakor12]

BTW, do you know why the page isn't loading? Is the Cloudflare worker that scans the page timing out - what kind of errors/messages are you getting in the console/network tab? I just tried it on my machine, and everything seems to be working fine.

I never realised that it was supposed to load something, but after monitoring the console/network tabs. I get these...
console

network

[Ngoakor12]

Maybe we can add another few things - we can have 'keyboard' shortcuts for accessing these actions quickly. For example, we can have 'N' or 'Enter' open the new tab, and 'esc' close the modal. We might have the text to the left of the text in each button maybe? There is a library called mousetrap I believe, which makes it pretty easy to assign these type of things.

Shortcuts for the two modal options sounds cool 👌 Will add that to the list of tasks. I haven't heard of mousetrap but will look into it

[mikhael28]

Take a look at this image - it has the Command Icon, and a Letter, next to the button text.

[mikhael28]

You can browser some other inspiration: https://dribbble.com/tags/keyboard_shortcuts

[Ngoakor12]

@mikhael28 I'd like to start working on this, can you please assign me?

[Ngoakor12]

Thanks @jeremydthomas 👌

[Ngoakor12]

Will start working on this tomorrow, I couldn't find the time until now🙈

[jeremydthomas]

So much to do, so little time :)

[mikhael28]

I hear you! Finding time is a challenge - right now I'm sitting at a coffee shop with my girlfriend on a Saturday, trying to catch up with everything here - trying to find some time to fully refactor the Experience objects. Need to really re-work those things, and make creating them scalable. It's a bit trickier than I first thought, and trying to find a compelling creation/rich-text/embedded images/media experience. All I will probably accomplish is just determining the architecture/schema/tools - writing the code will have to wait, because I have a super busy week next week!