Issue 13: trait values inline editing

[KitanGarcia]

This is addressing issue #13:

I added the ability to edit trait values inline. Each time the user edits and takes their focus off the input element, the values are saved. I also added error checking and surfaced issues to the user via alert messages.

A couple important things to note:

• I created the TraitValuesRow component, which consists of 2 input fields, one for the name and one for the rarity.
• In order for the rarity to work correctly as an input, I needed to change rarity in the TraitValues model to be either a number or a string. This is because it would not allow adding 0s after a decimal point.

I'm happy to go back and tweak some things if need be!

[cosimo-rip]

Thanks so much @KitanGarcia! We'll take a look at this asap.

[skeletoncrewrip]

hi @KitanGarcia - apologies that im only getting back to this now. It looks great but i ran into an issue that could be improved:

If you use "Add a List of Values" to add many trait values at once, they are initialized to a value of "-1". When i try to make changes to the -1 later with your inline editing, it throws an error that the value must be between 0 and 1, even if I am changing it to something in that range.

I get this as soon as I try to type a character:

[skeletoncrewrip]

style-wise, it would also be great if we could introduce a small amount of inner padding on the text fields

[skeletoncrewrip]

could we convert to number before storing in the model?

[KitanGarcia]

Yes! This should actually be taken care of already on line 90 of components/TraitValuesRow/index.tsx
Edit: Now on line 77

[skeletoncrewrip]

ok, can we revert the change here then?

[KitanGarcia]

@skeletoncrewrip Thanks for taking a look at this and for the feedback! Apologies for not catching this. I rewrote a lot of the code in a way that handles things much more nicely, in my opinion, to solve this, and also added the ability to update values by pressing enter.

hi @KitanGarcia - apologies that im only getting back to this now. It looks great but i ran into an issue that could be improved:

If you use "Add a List of Values" to add many trait values at once, they are initialized to a value of "-1". When i try to make changes to the -1 later with your inline editing, it throws an error that the value must be between 0 and 1, even if I am changing it to something in that range.

I get this as soon as I try to type a character:

[KitanGarcia]

style-wise, it would also be great if we could introduce a small amount of inner padding on the text fields

I went ahead and added p-2 to both inputs. I agree that this looks better.

[skeletoncrewrip]

@KitanGarcia this is looking great - should have time to test tomorrow. Only thing i would like to see is removing the change to the traitValue model if it's unnecessary. I'd like to know that we can guarantee that value is always a number and not a string. Thanks!

[KitanGarcia]

@KitanGarcia this is looking great - should have time to test tomorrow. Only thing i would like to see is removing the change to the traitValue model if it's unnecessary. I'd like to know that we can guarantee that value is always a number and not a string. Thanks!

@skeletoncrewrip I was able to restore the traitValue model to its previous state, so rarity will once again always be a Number. I also added protection against another edge case that resulted in buggy behavior if the user added a list of traits and updated rarity by either pressing enter or focusing to another rarity without changing either of them from the default of -1. Let me know if there's anything else you find in testing!

[skeletoncrewrip]

awesome work, thanks @KitanGarcia! Drop your wallet address (here or DM me: https://twitter.com/cosimo_rip) so that I can send you a contributor NFT :)

[skeletoncrewrip]

@KitanGarcia also, bonus points if you're interested: immediately updating the Total Rarity and calculated "None" rarity anytime there is an update to the individual rows.

[KitanGarcia]

awesome work, thanks @KitanGarcia! Drop your wallet address (here or DM me: https://twitter.com/cosimo_rip) so that I can send you a contributor NFT :)

Oh, awesome! Thanks a ton, I didn't even expect that! @skeletoncrewrip my wallet address is: EZ7sSyRmS9jQPMnjvwRVtBDhqtE1euDeqenAsiKa5ajK

And sounds good! I'll definitely see if I can implement updating rarity in the coming days!