Frontend Test Feedback

[pascalherrmann]

Hi @dstuebing @anhmt90 @metodi96 I set up the frontend and did some testing, here is my feedback:

Landing Page

• make font bigger on landing page (the part in the middle)
  

---

• add text to Main features

---

• Step Images:

• maybe add checkmark in the green circles? since the verification is like the „main feature“

• looks a bit empty. maybe we can add the contract or so in the middle?
• or some symbols for the private key upload?

---

• make these a button (i.e., with boarder around)

---

• black font on black looks a bit weird, mb change color

App



• maybe make font bold or a bit bigger, as the domain is quite important

---

• make max length a bit longer, this domain should also be shown

---

• make line break correctly

---

• pie chart looks weird if all contracts have no flags. maybe have additional entry „no flags“ or have one for the sanity flag.

---

• also here make max length longer

---

• pagination is shown for domains, but has no effect

---

• a back-button to return to the overview would be good

---

• filter does not work

---

• i think we can get rid of the sub-menus and having an icon for every feature (i.e. create, inspect, registry, analytics)

---

• better would be: expired, 1 month, 6 month, 1 year, >1 year

---

Analytics

• add in large font: TOTAL NUMBER OF VERIFIED TESCS IN REGISTRY: ####, TOTAL NUMBER OF DOMAINS: ####

---

• make it a link to inpsect page

---

• the collapse button looks like a back button, which is quite confusing => change icon and ideally move it somewhere into the sidebar

---

• add some spacing between question mark bubble and text

---

• I get this when I deploy a contract with a custom fingerprint (that should be retrieved from CT)

---

• I'm getting this even though contract IS registered

---

• looks squeezed on laptop screen → add some right padding

Errors

• not sure why i got those, do you maybe use another contract version? (I copied over the most up to date one that's also used inbackend)

Further improvements

• would be good to use submodules as in the api-server to reference the EIP and Registry smart contracts, copying over them makes the setup quite tedious

[pascalherrmann]

• if using the local blockchain (http://127.0.0.1:8545) this is shown. can be either display "Local Blockchain" or the URL itself?

• Also, can we show a warning if the backend is connected to a different blockchain than metamask?

The backend returns the URL at the route http://127.0.0.1:3005/

{
    "blockchainURL": "http://127.0.0.1:8545",
    "registryAddress": "0xe78A0F7E598Cc8b0Bb87894B0F60dD2a88d6a8Ab",
    "routes": [
        "/verify/:contractAddress",
        "/verify/:contractAddress/:domain",
        "/registry"
    ]
}

[pascalherrmann]

• think about adding second CLI video (its wider so we could add it without text)

---

• table: fix alignment of headers

---

• component diagram align circles

---

• also show other flags in pie chart (e.g. exlusive, etc.)