MBS-10732: Add collaborator validation to collection form

Up until now a user could type in an editor name in the collaborators
field for a collection and try to submit without selecting a result,
leading to an ISE.

The error field is special-cased to remove the margin because otherwise
a margin of over 160px makes it look absurd.

Also, inputName for the autocomplete was incorrect, so this
fixes that.

lib/MusicBrainz/Server/Form/Collection.pm

@@ -78,4 +78,32 @@ sub validate_type_id {
     }
 }
 
+sub validate_collaborators {
+    my $self = shift;
+
+    my @collaborators = $self->field('collaborators')->fields;
+    my $is_valid = 1;
+    for my $collaborator (@collaborators) {
+        my $id_field = $collaborator->field('id');
+        my $name_field = $collaborator->field('name');
+        my $editor = $self->ctx->model('Editor')->get_by_name($name_field->value);
+        if (defined $name_field->value && !(defined $id_field->value)) {
+            if (defined $editor) {
+                $id_field->add_error(
+                    l('To add “{editor}” as a collaborator, please select them from the dropdown.',
+                      {editor => $name_field->value})
+                );
+            } else {
+                $id_field->add_error(
+                    l('Editor “{editor}” does not exist.',
+                      {editor => $name_field->value})
+                );
+            }
+            my $is_valid = 0;
+        }
+    }
+
+    return $is_valid;
+}
+
 1;

root/static/scripts/collection/components/CollectionEditForm.js

@@ -100,15 +100,19 @@ const CollectionEditForm = ({collectionTypes, form}: Props) => {
               />
               <div className="form-row-text-list">
                 {collaborators.field.map((collaborator, index) => (
-                  <div className="text-list-row" key={collaborator.html_name}>
+                  <div
+                    className="text-list-row"
+                    id="collaborators-form-list"
+                    key={collaborator.html_name}
+                  >
                     <Autocomplete
                       currentSelection={{
                         id: collaborator.field.id.value,
                         name: collaborator.field.name.value,
                       }}
                       entity="editor"
                       inputID={'id-' + collaborator.html_name}
-                      inputName={collaborator.html_name}
+                      inputName={collaborator.field.name.html_name}
                       onChange={(c) => handleCollaboratorChange(c, index)}
                     >
                       <input

root/static/styles/forms.less

@@ -152,6 +152,8 @@ form ul.errors {
     margin-left: @form-label-width + @form-margin;
 }
 
+#collaborators-form-list ul.errors { margin-left: 0; }
+
 .select-list-row ul.errors {
     margin-left: 0;
 }