fix: handle initial value better

Author: brettkolodny

src/client/Preview.tsx

@@ -216,7 +216,7 @@ export const Preview: FC = () => {
 								</Button>
 							</div>
 						}
-						{!output ? (
+						{$parameters.length === 0 ? (
 							<div className="flex h-full w-full items-center justify-center overflow-x-clip rounded-xl border p-4">
 								<PreviewEmptyState />
 							</div>
@@ -585,7 +585,11 @@ const FormElement: FC<FormElementProps> = ({ parameter }) => {
 	const $setForm = useStore((state) => state.setFormState);
 
 	const value = useMemo(
-		() => $form[parameter.name] ?? parameter.default_value.value,
+		() =>
+			$form[parameter.name] ??
+			(parameter.default_value.value === "??"
+				? ""
+				: parameter.default_value.value),
 		[$form, parameter],
 	);
 

src/server/api.ts

@@ -6,15 +6,35 @@ import * as v from "valibot";
 
 export const BLOG_PATH = "parameters/share";
 
+export const ShareDataSchema = v.object({ code: v.string() });
+type ShareData = v.InferInput<typeof ShareDataSchema>;
+
+const putShareData = async (data: ShareData): Promise<string> => {
+	const id = nanoid();
+	await put(`${BLOG_PATH}/${id}.json`, JSON.stringify(data), {
+		addRandomSuffix: false,
+		access: "public",
+	});
+
+	return id;
+};
+
 const parameters = new Hono()
 	.get("/:id", async (c) => {
 		const { id } = c.req.param();
 		try {
-			const { url } = await head(`${BLOG_PATH}/${id}.txt`);
+			const { url } = await head(`${BLOG_PATH}/${id}.json`);
 			const res = await fetch(url);
-			const code = new TextDecoder().decode(await res.arrayBuffer());
+			const data = JSON.parse(
+				new TextDecoder().decode(await res.arrayBuffer()),
+			);
 
-			return c.json({ code });
+			const parsedData = v.safeParse(ShareDataSchema, data);
+			if (!parsedData.success) {
+				return c.json({ code: "// Something went wrong" }, 500);
+			}
+
+			return c.json(parsedData.output);
 		} catch (e) {
 			console.error(`Failed to load playground with id ${id}: ${e}`);
 			return c.json({ code: "" }, 404);
@@ -29,19 +49,16 @@ const parameters = new Hono()
 			}),
 		),
 		async (c) => {
-			const { code } = c.req.valid("json");
-			const bytes = new TextEncoder().encode(code);
+			const data = c.req.valid("json");
+			const bytes = new TextEncoder().encode(JSON.stringify(data));
 
+			// Check if the data is larger than 10kb
 			if (bytes.length < 1024 * 10) {
-				// throw new Error
+				console.error("Data larger than 10kb");
+				return c.json({ id: "" }, 500);
 			}
 
-			const id = nanoid();
-			await put(`${BLOG_PATH}/${id}.txt`, code, {
-				addRandomSuffix: false,
-				access: "public",
-			});
-
+			const id = await putShareData(data);
 			return c.json({ id });
 		},
 	);