improve form config

frontend/src/lib/components/FieldHeader.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { twMerge } from 'tailwind-merge'
 	import Required from './Required.svelte'
+	import { addWhitespaceBeforeCapitals, capitalize } from '$lib/utils'
 
 	export let label: string
 	export let format: string = ''
@@ -13,7 +14,7 @@
 
 <div class="inline-flex flex-row items-center truncated">
 	<span class={twMerge('font-semibold', labelClass)}>
-		{label}
+		{addWhitespaceBeforeCapitals(label.replace(/_/g, ' ')).split(' ').map(capitalize).join(' ')}
 	</span>
 	<Required {required} class="!ml-0" />
 

frontend/src/lib/components/apps/components/buttons/AppSchemaForm.svelte

@@ -61,7 +61,7 @@
 {/each}
 
 <RunnableWrapper {outputs} {render} autoRefresh {componentInput} {id} bind:initializing bind:result>
-	{#if result && Object.keys(result.properties).length > 0}
+	{#if result && Object.keys(result?.properties ?? {}).length > 0}
 		<div
 			class={twMerge('m-2', css?.container?.class)}
 			style={css?.container?.style}

frontend/src/lib/components/apps/editor/component/components.ts

@@ -1757,10 +1757,14 @@ Hello \${ctx.username}
 				type: 'static',
 				fieldType: 'schema',
 				value: {
-					$schema: 'https://json-schema.org/draft/2020-12/schema',
-					properties: {},
-					required: [],
-					type: 'object'
+					properties: {
+						first_name: {
+							type: 'string',
+							description: 'your name',
+							default: 'default'
+						}
+					},
+					required: []
 				}
 			},
 			configuration: {
@@ -1768,13 +1772,13 @@ Hello \${ctx.username}
 					fieldType: 'boolean',
 					type: 'static',
 					value: false,
-					staticOnly: true
+					onlyStatic: true
 				},
 				largeGap: {
 					fieldType: 'boolean',
 					type: 'static',
 					value: false,
-					staticOnly: true
+					onlyStatic: true
 				}
 			}
 		}

frontend/src/lib/components/apps/editor/component/default-codes.ts

@@ -474,5 +474,31 @@ export async function main(db: Resource<"postgresql">) {
 }`,
 		python3: `def main():
 	return "Smile"`
+	},
+	schemaformcomponent: {
+		deno: `export async function main() {
+return {
+		properties: {
+			first_name: {
+				type: 'string',
+				description: 'your name',
+				default: 'default'
+			}
+		},
+		required: []
+	}
+}`,
+		python3: `def main():
+	return {
+		"properties": {
+			"first_name": {
+				"type": "string",
+				"description": "your name",
+				"default": "default"
+			}
+		},
+		"required": []
+	}
+`
 	}
 } as const