Sealpage - jak będziemy wyświetlać formularze

Po dzisiejszym brainstormie z @arkadiusz.wieczorek mamy już odpowiedź na pytanie, które narodziło się w trakcie prac nad designami widoku tworzenia/edycji elementów kolekcji, a mianowicie: “Jaki layout nadać inputom formularza”?

Na początku myśleliśmy, aby robić to jakoś algorytmicznie, ale zdecydowaliśmy, że nasz pomysł na implementację zaawansowanego algorytmu Sztucznej Inteligencji

dawałby rezultat zbyt kłopotliwy dla programistów Sealpage’a i jego docelowych użytkowników.

Zdecydowaliśmy się nie próbować zastępować człowieka komputerem tam, gdzie komputer radzi sobie gorzej. Po prostu damy możliwość deklaratywnego określania, jak pola formularza mają być pogrupowane i sformatowane.

Introducing display hints

Dodaliśmy do sealiousa możliwość dodawania “display hints” do kolekcji i pól kolekcji. Używa się ich w następujący sposób:

dla pól:

{
	name: "author",
	type: "text",
	required: true,
	display_hints: { group: "metadata" },
},
{
	name: "body",
	type: "array-of-objects",
	required: true,
	display_hints: { group: "content" },
},

dla kolekcji:

const articles = app.createChip(app.Sealious.Collection, {
	name: "articles",
	fields: [
		...
	],
	display_hints: { groups: ["metadata", "content"] },
});

display_hints póki co nie mają żadnej sformalizowanej struktury. Ustawia je się tak, żeby były minimalne ale wystarczające do automatycznego generowania formularzy.

@arkadiusz.wieczorek ma już wstępne layouty (podeślesz? :wink: )

Display hints będą zwracane w endpoincie /specification, dzięki czemu front-end będzie mógł ich użyć bez żadnego problemu.

Niedługo założę na to taska. Feedback mile widziany :wink:

3 Likes

W tym tygodniu planuje jeszcze popracować nad tym, bardziej złożone komponenty np. sekcja kontakt czy też obrazek z podpisem będą zrealizowane podobnie co przedstawiony Markdown component. W trybie dodawania takiego komponentu będzie w ramach jednego okienka np. kilka inputów wewnątrz.

View z ostatniej iteracji:

1 Like

Dodałem drobnego commita, w którym są prowizoryczne display_hints

https://hub.sealcode.org/rMIDLINEBLOGac4ecb0f52cd37419e4a7d5c743b1ba1f8f3afaa

1 Like