Fullstack rendering / drilling

[DexterStorey]

This is also kind of a ticket for actions and blocks.

We need to make rendering of server and client payloads unwrap cleanly.

Consider a form that executes an action, and includes a nested select that fetches data.

const form = {
	node: 'sendEmailForm',
	input: {
		fields: {
			to: {
				node: 'selectInput',
				input: {
					options: {
						node: 'getPeople',
						input: {}
					}
				}
			},
			subject: {
				node: 'textInput',
				input: {}
			},
			body: {
				node: 'textInput',
				input: {}
			},
		}
	}
}

to render this, you would need to first call the getPeople action, then hydrate and render the form (including the select of those options). When the form is submitted, you hit the server again, then maybe do more stuff on the client (like a modal or toast or something). This is sort of a server → client → [await user input] → server → ... waterfall.

See drilling

See form demo and source

• The form doesn't currently render