Add indication that Blockstack ID owns multiple usernames

[larrysalibra]

The browser only supports one username per Blockstack ID for authentication and other operations. However, it is possible for a Blockstack ID to have more than one name owned by its identity address at the protocol level.

Users who have purchased multiple names for a given identity can see that the identity address owns the names on the Blockstack explorer, however, there's no indication in the browser that these names exist. We want to display an icon on the Blockstack ID card that indicates the ID owns more than one name along with the names owned in a tooltip.

Any changes should include tests (we don't currently have any component test coverage but want to have that going forward)

This is an intermediary step before enabling transfer of these names once transaction generation logic is moved into blockstack.js.

See #1075 #1055 for more details

[ivegotwings]

When I try to purchase another name, it says "You cannot purchase usernames in this build. Feature coming soon.". How do i go about this?

[brettdewoody]

@larrysalibra I'm unable to add additional names to my Blockstack ID at the moment. However, I'm able to get started in the meantime by passing an array of additional usernames through to the <IdentityItem /> component in a new prop. This could change once I see the structure of an identity with multiple usernames.

I'll try to add some additional usernames to my ID later. However, if you happen to know/have an example of the identity object with multiple usernames and could post the structure that would unblock me.

[larrysalibra]

@brettdewoody Here's an example of an address that owns multiple names: https://explorer.blockstack.org/address/124VErRrXSkWea8aBxCnVLp4mXxDcaeLJC

One approach that wouldn't require buying names would be to hard code that address into the refreshIdentities call. Another approach is to set up a regtest environment, but that's a bit more involved and not necessary for this. The refreshIdentities function and the redux identity state tree will need to be modified to support display of more than one username as well: https://github.com/blockstack/blockstack-browser/blob/master/app/js/profiles/store/identity/actions.js#L275

[brettdewoody]

@larrysalibra The first method will work fine. Thanks for sharing the multi-name address.

[shea256]

@larrysalibra @yknl @guylepage3 This will require a bit of design thinking around how to best communicate this.

For example, I could imagine a view where the address is conveyed as a container and each name is conveyed as an item that is within the container. This should look natural with a single name contained inside the address as that will be the dominant condition by far.

[guylepage3]

@larrysalibra @yknl @shea256

It still seems very strange that the non-human readable name, the ID, is now the main focus for uses. The entire premise of Blockstack from the beginning is to make the ID human readable. Now it seems in going down this route we've made the ID the prominent identifier.

From an average user's perspective, this method of character string first and human readable name second is not a great user experience.