🦊 Add gitlab support (#295)

* 🦊 Add moar gitlab steps for self-servicing.

* create 2 sections

* fix spacing & wording

---------

Co-authored-by: Hahnbee Lee <[email protected]>

settings/gitlab.mdx

@@ -1,28 +1,37 @@
 ---
 title: "GitLab"
 description: "Sync your docs with a GitLab repo"
-icon: 'gitlab'
+icon: "gitlab"
 ---
 
 <Check>
-  GitLab integration is available on the [Enterprise plan](https://mintlify.com/pricing).
+  GitLab integration is available on the [Enterprise
+  plan](https://mintlify.com/pricing).
 </Check>
 
+We use a combination of Access tokens and Webhooks to authenticate and sync
+changes between GitLab and Mintlify.
+
+- We use Access tokens to pull information from GitLab.
+- We use Webhooks so GitLab can notify Mintlify when changes are made.
+  - This allows Mintlify to create preview deployments when a MR is created.
+
+## Set up the connection
+
 <Steps>
   <Step title="Find your project ID">
-    Navigate to your project's `Settings` > `General` and find the Project ID.
+    Within your GitLab project, navigate to `Settings` > `General` and find the `Project ID`.
     <Frame>
       <img src="/images/gitlab/gitlab-project-id.png" />
     </Frame>
   </Step>
-  <Step title="Generate a project private token">
-
-    a. Navigate to your project's `Settings` > `Access Tokens`.
+  <Step title="Generate an access token">
+    a. Navigate to `Settings` > `Access Tokens`.
 
     b. Select `Add new token`.
-      1. Name the token "Mintlify" - this specific name is important as it will be visible when we make changes on our end.
-      2. Choose `read_api` for the scopes.
-      3. If you have a private repo, you must set the role as `Reporter`.
+      1. Name the token "Mintlify".
+      2. If you have a private repo, you must set the role as `Maintainer`.
+      3. Choose `api` and `read_api` for the scopes.
 
     c. Finally click `Create project access token` and copy the token.
 
@@ -31,7 +40,59 @@ icon: 'gitlab'
     </Frame>
 
   </Step>
-  <Step title="Reach out to the Mintlify team for final setup.">
-    Contact us [here](https://mintlify.com/enterprise).
+  <Step title="Set up the connection">
+    Within the [Mintlify dashboard](https://dashboard.mintlify.com/mintlify/mintlify/settings/deployment/git-settings), add the project ID and access token from the previous steps alongside the other configurations. Click "Save Changes" when you're done.
+    <Frame>
+      <img src="/images/gitlab/gitlab-config.png" />
+    </Frame>
   </Step>
 </Steps>
+
+## Create the webhook
+
+Webhooks allow us to receive events when changes are made so that we can
+automatically trigger deployments.
+
+<Steps>
+  <Step title="Navigate to Settings > Webhooks and click 'Add new Webhook'">
+    <Frame>
+      <img src="/images/gitlab/gitlab-webhook.png" />
+    </Frame>
+  </Step>
+  <Step title="Set up URL and webhook">
+    In the "URL" field, enter the endpoint `https://leaves.mintlify.com/gitlab-webhook` and name the webhook "Mintlify".
+
+  </Step>
+  <Step title="Paste token">
+    Paste the Webhook token generated after setting up the connection.
+    <Frame>
+      <img src="/images/gitlab/gitlab-show-webtoken.png" />
+    </Frame>
+  </Step>
+  <Step title="Select events">
+    Select the events you want to trigger the webhook:
+      - Push events (All branches)
+      - Merge requests events
+
+    When you're done it should look like this:
+    <Frame>
+      <img src="/images/gitlab/gitlab-project-webtoken.png" />
+    </Frame>
+  </Step>
+  <Step title="Test the Webhook">
+    After creating the Webhook, click the "Test" dropdown and select "Push events" to send a sample payload to ensure it's configured correctly. It'll say "Hook executed successfully: HTTP 200" if configured correctly.
+
+    This will help you verify that everything is working correctly and that your documentation will sync properly with your GitLab repository.
+    <Frame>
+      <img src="/images/gitlab/gitlab-project-webtoken-test.png" />
+    </Frame>
+
+  </Step>
+</Steps>
+
+<Note>
+  Reach out to the Mintlify team if you need help. Contact us
+  [here](https://mintlify.com/enterprise).
+</Note>
+
+[git-settings]: https://dashboard.mintlify.com/settings/deployment/git-settings