feat: oa v4 types (#113)

* ci: prepare alpha release

* chore: bump open-attestation to 6.8.0-alpha.1

* feat: include oa v4 types

* chore: npm audit fix

* chore: revert to lockfileVersion 1

* fix: stricter type guard checks

.github/workflows/ci.yml

@@ -18,9 +18,8 @@ jobs:
         run: npm run test
       - name: Run build
         run: npm run build
-
       - name: Release
-        run: npx semantic-release@19.0.5 --branches master
+        run: npx semantic-release
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

.releaserc

@@ -0,0 +1,9 @@
+{
+  "branches": [
+    "master",
+    {
+      "name": "alpha",
+      "prerelease": true
+    }
+  ]
+}

package.json

@@ -15,7 +15,7 @@
     "@fortawesome/fontawesome-svg-core": "^1.2.35",
     "@fortawesome/free-solid-svg-icons": "^5.15.3",
     "@fortawesome/react-fontawesome": "^0.1.14",
-    "@govtechsg/open-attestation": "^6.6.0",
+    "@govtechsg/open-attestation": "6.8.0-alpha.1",
     "crypto-browserify": "^3.12.0",
     "debug": "^4.3.1",
     "penpal": "^5.3.0",

src/components/renderer/FramedDocumentRenderer.tsx

@@ -7,10 +7,17 @@ import { FrameActions, obfuscateField, updateHeight, updateTemplates } from "../
 import { HostConnector } from "../frame/HostConnector";
 import { DomListener } from "../common/DomListener";
 import { noAttachmentRenderer } from "./NoAttachmentRenderer";
-import { OpenAttestationDocument, WrappedDocument, v2, v3 } from "@govtechsg/open-attestation";
+import { OpenAttestationDocument, WrappedDocument, v2, v3, v4 } from "@govtechsg/open-attestation";
 
 const { trace } = getLogger("FramedDocumentRenderer");
 
+export function FramedDocumentRenderer<D extends v4.OpenAttestationDocument = v4.OpenAttestationDocument>({
+  templateRegistry,
+  attachmentToComponent,
+}: {
+  templateRegistry: TemplateRegistry<D>;
+  attachmentToComponent?: (attachment: Attachment, document: OpenAttestationDocument) => React.FunctionComponent | null;
+}): JSX.Element;
 export function FramedDocumentRenderer<D extends v3.OpenAttestationDocument = v3.OpenAttestationDocument>({
   templateRegistry,
   attachmentToComponent,

src/types.ts

@@ -1,7 +1,7 @@
 import { ComponentType } from "react";
 import { v2, WrappedDocument, OpenAttestationDocument, v3 } from "@govtechsg/open-attestation";
 
-export type Attachment = v2.Attachment | v3.Attachment;
+export type Attachment = v2.Attachment | v3.Attachment; // TODO: OA v4 schema does not support attachments yet
 export interface Renderer {
   attachment: Attachment;
 }

src/utils.ts

@@ -1,7 +1,7 @@
 import { FunctionComponent } from "react";
 import { Attachment, TemplateRegistry, TemplateWithComponent, TemplateWithTypes } from "./types";
 import { defaultTemplate } from "./DefaultTemplate";
-import { OpenAttestationDocument, v2, v3 } from "@govtechsg/open-attestation";
+import { OpenAttestationDocument, v2, v3, v4, utils } from "@govtechsg/open-attestation";
 
 export const repeat = (times: number) => (callback: (index: number) => any) =>
   Array(times)
@@ -19,21 +19,29 @@ export const inIframe = (): boolean => {
   }
 };
 
+// FIXME: Not sure why custom type guards are used to detect v2 and v3 documents
 export const isV2Document = (document: any): document is v2.OpenAttestationDocument => {
   return !!document.$template;
 };
 
+// FIXME: Not sure why custom type guards are used to detect v2 and v3 documents
 export const isV3Document = (document: any): document is v3.OpenAttestationDocument => {
-  return !!document["@context"];
+  return !!document["@context"] && !!document["openAttestationMetadata"];
 };
 
+export const isV4Document = (document: unknown): document is v4.OpenAttestationDocument =>
+  utils.isWrappedV4Document(document) || utils.isSignedWrappedV4Document(document);
+
 const getTemplateName = (document: OpenAttestationDocument): string => {
   if (isV2Document(document) && typeof document.$template === "object") {
     return document.$template.name;
   }
-  if (isV3Document(document) && document.openAttestationMetadata.template) {
+  if (isV3Document(document) && document.openAttestationMetadata?.template) {
     return document.openAttestationMetadata.template.name;
   }
+  if (isV4Document(document) && document.renderMethod) {
+    return document.renderMethod.name;
+  }
   return "";
 };
 
@@ -67,9 +75,11 @@ export function documentTemplates(
     })
     .filter((template) => (template.predicate ? template.predicate({ document }) : truePredicate()));
 
-  const tabsRenderedFromAttachments = (document.attachments || ([] as Attachment[]))
+  // TODO: OA v4 schema does not support attachments yet
+  const attachments = isV2Document(document) || isV3Document(document) ? document.attachments : ([] as Attachment[]);
+  const tabsRenderedFromAttachments = (attachments || ([] as Attachment[]))
     .map((attachment, index) =>
-      isV2Attachment(attachment)
+      isV2Attachment(attachment) // v2 uses attachment.type while v3 uses attachment.mimeType
         ? {
             id: `attachment-${index}`,
             label: attachment.filename || "Unknown filename",