Merge pull request #111 from packagist/clarify-integration-setup

Integrations: update GitLab guides

Author: glaubinix

Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-01-packagist-setup-20241219.png

@@ -1,28 +1,59 @@
 # GitLab (Self-Managed) Integration Setup
 ## Private Packagist Cloud
 
-## Initial Setup
+<div class="row column">
+    <div class="callout success">
+        <p>
+            This guide explains how to set up an OAuth integration for Private Packagist Cloud with the on-premises version of GitLab.
+            If you use their public service on GitLab.com, these instructions are not relevant to you. 
+        </p>
+        <p>If you are using our Self-Hosted product, please <a href="/docs/self-hosted/gitlab-integration-setup">use this guide</a>.</p>
+    </div>
+</div>
+
+To allow your users to authenticate to Private Packagist with their GitLab account, you'll first need to create
+an integration in Private Packagist. This document walks you through the required steps.
+
+## Open the Add Integration form
 
 From the organization settings page, select the "Integrations" subtab. Hit the "Add Integration" button on the integrations listing page to get to the form below.
-To set up a GitLab Self-Managed integration with Private Packagist, start by selecting "GitLab" as the plaform and enter the URL of your own GitLab server. A link to setup the OAuth application on your GitLab server will automatically be displayed.
+To set up a GitLab Self-Managed integration with Private Packagist, start by selecting "GitLab" as the platform and enter the URL of your own GitLab server. 
+A link to setup the OAuth application on your GitLab server will automatically be displayed.
 
-![Packagist Setup](/Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-01-packagist-setup.png)
+![Packagist Setup](/Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-01-packagist-setup-20241219.png)
 
 ## Add an OAuth Application
 
-Do not submit the integration form yet, but copy the content from the "Callback URL / Redirect URL" and follow the setup link to your GitLab server.
+Do not submit the integration form yet, but copy the content from the "Callback URL / Redirect URL" and follow the
+setup link to your GitLab server. The fields Client ID and Client Secret remain empty for now.
+
+On the GitLab applications page, click the "Add new application" button and fill in the form as shown here:
 
-![GitLab Form](/Resources/public/img/docs/integration-setup/gitlab-02-gitlab-form.png)
+![GitLab Form](/Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-02-gitlab-form.png)
 
-Make sure the "api" and "read_user" scopes are both checked and save the new application. This will reveal the credentials required to finish the setup on Private Packagist.
+Make sure the `api` and `read_user` scopes are both checked and save the new application. This will reveal the credentials required to finish the setup on Private Packagist.
 
 If you have full admin access on GitLab, then you can also create an application in the GitLab admin section under Applications.
-There are two additional checkmarks on that page: "trusted" should remain unchecked, and "confidential" should remain checked.
+There are two additional checkmarks on that page: `trusted` should remain unchecked, and `confidential` should remain checked.
 
-![GitLab Credentials](/Resources/public/img/docs/integration-setup/gitlab-03-gitlab-credentials.png)
+After you create the application, you will get a new Application ID and Secret. You'll need both these values to continue the set up in Private Packagist.
+
+![GitLab Credentials](/Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-03-gitlab-credentials.png)
 
 ## Finish the Setup
 
 Copy and paste the "Application Id" and "Secret" value back into the Private Packagist integration form and submit the form with the "Save Integration" button.
 
-![GitLab Credentials](/Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-04-packagist-form.png)
+![Complete integration form](/Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-04-packagist-form-20241219.png)
+
+You'll be redirected back to the list of integrations.
+
+### Share the GitLab login link
+
+The final step is sharing your organization-specific login link with your users. Look for the "Login link" button next to
+your newly created GitLab integration on the integrations page, and copy the URL.
+
+![GitLab integration](/Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-05-integration.png)
+
+This link presents the option to authenticate with your GitLab account and can now be used to log in to Private Packagist. 
+

Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-01-packagist-setup.png

@@ -25,7 +25,7 @@ A link to set up the OAuth application on GitHub will automatically be displayed
 
 ![Packagist Setup](/Resources/public/img/docs/integration-setup/self-hosted/github-01-packagist-setup.png)
 
-## Creating an OAuth Application
+## Create a GitHub OAuth Application
 Do not submit the integration form yet, but copy the content from the "Callback 
 URL / Redirect URL" and follow the setup link to your GitHub server. The fields 
 Client ID and Client Secret remain empty for now.
@@ -37,7 +37,7 @@ to get a new secret. You'll need the client ID and client secret to finish the s
 
 ![GitHub Credentials](/Resources/public/img/docs/integration-setup/github-03-github-credentials-20241219.png)
 
-## Finish the Setup
+## Create the integration
 Copy and paste the "Client ID" and "Client Secret" values back into the Private 
 Packagist integration form and submit the form with the "Create Integration" 
 button.

Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-02-gitlab-form.png

@@ -1,32 +1,51 @@
 # GitLab Integration Setup
 ## Private Packagist Self-Hosted
 
-This guide explains how to setup an OAuth integration for Private Packagist Self-Hosted with either the on-premises version of GitLab, or their public service on gitlab.com.  
-If you are using our cloud product at packagist.com, [use this guide](../cloud/gitlab-integration-setup.md).
+<div class="row column">
+    <div class="callout success">
+        <p>This guide explains how to set up an OAuth integration for Private Packagist Self-Hosted with either the on-premises version of GitLab, or their public service on GitLab.com.</p>
+        <p>If you are using our Cloud product at packagist.com, <a href="/docs/cloud/gitlab-integration-setup">use this guide</a>.</p>
+    </div>
+</div>
 
-## Initial Setup
-Hit the "Add Integration" button on the admin page in Private Packagist Self-Hosted to get to the form below. 
+To allow your users to authenticate to Private Packagist Self-Hosted with their GitLab account, you'll
+first need to create an integration in Private Packagist. This document walks you through the required steps.
+
+## Open the Add Integration form
+Go to the Admin section and hit the “Add Integration“ button to open the form to create your integration. If you've just
+installed Private Packagist Self-Hosted and it is still running in Setup Mode, you do not need to log in. If the application
+is no longer in Setup mode, you will have to log in with an admin account first.
 
 ![Add Integration](/Resources/public/img/docs/self-hosted/08-integration-create.png)
 
-To setup a GitLab integration with Private Packagist start by selecting "GitLab" as the platform and enter the URL of your own GitLab server or use <i>https://gitlab.com</i> for the public GitLab server as seen in the example below. A link to setup the oauth application on GitLab will automatically be displayed.
+To set up a GitLab integration with Private Packagist start by selecting "GitLab" as the platform and enter the URL of 
+your own GitLab server or use <i>https://gitlab.com</i> for the public GitLab server as seen in the example below. 
+A link to set up the OAuth application on GitLab will automatically be displayed.
 
-![Packagist Setup](/Resources/public/img/docs/integration-setup/gitlab-01-packagist-setup.png)
+![Packagist Setup](/Resources/public/img/docs/integration-setup/self-hosted/gitlab-01-packagist-setup.png)
 
-## Add an OAuth Application
-Do not submit the integration form yet, but copy the content from the "Callback URL / Redirect URL" and follow the setup link to your GitLab server.
+## Create a GitLab OAuth Application
+Do not submit the integration form yet, but copy the content from the "Callback URL / Redirect URL" and follow the 
+setup link to your GitLab server. The fields Client ID and Client Secret remain empty for now.
 
-![GitLab Form](/Resources/public/img/docs/integration-setup/gitlab-02-gitlab-form.png)
+![GitLab Form](/Resources/public/img/docs/integration-setup/self-hosted/gitlab-02-gitlab-form.png)
 
-Make sure the "api" and "read_user" scopes are both checked and save the new application. This will reveal the credentials required to finish the setup on Private Packagist.
+Make sure the `api` and `read_user` scopes are both checked and save the new application. This will reveal the credentials required to finish the setup on Private Packagist.
 
 Instead of the user settings, you can also create an application in the settings section of a GitLab group, or if you
 have full admin access on GitLab in the GitLab admin section under Applications.
-There are two additional checkmarks on that page: "trusted" should remain unchecked, and "confidential" should remain checked.
+There are two additional checkmarks on that page: `trusted` should remain unchecked, and `confidential` should remain checked.
 
-![GitLab Credentials](/Resources/public/img/docs/integration-setup/gitlab-03-gitlab-credentials.png)
+![GitLab Credentials](/Resources/public/img/docs/integration-setup/self-hosted/gitlab-03-gitlab-credentials.png)
 
-## Finish the Setup
+## Create the integration
 Copy and paste the "Application Id" and "Secret" value back into the Private Packagist integration form and submit the form with the "Create Integration" button.
 
-![GitLab Credentials](/Resources/public/img/docs/integration-setup/gitlab-04-packagist-form.png)
+![GitLab Credentials](/Resources/public/img/docs/integration-setup/self-hosted/gitlab-04-packagist-form.png)
+
+The GitLab integration will be created and you will be redirected to the admin page.
+
+The new integration will be shown in the list of available integrations, and your users can
+now log in to your Private Packagist Self-Hosted installation using their GitLab account.
+
+![Available integrations](/Resources/public/img/docs/integration-setup/self-hosted/gitlab-05-integrations-overview.png)

Resources/public/img/docs/integration-setup/cloud/gitlab-self-managed-03-gitlab-credentials.png

@@ -50,7 +50,7 @@ Private Packagist integrates with the following systems:
 * Webhooks: Code changes and releases
 
 #### GitLab
-* OAuth: Users authenticate on Private Packagist with their GitLab accounts
+* OAuth: Users authenticate on Private Packagist with their GitLab accounts. If you use Private Packagist Self-Hosted, first create a GitLab app by following these [steps](../docs/self-hosted/gitlab-integration-setup.md).
 * Synchronization:
     * Keeps teams, their members, and access permissions in sync with your GitLab groups
     * Individual collaborators aren't supported