[Import by URL] Update URL Import Form validation

Oiza Baiyerequested to merge
582110-SplitTicket-import-by-url-migrate-retry-logic into master

What does this MR do and why?

The purpose of this MR is to keep !221798 small.

There are two user (UI) flows for importing a project via URL.

  1. New project creation flow (/import/url/new): This is a multi-step Vue form that creates a project AND starts an import. See !201202 (merged)
  2. Existing project (or retry import) flow (/projects/:id/-/import/new): The project already exists. We need to import a repo OR retry a failed import. This form is in haml.

While migrating number 2 to Vue I made some updates to number 1. This MR is for those updates:

  • validate the url as user types
  • move the function for checking the git connection to a util file so it can be used in the retry form when I add it.

References

Screenshots or screen recordings

Before After

How to set up and validate locally

  1. Navigate to the url import form at /import/url/new
  2. Type a nonsense string for git url
  3. You can also try testing that the Check Connection button still works by adding a real git url

MR acceptance checklist

Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.

Related to #582110

Edited by Oiza Baiye

Merge request reports