support for hiding fields

[squallstar]

ref https://github.com/Fliplet/fliplet-studio/issues/4349

[tonytlwu]

@squallstar Why not just create a field type called Hidden, which drops in a type="hidden" field?

[tonytlwu]

@squallstar And, a reminder for https://github.com/Fliplet/fliplet-studio/issues/2520 It'll be good that as we add more features we enhance JS APIs at the same time rather than waiting for a separate round of dev.

[squallstar]

@tonytlwu Judging from what Jo said on the other ticket, I think a hidden field makes sense to us as developers, but less to users. Furthermore, having it enabled on any field means that validation and other settings are kept.

[tonytlwu]

@squallstar I see. I agree with where we're heading with this then. I think there could be a few issues, though with validation and hidden fields that we should explore and verify.

1. Fields that are required or have validation errors as indicated by the browser, it'll trigger errors because the field is not focusable.
2. If the field is hidden, how will the validation error be shown and informed? What would be in the message and how does it get highlighted to the user?

[squallstar]

@tonytlwu I can easily toggle required to false when hidden gets set to true (the UI will reflect this, of course). Do you agree?

[squallstar]

@tonytlwu you OK with this?

[tonytlwu]

@squallstar But to a user, they might want a field to be hidden but required (despite the browser doesn't by default support this). As we further enhance the UI for users to bind the field to a specific value, e.g. email, user might want to hide an email field and specify that it's required.

I don't mind removing the required attribute but we'll need to run a custom required validation. And, going beyond required, there's also field data type, pattern and length validation. For example:

1. A hidden type="email" field has non-email values
2. A hidden type="text" field with pattern="[A-Za-z]{3}" has 12345 as value
3. A hidden type="text" field with maxlength="3" has 12345 as value

Basically, by hiding a field all the currently configurable and implicit validation rules still need to work. I imagine the errors will still be displayed at the bottom near the submit button, but because it's hidden it won't be highlighted.

[squallstar]

@tonytlwu I've managed to add a simple validation for required hidden fields with no value:

Anything else, like email/pattern/length validation would be much more complex and more importantly reinventing the wheel.

[tonytlwu]

Just thought of another one too, extending the list to:

1. A hidden type="email" field has non-email values
2. A hidden type="text" field with pattern="[A-Za-z]{3}" has 12345 as value
3. A hidden type="text" field with maxlength="3" has 12345 as value
4. A number field that allows positive numbers only has -1 as value

I thought it might be quite complex. That doesn't say anything about why we shouldn't do it though because you're essentially taking away features when a setting is enabled.

[squallstar]

@tonytlwu can this PR be closed? Just wondering if this has been implemented by Upplabs/Xor already.

[tonytlwu]

@squallstar No, this feature was never implemented. See template. Product needs to confirm the scope and priority of this before we review and retest this PR.