Add copy user ID button to profile, closes #281

[Phillezi]

Hi!

I added a button to copy user ID in the profile page, like described in #281 It adds a snackbar entry message if it succeeds or fails.

For example if user is null it will say:

or if

navigator.clipboard.writeText(user.id);

throws an error, it will show this message (error message is the message of the error thrown):

Here's how it looks (in glorious GIF quality):

English

Swedish

Lmk if I should change anything :)

[pierrelefevre]

Nice! We do have a copy button component but since this is a bit isolated it should be fine :)

[Phillezi]

Nice! We do have a copy button component but since this is a bit isolated it should be fine :)

Oh, I saw it now, should i change to use that component instead?

[pierrelefevre]

If you want to, sure! Would be a bit cleaner code 🚀

[Phillezi]

Hi again!

I changed it now so that it uses the existing CopyButton component, I modified the CopyButton component so that it can be used with text intput (next to the icon) with the optional parameter textContent (it will only show if the variant is specified to not be icon too).

I also added that check-mark that I had before to this component, so it changes for 2s after you click it to show a check mark instead of the copy icon.

Heres how it looks:

On the existing copy ssh key

[pierrelefevre]

Nice! Love the check mark in the existing places too 👍🏻 Thanks for the PR