Add support for intoto v0.0.1 entries (#70)

* Add support for intoto v0.0.1 entries There are still many applications that upload intoto v001 entries, so adding back support. Fixes #69 Signed-off-by: Hayden Blauzvern <[email protected]> * prettier Signed-off-by: Hayden Blauzvern <[email protected]> --------- Signed-off-by: Hayden Blauzvern <[email protected]>
sigstore · Mar 1, 2024 · cee2879 · cee2879
1 parent 7f3e714
commit cee2879
Show file tree

Hide file tree

Showing 3 changed files with 88 additions and 5 deletions.
diff --git a/src/modules/components/Entry.tsx b/src/modules/components/Entry.tsx
@@ -18,11 +18,18 @@ import { Convert } from "pvtsutils";
 import { ReactNode } from "react";
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
 import { atomDark } from "react-syntax-highlighter/dist/cjs/styles/prism";
-import { DSSEV001Schema, IntotoV002Schema, LogEntry, RekorSchema } from "rekor";
+import {
+	DSSEV001Schema,
+	IntotoV001Schema,
+	IntotoV002Schema,
+	LogEntry,
+	RekorSchema,
+} from "rekor";
 import { toRelativeDateString } from "../utils/date";
 import { DSSEViewer } from "./DSSE";
 import { HashedRekordViewer } from "./HashedRekord";
-import { IntotoViewer } from "./Intoto";
+import { IntotoViewer001 } from "./Intoto001";
+import { IntotoViewer002 } from "./Intoto002";
 
 const DUMP_OPTIONS: jsyaml.DumpOptions = {
 	replacer: (key, value) => {
@@ -128,8 +135,13 @@ export function Entry({ entry }: { entry: LogEntry }) {
 			parsed = <HashedRekordViewer hashedRekord={body.spec as RekorSchema} />;
 			break;
 		case "intoto":
-			parsed = <IntotoViewer intoto={body.spec as IntotoV002Schema} />;
-			break;
+			if (body.apiVersion == "0.0.1") {
+				parsed = <IntotoViewer001 intoto={body.spec as IntotoV001Schema} />;
+				break;
+			} else {
+				parsed = <IntotoViewer002 intoto={body.spec as IntotoV002Schema} />;
+				break;
+			}
 		case "dsse":
 			parsed = <DSSEViewer dsse={body.spec as DSSEV001Schema} />;
 			break;

diff --git a/src/modules/components/Intoto001.tsx b/src/modules/components/Intoto001.tsx
@@ -0,0 +1,71 @@
+import { Box, Link, Typography } from "@mui/material";
+import { dump } from "js-yaml";
+import NextLink from "next/link";
+import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
+import { atomDark } from "react-syntax-highlighter/dist/cjs/styles/prism";
+import { IntotoV001Schema } from "rekor";
+import { decodex509 } from "../x509/decode";
+
+export function IntotoViewer001({ intoto }: { intoto: IntotoV001Schema }) {
+	const certContent = window.atob(intoto.publicKey || "");
+
+	const publicKey = {
+		title: "Public Key",
+		content: certContent,
+	};
+	if (certContent.includes("BEGIN CERTIFICATE")) {
+		publicKey.title = "Public Key Certificate";
+		publicKey.content = dump(decodex509(certContent), {
+			noArrayIndent: true,
+			lineWidth: -1,
+		});
+	}
+
+	return (
+		<Box>
+			<Typography
+				variant="h5"
+				sx={{ py: 1 }}
+			>
+				<NextLink
+					href={`/?hash=${intoto.content.payloadHash?.algorithm}:${intoto.content.payloadHash?.value}`}
+					passHref
+				>
+					<Link>Hash</Link>
+				</NextLink>
+			</Typography>
+
+			<SyntaxHighlighter
+				language="text"
+				style={atomDark}
+			>
+				{`${intoto.content.payloadHash?.algorithm}:${intoto.content.payloadHash?.value}`}
+			</SyntaxHighlighter>
+
+			<Typography
+				variant="h5"
+				sx={{ py: 1 }}
+			>
+				Signature
+			</Typography>
+			<SyntaxHighlighter
+				language="text"
+				style={atomDark}
+			>
+				{"Missing for intoto v0.0.1 entries"}
+			</SyntaxHighlighter>
+			<Typography
+				variant="h5"
+				sx={{ py: 1 }}
+			>
+				{publicKey.title}
+			</Typography>
+			<SyntaxHighlighter
+				language="yaml"
+				style={atomDark}
+			>
+				{publicKey.content}
+			</SyntaxHighlighter>
+		</Box>
+	);
+}
diff --git a/src/modules/components/Intoto.tsx → src/modules/components/Intoto002.tsx b/src/modules/components/Intoto.tsx → src/modules/components/Intoto002.tsx
@@ -6,7 +6,7 @@ import { atomDark } from "react-syntax-highlighter/dist/cjs/styles/prism";
 import { IntotoV002Schema } from "rekor";
 import { decodex509 } from "../x509/decode";
 
-export function IntotoViewer({ intoto }: { intoto: IntotoV002Schema }) {
+export function IntotoViewer002({ intoto }: { intoto: IntotoV002Schema }) {
 	const signature = intoto.content.envelope?.signatures[0];
 	const certContent = window.atob(signature?.publicKey || "");