1 files changed, 9 insertions, 8 deletions
diff --git a/packages/web-util/src/forms/DefaultForm.tsx b/packages/web-util/src/forms/DefaultForm.tsx
index 1155401f5..338460170 100644
--- a/packages/web-util/src/forms/DefaultForm.tsx
+++ b/packages/web-util/src/forms/DefaultForm.tsx
@@ -1,15 +1,16 @@
-import { Fragment, h } from "preact";
+import { Fragment, VNode, h } from "preact";
 import { FormProvider, FormProviderProps, FormState } from "./FormProvider.js";
 import { RenderAllFieldsByUiConfig, UIFormField } from "./forms.js";
 import { TranslatedString } from "@gnu-taler/taler-util";
+// import { FlexibleForm } from "./ui-form.js";
 
 /**
  * Flexible form uses a DoubleColumForm for design
  * and may have a dynamic properties defined by 
  * behavior function.
  */
-export interface FlexibleForm<T extends object> {
-  design: DoubleColumnForm;
+export interface FlexibleForm_Deprecated<T extends object> {
+  design: DoubleColumnForm_Deprecated;
   behavior?: (form: Partial<T>) => FormState<T>;
 }
 
@@ -20,9 +21,9 @@ export interface FlexibleForm<T extends object> {
  * have a description.
  * Every sections contain a set of fields.
  */
-export type DoubleColumnForm = Array<DoubleColumnFormSection | undefined>;
+export type DoubleColumnForm_Deprecated = Array<DoubleColumnFormSection_Deprecated | undefined>;
 
-export type DoubleColumnFormSection = {
+export type DoubleColumnFormSection_Deprecated = {
   title: TranslatedString;
   description?: TranslatedString;
   fields: UIFormField[];
@@ -39,20 +40,20 @@ export function DefaultForm<T extends object>({
   onSubmit,
   children,
   readOnly,
-}: Omit<FormProviderProps<T>, "computeFormState"> & { form: FlexibleForm<T> }) {
+}: Omit<FormProviderProps<T>, "computeFormState"> & { form: FlexibleForm_Deprecated<T> }): VNode {
   return (
     <FormProvider
       initial={initial}
       onUpdate={onUpdate}
       onSubmit={onSubmit}
       readOnly={readOnly}
-      computeFormState={form.behavior}
+      // computeFormState={form.behavior}
     >
       <div class="space-y-10 divide-y -mt-5 divide-gray-900/10">
         {form.design.map((section, i) => {
           if (!section) return <Fragment />;
           return (
-            <div class="grid grid-cols-1 gap-x-8 gap-y-8 pt-5 md:grid-cols-3">
+            <div key={i} class="grid grid-cols-1 gap-x-8 gap-y-8 pt-5 md:grid-cols-3">
               <div class="px-4 sm:px-0">
                 <h2 class="text-base font-semibold leading-7 text-gray-900">
                   {section.title}