Next.js: generate better form inputs

[dunglas]

Description
The Next.js generator should generate form input similar to the ones generated by the React generator (with proper types, step, Bootstrap class in case of error etc): https://github.com/api-platform/client-generator/blob/master/templates/react/components/foo/Form.js#L32-L37

[metaclass-nl]

Then maybe date, time and datetime form input types can be generated too. Here is an example from my extended react client generator ( the Form of branch tutorial-chapter3 Form):

          {{#each formFields}}
            <FormRow
              name="{{{name}}}"
              label={<FormattedMessage id="{{{../lc}}}.{{{name}}}" defaultMessage="{{{name}}}" />}
              type="{{#compare type "==" "dateTime" }}datetime-local{{else}}{{{type}}}{{/compare}}"
              placeholder={{#if description}}{intl.formatMessage({id:"{{{../lc}}}.{{{name}}}.placeholder", defaultMessage:"{{{description}}}"}) }{{else}}""{{/if}}
              {{#if required}}required={true}{{/if}}
              {{#if step}}render={(field) => (
              <input step="{{{step}}}" {...field} />
              )}{{/if}}
              {{#if number}}
              format={inputLoc.formatNumber}
              normalize={inputLoc.normalizeNumber}
              {{/if}}
              {{#compare type "==" "checkbox" }}
              render={(field) => (
                <input checked={ values.{{{name}}} } {...field} />
              )}
              {{/compare}}{{#compare type "==" "date" }}
              format={inputLoc.formatDate}
              normalize={inputLoc.normalizeDate}
              {{/compare}}{{#compare type "==" "time" }}
              format={inputLoc.formatTime}
              normalize={inputLoc.normalizeTime}
              {{/compare}}{{#compare type "==" "dateTime" }}
              format={inputLoc.formatDateTime}
              normalize={inputLoc.normalizeDateTime}
              {{/compare}}
            />
            {{/each}}

This reacts to property type hints from the entity class at the api, like:

     * @ApiProperty(
     *     jsonldContext={"@type"="http://www.w3.org/2001/XMLSchema#date"}
     * )

It does require some extra imports in the generator:

import handlebars from "handlebars";
import hbh_comparison from "handlebars-helpers/lib/comparison";
import hbh_string from "handlebars-helpers/lib/string";

The generators parseFields function needs to pass on the range field:

      return {
        ...list,
        [field.name]: {
          notrequired: !field.required,
          name: field.name,
          type: this.getType(field),
          description: this.getDescription(field),
          readonly: false,
          reference: field.reference,
          range: field.range,
        },
      };

inputLoc is imported from templates/next/utils/inputLocalization.ts, FormRow from
templates/next/components/common/FormRow.tsx