Add submit validation errors

[olistrik]

@jerbob92 @wouter-willems

This is what Jeroen and I discussed. I've added an error type that can be thrown from the onSubmit callback and will register message errors on the form fields based on it's path in the form. If you thow a "FormValidationError", or even an array of them, it'll work out the box. Any other error thrown will bubble up as before.

The default error handler function can be overwritten with a provider to allow for automatic, application wide error mapping. This is particularly useful for DocHorizon, as all of our validation errors from the backend follow the same schema, and 9/10 times map directly to the form structure.

[olistrik]

Oh and I didn't want to keep appending to the app.component.ts so I added routing to the demo app.

[olistrik]

this file shouldn't have ended up in here, I made a seperate branch for it, but rebase go burr i guess.

I can't develop without it as it sets up node 16 (which is no longer maintained btw, so nixos considers it insecure).

flake.nix can't, and shouldn't be, git ignored. Having to remake and remove this file every time I need to work on enhancy forms is really irritating, so it would be very helpful for me if this is in version control.

[wouter-willems]

@olistrik reviewed

[wouter-willems]

I prefer to leave the comment explaining why the error was swallowed. What is the reason for removing that?

[olistrik]

I also prefer those comments! I must have removed it by mistake.

[wouter-willems]

• missing public/private.
• What is the reason for starting with _?

[olistrik]

they should have both been private, that's true.

the underscore is because they clash with the public getter otherwise.

private _foo: string;
public get foo() {
  return this._foo;
}

is a common js encapsulation style. though some people prefer using $ instead of _ but I read that as sfoo.

[olistrik]

but I've removed them in my new changes.

[wouter-willems]

since the name is always FORM_VALIDATION_ERROR , can just be a static final constant?

[olistrik]

As in a constant in the file? name is defined by the error interface, I can't make it static readonly in the class as that conflicts with the definition in the super class.

[wouter-willems]

for consistency's sake, getPath()

[olistrik]

I could also make it like this?

class ... {
  public readonly path: string;
  private message: string;
}

[olistrik]

actually, this would be sufficient:

export class FormValidationError extends Error {
	public readonly name = 'FormValidationError';
	public readonly path: string;

	constructor(path: string, message: string) {
		super(message);
		this.path = path;
	}
}

[olistrik]

I could also have name reference this.constructor.name. That should be static afaik.

[wouter-willems]

A reduce inside the condition is kinda hard to read. Also, this reducer does not have an initial value?

[olistrik]

I'll move it outside the if statement.

From developer.mozilla.org:

If initialValue is not specified, accumulator is initialized to the first value in the array, and callbackFn starts executing with the second value in the array as currentValue.

which clearly doesn't make sense in this situation. So it'll need to be init'd.

[olistrik]

I've added a utility for array typing.

[wouter-willems]

Misleading name, this doesnt render anything, but it sets the error object on a formControl

[olistrik]

fixed!

[wouter-willems]

@olistrik @jerbob92 merged