fix: consistent forms for UI

[saumeya]

closes #5443 #5262

Note on DCO:

If the DCO action in the integration test fails, one or more of your commits are not signed off. Please click on the Details link next to the DCO action for instructions on how to resolve this.

Before
https://user-images.githubusercontent.com/17771352/160873344-3ada56ad-3026-41e5-ba26-0eb82b84e36f.mp4

After

online-screen-recorder-2022-03-31--18-09-39.mp4

Checklist:

• Either (a) I've created an enhancement proposal and discussed it with the community, (b) this is a bug fix, or (c) this does not need to be in the release notes.
• The title of the PR states what changed and the related issues number (used for the release note).
• I've included "Closes [ISSUE #]" or "Fixes [ISSUE #]" in the description to automatically close the associated issue.
• I've updated both the CLI and UI to expose my feature, or I plan to submit a second PR with them.
• Does this PR require documentation updates?
• I've updated documentation as required by this PR.
• Optional. My organization is added to USERS.md.
• I have signed off all my commits as required by DCO
• I have written unit and/or e2e tests for my change. PRs without these are unlikely to be merged.
• My build is green (troubleshooting builds).

[codecov]

Codecov Report

Merging #8922 (16fa5e9) into master (a5933db) will decrease coverage by 0.04%.
The diff coverage is n/a.

@@            Coverage Diff             @@
##           master    #8922      +/-   ##
==========================================
- Coverage   45.00%   44.95%   -0.05%     
==========================================
  Files         212      212              
  Lines       25272    25272              
==========================================
- Hits        11373    11362      -11     
- Misses      12292    12306      +14     
+ Partials     1607     1604       -3     

Impacted Files	Coverage Δ
applicationset/services/scm_provider/github.go	63.52% <0.00%> (-17.65%)	⬇️
util/settings/settings.go	48.10% <0.00%> (ø)
applicationset/services/scm_provider/utils.go	88.50% <0.00%> (+4.59%)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update a5933db...16fa5e9. Read the comment docs.

[terrytangyuan]

It might be helpful to provide a screenshot of the change.

[ciiay]

It's a big task and you did a great job! It looks much better now. I only have two things I want to mention, and you may don't have to finish it within this scope.

1, How about for required fields, can we add “*” to the label as an indicator? It’s just an easier way to apply across the app. E.g. Repo URL is required. 
On project details page, there are a few “*”s, what does it mean there? If it means required as well, we can make it consistent across the app.
2, Warning message doesn’t match the label name. E.g. “Name” v.s. “Project name is required”, “Repository URL” v.s. “Repo URL is required”, “Repository Server Name” v.s. “Repository server name is required”

[saumeya]

It's a big task and you did a great job! It looks much better now. I only have two things I want to mention, and you may don't have to finish it within this scope.

1, How about for required fields, can we add “” to the label as an indicator? It’s just an easier way to apply across the app. E.g. Repo URL is required. 
On project details page, there are a few “”s, what does it mean there? If it means required as well, we can make it consistent across the app. 2, Warning message doesn’t match the label name. E.g. “Name” v.s. “Project name is required”, “Repository URL” v.s. “Repo URL is required”, “Repository Server Name” v.s. “Repository server name is required”

Thanks Yi, I definitely noticed these, but wasn't sure - as this would involve a lot more changes. Let me sync up with you today and we could go over these points quickly.

[reginapizza]

Hey Saumeya! Tested it out and it looks great, thanks :)

[ciiay]

LGTM
Thanks for the update! Looks great 👍

[terrytangyuan]

Looking great!

[alexmt]

LGTM. Thank you for cleaning up UI!