Initial foray into the enrolling. Expect refactoring.

package-lock.json

@@ -41,6 +41,7 @@
         "web-did-resolver": "^2.0.21"
       },
       "devDependencies": {
+        "@types/ramda": "^0.28.20",
         "@typescript-eslint/eslint-plugin": "^5.44.0",
         "@typescript-eslint/parser": "^5.44.0",
         "@vue/cli-plugin-babel": "~5.0.8",
@@ -7492,6 +7493,15 @@
       "integrity": "sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw==",
       "dev": true
     },
+    "node_modules/@types/ramda": {
+      "version": "0.28.20",
+      "resolved": "https://registry.npmjs.org/@types/ramda/-/ramda-0.28.20.tgz",
+      "integrity": "sha512-MeUhzGSXQTRsY19JGn5LIBTLxVEnyF6HDNr08KSJqybsm4DlfLIgK1jBHjhpiSyk252tXYmp+UOe0UFg0UiFsA==",
+      "dev": true,
+      "dependencies": {
+        "ts-toolbelt": "^6.15.1"
+      }
+    },
     "node_modules/@types/range-parser": {
       "version": "1.2.4",
       "resolved": "https://registry.npmmirror.com/@types/range-parser/-/range-parser-1.2.4.tgz",
@@ -24441,6 +24451,12 @@
         "node": ">=8"
       }
     },
+    "node_modules/ts-toolbelt": {
+      "version": "6.15.5",
+      "resolved": "https://registry.npmjs.org/ts-toolbelt/-/ts-toolbelt-6.15.5.tgz",
+      "integrity": "sha512-FZIXf1ksVyLcfr7M317jbB67XFJhOO1YqdTcuGaq9q5jLUoTikukZ+98TPjKiP2jC5CgmYdWWYs0s2nLSU0/1A==",
+      "dev": true
+    },
     "node_modules/tslib": {
       "version": "2.4.1",
       "resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.4.1.tgz",

package.json

@@ -41,6 +41,7 @@
     "web-did-resolver": "^2.0.21"
   },
   "devDependencies": {
+    "@types/ramda": "^0.28.20",
     "@typescript-eslint/eslint-plugin": "^5.44.0",
     "@typescript-eslint/parser": "^5.44.0",
     "@vue/cli-plugin-babel": "~5.0.8",

src/views/AccountViewView.vue

@@ -4,41 +4,45 @@
     <ul class="flex text-2xl p-2 gap-2">
       <!-- Home Feed -->
       <li class="basis-1/5 rounded-md text-slate-500">
-        <router-link :to="{ name: 'home' }" class="block text-center py-3 px-1"
+        <router-link :to="{ name: 'home' }" class="block text-center py-3 px-1">
-          ><fa icon="house-chimney" class="fa-fw"></fa
+          <fa icon="house-chimney" class="fa-fw"></fa>
-        ></router-link>
+        </router-link>
       </li>
       <!-- Search -->
       <li class="basis-1/5 rounded-md text-slate-500">
         <router-link
           :to="{ name: 'discover' }"
           class="block text-center py-3 px-1"
-          ><fa icon="magnifying-glass" class="fa-fw"></fa
+        >
-        ></router-link>
+          <fa icon="magnifying-glass" class="fa-fw"></fa>
+        </router-link>
       </li>
       <!-- Projects -->
       <li class="basis-1/5 rounded-md text-slate-500">
         <router-link
           :to="{ name: 'projects' }"
           class="block text-center py-3 px-1"
-          ><fa icon="folder-open" class="fa-fw"></fa
+        >
-        ></router-link>
+          <fa icon="folder-open" class="fa-fw"></fa>
+        </router-link>
       </li>
       <!-- Commitments -->
       <li class="basis-1/5 rounded-md text-slate-500">
         <router-link
           :to="{ name: 'commitments' }"
           class="block text-center py-3 px-1"
-          ><fa icon="hand" class="fa-fw"></fa
+        >
-        ></router-link>
+          <fa icon="hand" class="fa-fw"></fa>
+        </router-link>
       </li>
       <!-- Profile -->
       <li class="basis-1/5 rounded-md bg-slate-400 text-white">
         <router-link
           :to="{ name: 'account' }"
           class="block text-center py-3 px-1"
-          ><fa icon="circle-user" class="fa-fw"></fa
+        >
-        ></router-link>
+          <fa icon="circle-user" class="fa-fw"></fa>
+        </router-link>
       </li>
     </ul>
   </nav>
@@ -76,8 +80,8 @@
       >
         <span
           ><code>did:peer:kl45kj41lk451kl3</code>
-          <fa icon="copy" class="text-slate-400 fa-fw ml-1"></fa
+          <fa icon="copy" class="text-slate-400 fa-fw ml-1"></fa>
-        ></span>
+        </span>
         <span>
           <button
             class="text-xs uppercase bg-slate-500 text-white px-1.5 py-1 rounded-md"
@@ -96,16 +100,16 @@
       <div class="text-sm text-slate-500 mb-1">
         <span
           ><code>dyIgKepL19trfrFu5jzkoNhI</code>
-          <fa icon="copy" class="text-slate-400 fa-fw ml-1"></fa
+          <fa icon="copy" class="text-slate-400 fa-fw ml-1"></fa>
-        ></span>
+        </span>
       </div>
 
       <div class="text-slate-500 text-sm font-bold">Derivation Path</div>
       <div class="text-sm text-slate-500 mb-1">
         <span
           ><code>m/44'/0'/0'/0/0</code>
-          <fa icon="copy" class="text-slate-400 fa-fw ml-1"></fa
+          <fa icon="copy" class="text-slate-400 fa-fw ml-1"></fa>
-        ></span>
+        </span>
       </div>
     </div>
 
@@ -163,9 +167,77 @@
 
 <script lang="ts">
 import { Options, Vue } from "vue-class-component";
+import { getRandomBytesSync } from "ethereum-cryptography/random";
+import { entropyToMnemonic } from "ethereum-cryptography/bip39";
+import { wordlist } from "ethereum-cryptography/bip39/wordlists/english";
+import { HDNode } from "@ethersproject/hdnode";
+import { IIdentifier } from "@veramo/core";
+import * as R from "ramda";
 
 @Options({
   components: {},
 })
-export default class AccountViewView extends Vue {}
+export default class AccountViewView extends Vue {
+  created() {
+    console.log("Component has been created!");
+    const entropy = getRandomBytesSync(32);
+    const mnemonic = entropyToMnemonic(entropy, wordlist);
+    const mnemonicPassword = "HardCodedPassword";
+    console.log(entropy, mnemonic);
+    this.importAndStoreIdentifier(mnemonic, mnemonicPassword, false, []);
+  }
+  importAndStoreIdentifier(
+    mnemonic: string,
+    mnemonicPassword: string,
+    toLowercase: boolean,
+    previousIdentifiers: Array<IIdentifier>
+  ) {
+    const UPORT_ROOT_DERIVATION_PATH = "m/7696500'/0'/0'/0'";
+    mnemonic = mnemonic.trim().toLowerCase();
+    console.log(mnemonic);
+    const hdnode: HDNode = HDNode.fromMnemonic(mnemonic);
+    const rootNode: HDNode = hdnode.derivePath(UPORT_ROOT_DERIVATION_PATH);
+    const privateHex = rootNode.privateKey.substring(2); // original starts with '0x'
+    const publicHex = rootNode.publicKey.substring(2); // original starts with '0x'
+    let address = rootNode.address;
+
+    console.log(address, privateHex, publicHex);
+
+    const prevIds = previousIdentifiers || [];
+    if (toLowercase) {
+      const foundEqual = R.find(
+        (id: IIdentifier) => id.did.split(":")[2] === address,
+        prevIds
+      );
+      if (foundEqual) {
+        // They're trying to create a lowercase version of one that exists in normal case.
+        // (We really should notify the user.)
+        // appStore.dispatch(appSlice.actions.addLog({log: true, msg: "Will create a normal-case version of the DID since a regular version exists."}))
+      } else {
+        address = address.toLowerCase();
+      }
+    } else {
+      // They're not trying to convert to lowercase.
+      const foundLower = R.find(
+        (id: IIdentifier) => id.did.split(":")[2] === address.toLowerCase(),
+        prevIds
+      );
+      if (foundLower) {
+        // They're trying to create a normal case version of one that exists in lowercase.
+        // (We really should notify the user.)
+        //appStore.dispatch(appSlice.actions.addLog({log: true, msg: "Will create a lowercase version of the DID since a lowercase version exists."}))
+        address = address.toLowerCase();
+      }
+    }
+    //appStore.dispatch(appSlice.actions.addLog({log: false, msg: "... derived keys and address..."}))
+
+    //const newId = newIdentifier(address, publicHex, privateHex, UPORT_ROOT_DERIVATION_PATH)
+    //appStore.dispatch(appSlice.actions.addLog({log: false, msg: "... created new ID..."}))
+
+    // awaiting because otherwise the UI may not see that a mnemonic was created
+    //const savedId = await storeIdentifier(newId, mnemonic, mnemonicPassword)
+    //appStore.dispatch(appSlice.actions.addLog({log: false, msg: "... stored new ID..."}))
+    //return savedId;
+  }
+}
 </script>