Notebooks: editor, publish, upload, share polish

package.json

@@ -77,6 +77,8 @@
 		"lucide-react": "^0.577.0",
 		"react": "^19.2.4",
 		"react-dom": "^19.2.4",
+		"react-markdown": "^10.1.0",
+		"remark-gfm": "^4.0.1",
 		"sql-formatter": "^15.7.2",
 		"zod-to-json-schema": "^3.25.1"
 	}

src/components/ResourceBrowser/browser.tsx

@@ -408,7 +408,20 @@ export function Browser() {
 		setTags(chips.filter((c) => c !== tag));
 	};
 	const updateTextPart = (next: string) => {
-		const parsed = parseQuery(next);
+		// last token without trailing whitespace is "in progress" — don't parse yet
+		let toParse = next;
+		let tail = "";
+		if (!/\s$/.test(next)) {
+			const m = next.match(/^(.*\s)(\S*)$/);
+			if (m) {
+				toParse = m[1] ?? "";
+				tail = m[2] ?? "";
+			} else {
+				toParse = "";
+				tail = next;
+			}
+		}
+		const parsed = parseQuery(toParse);
 		if (parsed.chips.length > 0) {
 			const seen = new Set(chips.map(tagSlug));
 			const extra: string[] = [];
@@ -420,7 +433,7 @@ export function Browser() {
 				}
 			}
 			if (extra.length > 0) setTags([...chips, ...extra]);
-			setText(parsed.text);
+			setText([parsed.text, tail].filter(Boolean).join(" "));
 		} else {
 			setText(next);
 		}

src/components/confirm-dialog.tsx

@@ -0,0 +1,59 @@
+import {
+	AlertDialog,
+	AlertDialogAction,
+	AlertDialogCancel,
+	AlertDialogContent,
+	AlertDialogDescription,
+	AlertDialogFooter,
+	AlertDialogHeader,
+	AlertDialogTitle,
+} from "@health-samurai/react-components";
+import type { ReactNode } from "react";
+
+export function ConfirmDialog({
+	open,
+	onOpenChange,
+	title,
+	description,
+	confirmLabel = "Confirm",
+	cancelLabel = "Cancel",
+	danger = false,
+	onConfirm,
+}: {
+	open: boolean;
+	onOpenChange: (open: boolean) => void;
+	title: string;
+	description?: ReactNode;
+	confirmLabel?: string;
+	cancelLabel?: string;
+	danger?: boolean;
+	onConfirm: () => void;
+}) {
+	return (
+		<AlertDialog open={open} onOpenChange={onOpenChange}>
+			<AlertDialogContent className="max-w-lg">
+				<AlertDialogHeader>
+					<AlertDialogTitle>{title}</AlertDialogTitle>
+				</AlertDialogHeader>
+				{description && (
+					<AlertDialogDescription>{description}</AlertDialogDescription>
+				)}
+				<AlertDialogFooter>
+					<AlertDialogCancel onClick={() => onOpenChange(false)}>
+						{cancelLabel}
+					</AlertDialogCancel>
+					<AlertDialogAction
+						variant="primary"
+						danger={danger}
+						onClick={() => {
+							onConfirm();
+							onOpenChange(false);
+						}}
+					>
+						{confirmLabel}
+					</AlertDialogAction>
+				</AlertDialogFooter>
+			</AlertDialogContent>
+		</AlertDialog>
+	);
+}