Validation errors do not appear in "add approvers" modal

Summary

We recently added validation to prevent users creating approver groups with the same name.

The problem is that the validation error appears underneath the modal and at the top of the page, making it ineffective as feedback to the user that something bad has occurred.

Here's a screenshot. I had to scroll to the top of the page to see this:

Steps to reproduce

1. Add an approver group with the same name as one that already exists

What is the current bug behavior?

Validation error alert appears at the top of the page and under the modal.

What is the expected correct behavior?

Validation error alert appears inside the modal.

Relevant logs and/or screenshots

(Paste any relevant logs - please use code blocks (```) to format console output, logs, and code as it's tough to read otherwise.)

Output of checks

(If you are reporting a bug on GitLab.com, write: This bug happens on GitLab.com)

Results of GitLab environment info

Expand for output related to GitLab environment info

(For installations with omnibus-gitlab package run and paste the output of:
sudo gitlab-rake gitlab:env:info)
(For installations from source run and paste the output of:
sudo -u git -H bundle exec rake gitlab:env:info RAILS_ENV=production)

Results of GitLab application Check

Expand for output related to the GitLab application check

(For installations with omnibus-gitlab package run and paste the output of:
sudo gitlab-rake gitlab:check SANITIZE=true)
(For installations from source run and paste the output of:
sudo -u git -H bundle exec rake gitlab:check RAILS_ENV=production SANITIZE=true)
(we will only investigate if the tests are passing)

Possible fixes

(If you can, link to the line of code that might be responsible for the problem)