@supernova-studio/client 0.9.0 → 0.9.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@supernova-studio/client",
-  "version": "0.9.0",
+  "version": "0.9.2",
   "description": "Supernova Data Models",
   "source": "src/index.ts",
   "main": "dist/index.js",

package/src/docs-editor/blocks-to-prosemirror.ts

@@ -72,7 +72,9 @@ export function pageToProsemirrorDoc(
 
 export function blockDefinitionForBlock(block: PageBlockEditorModel, definitions: PageBlockDefinition[]) {
   const definition = definitions.find(d => d.id === block.data.packageId);
-  if (!definition) throw new Error(`Could not find definition for ${block.id} (${block.data.packageId})`);
+  if (!definition) {
+    throw new Error(`Could not find definition for ${block.id} (${block.data.packageId})`);
+  }
 
   return definition;
 }

package/src/docs-editor/prosemirror-to-blocks.ts

@@ -37,15 +37,14 @@ import {
   PageBlockItemTableNode,
   PageBlockItemTableCell,
   PageBlockTableCellAlignment,
-  DocumentationItemConfiguration,
   PageBlockAppearanceV2,
-  PageBlockEditorModelV2,
   ColorValue,
 } from "@supernova-studio/model";
 import { PageBlockEditorModel } from "./model/block";
 import { DocumentationPageEditorModel } from "./model/page";
 import { BlockDefinitionUtils } from "./utils";
 import { yXmlFragmentToProsemirrorJSON } from "y-prosemirror";
+import { ZodSchema, z } from "zod";
 
 export function yDocToPage(yDoc: Y.Doc, definitions: PageBlockDefinition[]): DocumentationPageEditorModel {
   return yXmlFragmentToPage(yDoc.getXmlFragment("default"), definitions);
@@ -68,13 +67,23 @@ export function prosemirrorDocToPage(
   return {
     blocks: (prosemirrorDoc.content ?? [])
       .map(prosemirrorNode => {
-        const definitionId = parseProsemirrorBlockAttribute(prosemirrorNode, "definitionId");
-        if (!definitionId) throw new Error(`Node is missing defintion id`);
-        if (typeof definitionId !== "string")
-          throw new Error(`Definition id is ${typeof definitionId}, has to be string`);
+        const definitionId = getProsemirrorAttribute(prosemirrorNode, "definitionId", z.string());
+        if (!definitionId) {
+          console.warn(
+            `definitionId on ${prosemirrorNode.type} is required to be interpreted as a block, skipping node`
+          );
+
+          return null;
+        }
 
         const definition = definitionsById.get(definitionId);
-        if (!definition) throw new Error(`Definition by id ${definitionId} doesn't exist`);
+        if (!definition) {
+          console.warn(
+            `Block definitionId "${definitionId}" (prosemirror node ${prosemirrorNode.type}) is not among available definitions`
+          );
+          console.warn(prosemirrorNode);
+          return null;
+        }
 
         return prosemirrorNodeToBlock(prosemirrorNode, definition);
       })
@@ -122,13 +131,11 @@ function parseAsRichText(
   definition: PageBlockDefinition,
   property: PageBlockDefinitionProperty
 ): PageBlockEditorModel | null {
-  const id = parseProsemirrorBlockAttribute(prosemirrorNode, "id");
-  if (typeof id !== "string") return null;
-
-  const variantIdRaw = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "variantId");
-  const variantId = typeof variantIdRaw === "string" ? variantIdRaw : undefined;
+  const id = getProsemirrorBlockId(prosemirrorNode);
+  if (!id) return null;
 
-  const calloutType = parseCalloutType(parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "type"));
+  const variantId = getProsemirrorBlockVariantId(prosemirrorNode);
+  const calloutType = parseCalloutType(getProsemirrorAttribute(prosemirrorNode, "type", z.string()));
 
   return {
     // TODO Artem: indent
@@ -181,11 +188,10 @@ function parseAsMultiRichText(
   definition: PageBlockDefinition,
   property: PageBlockDefinitionProperty
 ): PageBlockEditorModel | null {
-  const id = parseProsemirrorBlockAttribute(prosemirrorNode, "id");
-  if (typeof id !== "string") return null;
+  const id = getProsemirrorBlockId(prosemirrorNode);
+  if (!id) return null;
 
-  const variantIdRaw = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "variantId");
-  const variantId = typeof variantIdRaw === "string" ? variantIdRaw : undefined;
+  const variantId = getProsemirrorBlockVariantId(prosemirrorNode);
 
   return {
     // TODO Artem: indent
@@ -253,11 +259,8 @@ function parseRichTextAttribute(mark: ProsemirrorMark): PageBlockTextSpanAttribu
     case "code":
       return { type: "Code" };
     case "link":
-      const itemIdRaw = parseProsemirrorBlockAttribute(mark, "itemId");
-      const itemId = typeof itemIdRaw === "string" ? itemIdRaw : undefined;
-
-      const hrefRaw = parseProsemirrorBlockAttribute(mark, "href");
-      const href = typeof hrefRaw === "string" ? hrefRaw : undefined;
+      const itemId = getProsemirrorAttribute(mark, "itemId", z.string());
+      const href = getProsemirrorAttribute(mark, "href", z.string());
 
       return {
         type: "Link",
@@ -279,13 +282,11 @@ function parseAsTable(
   definition: PageBlockDefinition,
   property: PageBlockDefinitionProperty
 ): PageBlockEditorModel | null {
-  const id = parseProsemirrorBlockAttribute(prosemirrorNode, "id");
-  if (typeof id !== "string") return null;
+  const id = getProsemirrorBlockId(prosemirrorNode);
+  if (!id) return null;
 
-  const variantIdRaw = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "variantId");
-  const variantId = typeof variantIdRaw === "string" ? variantIdRaw : undefined;
-
-  const hasBorder = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "hasBorder") !== false;
+  const variantId = getProsemirrorBlockVariantId(prosemirrorNode);
+  const hasBorder = getProsemirrorAttribute(prosemirrorNode, "hasBorder", z.boolean()) !== false;
 
   const tableChild = prosemirrorNode.content?.find(c => c.type === "table");
   if (!tableChild) {
@@ -338,14 +339,14 @@ function parseAsTable(
 }
 
 function parseAsTableCell(prosemirrorNode: ProsemirrorNode): PageBlockItemTableCell | null {
-  const id = parseProsemirrorBlockAttribute(prosemirrorNode, "id");
-  if (typeof id !== "string") return null;
+  const id = getProsemirrorBlockId(prosemirrorNode);
+  if (!id) return null;
 
-  const textAlign = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "textAlign");
+  const textAlign = getProsemirrorAttribute(prosemirrorNode, "textAlign", z.string());
 
   let columnWidth: number | undefined;
-  const columnWidthArray = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "colwidth");
-  if (Array.isArray(columnWidthArray) && typeof columnWidthArray[0] === "number") {
+  const columnWidthArray = getProsemirrorAttribute(prosemirrorNode, "colwidth", z.array(z.number()));
+  if (columnWidthArray) {
     columnWidth = columnWidthArray[0];
   }
 
@@ -384,8 +385,8 @@ function parseAsTableNode(prosemirrorNode: ProsemirrorNode): PageBlockItemTableN
       };
 
     case "image":
-      const url = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "src");
-      if (!url || typeof url !== "string") return null;
+      const url = getProsemirrorAttribute(prosemirrorNode, "src", z.string());
+      if (!url) return null;
 
       return {
         type: "Image",
@@ -458,15 +459,14 @@ function parseAsEmbed(
   definition: PageBlockDefinition,
   property: PageBlockDefinitionProperty
 ): PageBlockEditorModel | null {
-  const id = parseProsemirrorBlockAttribute(prosemirrorNode, "id");
-  if (typeof id !== "string") return null;
+  const id = getProsemirrorBlockId(prosemirrorNode);
+  if (!id) return null;
 
-  const variantIdRaw = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "variantId");
-  const variantId = typeof variantIdRaw === "string" ? variantIdRaw : undefined;
+  const variantId = getProsemirrorBlockVariantId(prosemirrorNode);
 
-  const url = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "url");
-  const caption = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "caption");
-  const height = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "height");
+  const url = getProsemirrorAttribute(prosemirrorNode, "url", z.string());
+  const caption = getProsemirrorAttribute(prosemirrorNode, "caption", z.string());
+  const height = getProsemirrorAttribute(prosemirrorNode, "height", z.number());
 
   return {
     id: id,
@@ -500,11 +500,10 @@ function parseAsDivider(
   prosemirrorNode: ProsemirrorNode,
   definition: PageBlockDefinition
 ): PageBlockEditorModel | null {
-  const id = parseProsemirrorBlockAttribute(prosemirrorNode, "id");
-  if (typeof id !== "string") return null;
+  const id = getProsemirrorBlockId(prosemirrorNode);
+  if (!id) return null;
 
-  const variantIdRaw = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "variantId");
-  const variantId = typeof variantIdRaw === "string" ? variantIdRaw : undefined;
+  const variantId = getProsemirrorBlockVariantId(prosemirrorNode);
 
   return {
     id: id,
@@ -527,11 +526,10 @@ function parseAsCustomBlock(
   prosemirrorNode: ProsemirrorNode,
   definition: PageBlockDefinition
 ): PageBlockEditorModel | null {
-  const id = parseProsemirrorBlockAttribute(prosemirrorNode, "id");
-  if (typeof id !== "string") return null;
+  const id = getProsemirrorBlockId(prosemirrorNode);
+  if (!id) return null;
 
-  const variantIdRaw = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "variantId");
-  const variantId = typeof variantIdRaw === "string" ? variantIdRaw : undefined;
+  const variantId = getProsemirrorBlockVariantId(prosemirrorNode);
 
   const appearance = parseAppearance(prosemirrorNode);
   const parsedItems = parseBlockItems(prosemirrorNode, definition);
@@ -552,8 +550,8 @@ function parseAsCustomBlock(
 }
 
 function parseBlockItems(prosemirrorNode: ProsemirrorNode, definition: PageBlockDefinition): PageBlockItemV2[] | null {
-  const itemsString = parseProsemirrorBlockAttribute(prosemirrorNode, "items");
-  if (typeof itemsString !== "string") return null;
+  const itemsString = getProsemirrorAttribute(prosemirrorNode, "items", z.string());
+  if (!itemsString) return null;
 
   const itemsJson: unknown = JSON.parse(itemsString);
   if (!Array.isArray(itemsJson)) {
@@ -567,13 +565,13 @@ function parseBlockItems(prosemirrorNode: ProsemirrorNode, definition: PageBlock
 function parseAppearance(prosemirrorNode: ProsemirrorNode): PageBlockAppearanceV2 | undefined {
   const appearance: PageBlockAppearanceV2 = {};
 
-  const columns: unknown = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "columns");
-  if (typeof columns === "number") {
+  const columns = getProsemirrorAttribute(prosemirrorNode, "columns", z.number());
+  if (columns) {
     appearance.numberOfColumns = columns;
   }
 
-  const backgroundColor: unknown = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, "backgroundColor");
-  if (typeof backgroundColor === "string") {
+  const backgroundColor = getProsemirrorAttribute(prosemirrorNode, "backgroundColor", z.string());
+  if (backgroundColor) {
     const parsedColor = ColorValue.safeParse(JSON.parse(backgroundColor));
     if (parsedColor.success) {
       appearance.itemBackgroundColor = parsedColor.data;
@@ -673,17 +671,35 @@ function valueSchemaForPropertyType(type: PageBlockDefinitionPropertyType) {
 // Attributes
 //
 
-function parseProsemirrorBlockAttribute(prosemirrorNode: ProsemirrorNode, attributeName: string): unknown {
-  const attributeValue = parseProsemirrorOptionalBlockAttribute(prosemirrorNode, attributeName);
-  if (!attributeValue) {
-    throw new Error(`Attribute ${attributeName} was not defined on node ${prosemirrorNode.type}`);
-  }
+function getProsemirrorBlockId(prosemirrorNode: ProsemirrorNode): string | undefined {
+  const id = getProsemirrorAttribute(prosemirrorNode, "id", z.string());
+  if (!id) console.warn(`Prosemirror attribute "id" on ${prosemirrorNode.type} is required`);
+  return id;
+}
 
-  return attributeValue;
+function getProsemirrorBlockVariantId(prosemirrorNode: ProsemirrorNode): string | undefined {
+  return getProsemirrorAttribute(prosemirrorNode, "variantId", z.string());
 }
 
-function parseProsemirrorOptionalBlockAttribute(prosemirrorNode: ProsemirrorNode, attributeName: string): unknown {
-  return prosemirrorNode.attrs?.[attributeName] ?? undefined;
+function getProsemirrorAttribute<O>(
+  prosemirrorNode: ProsemirrorNode,
+  attributeName: string,
+  validationSchema: ZodSchema<O>
+): O | undefined {
+  const attr: unknown = prosemirrorNode.attrs?.[attributeName] ?? undefined;
+  if (!attr) {
+    console.warn(`Prosemirror attribute ${attributeName} on ${prosemirrorNode.type} was not defined`);
+    return undefined;
+  }
+
+  const parsedAttr = validationSchema.safeParse(attr);
+  if (parsedAttr.success) {
+    return parsedAttr.data;
+  } else {
+    console.warn(`Prosemirror attribute ${attributeName} on ${prosemirrorNode.type} is not valid and will be ignored`);
+    console.warn(parsedAttr.error.flatten());
+    return undefined;
+  }
 }
 
 //