Dnssec2 (#392)

* Add state to show DNSSSEC

* Create job to setup dnssec

* Add isDNSRegistrar

* add isDNSRegistrar flag

* Add dnsOwner

* Rename from State to Status

* Add DNS owner info

* Do not show transfer for DNSRegistrar

* Call web3 from @ensdomains/ui


* getDNSEntry from ui module

* Remove files which are moved in modules

* Move submitProof

* Remove dnsregistrar

* Add sendHelperOld which supports web3.js over ethers.js

* Add registration page

* Add DNSOwner info

* Add style to address to insert

* Add dummy transaction confirmation

* Adjusted content number to be in line with content title

* Set initial state

* Fix problem of throwing error when dnsOwner is empty

* Reload page

* Add error message

* Refresh will reload the page with spinning button

* Add (You)

* Rename getAddress and getSubdomains

* Add CTA to call submitProof

* Remove 3 column grid on mobile

* Add support for transferring Domain

* Change to use loader button

* Do not allow transfer if DNS record does not exist.

* Remove action field

* Remove deployENS.js

* Remove sendHelperOld

* Make the naming consistent

* Uncomment isLabelValid

* Change it to JSX

* Replace the guide

* Add regisgterReducerFactory

* Rename from Transfer to Sync

* Display "You" if you are the deedOwner

* Added You component

* Add explainer

* Fix setState error

* Show explainer only to DNS Name owner

* Added out of sync state

* Replace EtherScanLink to AddressLink

* Change dnssecmode.outOfSync to outOfSync

* Update ui and mock component to the latest

* Update ui and mock

cypress/integration/address.spec.js

@@ -75,16 +75,18 @@ describe('Address', () => {
       .should('have.value', NAME)
 
     cy.get('.resolve-result').should('contain', ADDRESS)
-    cy.get('.blockies').should('have.attr', 'style').then((attr) => {
-      cy.get('.cmp-address:nth(4) input')
-        .clear()
-        .type(ADDRESS)
-        .should('have.value', ADDRESS)
-
-      cy.get('.resolve-result').should('contain', NAME)
-
-      cy.get('.blockies').should('have.attr', 'style', attr)
-    })
+    cy.get('.blockies')
+      .should('have.attr', 'style')
+      .then(attr => {
+        cy.get('.cmp-address:nth(4) input')
+          .clear()
+          .type(ADDRESS)
+          .should('have.value', ADDRESS)
+
+        cy.get('.resolve-result').should('contain', NAME)
+
+        cy.get('.blockies').should('have.attr', 'style', attr)
+      })
   })
 
   it('test #6 check onResolve', () => {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ens-app",
-  "version": "1.0.0",
+  "version": "1.1.2",
   "private": true,
   "homepage": "https://manager.ens.domains",
   "dependencies": {
@@ -12,7 +12,7 @@
     "@ensdomains/ethregistrar": "^1.2.2",
     "@ensdomains/react-ens-address": "^0.0.11",
     "@ensdomains/resolver": "^0.1.6",
-    "@ensdomains/ui": "^1.0.93",
+    "@ensdomains/ui": "^1.1.1",
     "apollo-cache-inmemory": "^1.2.9",
     "apollo-client": "^2.4.5",
     "apollo-link": "^1.2.2",
@@ -56,6 +56,7 @@
     "test:coverage": "npm test -- --coverage",
     "eject": "react-scripts eject",
     "preTest": "node -r esm src/testing-utils/preTest.js",
+    "preTest:dnssec": "node -r esm src/testing-utils/preTest.js default dnssec",
     "subgraph": "node scripts/subgraph.js",
     "advance": "node src/testing-utils/advance.js",
     "cypress:open": "yarn run cypress open",
@@ -73,7 +74,7 @@
     }
   },
   "devDependencies": {
-    "@ensdomains/mock": "^1.0.12",
+    "@ensdomains/mock": "^1.0.13",
     "apollo-client-mock": "0.0.8",
     "apollo-link-schema": "^1.1.0",
     "babel-plugin-macros": "^2.4.2",

src/api/dnssecmodes.js

@@ -0,0 +1,45 @@
+export default [
+  // 0
+  {
+    state: 'ENABLE_DNSSEC',
+    title: 'Problem fetching data from DNS',
+    displayError: true
+  },
+  // 1
+  {
+    state: 'ENABLE_DNSSEC',
+    title: 'DNS entry does not exist.',
+    displayError: true
+  },
+  // 2
+  {
+    state: 'ENABLE_DNSSEC',
+    title: 'Please enable DNSSEC'
+  },
+  // 3
+  {
+    state: 'ADD_TEXT',
+    title: 'Please add text record into _ens.name.tld'
+  },
+  // 4,
+  {
+    state: 'ADD_TEXT',
+    title: 'DNS Record is invalid',
+    displayError: true
+  },
+  // 5,
+  {
+    state: 'SUBMIT_PROOF',
+    title: 'Ready to register',
+    explainer:
+      "*Click 'refresh' if you make changes to the domain in the DNS Registrar."
+  },
+  // 6,
+  {
+    state: 'SUBMIT_PROOF',
+    title: 'DNS is out of sync',
+    explainer:
+      "The Controller and DNS Owner are out of sync. Click 'sync' to make the DNS Owner the Controller. Click 'refresh' if you make changes to the domain in the DNS Registrar.",
+    outOfSync: true
+  }
+]

src/api/manager/resolvers.js

@@ -1,9 +1,13 @@
 import {
   getOwner,
+  getEntry,
+  getDNSEntry,
+  isDNSRegistrar,
   setSubnodeOwner,
   getDomainDetails,
   getSubdomains,
   getName,
+  getNetworkId,
   getAddress,
   claimAndSetReverseRecordName,
   setOwner,
@@ -16,13 +20,11 @@ import {
   expiryTimes,
   isDecrypted
 } from '@ensdomains/ui'
-import { getEntry } from '@ensdomains/ui'
 import { query } from '../subDomainRegistrar'
 import modeNames from '../modes'
-import { getNetworkId } from '@ensdomains/ui'
 import domains from '../../constants/domains.json'
 import { sendHelper } from '../resolverUtils'
-
+import { emptyAddress } from '../../utils/utils'
 import {
   GET_FAVOURITES,
   GET_SUBDOMAIN_FAVOURITES,
@@ -79,6 +81,8 @@ const resolvers = {
           contentType: null,
           expiryTime: null,
           isNewRegistrar: null,
+          isDNSRegistrar: null,
+          dnsOwner: null,
           deedOwner: null,
           registrant: null
         }
@@ -141,6 +145,22 @@ const resolvers = {
               state: subdomain.available ? 'Open' : 'Owned'
             }
           }
+        } else {
+          // either dnssect domain or non existing domain
+          let tld = nameArray[1]
+          let owner
+          let tldowner = (await getOwner(tld)).toLocaleLowerCase()
+          try {
+            owner = (await getOwner(name)).toLocaleLowerCase()
+          } catch {}
+
+          let isDNSRegistrarSupported = await isDNSRegistrar(tld)
+          if (isDNSRegistrarSupported && tldowner !== emptyAddress) {
+            const dnsEntry = await getDNSEntry(name, tldowner, owner)
+            node.isDNSRegistrar = true
+            node.dnsOwner = dnsEntry.dnsOwner || emptyAddress
+            node.state = dnsEntry.state
+          }
         }
 
         console.log(node)

src/api/registrar/resolvers.js

@@ -12,8 +12,10 @@ import {
   releaseDeed,
   transferOwner,
   reclaim,
+  submitProof,
   getOwner
 } from '@ensdomains/ui'
+
 import modeNames from '../modes'
 import { sendHelper } from '../resolverUtils'
 
@@ -114,6 +116,10 @@ const resolvers = {
     async releaseDeed(_, { label }) {
       const tx = await releaseDeed(label)
       return sendHelper(tx)
+    },
+    async submitProof(_, { name, parentOwner }) {
+      const tx = await submitProof(name, parentOwner)
+      return sendHelper(tx)
     }
   }
 }

src/api/schema.js

@@ -66,6 +66,8 @@ const typeDefs = `
     currentBlockDate: Int
     transferEndDate: Int
     isNewRegistrar: Boolean
+    isDNSRegistrar: Boolean
+    dnsOwner: String
   }
 
   extend type Query {

src/components/Blockies.js

@@ -5,11 +5,22 @@ import styled from '@emotion/styled'
 
 const BlockiesContainer = styled('span')``
 
-const Blockies = ({ address, imageSize = 42, className }) => {
+const Blockies = ({
+  address,
+  imageSize = 42,
+  color,
+  bgcolor,
+  spotcolor,
+  className
+}) => {
+  console.log({ address, imageSize, color, bgcolor, spotcolor, className })
   var imgURL = createIcon({
     seed: address.toLowerCase(),
     size: 8,
-    scale: 5
+    scale: 5,
+    color,
+    bgcolor,
+    spotcolor
   }).toDataURL()
   var style = {
     backgroundImage: 'url(' + imgURL + ')',
@@ -25,6 +36,9 @@ const Blockies = ({ address, imageSize = 42, className }) => {
 Blockies.propTypes = {
   address: PropTypes.string.isRequired,
   imageSize: PropTypes.number,
+  color: PropTypes.string,
+  bgcolor: PropTypes.string,
+  spotcolor: PropTypes.string,
   className: PropTypes.string
 }
 

src/components/Icons/You.js

@@ -0,0 +1,16 @@
+import React from 'react'
+import styled from '@emotion/styled'
+
+const Button = styled('span')`
+  color: white;
+  background: #c7d3e3;
+  border-radius: 6px;
+  border: 1px solid #ededed;
+  padding: 0 2px;
+`
+
+const You = () => {
+  return <Button>You</Button>
+}
+
+export default You