Improve integrations settings template
### Problem to solve
When setting up an integration with many configuration options, a sense of hierarchy can easily be lost with the current layout template. It is not always easy to understand:
1. Which fields are required / optional
1. What order the form should be filled out in
1. What each section does, without having to leave the config view to read the documentation
1. Visually, the [layout appears unbalanced and misaligned](https://gitlab.com/gitlab-org/gitlab/-/issues/335528), especially on larger monitors
| Current - integration settings example | Proposed layout - integration settings example|
| ------ | ------ |
|  | |
As we work towards extending integration like this by adding more configurations options, this problem will grow.
### Proposal
* Leverage existing layouts that already solve this problem well like the [Preferences](https://gitlab.com/profile/preferences) view, [Access token](https://gitlab.com/profile/personal_access_tokens) view, or the [Prometheus integration](https://gitlab.com/lvanc/integration-jira/-/services/prometheus/edit) view.
* Chunk the form down into logical sections
* Reorder the sections in a logical order
* Add better supporting microcopy to each section
* Use [progressive disclosure](https://www.nngroup.com/articles/progressive-disclosure/) when possible
* Updated layout templates should consider a "Fluid" Layout Width. See https://gitlab.com/gitlab-org/gitlab/-/issues/335528 for more details
### Implementation
An individual issue has been created for each integration in order to better break down and track this effort.
- [ ] Asana
- [ ] Assembla
- [ ] Atlassian Bamboo
- [ ] Bugzilla
- [ ] Buildkite
- [ ] Campfire
- [ ] Confluence Workspace
- [ ] Custom issue tracker
- [ ] Datadog
- [x] Discord Notifications
- [ ] Drone
- [ ] EWM
- [ ] Emails on push
- [x] External wiki
- [ ] Flowdock
- [ ] GitHub
- [ ] Google Chat
- [ ] Irker (IRC Gateway)
- [ ] Jenkins
- [ ] JetBrains TeamCity
- [x] Jira
- [ ] Mattermost notifications
- [ ] Mattermost slash commands
- [x] Microsoft Teams notifications
- [ ] Packagist
- [ ] Pipeline status emails
- [ ] PivotalTracker
- [ ] Prometheus
- [ ] Pushover
- [ ] Redmine
- [x] Slack application
- [x] Slack notifications
- [ ] Unify Circuit
- [ ] Webex Teams
- [ ] YouTrack
_Note: issues listed in this epic are prioritized based on usage and the number of form sections. The idea is to implement the more complex integrations first which _should_ make implementing integration with less configurations faster._
### Todo
- [x] Identify common sections across all integrations, i.e. Connection details, Trigger, etc.
### Product Priority
1. Prometheus
1. Pipeline emails
1. Emails on push
2. Datadog
3. Discord
4. Mattermost
5. Redmine
6. Jenkins
7. Youtrack
8. Other -- will revisit priority once those above are completed.
** Slack/Jira are highest priority but the Jira template is updated and we're waiting to apply updates to the Slack template until we know if there are impacts with active updates.
epic