Merge pull request #897 from trey-wallis/dev

8.15.6

Author: decaf-dev

manifest.json

@@ -9,5 +9,5 @@
 	"fundingUrl": {
 		"Buymeacoffee": "https://www.buymeacoffee.com/treywallis"
 	},
-	"version": "8.15.5"
+	"version": "8.15.6"
 }

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "obsidian-dataloom",
-	"version": "8.15.5",
+	"version": "8.15.6",
 	"description": "Weave together data from diverse sources into different views. Inspired by Excel Spreadsheets and Notion.so.",
 	"main": "main.js",
 	"scripts": {

src/data/serialize-frontmatter.ts

@@ -62,6 +62,11 @@ export const serializeFrontmatter = async (app: App, state: LoomState) => {
 					rowId: row.id,
 				});
 
+			const { hasValidFrontmatter } = cell;
+			//If we don't have valid frontmatter, skip this cell, so we don't overwrite the invalid value
+			//we want the user to correct it themselves
+			if (hasValidFrontmatter === false) continue;
+
 			let saveValue: unknown = null;
 			if (type === CellType.TEXT) {
 				const { content } = cell as TextCell;

src/data/serialize-state.ts

@@ -25,6 +25,7 @@ import {
 	LoomState17,
 	LoomState18,
 	LoomState19,
+	LoomState20,
 } from "src/shared/loom-state/types";
 
 import {
@@ -52,6 +53,7 @@ import {
 } from "src/shared/loom-state/migrate";
 import { LoomStateObject } from "src/shared/loom-state/validate-state";
 import DeserializationError from "./deserialization-error";
+import MigrateState21 from "src/shared/loom-state/migrate/migrate-state-21";
 
 export const serializeState = (state: LoomState): string => {
 	//Filter out any source rows, as these are populated by the plugin
@@ -304,6 +306,16 @@ export const deserializeState = (
 			failedMigration = null;
 		}
 
+		const VERSION_8_15_6 = "8.15.6";
+		if (isVersionLessThan(fileVersion, VERSION_8_15_6)) {
+			failedMigration = VERSION_8_15_6;
+			const nextState = new MigrateState21().migrate(
+				currentState as LoomState20
+			);
+			currentState = nextState;
+			failedMigration = null;
+		}
+
 		//TODO handle previous versions?
 		LoomStateObject.check(currentState);
 

src/react/loom-app/body-cell-container/index.tsx

@@ -69,6 +69,7 @@ import { getSourceCellContent } from "src/shared/cell-content/source-cell-conten
 import { getSourceFileContent } from "src/shared/cell-content/source-file-content";
 import { getFileCellContent } from "src/shared/cell-content/file-cell-content";
 import { getDateCellContent } from "src/shared/cell-content/date-cell-content";
+import DisabledCell from "../disabled-cell";
 
 interface BaseCellProps {
 	frontmatterKey: string | null;
@@ -185,6 +186,7 @@ export default function BodyCellContainer(props: Props) {
 	const {
 		id,
 		columnId,
+		hasValidFrontmatter,
 		source,
 		includeTime,
 		aspectRatio,
@@ -216,7 +218,17 @@ export default function BodyCellContainer(props: Props) {
 		type === CellType.MULTI_TAG ||
 		type === CellType.DATE;
 
-	const isDisabled = source !== null && frontmatterKey === null;
+	let isDisabled = false;
+	if (hasValidFrontmatter === false) {
+		isDisabled = true;
+	} else if (
+		source !== null &&
+		frontmatterKey === null &&
+		type !== CellType.SOURCE &&
+		type !== CellType.SOURCE_FILE
+	) {
+		isDisabled = true;
+	}
 
 	const isUneditable =
 		type === CellType.CHECKBOX ||
@@ -239,14 +251,12 @@ export default function BodyCellContainer(props: Props) {
 
 	function onMenuTriggerEnterDown(cellActionCallback: () => void) {
 		return () => {
-			if (isDisabled) return;
 			cellActionCallback();
 		};
 	}
 
 	function onMenuTriggerClick(cellActionCallback: () => void) {
 		return () => {
-			if (isDisabled) return;
 			cellActionCallback();
 		};
 	}
@@ -322,23 +332,29 @@ export default function BodyCellContainer(props: Props) {
 
 	if (isUneditable) {
 		className += " dataloom-cell--uneditable";
-	} else if (isDisabled) {
-		className += " dataloom-cell--disabled";
 	}
 
 	let shouldRunTrigger = true;
-	if (isUneditable || isDisabled) {
+	if (isUneditable) {
 		shouldRunTrigger = false;
 	}
 
-	let ariaLabel = "";
-	if (
-		isDisabled &&
-		type !== CellType.SOURCE &&
-		type !== CellType.SOURCE_FILE
-	) {
-		ariaLabel =
-			"This cell is disabled until you choose a frontmatter key for this column";
+	if (isDisabled) {
+		return (
+			<div
+				className={
+					className + " dataloom-cell--body__container--no-padding"
+				}
+				style={{
+					width,
+				}}
+			>
+				<DisabledCell
+					hasValidFrontmatter={hasValidFrontmatter ?? true}
+					doesColumnHaveFrontmatterKey={frontmatterKey !== null}
+				/>
+			</div>
+		);
 	}
 
 	let contentNode: React.ReactNode | null = null;
@@ -728,7 +744,6 @@ export default function BodyCellContainer(props: Props) {
 	return (
 		<>
 			<MenuTrigger
-				ariaLabel={ariaLabel}
 				ref={menu.triggerRef}
 				variant="cell"
 				menuId={menu.id}

src/react/loom-app/body-cell-container/styles.css

@@ -3,16 +3,15 @@
     width: 100%;
     height: 100%;
     min-height: var(--dataloom-cell-min-height);
-    padding: var(--dataloom-cell-spacing-x) var(--dataloom-cell-spacing-y);
+	padding: var(--dataloom-cell-spacing-x) var(--dataloom-cell-spacing-y);
     cursor: pointer;
     color: var(--text-normal); /* Stop dimming of text when mouse leaves embedded loom */
 }
 
-.dataloom-cell--uneditable {
-	cursor: default;
+.dataloom-cell--body__container--no-padding {
+	padding: 0;
 }
 
-.dataloom-cell--disabled {
+.dataloom-cell--uneditable {
 	cursor: default;
-	background-color: var(--background-secondary);
 }

src/react/loom-app/disabled-cell/index.tsx

@@ -0,0 +1,27 @@
+import Text from "src/react/shared/text";
+
+import "./styles.css";
+
+interface Props {
+	hasValidFrontmatter: boolean;
+	doesColumnHaveFrontmatterKey: boolean;
+}
+
+export default function DisabledCell({
+	hasValidFrontmatter,
+	doesColumnHaveFrontmatterKey,
+}: Props) {
+	let ariaLabel = "";
+	if (!doesColumnHaveFrontmatterKey) {
+		ariaLabel =
+			"This cell is disabled until you choose a frontmatter key for this column";
+	} else if (!hasValidFrontmatter) {
+		ariaLabel =
+			"This cell has an invalid property value. Please correct it in the source file.";
+	}
+	return (
+		<div className="dataloom-disabled-cell" aria-label={ariaLabel}>
+			<Text value={hasValidFrontmatter ? "" : "Invalid property value"} />
+		</div>
+	);
+}

src/react/loom-app/disabled-cell/styles.css

@@ -0,0 +1,7 @@
+.dataloom-disabled-cell {
+	width: 100%;
+	height: 100%;
+	background-color: var(--background-secondary);
+	cursor: default;
+	padding: var(--dataloom-cell-spacing-x) var(--dataloom-cell-spacing-y);
+}

src/react/loom-app/table/index.tsx

@@ -376,10 +376,11 @@ const Table = React.forwardRef<VirtuosoHandle, Props>(function Table(
 
 						key = column.id;
 
-						const { id } = cell;
+						const { id, hasValidFrontmatter } = cell;
 
 						const commonProps = {
 							id,
+							hasValidFrontmatter,
 							columnId,
 							frontmatterKey,
 							verticalPadding,