Migrate gRPC VerificationService (#19143)

* Implement

* use on dashboard

* Add test case

* fixup

* fix build

* Update proto

* Update

* 💄

* 💄

* [verificationservice] added mock impl for previews

---------

Co-authored-by: Jean Pierre Huaroto <jeanp413@hotmail.com>
Co-authored-by: Sven Efftinge <sven@gitpod.io>

Author: 3 people

components/dashboard/src/data/setup.tsx

@@ -24,13 +24,14 @@ import * as ConfigurationClasses from "@gitpod/public-api/lib/gitpod/v1/configur
 import * as AuthProviderClasses from "@gitpod/public-api/lib/gitpod/v1/authprovider_pb";
 import * as EnvVarClasses from "@gitpod/public-api/lib/gitpod/v1/envvar_pb";
 import * as PrebuildClasses from "@gitpod/public-api/lib/gitpod/v1/prebuild_pb";
+import * as VerificationClasses from "@gitpod/public-api/lib/gitpod/v1/verification_pb";
 import * as SCMClasses from "@gitpod/public-api/lib/gitpod/v1/scm_pb";
 import * as SSHClasses from "@gitpod/public-api/lib/gitpod/v1/ssh_pb";
 
 // This is used to version the cache
 // If data we cache changes in a non-backwards compatible way, increment this version
 // That will bust any previous cache versions a client may have stored
-const CACHE_VERSION = "8";
+const CACHE_VERSION = "9";
 
 export function noPersistence(queryKey: QueryKey): QueryKey {
     return [...queryKey, "no-persistence"];
@@ -152,6 +153,7 @@ function initializeMessages() {
         ...Object.values(AuthProviderClasses),
         ...Object.values(EnvVarClasses),
         ...Object.values(PrebuildClasses),
+        ...Object.values(VerificationClasses),
         ...Object.values(SCMClasses),
         ...Object.values(SSHClasses),
     ];

components/dashboard/src/service/json-rpc-verification-client.ts

@@ -0,0 +1,56 @@
+/**
+ * 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 { CallOptions, PromiseClient } from "@connectrpc/connect";
+import { PartialMessage } from "@bufbuild/protobuf";
+import { VerificationService } from "@gitpod/public-api/lib/gitpod/v1/verification_connect";
+import {
+    SendPhoneNumberVerificationTokenRequest,
+    SendPhoneNumberVerificationTokenResponse,
+    VerifyPhoneNumberVerificationTokenRequest,
+    VerifyPhoneNumberVerificationTokenResponse,
+} from "@gitpod/public-api/lib/gitpod/v1/verification_pb";
+import { ApplicationError, ErrorCodes } from "@gitpod/gitpod-protocol/lib/messaging/error";
+import { getGitpodService } from "./service";
+import { validate as uuidValidate } from "uuid";
+
+export class JsonRpcVerificationClient implements PromiseClient<typeof VerificationService> {
+    async sendPhoneNumberVerificationToken(
+        request: PartialMessage<SendPhoneNumberVerificationTokenRequest>,
+        _options?: CallOptions | undefined,
+    ): Promise<SendPhoneNumberVerificationTokenResponse> {
+        if (!request.phoneNumber) {
+            throw new ApplicationError(ErrorCodes.BAD_REQUEST, "phoneNumber is required");
+        }
+        const info = await getGitpodService().server.sendPhoneNumberVerificationToken(request.phoneNumber);
+        return new SendPhoneNumberVerificationTokenResponse({
+            verificationId: info.verificationId,
+        });
+    }
+
+    async verifyPhoneNumberVerificationToken(
+        request: PartialMessage<VerifyPhoneNumberVerificationTokenRequest>,
+        _options?: CallOptions | undefined,
+    ): Promise<VerifyPhoneNumberVerificationTokenResponse> {
+        if (!request.phoneNumber) {
+            throw new ApplicationError(ErrorCodes.BAD_REQUEST, "phoneNumber is required");
+        }
+        if (!request.verificationId || !uuidValidate(request.verificationId)) {
+            throw new ApplicationError(ErrorCodes.BAD_REQUEST, "verificationId is required");
+        }
+        if (!request.token) {
+            throw new ApplicationError(ErrorCodes.BAD_REQUEST, "token is required");
+        }
+        const info = await getGitpodService().server.verifyPhoneNumberVerificationToken(
+            request.phoneNumber,
+            request.token,
+            request.verificationId,
+        );
+        return new VerifyPhoneNumberVerificationTokenResponse({
+            verified: info,
+        });
+    }
+}

components/dashboard/src/service/public-api.ts

@@ -36,6 +36,8 @@ import { JsonRpcScmClient } from "./json-rpc-scm-client";
 import { SCMService } from "@gitpod/public-api/lib/gitpod/v1/scm_connect";
 import { SSHService } from "@gitpod/public-api/lib/gitpod/v1/ssh_connect";
 import { JsonRpcSSHClient } from "./json-rpc-ssh-client";
+import { JsonRpcVerificationClient } from "./json-rpc-verification-client";
+import { VerificationService } from "@gitpod/public-api/lib/gitpod/v1/verification_connect";
 
 const transport = createConnectTransport({
     baseUrl: `${window.location.protocol}//${window.location.host}/public-api`,
@@ -91,6 +93,11 @@ export const sshClient = createServiceClient(SSHService, {
     featureFlagSuffix: "ssh",
 });
 
+export const verificationClient = createServiceClient(VerificationService, {
+    client: new JsonRpcVerificationClient(),
+    featureFlagSuffix: "verification",
+});
+
 export async function listAllProjects(opts: { orgId: string }): Promise<ProtocolProject[]> {
     let pagination = {
         page: 1,

components/dashboard/src/start/VerifyModal.tsx

@@ -7,13 +7,13 @@
 import { useState } from "react";
 import Alert, { AlertType } from "../components/Alert";
 import Modal, { ModalBody, ModalFooter, ModalHeader } from "../components/Modal";
-import { getGitpodService } from "../service/service";
 import PhoneInput from "react-intl-tel-input";
 import "react-intl-tel-input/dist/main.css";
 import "./phone-input.css";
 import { Button } from "../components/Button";
 import { LinkButton } from "../components/LinkButton";
 import { useFeatureFlag } from "../data/featureflag-query";
+import { verificationClient } from "../service/public-api";
 
 interface VerifyModalState {
     phoneNumber?: string;
@@ -41,7 +41,9 @@ export function VerifyModal() {
                     message: undefined,
                     sending: true,
                 });
-                const resp = await getGitpodService().server.sendPhoneNumberVerificationToken(state.phoneNumber || "");
+                const resp = await verificationClient.sendPhoneNumberVerificationToken({
+                    phoneNumber: state.phoneNumber || "",
+                });
                 setVerificationId(resp.verificationId);
                 setState({
                     ...state,
@@ -123,11 +125,12 @@ export function VerifyModal() {
         };
         const verifyToken = async () => {
             try {
-                const verified = await getGitpodService().server.verifyPhoneNumberVerificationToken(
-                    state.phoneNumber!,
-                    state.token!,
+                const resp = await verificationClient.verifyPhoneNumberVerificationToken({
                     verificationId,
-                );
+                    token: state.token,
+                    phoneNumber: state.phoneNumber,
+                });
+                const verified = resp.verified;
                 if (verified) {
                     setState({
                         ...state,

components/public-api/gitpod/v1/verification.proto

@@ -0,0 +1,45 @@
+syntax = "proto3";
+
+package gitpod.v1;
+
+option go_package = "github.com/gitpod-io/gitpod/components/public-api/go/v1";
+
+service VerificationService {
+  // SendPhoneNumberVerificationToken sends a verification token to the
+  // specified phone number.
+  rpc SendPhoneNumberVerificationToken(SendPhoneNumberVerificationTokenRequest) returns (SendPhoneNumberVerificationTokenResponse) {}
+
+  // VerifyPhoneNumberVerificationToken verifies the specified verification
+  // token.
+  rpc VerifyPhoneNumberVerificationToken(VerifyPhoneNumberVerificationTokenRequest) returns (VerifyPhoneNumberVerificationTokenResponse) {}
+}
+
+// Required fields:
+// - phone_number
+message SendPhoneNumberVerificationTokenRequest {
+  // phone_number in E.164 format
+  string phone_number = 1;
+}
+
+message SendPhoneNumberVerificationTokenResponse {
+  // verification_id is used to VerifyPhoneNumberVerificationToken
+  string verification_id = 1;
+}
+
+// Required fields:
+// - phone_number
+// - verification_id
+// - token
+message VerifyPhoneNumberVerificationTokenRequest {
+  // phone_number in E.164 format
+  string phone_number = 1;
+  // verification_id is returned by SendPhoneNumberVerificationToken
+  string verification_id = 2;
+  // token is the verification token from providers
+  string token = 3;
+}
+
+message VerifyPhoneNumberVerificationTokenResponse {
+  // verified indicates if the verification was successful
+  bool verified = 1;
+}