migrate Org Git Integrations

components/dashboard/src/data/auth-providers/create-org-auth-provider-mutation.ts

@@ -0,0 +1,46 @@
+/**
+ * Copyright (c) 2023 Gitpod GmbH. All rights reserved.
+ * Licensed under the GNU Affero General Public License (AGPL).
+ * See License.AGPL.txt in the project root for license information.
+ */
+
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { getOrgAuthProvidersQueryKey } from "./org-auth-providers-query";
+import { CreateAuthProviderRequest } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
+import { authProviderClient } from "../../service/public-api";
+
+type CreateAuthProviderArgs = {
+    provider: Pick<CreateAuthProviderRequest, "host" | "type"> & {
+        clientId: string;
+        clientSecret: string;
+        orgId: string;
+    };
+};
+export const useCreateOrgAuthProviderMutation = () => {
+    const queryClient = useQueryClient();
+
+    return useMutation({
+        mutationFn: async ({ provider }: CreateAuthProviderArgs) => {
+            const response = await authProviderClient.createAuthProvider(
+                new CreateAuthProviderRequest({
+                    owner: { case: "organizationId", value: provider.orgId },
+                    host: provider.host,
+                    oauth2Config: {
+                        clientId: provider.clientId,
+                        clientSecret: provider.clientSecret,
+                    },
+                    type: provider.type,
+                }),
+            );
+            return response.authProvider!;
+        },
+        onSuccess(provider) {
+            const orgId = provider?.owner?.value;
+            if (!orgId) {
+                return;
+            }
+
+            queryClient.invalidateQueries({ queryKey: getOrgAuthProvidersQueryKey(orgId) });
+        },
+    });
+};

components/dashboard/src/data/auth-providers/get-auth-providers-query.ts

@@ -0,0 +1,26 @@
+/**
+ * Copyright (c) 2023 Gitpod GmbH. All rights reserved.
+ * Licensed under the GNU Affero General Public License (AGPL).
+ * See License.AGPL.txt in the project root for license information.
+ */
+
+import { useQuery } from "@tanstack/react-query";
+import { authProviderClient } from "../../service/public-api";
+import { AuthProvider, GetAuthProviderRequest } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
+
+export const useGetAuthProviderQuery = (authProviderId: string | undefined) => {
+    return useQuery<AuthProvider | undefined, Error>(getAuthProvidersQueryKey(authProviderId || ""), async () => {
+        if (!authProviderId) {
+            return;
+        }
+        const { authProvider } = await authProviderClient.getAuthProvider(
+            new GetAuthProviderRequest({
+                authProviderId: authProviderId,
+            }),
+        );
+
+        return authProvider;
+    });
+};
+
+export const getAuthProvidersQueryKey = (authProviderId: string) => ["auth-provider", { authProviderId }];

components/dashboard/src/data/auth-providers/org-auth-providers-query.ts

@@ -4,13 +4,13 @@
  * See License.AGPL.txt in the project root for license information.
  */
 
-import { AuthProviderEntry } from "@gitpod/gitpod-protocol";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { useCallback } from "react";
-import { getGitpodService } from "../../service/service";
 import { useCurrentOrg } from "../organizations/orgs-query";
+import { authProviderClient } from "../../service/public-api";
+import { AuthProvider, ListAuthProvidersRequest } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
 
-export type OrgAuthProvidersQueryResult = AuthProviderEntry[];
+export type OrgAuthProvidersQueryResult = AuthProvider[];
 export const useOrgAuthProvidersQuery = () => {
     const organization = useCurrentOrg().data;
 
@@ -21,7 +21,16 @@ export const useOrgAuthProvidersQuery = () => {
                 throw new Error("No current organization selected");
             }
 
-            return await getGitpodService().server.getOrgAuthProviders({ organizationId: organization.id });
+            const response = await authProviderClient.listAuthProviders(
+                new ListAuthProvidersRequest({
+                    id: {
+                        case: "organizationId",
+                        value: organization.id,
+                    },
+                }),
+            );
+
+            return response.authProviders;
         },
     });
 };

components/dashboard/src/data/auth-providers/update-org-auth-provider-mutation.ts

@@ -0,0 +1,42 @@
+/**
+ * Copyright (c) 2023 Gitpod GmbH. All rights reserved.
+ * Licensed under the GNU Affero General Public License (AGPL).
+ * See License.AGPL.txt in the project root for license information.
+ */
+
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { getOrgAuthProvidersQueryKey } from "./org-auth-providers-query";
+import { UpdateAuthProviderRequest } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
+import { authProviderClient } from "../../service/public-api";
+
+type UpdateAuthProviderArgs = {
+    provider: {
+        id: string;
+        clientId: string;
+        clientSecret: string;
+    };
+};
+export const useUpdateOrgAuthProviderMutation = () => {
+    const queryClient = useQueryClient();
+
+    return useMutation({
+        mutationFn: async ({ provider }: UpdateAuthProviderArgs) => {
+            const response = await authProviderClient.updateAuthProvider(
+                new UpdateAuthProviderRequest({
+                    authProviderId: provider.id,
+                    clientId: provider.clientId,
+                    clientSecret: provider.clientSecret,
+                }),
+            );
+            return response.authProvider!;
+        },
+        onSuccess(provider) {
+            const orgId = provider?.owner?.value;
+            if (!orgId) {
+                return;
+            }
+
+            queryClient.invalidateQueries({ queryKey: getOrgAuthProvidersQueryKey(orgId) });
+        },
+    });
+};

components/dashboard/src/teams/git-integrations/GitIntegrationListItem.tsx

@@ -4,7 +4,6 @@
  * See License.AGPL.txt in the project root for license information.
  */
 
-import { AuthProviderEntry } from "@gitpod/gitpod-protocol";
 import { FunctionComponent, useCallback, useMemo, useState } from "react";
 import ConfirmationModal from "../../components/ConfirmationModal";
 import { ContextMenuEntry } from "../../components/ContextMenu";
@@ -14,9 +13,10 @@ import { GitIntegrationModal } from "./GitIntegrationModal";
 import { ModalFooterAlert } from "../../components/Modal";
 import { useToast } from "../../components/toasts/Toasts";
 import { useListOrganizationMembers } from "../../data/organizations/members-query";
+import { AuthProvider } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
 
 type Props = {
-    provider: AuthProviderEntry;
+    provider: AuthProvider;
 };
 export const GitIntegrationListItem: FunctionComponent<Props> = ({ provider }) => {
     const [showEditModal, setShowEditModal] = useState(false);
@@ -30,7 +30,7 @@ export const GitIntegrationListItem: FunctionComponent<Props> = ({ provider }) =
     const menuEntries = useMemo(() => {
         const result: ContextMenuEntry[] = [];
         result.push({
-            title: provider.status === "verified" ? "Edit" : "Activate",
+            title: provider.verified ? "Edit" : "Activate",
             onClick: () => setShowEditModal(true),
             separator: true,
         });
@@ -40,7 +40,7 @@ export const GitIntegrationListItem: FunctionComponent<Props> = ({ provider }) =
             onClick: () => setShowDeleteConfirmation(true),
         });
         return result;
-    }, [provider.status]);
+    }, [provider.verified]);
 
     const deleteProvider = useCallback(async () => {
         try {
@@ -58,7 +58,7 @@ export const GitIntegrationListItem: FunctionComponent<Props> = ({ provider }) =
                     <div
                         className={
                             "rounded-full w-3 h-3 text-sm align-middle m-auto " +
-                            (provider.status === "verified" ? "bg-green-500" : "bg-gray-400")
+                            (provider.verified ? "bg-green-500" : "bg-gray-400")
                         }
                     >
                         &nbsp;