Add support for conditional rendering #12

New Issue

mitchell · 2024-06-04T23:02:29Z

mitchell commented

2024-06-04 23:02:29 +00:00

There should be a way to do conditional rendering. Like render components only if a certain condition is met, like age >= 18.
Perhaps this has something to do with the future implementation of groups.

There should be a way to do conditional rendering. Like render components only if a certain condition is met, like age >= 18. Perhaps this has something to do with the future implementation of groups.

mitchell commented

2024-06-05 22:29:40 +00:00

Like a <Show>. Could have a render when function added to all/some controls.

Like a `<Show>`. Could have a render when function added to all/some controls.

mitchell changed title from ~~Add support for Enum like rendering~~ to Add support for conditional rendering

2024-06-11 22:06:45 +00:00

mitchell added a new dependency 2024-06-11 22:07:07 +00:00

#19 Context

mitchell commented

2024-06-12 21:56:14 +00:00

This gets tough when you consider the validation and what should happen on the server.

Do you validate fields that aren't showing? Do you validate them on the server? What if the context is different on the client and server? Will this lead to different validations (not good)?

This gets tough when you consider the validation and what should happen on the server. Do you validate fields that aren't showing? Do you validate them on the server? What if the context is different on the client and server? Will this lead to different validations (not good)?

mitchell commented

2024-06-13 16:04:08 +00:00

If the validations always run and only the control is shown/hidden that would check all the boxes. However, if that validation fails, the form wouldn't submit and there would be no indication as to why.

If hidden controls don't validate, then we can't just blatantly add all the validations to a Vec and call it a day:

If it depends only on the context, this should be OK if we can replicate the context on the server.
If it depends on context and form data, this would be a problem, as we need to have the form data to decide what validations to run.

If it does depend on form data (needed for enum like rendering) we would need to store the validation functions along with their conditions to run.

If the validations always run and only the control is shown/hidden that would check all the boxes. However, if that validation fails, the form wouldn't submit and there would be no indication as to why. If hidden controls don't validate, then we can't just blatantly add all the validations to a Vec and call it a day: - If it depends only on the context, this should be OK if we can replicate the context on the server. - If it depends on context and form data, this would be a problem, as we need to have the form data to decide what validations to run. If it does depend on form data (needed for enum like rendering) we would need to store the validation functions along with their conditions to run.

mitchell commented

2024-06-18 16:14:52 +00:00

Conditional Rendering implemented, but has hydration issues.

Most likely this is happening because no matter weather the show is true or not, we are still rendering the view, but then only showing the view within the show.

I think if we move the rendering of the view into the show, this should be solved???

Conditional Rendering implemented, but has hydration issues. Most likely this is happening because no matter weather the show is true or not, we are still rendering the view, but then only showing the view within the show. I think if we move the rendering of the view into the show, this should be solved???

mitchell commented

2024-06-18 17:59:06 +00:00

Making the view a closure and moving that closure inside the show worked! Show When now works.