Improve Project Services UI

Problem to solve

Currently, GitLab supports 24 project integrations, and over time that number will increase. As that number has grown, the UI for displaying the list of integrations has become unwieldy, and this problem will only get worse as more integrations are added. Additionally, as we investigate adding Group-level integrations, the pattern that this page establishes will also set the standard for how that will be implemented.

We should consider revisiting the design of this page to make these integrations easier to scan/read through, and make it more obvious which ones are currently in an enabled state. One solution would be to organize them by category, but now you have two problems (how I organize the categories visually now?)

Further details

Proposal

Documentation

Additional Considerations

When designing this new UX, here are some things that may be worth thinking about:

  • What if we end up adding the ability to support multiple copies of a single integration, such as integrating with two Jira instances? (#14347)
  • What if we add group-level integrations as well -- how do we should that a project is inheriting an integration from the group?
  • Is there a way we can tell if the most recent call made by that project service has failed? If so, should we indicate that?
  • Would it be valuable to be able to test the integration settings from this page (without having to click in to the integration itself)?
  • Should this list also link out to the documentation? Should the individual projects link to the docs instead, or in addition (where available)?

Links / references

Original Content

We have services that belongs to different kinds of applications, and does not make sense to activate some of them
at the same time. For example activate two issue tracker services like Redmine and Bugzilla.

Proposal

Improve services layout page organizing applications by categories. We can find services that belongs to CI, issue trackers chat and other kind of applications

Edited by 🤖 GitLab Bot 🤖