Merge branch 'kpaizee-convert-diagram-to-mermaid' into 'master'

Convert diagram to Mermaid

See merge request gitlab-org/gitlab!75002

doc/integration/mattermost/gitlab-mattermost.msc

-msc {
-  # Use https://mscgen.js.org or mscgen to convert this into PNG
-  hscale="1.5",
-  wordwraparcs=on;
-
-  user [ label="User", textbgcolor="blue", textcolor="white" ],
-  mattermost [ label="Mattermost", textbgcolor="red", textcolor="white"],
-  gitlab [ label="GitLab", textbgcolor="indigo", textcolor="white"];
-
-  user=>mattermost [label="GET https://mm.domain.com"];
-  mattermost note gitlab [label="Obtain access code", textcolor="green"];
-  mattermost=>gitlab [label="GET https://gitlab.domain.com/oauth/authorize", textcolor="indigo"];
-  gitlab rbox user [label="GitLab user logs in (if necessary)"];
-  gitlab rbox gitlab [label="GitLab verifies client_id matches an OAuth application"];
-  gitlab=>user [label="GitLab asks user to authorize Mattermost OAuth app"];
-  user=>gitlab [label="User clicks 'Allow'"];
-  gitlab rbox gitlab [label="GitLab verifies redirect_uri matches list of valid URLs"];
-  gitlab=>user [label="302 Redirect: https://mm.domain.com/signup/gitlab/complete"];
-  user=>mattermost [label="GET https://mm.domain.com/signup/gitlab/complete", textcolor="red"];
-  mattermost note gitlab [label="Exchange access code for access token", textcolor="green"];
-  mattermost=>gitlab [label="POST http://gitlab.domain.com/oauth/token", textcolor="indigo"];
-  gitlab=>gitlab [label="Doorkeeper::TokensController#create"];
-  gitlab=>mattermost [label="Access token", textcolor="red"];
-  mattermost note gitlab [label="Mattermost looks up GitLab user", textcolor="green"];
-  mattermost=>gitlab [label="GET https://gitlab.domain.com/api/v4/user", textcolor="indigo"];
-  gitlab=>mattermost [label="User details", textcolor="red"];
-  mattermost=>user [label="Mattermost/GitLab user ready"];
-}

doc/integration/mattermost/index.md

@@ -476,7 +476,27 @@ The following image is a sequence diagram for how GitLab works as an OAuth2
 provider for Mattermost. You can use this to troubleshoot errors
 in getting the integration to work:
 
-![sequence diagram](img/gitlab-mattermost.png)
+```mermaid
+sequenceDiagram
+    User->>Mattermost: GET https://mm.domain.com
+    Note over Mattermost, GitLab: Obtain access code
+    Mattermost->>GitLab: GET https://gitlab.domain.com/oauth/authorize
+    Note over User, GitLab: GitLab user signs in (if necessary)
+    Note over GitLab: GitLab verifies client_id matches an OAuth application
+    GitLab->>User: GitLab asks user to authorize Mattermost OAuth app
+    User->>GitLab: User selects 'Allow'
+    Note over GitLab: GitLab verifies redirect_uri matches list of valid URLs
+    GitLab->>User: 302 redirect: https://mm.domain.com/signup/gitlab/complete
+    User->>Mattermost: GET https://mm.domain.com/signup/gitlab/complete
+    Note over Mattermost, GitLab: Exchange access code for access token
+    Mattermost->>GitLab: POST http://gitlab.domain.com/oauth/token
+    GitLab->>GitLab: Doorkeeper::TokensController#35;create
+    GitLab->>Mattermost: Access token
+    Note over Mattermost, GitLab: Mattermost looks up GitLab user
+    Mattermost->>GitLab: GET https://gitlab.domain.com/api/v4/user
+    GitLab->>Mattermost: User details
+    Mattermost->>User: Mattermost/GitLab user ready
+```
 
 ## Troubleshooting the Mattermost CLI