Add partial support for Ed25519

mistlur · Jul 25, 2023 · 8a22bbf · 8a22bbf
1 parent a44f00c
commit 8a22bbf
Show file tree

Hide file tree

Showing 9 changed files with 5,557 additions and 5,323 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -25,7 +25,7 @@
     "feather-icons-react": "^0.6.2",
     "gray-matter": "^4.0.3",
     "immer": "^9.0.16",
-    "jwk-thumbprint": "^0.1.4",
+    "jose": "^4.14.4",
     "multiformats": "^10.0.3",
     "next": "13.0.2",
     "next-mdx-remote": "^4.2.0",

diff --git a/src/components/dids/Embedded/MethodSettings.tsx b/src/components/dids/Embedded/MethodSettings.tsx
@@ -1,10 +1,15 @@
 import { DidDocument } from "@/lib/DidDocument";
 import { EmbeddedMaterial } from "@/lib/DidMaterial";
-import { deriveIdentificationFragment } from "@/lib/keys";
-import { KeyFormat, Representation, UsageFormat, verificationRelationships } from "@/types/dids";
+import {
+  EmbeddedType,
+  KeyFormat,
+  Representation,
+  UsageFormat,
+  verificationRelationships,
+} from "@/types/dids";
 import { useState } from "react";
 import DidInput from "../DidInput";
-
+import { deriveIdentificationFragment } from "@/lib/keys";
 
 export default function EmbeddedMethodSettings({
   htmlId,
@@ -16,11 +21,15 @@ export default function EmbeddedMethodSettings({
   didDocument: DidDocument;
   save: (vm: EmbeddedMaterial) => void;
 }): JSX.Element {
-  const material = method.material.keyMaterial
+  const material = method.material.keyMaterial;
   const [id, setId] = useState<string>(method.id);
-  const [controller, setController] = useState<string>(method.material.controller);
+  const [controller, setController] = useState<string>(
+    method.material.controller
+  );
   const [format, setFormat] = useState<KeyFormat>(method.material.format);
-  const [methods, setMethods] = useState<UsageFormat<Representation>>(method.material.usage);
+  const [methods, setMethods] = useState<UsageFormat<Representation>>(
+    method.material.usage
+  );
 
   return (
     <div>
@@ -44,8 +53,9 @@ export default function EmbeddedMethodSettings({
               value={controller}
               label="Controller"
               callback={(e) => {
-                setController(e.did?.serialize() || "")
-              }} />
+                setController(e.did?.serialize() || "");
+              }}
+            />
           </div>
         </div>
 
@@ -130,17 +140,21 @@ export default function EmbeddedMethodSettings({
       </div>
       <label
         htmlFor={htmlId}
-        className={`btn btn-info btn-outline btn-block mt-4 ${controller !== "" ? "" : "btn-disabled"}`}
-        onClick={() => {
-          const newVerificationMethod: EmbeddedMaterial =
-            new EmbeddedMaterial(id || `#${deriveIdentificationFragment(format, material)}`,
-              {
-                format,
-                curve: "P-256",
-                controller,
-                usage: methods,
-                keyMaterial: material,
-              });
+        className={`btn btn-info btn-outline btn-block mt-4 ${controller !== "" ? "" : "btn-disabled"
+          }`}
+        onClick={async () => {
+          const finalMaterial: EmbeddedType = {
+            format,
+            curve: method.material.curve,
+            controller,
+            usage: methods,
+            keyMaterial: material,
+          }
+          let finalId = id || await deriveIdentificationFragment(finalMaterial)
+          const newVerificationMethod: EmbeddedMaterial = new EmbeddedMaterial(
+            finalId,
+            finalMaterial
+          );
           save(newVerificationMethod);
         }}
       >

diff --git a/src/components/dids/NewKeyMaterial.tsx b/src/components/dids/NewKeyMaterial.tsx
@@ -1,9 +1,9 @@
 import { DidDocument } from "@/lib/DidDocument";
 import { EmbeddedMaterial } from "@/lib/DidMaterial";
-import { decodeP256Jwk, exportPrivateKey } from "@/lib/keys";
-import { ec as EC } from "elliptic";
+import { generateKeyPair, decodeJwk } from "@/lib/keys";
 import { useState } from "react";
 import { publicKeyJwkSchema } from "../../lib/didParser";
+import { SupportedCurves } from "@/types/dids";
 
 export default function NewKeyMaterial({
   didDocument,
@@ -12,6 +12,7 @@ export default function NewKeyMaterial({
   didDocument: DidDocument;
   setMethod: (km: EmbeddedMaterial) => void;
 }): JSX.Element {
+  const [curve, setCurve] = useState<SupportedCurves>("Ed25519");
   const [isGeneratedKey, setIsGeneratedKey] = useState<boolean>(true);
   const [importedKeyValidationStatus, setImportedKeyValidationStatus] =
     useState<string | undefined>(undefined);
@@ -23,15 +24,13 @@ export default function NewKeyMaterial({
   function completeSetup() {
     if (!keyMaterial) throw Error("KeyMaterial is undefined");
     const format = "JsonWebKey2020";
-    const method: EmbeddedMaterial = new EmbeddedMaterial(
-      undefined,
-      {
-        controller: didDocument.id,
-        format,
-        curve: "P-256",
-        usage: {},
-        keyMaterial,
-      });
+    const method: EmbeddedMaterial = new EmbeddedMaterial(undefined, {
+      controller: didDocument.id,
+      format,
+      curve,
+      usage: {},
+      keyMaterial,
+    });
     setMethod(method);
   }
 
@@ -57,15 +56,44 @@ export default function NewKeyMaterial({
       </div>
       {isGeneratedKey ? (
         <div>
+          <div>
+            <div className="form-control">
+              <label className="label cursor-pointer">
+                <span className="label-text">Ed25519</span>
+                <input
+                  type="radio"
+                  name="radio-10"
+                  className="radio checked:bg-red-500"
+                  onClick={() => setCurve("Ed25519")}
+                  checked={curve === "Ed25519"}
+                />
+              </label>
+            </div>
+            <div className="form-control">
+              <label className="label cursor-pointer">
+                <span className="label-text">P-256</span>
+                <input
+                  type="radio"
+                  name="radio-10"
+                  className="radio checked:bg-blue-500"
+                  onClick={() => setCurve("P-256")}
+                  checked={curve === "P-256"}
+                />
+              </label>
+            </div>
+          </div>
           <button
             className="btn btn-block mb-4 mt-8"
             onClick={() => {
-              const ec = new EC("p256");
-              const keypair = ec.genKeyPair();
-              const pk = JSON.stringify(exportPrivateKey(keypair), null, 2);
-              setPrivateKey(pk);
+              const keyPair = generateKeyPair(curve);
+              const privateKey = JSON.stringify(
+                keyPair.privateKey,
+                null,
+                2
+              );
+              setPrivateKey(privateKey);
               setKeyMaterial(
-                new Uint8Array(keypair.getPublic().encode("array", false))
+                keyPair.publicKey
               );
             }}
           >
@@ -99,7 +127,7 @@ export default function NewKeyMaterial({
         <div className="form-control">
           <label className="label">
             <span className="label-text">
-              Import a JWK formatted P-256 Public Key
+              Import a JWK formatted Public Key. P-256 and Ed25519 curves are supported.
             </span>
             <span
               className={`label-text-alt ${importedKeyValidationStatus === "Valid" ? "text-success" : ""
@@ -127,9 +155,10 @@ export default function NewKeyMaterial({
               try {
                 const parsedJson = JSON.parse(e.target.value);
                 const parsedSchema = publicKeyJwkSchema.parse(parsedJson);
-                const decoded = decodeP256Jwk(parsedSchema);
+                const decoded = decodeJwk(parsedSchema);
                 setImportedKeyValidationStatus("Valid");
                 setKeyMaterial(decoded);
+                setCurve(parsedSchema.crv === "P-256" ? "P-256" : "Ed25519")
               } catch (e) {
                 setImportedKeyValidationStatus("Invalid key or key format");
               }