complete migration from useAuthProviders to useAuthProviderDescriptions

AlexTugarev · AlexTugarev · commit b1e7bbbc2b02 · 2023-11-13T14:50:48.000Z
diff --git a/components/dashboard/src/components/AuthorizeGit.tsx b/components/dashboard/src/components/AuthorizeGit.tsx
@@ -4,10 +4,9 @@
  * See License.AGPL.txt in the project root for license information.
  */
 
-import { AuthProviderInfo } from "@gitpod/gitpod-protocol";
 import { FC, useCallback, useContext } from "react";
 import { Link } from "react-router-dom";
-import { useAuthProviders } from "../data/auth-providers/auth-provider-query";
+import { useAuthProviderDescriptions } from "../data/auth-providers/auth-provider-query";
 import { openAuthorizeWindow } from "../provider-utils";
 import { getGitpodService } from "../service/service";
 import { UserContext, useCurrentUser } from "../user-context";
@@ -16,45 +15,43 @@ import { Heading2, Heading3, Subheading } from "./typography/headings";
 import classNames from "classnames";
 import { iconForAuthProvider, simplifyProviderName } from "../provider-utils";
 import { useIsOwner } from "../data/organizations/members-query";
+import { AuthProviderDescription } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
 
 export function useNeedsGitAuthorization() {
-    const authProviders = useAuthProviders();
+    const authProviders = useAuthProviderDescriptions();
     const user = useCurrentUser();
     if (!user || !authProviders.data) {
         return false;
     }
-    return !authProviders.data.some((ap) => user.identities.some((i) => ap.authProviderId === i.authProviderId));
+    return !authProviders.data.some((ap) => user.identities.some((i) => ap.id === i.authProviderId));
 }
 
 export const AuthorizeGit: FC<{ className?: string }> = ({ className }) => {
     const { setUser } = useContext(UserContext);
     const owner = useIsOwner();
-    const authProviders = useAuthProviders();
+    const { data: authProviders } = useAuthProviderDescriptions();
     const updateUser = useCallback(() => {
         getGitpodService().server.getLoggedInUser().then(setUser);
     }, [setUser]);
 
     const connect = useCallback(
-        (ap: AuthProviderInfo) => {
+        (ap: AuthProviderDescription) => {
             openAuthorizeWindow({
                 host: ap.host,
-                scopes: ap.requirements?.default,
                 overrideScopes: true,
                 onSuccess: updateUser,
             });
         },
         [updateUser],
     );
 
-    if (authProviders.data === undefined) {
+    if (authProviders === undefined) {
         return <></>;
     }
 
-    const verifiedProviders = authProviders.data.filter((ap) => ap.verified);
-
     return (
         <div className={classNames("text-center p-4 m-4 py-10", className)}>
-            {verifiedProviders.length === 0 ? (
+            {authProviders.length === 0 ? (
                 <>
                     <Heading3 className="pb-2">No Git integrations</Heading3>
                     {!!owner ? (
@@ -82,7 +79,7 @@ export const AuthorizeGit: FC<{ className?: string }> = ({ className }) => {
                         Select one of the following available providers to access repositories for your account.
                     </Subheading>
                     <div className="flex flex-col items-center">
-                        {verifiedProviders.map((ap) => {
+                        {authProviders.map((ap) => {
                             return (
                                 <Button
                                     onClick={() => connect(ap)}
@@ -91,7 +88,7 @@ export const AuthorizeGit: FC<{ className?: string }> = ({ className }) => {
                                     className="mt-3 btn-login flex-none w-56 px-0 py-0.5 inline-flex"
                                 >
                                     <div className="flex relative -left-4 w-56">
-                                        {iconForAuthProvider(ap.authProviderType)}
+                                        {iconForAuthProvider(ap.type)}
                                         <span className="pt-2 pb-2 mr-3 text-sm my-auto font-medium truncate overflow-ellipsis">
                                             Continue with {simplifyProviderName(ap.host)}
                                         </span>
diff --git a/components/dashboard/src/components/RepositoryFinder.tsx b/components/dashboard/src/components/RepositoryFinder.tsx
@@ -11,8 +11,9 @@ import { ReactComponent as RepositoryIcon } from "../icons/RepositoryWithColor.s
 import { SuggestedRepository } from "@gitpod/gitpod-protocol";
 import { MiddleDot } from "./typography/MiddleDot";
 import { useUnifiedRepositorySearch } from "../data/git-providers/unified-repositories-search-query";
-import { useAuthProviders } from "../data/auth-providers/auth-provider-query";
+import { useAuthProviderDescriptions } from "../data/auth-providers/auth-provider-query";
 import { ReactComponent as Exclamation2 } from "../images/exclamation2.svg";
+import { AuthProviderType } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
 
 interface RepositoryFinderProps {
     selectedContextURL?: string;
@@ -39,7 +40,7 @@ export default function RepositoryFinder({
         hasMore,
     } = useUnifiedRepositorySearch({ searchString, excludeProjects });
 
-    const authProviders = useAuthProviders();
+    const authProviders = useAuthProviderDescriptions();
 
     const handleSelectionChange = useCallback(
         (selectedID: string) => {
@@ -115,7 +116,10 @@ export default function RepositoryFinder({
                     isSelectable: false,
                 } as ComboboxElement);
             }
-            if (searchString.length >= 3 && authProviders.data?.some((p) => p.authProviderType === "BitbucketServer")) {
+            if (
+                searchString.length >= 3 &&
+                authProviders.data?.some((p) => p.type === AuthProviderType.BITBUCKET_SERVER)
+            ) {
                 // add an element that tells the user that the Bitbucket Server does only support prefix search
                 result.push({
                     id: "bitbucket-server",
diff --git a/components/dashboard/src/data/auth-providers/auth-provider-query.ts b/components/dashboard/src/data/auth-providers/auth-provider-query.ts
@@ -4,25 +4,14 @@
  * See License.AGPL.txt in the project root for license information.
  */
 
-import { AuthProviderInfo } from "@gitpod/gitpod-protocol";
 import { useQuery } from "@tanstack/react-query";
-import { getGitpodService } from "../../service/service";
 import { authProviderClient } from "../../service/public-api";
 import { useCurrentUser } from "../../user-context";
 import {
     AuthProviderDescription,
     ListAuthProviderDescriptionsRequest,
 } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
 
-export const useAuthProviders = () => {
-    return useQuery<AuthProviderInfo[]>({
-        queryKey: ["auth-providers"],
-        queryFn: async () => {
-            return await getGitpodService().server.getAuthProviders();
-        },
-    });
-};
-
 export const useAuthProviderDescriptions = () => {
     const user = useCurrentUser();
     const query = useQuery<AuthProviderDescription[]>({
diff --git a/components/dashboard/src/data/git-providers/github-queries.ts b/components/dashboard/src/data/git-providers/github-queries.ts
@@ -6,8 +6,9 @@
 
 import { useQuery } from "@tanstack/react-query";
 import { getGitpodService } from "../../service/service";
-import { useAuthProviders } from "../auth-providers/auth-provider-query";
+import { useAuthProviderDescriptions } from "../auth-providers/auth-provider-query";
 import { useCurrentUser } from "../../user-context";
+import { AuthProviderType } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
 
 export const useIsGithubAppEnabled = () => {
     return useQuery(["github-app-enabled"], async () => {
@@ -16,7 +17,7 @@ export const useIsGithubAppEnabled = () => {
 };
 
 export const useAreGithubWebhooksUnauthorized = (providerHost: string) => {
-    const { data: authProviders } = useAuthProviders();
+    const { data: authProviders } = useAuthProviderDescriptions();
     const { data: isGitHubAppEnabled } = useIsGithubAppEnabled();
     const { data: token } = useGetGitToken(providerHost);
 
@@ -32,7 +33,7 @@ export const useAreGithubWebhooksUnauthorized = (providerHost: string) => {
 
     // Find matching auth provider - if none, treat as authorized
     const ap = authProviders?.find((ap) => ap.host === providerHost);
-    if (!ap || ap.authProviderType !== "GitHub") {
+    if (!ap || ap.type !== AuthProviderType.GITHUB) {
         return false;
     }
 
diff --git a/components/dashboard/src/data/git-providers/provider-repositories-query.ts b/components/dashboard/src/data/git-providers/provider-repositories-query.ts
@@ -8,9 +8,10 @@ import { useQuery } from "@tanstack/react-query";
 import { getGitpodService } from "../../service/service";
 import { useCurrentUser } from "../../user-context";
 import { CancellationTokenSource } from "vscode-jsonrpc";
-import { useAuthProviders } from "../auth-providers/auth-provider-query";
+import { useAuthProviderDescriptions } from "../auth-providers/auth-provider-query";
 import { GetProviderRepositoriesParams } from "@gitpod/gitpod-protocol";
 import { useFeatureFlag } from "../featureflag-query";
+import { AuthProviderType } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
 
 type UseProviderRepositoriesQueryArgs = {
     providerHost: string;
@@ -24,12 +25,12 @@ export const useProviderRepositoriesForUser = ({
 }: UseProviderRepositoriesQueryArgs) => {
     const user = useCurrentUser();
     const newProjectIncrementalRepoSearchBBS = useFeatureFlag("newProjectIncrementalRepoSearchBBS");
-    const { data: authProviders } = useAuthProviders();
+    const { data: authProviders } = useAuthProviderDescriptions();
     const selectedProvider = authProviders?.find((p) => p.host === providerHost);
 
     const queryKey: any[] = ["provider-repositories", { userId: user?.id }, { providerHost, installationId }];
 
-    const isBitbucketServer = selectedProvider?.authProviderType === "BitbucketServer";
+    const isBitbucketServer = selectedProvider?.type === AuthProviderType.BITBUCKET_SERVER;
     const enableIncrementalSearch = isBitbucketServer && newProjectIncrementalRepoSearchBBS;
     if (enableIncrementalSearch) {
         queryKey.push({ search });
diff --git a/components/dashboard/src/projects/NewProject.tsx b/components/dashboard/src/projects/NewProject.tsx
@@ -4,7 +4,7 @@
  * See License.AGPL.txt in the project root for license information.
  */
 
-import { AuthProviderInfo, Project } from "@gitpod/gitpod-protocol";
+import { Project } from "@gitpod/gitpod-protocol";
 import { FC, useCallback, useContext, useEffect, useMemo, useState } from "react";
 import ErrorMessage from "../components/ErrorMessage";
 import { useCurrentOrg } from "../data/organizations/orgs-query";
@@ -13,19 +13,20 @@ import { iconForAuthProvider, openAuthorizeWindow, simplifyProviderName } from "
 import { getGitpodService } from "../service/service";
 import { UserContext, useCurrentUser } from "../user-context";
 import { Heading1, Subheading } from "../components/typography/headings";
-import { useAuthProviders } from "../data/auth-providers/auth-provider-query";
+import { useAuthProviderDescriptions } from "../data/auth-providers/auth-provider-query";
 import { AuthorizeGit, useNeedsGitAuthorization } from "../components/AuthorizeGit";
 import { NewProjectRepoSelection } from "./new-project/NewProjectRepoSelection";
 import { NewProjectSubheading } from "./new-project/NewProjectSubheading";
 import { Button } from "../components/Button";
+import { AuthProviderDescription, AuthProviderType } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
 
 export default function NewProject() {
     const currentTeam = useCurrentOrg()?.data;
     const user = useCurrentUser();
-    const authProviders = useAuthProviders();
+    const authProviders = useAuthProviderDescriptions();
 
     // State this component manages
-    const [selectedProvider, setSelectedProvider] = useState<AuthProviderInfo>();
+    const [selectedProvider, setSelectedProvider] = useState<AuthProviderDescription>();
     const [project, setProject] = useState<Project>();
 
     // Defaults selectedProviderHost if not set yet
@@ -34,9 +35,7 @@ export default function NewProject() {
             for (let i = user.identities.length - 1; i >= 0; i--) {
                 const candidate = user.identities[i];
                 if (candidate) {
-                    const authProvider = authProviders.data.find(
-                        (ap) => ap.authProviderId === candidate.authProviderId,
-                    );
+                    const authProvider = authProviders.data.find((ap) => ap.id === candidate.authProviderId);
                     if (authProvider) {
                         setSelectedProvider(authProvider);
                         break;
@@ -107,8 +106,8 @@ export default function NewProject() {
 }
 
 type NewProjectMainContentProps = {
-    selectedProvider?: AuthProviderInfo;
-    onProviderSelected: (ap: AuthProviderInfo, updateUser?: boolean) => void;
+    selectedProvider?: AuthProviderDescription;
+    onProviderSelected: (ap: AuthProviderDescription, updateUser?: boolean) => void;
     onProjectCreated: (project: Project) => void;
 };
 const NewProjectMainContent: FC<NewProjectMainContentProps> = ({
@@ -117,12 +116,12 @@ const NewProjectMainContent: FC<NewProjectMainContentProps> = ({
     onProjectCreated,
 }) => {
     const { setUser } = useContext(UserContext);
-    const authProviders = useAuthProviders();
+    const authProviders = useAuthProviderDescriptions();
     const needsGitAuth = useNeedsGitAuthorization();
     const [showGitProviders, setShowGitProviders] = useState(false);
 
     const onGitProviderSeleted = useCallback(
-        async (ap: AuthProviderInfo, updateUser?: boolean) => {
+        async (ap: AuthProviderDescription, updateUser?: boolean) => {
             // TODO: Can we push this down into where sends updateUser=true?
             if (updateUser) {
                 setUser(await getGitpodService().server.getLoggedInUser());
@@ -151,23 +150,22 @@ const NewProjectMainContent: FC<NewProjectMainContentProps> = ({
 };
 
 const GitProviders: FC<{
-    authProviders: AuthProviderInfo[];
-    onProviderSelected: (ap: AuthProviderInfo, updateUser?: boolean) => void;
+    authProviders: AuthProviderDescription[];
+    onProviderSelected: (ap: AuthProviderDescription, updateUser?: boolean) => void;
 }> = ({ authProviders, onProviderSelected }) => {
     const [errorMessage, setErrorMessage] = useState<string | undefined>(undefined);
 
     const selectProvider = useCallback(
-        async (ap: AuthProviderInfo) => {
+        async (ap: AuthProviderDescription) => {
             setErrorMessage(undefined);
 
             const token = await getGitpodService().server.getToken({ host: ap.host });
-            if (token && !(ap.authProviderType === "GitHub" && !token.scopes.includes("repo"))) {
+            if (token && !(ap.type === AuthProviderType.GITHUB && !token.scopes.includes("repo"))) {
                 onProviderSelected(ap);
                 return;
             }
             await openAuthorizeWindow({
                 host: ap.host,
-                scopes: ap.authProviderType === "GitHub" ? ["repo"] : ap.requirements?.default,
                 onSuccess: async () => {
                     onProviderSelected(ap, true);
                 },
@@ -194,10 +192,10 @@ const GitProviders: FC<{
         () =>
             authProviders.filter(
                 (p) =>
-                    p.authProviderType === "GitHub" ||
+                    p.type === AuthProviderType.GITHUB ||
                     p.host === "bitbucket.org" ||
-                    p.authProviderType === "GitLab" ||
-                    p.authProviderType === "BitbucketServer",
+                    p.type === AuthProviderType.GITLAB ||
+                    p.type === AuthProviderType.BITBUCKET_SERVER,
             ),
         [authProviders],
     );
@@ -216,7 +214,7 @@ const GitProviders: FC<{
                                 className="btn-login flex-none w-56 h-10 p-0 inline-flex"
                                 onClick={() => selectProvider(ap)}
                             >
-                                {iconForAuthProvider(ap.authProviderType)}
+                                {iconForAuthProvider(ap.type)}
                                 <span className="pt-2 pb-2 mr-3 text-sm my-auto font-medium truncate overflow-ellipsis">
                                     Continue with {simplifyProviderName(ap.host)}
                                 </span>
diff --git a/components/dashboard/src/projects/new-project/NewProjectAuthRequired.tsx b/components/dashboard/src/projects/new-project/NewProjectAuthRequired.tsx
@@ -5,7 +5,7 @@
  */
 
 import { FC, useCallback } from "react";
-import { useAuthProviders } from "../../data/auth-providers/auth-provider-query";
+import { useAuthProviderDescriptions } from "../../data/auth-providers/auth-provider-query";
 import { openAuthorizeWindow } from "../../provider-utils";
 
 type Props = {
@@ -18,7 +18,7 @@ export const NewProjectAuthRequired: FC<Props> = ({
     areGitHubWebhooksUnauthorized = false,
     onReconfigure,
 }) => {
-    const authProviders = useAuthProviders();
+    const authProviders = useAuthProviderDescriptions();
 
     const handleAuthorize = useCallback(() => {
         const ap = authProviders.data?.find((ap) => ap.host === selectedProviderHost);
@@ -27,12 +27,8 @@ export const NewProjectAuthRequired: FC<Props> = ({
         }
         openAuthorizeWindow({
             host: ap.host,
-            scopes: ap.authProviderType === "GitHub" ? ["repo"] : ap.requirements?.default,
             onSuccess: async () => {
-                // TODO: Verify this works correctly
-                if (ap.authProviderType === "GitHub") {
-                    authProviders.refetch();
-                }
+                authProviders.refetch();
             },
             onError: (payload) => {
                 console.error("Authorization failed", selectedProviderHost, payload);
diff --git a/components/dashboard/src/projects/new-project/NewProjectRepoSelection.tsx b/components/dashboard/src/projects/new-project/NewProjectRepoSelection.tsx
@@ -4,7 +4,7 @@
  * See License.AGPL.txt in the project root for license information.
  */
 
-import { AuthProviderInfo, Project } from "@gitpod/gitpod-protocol";
+import { Project } from "@gitpod/gitpod-protocol";
 import { FC, useCallback, useEffect, useMemo, useState } from "react";
 import { useAreGithubWebhooksUnauthorized, useIsGithubAppEnabled } from "../../data/git-providers/github-queries";
 import { LinkButton } from "../../components/LinkButton";
@@ -22,9 +22,10 @@ import { NewProjectCreateFromURL } from "./NewProjectCreateFromURL";
 import { useStateWithDebounce } from "../../hooks/use-state-with-debounce";
 import { useFeatureFlag } from "../../data/featureflag-query";
 import Alert from "../../components/Alert";
+import { AuthProviderDescription, AuthProviderType } from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
 
 type Props = {
-    selectedProvider?: AuthProviderInfo;
+    selectedProvider?: AuthProviderDescription;
     onProjectCreated: (project: Project) => void;
     onChangeGitProvider: () => void;
 };
@@ -59,7 +60,7 @@ export const NewProjectRepoSelection: FC<Props> = ({ selectedProvider, onProject
     // Memoized & derived values
     const noReposAvailable = !!(reposInAccounts?.length === 0 || areGitHubWebhooksUnauthorized);
     const isGitHub = selectedProvider?.host === "github.com";
-    const isBitbucketServer = selectedProvider?.authProviderType === "BitbucketServer";
+    const isBitbucketServer = selectedProvider?.type === AuthProviderType.BITBUCKET_SERVER;
     const enableBBSIncrementalSearch = isBitbucketServer && newProjectIncrementalRepoSearchBBS;
 
     const accounts = useMemo(() => {
diff --git a/components/dashboard/src/provider-utils.tsx b/components/dashboard/src/provider-utils.tsx
diff --git a/components/dashboard/src/user-settings/AuthEntryItem.tsx b/components/dashboard/src/user-settings/AuthEntryItem.tsx
diff --git a/components/dashboard/src/user-settings/Integrations.tsx b/components/dashboard/src/user-settings/Integrations.tsx
diff --git a/components/dashboard/src/workspaces/CreateWorkspacePage.tsx b/components/dashboard/src/workspaces/CreateWorkspacePage.tsx
