refactor: redesign add module page

[bartlomieju]

This error is visible immediately after visiting the page

[kitsonk]

Sorry for the late feedback, but it feels odd that this is copyable/visible until there is a valid package name:

Also, if you type a valid package name (e.g. oak_se) and then you type a taken valid name (e.g. oak_sessions) the confetti goes off and the UI updates for success:

[crowlKats]

@kitsonk fixed, PTAL

[kitsonk]

Maybe I misunderstood. I am still getting "success" and confetti when going from a valid name to an invalid name:

[crowlKats]

huh, i cannot reproduce that anymore with the latest deployment (https://dotland-m8jyb21w6dwg.deno.dev)

[kitsonk]

https://user-images.githubusercontent.com/1282577/180760202-1ca3c74d-288b-4c6d-aca3-1611776e50d3.mp4

[crowlKats]

ah, after spamming delete and writing name fast, i could reproduce again...

[kitsonk]

In my video I wouldn't consider it fast typing. 😜

[crowlKats]

ok i really cannot reproduce the way you are doing it...

[rojvv]

@crowlKats you can try this with the name twitter, too

[crowlKats]

ok, so it seems you need to be typing at a specific speed and then it happens; love it.

[kitsonk]

ok i really cannot reproduce the way you are doing it...

"works on my machine"... 🤣 Version 1.40.113 Chromium: 103.0.5060.114 (Official Build) (x86_64)

[kitsonk]

On Firefox 103, I have to type really fast, but it breaks in a different way, no "error" that module is taken and sort of infinite confetti that looks really yucky:

[crowlKats]

this is extremely annoying... how about now?

[kitsonk]

Same behaviour for me on: https://dotland-2m9t6qw1bv5g.deno.dev/add_module

[crowlKats]

@kitsonk check again

[kitsonk]

Ok, the confetti has gone and works as expected, thought my manual fuzzing has demonstrated another minor issue. Long package names cause layout problems:

[crowlKats]

oh, thats fine, thats simple to fix, thank god the false-positive is fixed now