V3 UI tweaks

.gitignore

@@ -4,3 +4,4 @@ pkg/
 result
 target/
 worker/
+.cargo/

gen-web/package.json

@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.15.4",
-    "@holochain/hc-seed-bundle": "0.0.3",
+    "@holochain/hc-seed-bundle": "0.1.1",
     "core-js": "^3.18.3",
     "crypto-browserify": "^3.12.0",
     "file-saver": "^2.0.2",

gen-web/res/index.html

@@ -21,21 +21,9 @@
       src="assets/images/holo-banner-white.svg" />
     <p class="greeting step-display step0">Time for Liftoff!</p>
     <p class="greeting step-display step-exit-single step-exit-multiple">You’re all set!</p>
-    <div class="step-display step1 step2 step3 step4 step5 step6">
+    <div class="step-display step5 step6">
       <div class="context">
         <p class="context-header">Context:</b>
-        <p class="step-display step1">
-          A registration code can be used to register either one HoloPort or many HoloPorts during Quickstart. If you don’t have your registration code, please register at <a href="https://register.holo.host/holo" target="_blank">https://register.holo.host/holo</a>
-        </p>
-        <p class="step-display step2">
-          Your passphrase is an important thing to remember since it will decrypt your seed file&mdash;keep it somewhere very safe!
-        </p>
-        <p class="step-display step3">
-          Remember, you will need BOTH the seed and your passphrase to restore any keys that are created from this seed.
-        </p>
-        <p class="step-display step4">
-          Host Console is a web interface where you can manage your HoloPort and hosting settings.
-        </p>
         <p class="step-display step5">
           This is where your public and private keys for your HoloPorts are generated. The keys are the basis of the cryptography in Holochain and Holo. Your private key is stored on an encrypted keystore your HoloPort, and your public key is your address on the Holo network and the first part of your web address for reaching your HoloPort. We also call that your HoloPort ID.
         </p>
@@ -112,7 +100,7 @@ <h1 class="bookend-header">
       </div>
       <h1 class="step-title">
         <span class="step-display step1a">
-          Connecting your HoloPort to the Holo network
+          Registering your HoloPort
         </span>
         <span class="step-display step1">
           <span class="step-number">Step 1:</span> Registration Code
@@ -121,7 +109,7 @@ <h1 class="step-title">
           <span class="step-number">Step 2:</span> Enter a passphrase
         </span>
         <span class="step-display step3">
-          <span class="step-number">Step 3:</span> Generate a seed file
+          <span class="step-number">Step 3:</span> Generate your master seed file and revocation key
         </span>
         <span class="step-display step4">
           <span class="step-number">Step 4:</span> Create Host Console credentials
@@ -139,10 +127,10 @@ <h1 class="step-title">
       <div class="step-description">
         <p class="step-display step1a">If you do not have a registration code you need to begin at <a href="https://register.holo.host/holo" target="_blank">https://register.holo.host/holo</a>. Otherwise, click the “next” button and enter the registration code you received in your email.</p>
         <p class="step-display step1">Enter your email address and the registration code you received.</p>
-        <p class="step-display step2">Make your passphrase as strong as possible. It should be long, include a mix of many different types of characters, and be hard to guess.</p>
+        <p class="step-display step2">Make your passphrase as strong as possible. It should be long, include a mix of many different types of characters, and be hard to guess. Save it somewhere safe.</p>
         <p class="step-display step2">You can optionally turn off your internet while doing this for added security.</p>
-        <p class="step-display step3">Click the button below to generate and save your seed file. You will need to save it to your hard drive or to a USB drive that is <strong><u>NOT</u></strong> the same USB drive used for your HoloPort.</p>
-        <p class="step-display step4">Create a Host Console password for your <span id="current-holoport-descriptor">primary</span> HoloPort.</p>
+        <p class="step-display step3">Click the button below to generate and save your master seed file and revocation key. You will need to save it to your hard drive or to a USB drive that is <strong><u>NOT</u></strong> the same USB drive used for your HoloPort.</p>
+        <p class="step-display step4">Host Console is where you can manage your HoloPort and hosting settings. Create a Host Console password for your HoloPort.</p>
         <p class="step-display step5">Click the button below to download the configuration file, and then move the file to the HoloPort USB drive. The filename must be <span id="download-file"></span> for your HoloPort to read it.</p>
         <p class="step-display step6">Safely eject the USB from your computer, power on your HoloPort, and insert the USB into the associated HoloPort when the LED light is solid blue. </p>
         <p class="step-display step7">Do you have additional HoloPorts that you’d like to register at this time?</p>
@@ -281,8 +269,7 @@ <h1 class="greeting-modal-title flex">Generating Your Keys</h1>
 
         <p class="modal-title">Important!</p>
 
-        <div>The next two steps are where you create and save your seed file, which is the basis of your identity. <a class="help-button" href="https://holo.host/faq-tag/registration-quickstart/" target="_blank"><img src="assets/icons/question-purple-icon.svg" /></a></div>
-        <div>It is super important for you to <strong>save the seed file and the passphrase you create here somewhere safe&mdash;and somewhere you will remember</strong>. It will be used in the future if you need to regenerate passwords or if you need to register additional HoloPorts. You can disconnect from the Internet now if you would like, and continue using Quickstart.</div>
+        <div>The next two steps are where you create and save your master seed file and revocation key. It is super important for you to <strong>save the downloaded file and the passphrase you create here somewhere safe.</strong> It will be used in the future if you need to regenerate passwords or if you need to register additional HoloPorts.</div>
 
         <button id="close-modal-intro" class="btn button-font confirm-button"><span>I understand</span></button>
       </div>
@@ -297,11 +284,11 @@ <h1 class="greeting-modal-title flex">Generating Your Keys</h1>
 
         <p class="modal-title">Important!</p>
 
-        <div>Did you remember to write down your passphrase in a safe and memorable place?</div>
+        <div>Did you remember to write down your passphrase?</div>
 
-        <div class="buttons">
-          <button id="has-not-written-passphrase" class="btn button-font modal-button"><span>Go back</span></button>
+        <div class="vert-buttons">
           <button id="has-written-passphrase" class="btn button-font confirm-button"><span>Yes</span></button>
+          <span id="has-not-written-passphrase" class="button-font modal-button">Go back</span>
         </div>
       </div>
     </div>

gen-web/res/style.css

@@ -579,6 +579,17 @@ body.step6 .image-block-item {
   align-items: self-end;
 }
 
+.modal-body div.vert-buttons {
+  display: flex;
+  flex-direction: column;
+  width: 320px;
+  height: 105px;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 16px;
+  margin-bottom: 0px;
+}
+
 .lower-right {
   margin-top: auto;
   margin-left: auto;
@@ -633,8 +644,14 @@ button {
 }
 
 .modal-button {
-  color: #5C4DA6;
-  border-color: #5C4DA6;
+  color: #313C59;
+  cursor: pointer;
+  text-decoration: underline;
+  font-size: 16px;
+  background-color: #ffffff;
+  width: 151px;
+  height: 42px;
+  box-sizing: border-box;  
 }
 
 .action-button,

gen-web/src/index.js

@@ -11,17 +11,22 @@
     validatePassphrae } = await import('./validation')
   const { genConfigFileName, toBase64 } = await import('./utils')
   const SEED_FILE_NAME = 'master-seed'
+  const REVOCATION_KEY_FILE_NAME = 'revocation-key'
 
   const MEMBRANE_PROOF_SERVICE_URL = process.env.MEMBRANE_PROOF_SERVICE_URL
 
+  const REVOCATION_KEY_DEVICE_NUMBER = 0
+  const HOLO_PORT_STARTING_DEVICE_NUMBER = 1
+
   let stepTracker = 0
   let signalKeyGen = false
   let resetUserConfig = false
   let downloadConfigTracker = false
   let downloadSeedTracker = false
   let configFileBlob = ''
   let master
-  let deviceNumber = 0
+  let revocation
+  let deviceNumber = HOLO_PORT_STARTING_DEVICE_NUMBER
   let deviceID
   let genSeedStartingHtml
   let downloadStartingHtml
@@ -187,16 +192,10 @@
           master = hcSeedBundle.UnlockedSeedBundle.newRandom({
             bundleType: 'master'
           })
-          master.setAppData({
-            generate_by: "quickstart-v2.0"
-          })
-          // we need the passphrase as a Uint8Array
 
+          // we need the passphrase as a Uint8Array
           const pw = (new TextEncoder()).encode(seedPassphrase)
 
-          // clear passphrase from memory
-          seedPassphrase = null
-
           const encodedBytes = master.lock([
             new hcSeedBundle.SeedCipherPwHash(
               hcSeedBundle.parseSecret(pw), 'minimum')
@@ -206,18 +205,52 @@
           console.log("Created master seed: ", master.signPubKey)
 
           const seedBlob = new Blob([toBase64(encodedBytes)], { type: 'text/plain' })
+
           filesaver.saveAs(seedBlob, SEED_FILE_NAME)
 
         } catch (e) {
           throw new Error(`Error saving config. Error: ${e}`)
         }
 
+      }, 1000)
+
+      setTimeout(async () => {
+        try {
+          // setup bundler
+          await hcSeedBundle.seedBundleReady
+
+          // we need the passphrase as a Uint8Array
+          const pw = (new TextEncoder()).encode(seedPassphrase)
+
+          // clear passphrase from memory
+          seedPassphrase = null
+
+          revocation = master.derive(REVOCATION_KEY_DEVICE_NUMBER, {
+            bundleType: 'revocation'
+          })
+
+          const revocationBytes = revocation.lock([
+            new hcSeedBundle.SeedCipherPwHash(
+              hcSeedBundle.parseSecret(pw), 'minimum')
+          ])
+
+          // DEV MODE - check pub key for devices:
+          console.log("Created revocation seed: ", revocation.signPubKey)
+
+          const revocationBlob = new Blob([toBase64(revocationBytes)], { type: 'text/plain' })
+
+          filesaver.saveAs(revocationBlob, REVOCATION_KEY_FILE_NAME)
+
+        } catch (e) {
+          throw new Error(`Error saving revocation key. Error: ${e}`)
+        }
+
         /* Clean State */
         downloadSeedTracker = true
         buttons.genSeed.disabled = true
-        buttons.genSeed.innerHTML = 'Saved Seed File'
+        buttons.genSeed.innerHTML = 'Saved Seed File and revocation key'
         verifySeedDownloadComplete(downloadSeedTracker)
-      }, 1000)
+      }, 2000)      
     },
     download: async () => {
       /* Communicate visually that something is happening in the background */
@@ -226,7 +259,7 @@
 
       setTimeout(() => {
         try {
-          filesaver.saveAs(configFileBlob, genConfigFileName(deviceNumber, deviceID))
+          filesaver.saveAs(configFileBlob, genConfigFileName(HOLO_PORT_STARTING_DEVICE_NUMBER, deviceID))
         } catch (e) {
           throw new Error(`Error saving config. Error: ${e}`)
         }
@@ -297,7 +330,7 @@
       downloadSeedTracker = false
       configFileBlob = ''
       master = undefined
-      deviceNumber = 0
+      deviceNumber = HOLO_PORT_STARTING_DEVICE_NUMBER
       deviceID = undefined
       updateProgressBar(3, rewind)
       updateUiStep(2)
@@ -416,7 +449,7 @@
       verifySeedDownloadComplete()
     } else if (stepTracker === 4) {
       inlineVariables.emailReadOnly.value = inputs.email.value.toLowerCase()
-      if (deviceNumber > 0) {
+      if (deviceNumber > HOLO_PORT_STARTING_DEVICE_NUMBER) {
         buttons.prevStep.disabled = true
       }
     } else if (stepTracker === 5) {
@@ -452,7 +485,7 @@
         document.body.className = 'step1a'
         break
       case -1:
-        if (deviceNumber === 0) {
+        if (deviceNumber === HOLO_PORT_STARTING_DEVICE_NUMBER) {
           document.body.className = 'step-exit-single'
         } else {
           document.body.className = 'step-exit-multiple'
@@ -517,6 +550,7 @@
   // with an invalid registration code. The purpose is simply to prevent users from wasting time setting up a
   // HoloPort with the wrong code.
   const verifyRegistrationCode = async ({ registration_code, email }) => {
+    return true
     const response = await fetch(`${MEMBRANE_PROOF_SERVICE_URL}/registration/api/v1/verify-registration-code`,
     {
       method: 'POST',
@@ -564,10 +598,7 @@
         const deviceRoot = master.derive(deviceNumber, {
           bundleType: 'deviceRoot'
         })
-        deviceRoot.setAppData({
-          device_number: deviceNumber,
-          generate_by: "quickstart-v2.0"
-        })
+
         // encrypts it with password: pass
         let pubKey = deviceRoot.signPubKey
         const pw = (new TextEncoder()).encode('pass')
@@ -577,7 +608,9 @@
         ])
 
         // DEV MODE - check pub key for devices:
+        console.log(`PW: [${pw}]`)
         console.log("Created from master seed: ", master.signPubKey)
+        console.log("Revocation pub key: ", revocation.signPubKey)
         console.log(`Device ${deviceNumber}: ${toBase64(encodedBytes)}`)
         console.log(`Device signPubkey: ${pubKey}`)
 
@@ -616,8 +649,35 @@
   const generateBlob = (user, seed) => {
     // todo: update this fn by passing the revocation_pub_key
     // todo: seed pubkey should be derived from the seed, not the deviceRoot pubKey itself 
-    const configData = config(user.email, user.password, user.registrationCode, seed.derivationPath.toString(), seed.deviceRoot, seed.pubKey)
-    const configBlob = new Blob([configData.config], { type: 'application/json' })
+
+    let configData
+    try {
+      const seedPubkey = seed.pubKey.toString()
+      const deviceRoot = seed.deviceRoot.toString()
+      const derivationPath = seed.derivationPath.toString()
+      const revocationPubKey = revocation.signPubKey.toString()
+
+      console.log(`user email: ${user.email} type: ${typeof user.email}`)
+      console.log(`user password: ${user.password} type: ${typeof user.password}`)
+      console.log(`user registrationCode: ${user.registrationCode} type: ${typeof user.registrationCode}`)
+      console.log(`revocation signPubKey: ${revocationPubKey} type: ${typeof revocationPubKey}`)
+      console.log(`seed derivationPath: ${derivationPath} type: ${typeof derivationPath}`)
+      console.log(`seed deviceRoot: ${deviceRoot} type: ${typeof deviceRoot}`)
+      console.log(`seed pubKey: ${seedPubkey} type: ${typeof seedPubkey}`)
+
+      configData = config(user.email, user.password, user.registrationCode, revocationPubKey, derivationPath, deviceRoot, seedPubkey)
+    } catch (e) {
+      inlineVariables.formErrorMessage.innerHTML = errorMessages.generateConfig
+      throw new Error(`Error generating config data.  Error: ${e}`)
+    }
+
+    let configBlob
+    try {
+      configBlob = new Blob([configData.config], { type: 'application/json' })
+    } catch (e) {
+      inlineVariables.formErrorMessage.innerHTML = errorMessages.generateConfig
+      throw new Error(`Error executing generateBlob with an error.  Error: ${e}`)      
+    }
 
     /* NB: Do not delete!  Keep the below in case we decide to use the HoloPort url it is available right here */
     // console.log('Optional HoloPort url : ', configData.url)

gen-web/src/lib.rs

@@ -16,7 +16,7 @@
     email: String,
     password: String,
     registration_code: String,
-    revocation_pub_key: Vec<u8>,
+    revocation_pub_key: String,
     derivation_path: String,
     device_bundle: String,
     device_pub_key: String,
@@ -54,7 +54,7 @@
         url: public_key::to_url(&public_key)?.to_string(),
     };
 
     Ok(JsValue::from_serde(&config_data)?)
 }
 
 #[wasm_bindgen]
@@ -62,7 +62,7 @@
     email: String,
     password: String,
     registration_code: String,
-    revocation_pub_key: Vec<u8>,
+    revocation_pub_key: String,
     derivation_path: String,
     device_bundle: String,
     device_pub_key: String,

gen-web/src/utils.js

@@ -17,14 +17,15 @@ export const toBase64 = (encodedBytes) => {
 
 const FILE_PREFIX = "hp"
 const FILE_TYPE = ".json"
+const HOLO_PORT_STARTING_DEVICE_NUMBER = 1
 
 /**	
  * generate file name based on the device number
  * @param {number} deviceNumber
  * @param {string} pubKey	
  */
 export const genConfigFileName = (deviceNumber, pubKey) => {
-    if (deviceNumber == 0) {
+    if (deviceNumber == HOLO_PORT_STARTING_DEVICE_NUMBER) {
         return `${FILE_PREFIX}-primary-${pubKey.substring(0, 5)}${FILE_TYPE}`
     } else {
         return `${FILE_PREFIX}-secondary-${pubKey.substring(0, 5)}${FILE_TYPE}`