Upgrade external modal component

Question

Upgrade external modal component

Opened this issue 2 years ago · 10 comments

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

Answer 1 · 2022-09-30T22:26:00.000Z

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.

Answer 2 · 2022-10-01T04:34:46.000Z

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

Answer 3 · 2022-10-01T04:43:03.000Z

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

Answer 4 · 2022-10-08T17:33:05.000Z

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

Answer 5 · 2022-10-08T17:33:40.000Z

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

Answer 6 · 2022-10-18T20:02:46.000Z

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

Answer 7 · 2022-10-19T03:29:41.000Z

Thanks @jeremydthomas 👌

Answer 8 · 2022-10-27T17:07:38.000Z

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

Answer 9 · 2022-10-28T11:29:41.000Z

So much to do, so little time :)

Answer 10 · 2022-10-29T20:18:54.000Z

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!