Launchpad: add GitHub Enterprise and GitLab Self-Managed support (#42)

* Add support for GitHub Enterprise to Launchpad * Add support for GitLab Self-Managed to Launchpad * Add link to Integration Settings to the ConnectAProvider component
gitkraken · May 31, 2024 · 7ab5f05 · 7ab5f05
1 parent f54c9bf
commit 7ab5f05
Show file tree

Hide file tree

Showing 6 changed files with 63 additions and 22 deletions.
diff --git a/src/deepLink.ts b/src/deepLink.ts
@@ -210,9 +210,11 @@ export const getGitKrakenDeepLinkUrl = (provider: FocusViewSupportedProvider, ur
 	let redirectUrl = '';
 	switch (provider) {
 		case 'github':
+		case 'githubEnterprise':
 			redirectUrl = getGitHubRedirectUrl(url, 'vscode');
 			break;
 		case 'gitlab':
+		case 'gitlabSelfHosted':
 			redirectUrl = getGitLabRedirectUrl(url, 'vscode');
 			break;
 		case 'bitbucket':

diff --git a/src/popup/components/ConnectAProvider.tsx b/src/popup/components/ConnectAProvider.tsx
@@ -37,8 +37,16 @@ export const ConnectAProvider = () => {
 						<div>Azure DevOps</div>
 					</ExternalLink>
 				</div>
-				<div className="text-sm text-secondary italic">
-					*Only cloud-hosted providers are currently supported.
+				<div className="named-divider">
+					<div className="divider-line" />
+					<div className="text-secondary">or</div>
+					<div className="divider-line" />
+				</div>
+				<div className="text-secondary">
+					Connect more integrations in the{' '}
+					<ExternalLink className="text-link" href={`${GKDotDevUrl}/settings/integrations`}>
+						Integration Settings
+					</ExternalLink>
 				</div>
 			</div>
 		</div>

diff --git a/src/popup/hooks.ts b/src/popup/hooks.ts
@@ -32,11 +32,12 @@ export const useFocusViewConnectedProviders = (userId: string) => {
 		return providerConnectionsQuery.data
 			.filter(
 				connection =>
-					(connection.provider === 'github' ||
-						connection.provider === 'gitlab' ||
-						connection.provider === 'bitbucket' ||
-						connection.provider === 'azure') &&
-					!connection.domain,
+					connection.provider === 'github' ||
+					connection.provider === 'githubEnterprise' ||
+					connection.provider === 'gitlab' ||
+					connection.provider === 'gitlabSelfHosted' ||
+					connection.provider === 'bitbucket' ||
+					connection.provider === 'azure',
 			)
 			.map(connection => connection.provider as FocusViewSupportedProvider);
 	}, [providerConnectionsQuery.data]);

diff --git a/src/providers.ts b/src/providers.ts
@@ -1,16 +1,18 @@
 import { AzureDevOps, Bitbucket, GitHub, GitLab } from '@gitkraken/provider-apis';
 import { fetchProviderToken } from './gkApi';
-import type { FocusViewData, FocusViewSupportedProvider, Provider } from './types';
+import type { FocusViewData, FocusViewSupportedProvider, Provider, ProviderToken } from './types';
 
 export const ProviderMeta: Record<FocusViewSupportedProvider, { name: string; iconSrc: string }> = {
 	github: { name: 'GitHub', iconSrc: 'img/github-color.svg' },
+	githubEnterprise: { name: 'GitHub Enterprise Server', iconSrc: 'img/github-color.svg' },
 	gitlab: { name: 'GitLab', iconSrc: 'img/gitlab-color.svg' },
+	gitlabSelfHosted: { name: 'GitLab Self-Managed', iconSrc: 'img/gitlab-color.svg' },
 	bitbucket: { name: 'Bitbucket', iconSrc: 'img/bitbucket-color.svg' },
 	azure: { name: 'Azure DevOps', iconSrc: 'img/azuredevops-color.svg' },
 };
 
-const fetchGitHubFocusViewData = async (token: string) => {
-	const github = new GitHub({ token: token });
+const fetchGitHubFocusViewData = async (token: ProviderToken) => {
+	const github = new GitHub({ token: token.accessToken, baseUrl: token.domain });
 
 	const { data: providerUser } = await github.getCurrentUser();
 	if (!providerUser.username) {
@@ -25,13 +27,19 @@ const fetchGitHubFocusViewData = async (token: string) => {
 		providerUser: providerUser,
 		pullRequests: pullRequests.map(pr => ({
 			...pr,
-			uniqueId: JSON.stringify(['github', 'pr', '1', '', pr.graphQLId || pr.id]),
+			uniqueId: JSON.stringify([
+				token.domain ? 'githubEnterprise' : 'github',
+				'pr',
+				'1',
+				token.domain || '',
+				pr.graphQLId || pr.id,
+			]),
 		})),
 	};
 };
 
-const fetchGitLabFocusViewData = async (token: string) => {
-	const gitlab = new GitLab({ token: token });
+const fetchGitLabFocusViewData = async (token: ProviderToken) => {
+	const gitlab = new GitLab({ token: token.accessToken, baseUrl: token.domain });
 
 	const { data: providerUser } = await gitlab.getCurrentUser();
 	if (!providerUser.username) {
@@ -45,8 +53,8 @@ const fetchGitLabFocusViewData = async (token: string) => {
 	return { providerUser: providerUser, pullRequests: pullRequests.map(pr => ({ ...pr, uniqueId: '' })) };
 };
 
-const fetchBitbucketFocusViewData = async (token: string) => {
-	const bitbucket = new Bitbucket({ token: token });
+const fetchBitbucketFocusViewData = async (token: ProviderToken) => {
+	const bitbucket = new Bitbucket({ token: token.accessToken });
 
 	const { data: providerUser } = await bitbucket.getCurrentUser();
 
@@ -57,8 +65,8 @@ const fetchBitbucketFocusViewData = async (token: string) => {
 	return { providerUser: providerUser, pullRequests: pullRequests.map(pr => ({ ...pr, uniqueId: '' })) };
 };
 
-const fetchAzureFocusViewData = async (token: string) => {
-	const azureDevOps = new AzureDevOps({ token: token });
+const fetchAzureFocusViewData = async (token: ProviderToken) => {
+	const azureDevOps = new AzureDevOps({ token: token.accessToken });
 
 	// Getting a user's PRs requires getting their projects, which requires getting their organizations
 	const { data: providerUser } = await azureDevOps.getCurrentUser();
@@ -85,13 +93,15 @@ export const fetchFocusViewData = async (provider: FocusViewSupportedProvider):
 
 	switch (provider) {
 		case 'github':
-			return fetchGitHubFocusViewData(providerToken.accessToken);
+		case 'githubEnterprise':
+			return fetchGitHubFocusViewData(providerToken);
 		case 'gitlab':
-			return fetchGitLabFocusViewData(providerToken.accessToken);
+		case 'gitlabSelfHosted':
+			return fetchGitLabFocusViewData(providerToken);
 		case 'bitbucket':
-			return fetchBitbucketFocusViewData(providerToken.accessToken);
+			return fetchBitbucketFocusViewData(providerToken);
 		case 'azure':
-			return fetchAzureFocusViewData(providerToken.accessToken);
+			return fetchAzureFocusViewData(providerToken);
 		default:
 			throw new Error(`Attempted to fetch pull requests for unsupported provider: ${provider as Provider}`);
 	}

diff --git a/src/types.ts b/src/types.ts
@@ -23,7 +23,13 @@ export type Provider =
 	| 'githubEnterprise'
 	| 'gitlabSelfHosted';
 
-export type FocusViewSupportedProvider = 'github' | 'gitlab' | 'bitbucket' | 'azure';
+export type FocusViewSupportedProvider =
+	| 'github'
+	| 'githubEnterprise'
+	| 'gitlab'
+	| 'gitlabSelfHosted'
+	| 'bitbucket'
+	| 'azure';
 
 export type GitPullRequestWithUniqueID = GitPullRequest & { uniqueId: string };
 

diff --git a/static/popup.css b/static/popup.css
@@ -275,6 +275,20 @@ button.icon-btn {
 	border: none;
 }
 
+.named-divider {
+	width: 100%;
+	display: flex;
+	align-items: center;
+}
+.named-divider > *:not(:last-child) {
+	margin-right: 8px;
+}
+
+.divider-line {
+	border-top: 1px solid var(--color-border-row);
+	flex: 1 1 0%;
+}
+
 /* Utility classes */
 .text-sm {
 	font-size: var(--text-sm);