Frontend: User page

[mhchia]

User should be a single webpage with some simple UI. Depends on #28.

The design below is just a draft.

Design

Blind Find v1.5 is a hierarchical peer-to-peer network allowing users to search for others while preserving privacy. When a user is searching for others, it does not reveal its own identity and also the identity of the user it's searching for.

In the network, there are three roles: Admin, Hub, and User.

• Admin: in charge of authorizing people to be hubs. There is only one admin in the network.
• Hub: hubs listen to users' requests. Users can join a hub and be searchable by other users. Also, they can search for others through a hub.
• User: users can be searchable in the network by joining a hub, and search for others through asking a hub.

We only need a page for User because it's not trivial for Hub and Admin to work in browsers.

User UI

Identity

• TextIdentity: A column showing the user's identity. A user identity is a plain ascii string.
• ButtonCreateIdentity: A button to create a new identity. When an identity is created, ColumnIdentity should be replaced by it.

Hub Interaction

Join Hub

• InputsJoinHub: A set of inputs including a hub's contact information which is used to join the hub.
  • InputTextHubAddress: A string, the hub's IPv4 address
  • InputTextHubIdentity: A string, the hub's public key
  • ButtonJoinHub: A button triggering join-hub operation
• TableJoinedHubs: A table showing the hubs the user has joined before. Each column contains
  • TextHubAddress: A string, the hub's IPv4 address
  • TextHubIdentity: the hub's identity

Search

• InputsSearch: A set of inputs including a hub's contact information which is used to search for another user.
  • InputTextHubAddress: A string, the hub's IPv4 address
  • InputTextTargetUserIdentity: A string, target user's identity
  • ButtonSearch: A button triggering search operation
• TableSearchHistory: A table showing the search results. Each column contains
  • TextHubAddress: A string, the hub's IPv4 address
  • TextTargetUserIdentity: A string, target user's identity
  • TextResult: A string, whether the search is successful or not
  • ButtonShowProof: A button, showing the zk-proof when it's clicked