Skip to content

docs: refactored integration guides images SEO and accessibility #129

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 7 commits into from
Closed

docs: refactored integration guides images SEO and accessibility #129

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
91f9e8e
docs: refactored integration guides images SEO and accessibility
tyaga001 Nov 1, 2024
d687c2d
🎨 pnpm run lint:fix
github-actions[bot] Nov 5, 2024
b105648
docs: added newline at end of file.
tyaga001 Nov 6, 2024
34f7c5d
🎨 pnpm run lint:fix
github-actions[bot] Nov 6, 2024
060f4a2
chore: verify commit signing for previous commits
tyaga001 Nov 6, 2024
e8f20a9
Merge branch 'main' into docs/improve-image-seo
tyaga001 Nov 7, 2024
419fd55
Merge branch 'main' into docs/improve-image-seo
tyaga001 Nov 11, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions docs/platforms/azure-devops.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,14 +28,14 @@ DevOps.

:::

![azure devops apps consent](/img/integrations/azure_apps_consent_page.png)
![CodeRabbit admin consent page for Azure DevOps integration showing Microsoft authentication URLs and continue button for granting application permissions](/img/integrations/azure_apps_consent_page.png)

3. Once your administrator has approved the applications, click "Continue."
4. You will be redirected to the "Onboarding" page, where you can select the
organization you wish to integrate with.
5. On the "Azure DevOps User" page, enter your Personal Access Token for Azure
DevOps.
![azure devops user page](/img/integrations/azure_devops_user_page.png)
![Azure DevOps integration settings page showing organization user ID and personal access token input field for CodeRabbit configuration](/img/integrations/azure_devops_user_page.png)
6. To install CodeRabbit on a repository, toggle the switch on the
"Repositories" page.

Expand All @@ -58,7 +58,7 @@ your existing users.
Upon first login to the application (immediately after the onboarding screen),
you will need to add the Personal Access Token.

![azure devops user modal](/img/integrations/azure_personal_access_token_add.png)
![Azure DevOps integration modal with personal access token input field and documentation link for connecting CodeRabbit to Azure DevOps API](/img/integrations/azure_personal_access_token_add.png)

### Recommendations

Expand Down Expand Up @@ -98,4 +98,4 @@ Follow these steps to generate the token:
on pull requests.
8. Click "Create"

![Generate Personal Access Token](/img/integrations/azure-access-token.png)
![Azure DevOps personal access token creation form showing name field, organization selector, expiration date, and detailed permission scopes for work items, code, build, release, test management, and packaging](/img/integrations/azure-access-token.png)
6 changes: 3 additions & 3 deletions docs/platforms/github-enterprise-server.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,13 +25,13 @@ complete, you can log in directly.
**Visit CodeRabbit:** Visit our [Login](https://coderabbit.ai/login) page and
select Self-Hosted GitHub

![login-page](/img/integrations/login-self-hosted-github.png)
![CodeRabbit login page displaying multiple sign-in options - Login with GitHub, Login with GitLab, Self-Hosted GitHub and GitLab](/img/integrations/login-self-hosted-github.png)

On this page, enter the URL of your self-managed GitHub instance and click
submit. Once, you submit, we check our database for a record of your
organization and if we find an existing one, we will start the login process.

![Untitled](/img/integrations/self-hosted-github-host-url.png)
![Self-hosted GitHub Enterprise connection page for CodeRabbit showing URL input field for GitHub instance domain](/img/integrations/self-hosted-github-host-url.png)

If the self-managed GitHub instance is not found, you will be required to enter
more details for the onboarding.
Expand Down Expand Up @@ -66,7 +66,7 @@ Keep the following details handy:
- Client ID
- Client secret

![GitHub OAuth Client ID & Secret](/img/integrations/github-oauth-client-id-secret.png)
![GitHub Developer Settings page showing CodeRabbit OAuth application configuration with client ID display, client secret management](/img/integrations/github-oauth-client-id-secret.png)

### **Step 3: GitHub App**

Expand Down
6 changes: 3 additions & 3 deletions docs/platforms/gitlab-com.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,15 +27,15 @@ To interact with the GitLab API, a **Personal Access Token** is required. This t

Upon first login to the application (immediately after the onboarding screen), you will need to choose based on your organization's requirements.

![gitlab user modal choice](/img/integrations/gitlab_user_choice.png)
![GitLab repository access configuration modal showing how to choose between default CodeRabbit user or organization user token](/img/integrations/gitlab_user_choice.png)

**We recommend using the default CodeRabbit user** for most organizations, as it is pre-configured. However, we understand that some organizations may prefer more control over the user or have restrictions regarding user inclusion within their organization.

### Personal Access Tokens

If your organization opts to use another user within the organization, you can do so by [generating a personal access token](#generating-a-personal-access-token).

![gitlab organization user modal choice](/img/integrations/gitlab_organization_user.png)
![GitLab integration configuration modal showing personal access token input field and organization user setup with detailed instructions for token integration](/img/integrations/gitlab_organization_user.png)

#### Recommendations

Expand Down Expand Up @@ -67,4 +67,4 @@ GitLab provides an option to generate a personal access token for a new user. Fo
9. Click "Create Personal Access Token."
10. Note down the token as it will only be displayed once.

![Untitled](/img/integrations/admin-access-token.png)
![GitLab personal access token configuration page showing token name input, expiration date selector, and API permission scopes including read/write access options](/img/integrations/gitlab-personal-access-token-scopes-setup.png)
12 changes: 6 additions & 6 deletions docs/platforms/self-hosted-gitlab.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,15 +22,15 @@ upgrading your GitLab instance to obtain the intended experience.
**Visit CodeRabbit:** Visit our [Login](https://coderabbit.ai/login) page and
select Self-Hosted GitLab

![login-page](/img/integrations/login-self-hosted-gitlab.png)
![CodeRabbit login page displaying multiple sign-in options - Login with GitHub, Login with GitLab, Self-Hosted GitHub and GitLab](/img/integrations/login-self-hosted-gitlab.png)

### Step 2: Enter your Self-Managed GitLab URL

On this page, enter the URL of your self-managed GitLab instance and click
submit. Once, you submit, we check our database for a record of your
organization and if we find an existing one, we are starting the login process.

![Untitled](/img/integrations/self-hosted-gitlab-host-url.png)
![Self-hosted Gitlab enterprise connection page for CodeRabbit](/img/integrations/self-hosted-gitlab-host-url.png)

If the self-managed GitLab instance is not found, we initiate the onboarding
process, which can be either manual or automated.
Expand All @@ -39,7 +39,7 @@ process, which can be either manual or automated.

#### 1. Automated onboarding

![Untitled](/img/integrations/automated-onboarding.png)
![Self-managed GitLab connection page showing instance URL input, admin access token field, installation type toggles (Manual/Automated)](/img/integrations/automated-onboarding.png)

#### **Why do we need the Admin Access Token?**

Expand All @@ -55,7 +55,7 @@ add CodeRabbit manually on the projects you wish, as the next step.
For the manual onboarding process we need to create the
[CodeRabbit user](#creating-coderabbit-user) and the
[OAuth2 GitLab application](#creating-oauth2-application).
![Untitled](/img/integrations/manual-onboarding.png)
![Self-managed GitLab connection page showing instance URL input, admin access token field, installation type toggles (Manual/Automated)](/img/integrations/manual-onboarding.png)

#### **Creating CodeRabbit user**

Expand Down Expand Up @@ -105,14 +105,14 @@ the token, please follow the process outlined below:
9. Select Create personal access token.
10. Please note down this token as this will be visible one time only

![Untitled](/img/integrations/admin-access-token.png)
![GitLab personal access token configuration page showing token name input, expiration date selector, and API permission scopes including read/write access options](/img/integrations/gitlab-personal-access-token-scopes-setup.png)

### **Step 4: Paste the details and click submit**

- Submit the form.
- We will handle the setup process for you.
- On subsequent visits, your setup will be automatically detected, allowing for
direct login. ![Untitled](/img/integrations/self-hosted-page.png)
direct login. ![CodeRabbit authentication options page displaying three login choices - GitHub login button, GitLab login button, and Self-Hosted GitLab option](/img/integrations/self-hosted-page.png)

### **Step 5: Whitelist CodeRabbit IP address**

Expand Down
0 ...c/img/integrations/admin-access-token.png → ...ab-personal-access-token-scopes-setup.png
View file
Open in desktop
File renamed without changes
Loading