Replace $.ajax with fetch

src/Explorer/Tables/TableDataClient.ts

@@ -265,9 +265,11 @@ export class CassandraAPIDataClient extends TableDataClient {
         authType === AuthType.EncryptedToken
           ? Constants.CassandraBackend.guestQueryApi
           : Constants.CassandraBackend.queryApi;
-      const data: any = await $.ajax(`${configContext.BACKEND_ENDPOINT}/${apiEndpoint}`, {
+      const authorizationHeader = getAuthorizationHeader();
-        type: "POST",
+
-        data: {
+      const response = await fetch(`${configContext.BACKEND_ENDPOINT}/${apiEndpoint}`, {
+        method: "POST",
+        body: JSON.stringify({
           accountName:
             collection && collection.container.databaseAccount && collection.container.databaseAccount().name,
           cassandraEndpoint: this.trimCassandraEndpoint(
@@ -278,11 +280,19 @@ export class CassandraAPIDataClient extends TableDataClient {
           tableId: collection.id(),
           query,
           paginationToken
-        },
+        }),
-        beforeSend: this.setAuthorizationHeader,
+        headers: {
-        error: this.handleAjaxError,
+          [authorizationHeader.header]: authorizationHeader.token,
-        cache: false
+          [Constants.HttpHeaders.contentType]: "application/json"
+        }
       });
+
+      if (!response.ok) {
+        displayTokenRenewalPromptForStatus(response.status);
+        throw Error(`Failed to query rows for table ${collection.id()}`);
+      }
+
+      const data = await response.json();
       shouldNotify &&
         NotificationConsoleUtils.logConsoleInfo(
           `Successfully fetched ${data.result.length} rows for table ${collection.id()}`
@@ -450,9 +460,9 @@ export class CassandraAPIDataClient extends TableDataClient {
     return deferred.promise;
   }
 
-  public getTableKeys(collection: ViewModels.Collection): Q.Promise<CassandraTableKeys> {
+  public async getTableKeys(collection: ViewModels.Collection): Promise<CassandraTableKeys> {
     if (!!collection.cassandraKeys) {
-      return Q.resolve(collection.cassandraKeys);
+      return collection.cassandraKeys;
     }
     const notificationId = NotificationConsoleUtils.logConsoleMessage(
       ConsoleDataType.InProgress,
@@ -464,45 +474,51 @@ export class CassandraAPIDataClient extends TableDataClient {
         ? Constants.CassandraBackend.guestKeysApi
         : Constants.CassandraBackend.keysApi;
     let endpoint = `${configContext.BACKEND_ENDPOINT}/${apiEndpoint}`;
-    const deferred = Q.defer<CassandraTableKeys>();
+    const authorizationHeader = getAuthorizationHeader();
-    $.ajax(endpoint, {
+
-      type: "POST",
+    try {
-      data: {
+      const response = await fetch(endpoint, {
-        accountName: collection && collection.container.databaseAccount && collection.container.databaseAccount().name,
+        method: "POST",
+        body: JSON.stringify({
+          accountName:
+            collection && collection.container.databaseAccount && collection.container.databaseAccount().name,
           cassandraEndpoint: this.trimCassandraEndpoint(
             collection.container.databaseAccount().properties.cassandraEndpoint
           ),
           resourceId: collection.container.databaseAccount().id,
           keyspaceId: collection.databaseId,
           tableId: collection.id()
-      },
+        }),
-      beforeSend: this.setAuthorizationHeader,
+        headers: {
-      error: this.handleAjaxError,
+          [authorizationHeader.header]: authorizationHeader.token,
-      cache: false
+          [Constants.HttpHeaders.contentType]: "application/json"
-    })
+        }
-      .then(
+      });
-        (data: CassandraTableKeys) => {
+
+      if (!response.ok) {
+        displayTokenRenewalPromptForStatus(response.status);
+        throw Error(`Fetching keys for table ${collection.id()} failed`);
+      }
+
+      const data: CassandraTableKeys = await response.json();
       collection.cassandraKeys = data;
       NotificationConsoleUtils.logConsoleMessage(
         ConsoleDataType.Info,
         `Successfully fetched keys for table ${collection.id()}`
       );
-          deferred.resolve(data);
+
-        },
+      return data;
-        (error: any) => {
+    } catch (error) {
       handleError(error, "FetchKeysCassandra", `Error fetching keys for table ${collection.id()}`);
-          deferred.reject(error);
+      throw error;
-        }
+    } finally {
-      )
-      .done(() => {
       NotificationConsoleUtils.clearInProgressMessageWithId(notificationId);
-      });
+    }
-    return deferred.promise;
   }
 
-  public getTableSchema(collection: ViewModels.Collection): Q.Promise<CassandraTableKey[]> {
+  public async getTableSchema(collection: ViewModels.Collection): Promise<CassandraTableKey[]> {
     if (!!collection.cassandraSchema) {
-      return Q.resolve(collection.cassandraSchema);
+      return collection.cassandraSchema;
     }
     const notificationId = NotificationConsoleUtils.logConsoleMessage(
       ConsoleDataType.InProgress,
@@ -514,74 +530,79 @@ export class CassandraAPIDataClient extends TableDataClient {
         ? Constants.CassandraBackend.guestSchemaApi
         : Constants.CassandraBackend.schemaApi;
     let endpoint = `${configContext.BACKEND_ENDPOINT}/${apiEndpoint}`;
-    const deferred = Q.defer<CassandraTableKey[]>();
+    const authorizationHeader = getAuthorizationHeader();
-    $.ajax(endpoint, {
+
-      type: "POST",
+    try {
-      data: {
+      const response = await fetch(endpoint, {
-        accountName: collection && collection.container.databaseAccount && collection.container.databaseAccount().name,
+        method: "POST",
+        body: JSON.stringify({
+          accountName:
+            collection && collection.container.databaseAccount && collection.container.databaseAccount().name,
           cassandraEndpoint: this.trimCassandraEndpoint(
             collection.container.databaseAccount().properties.cassandraEndpoint
           ),
           resourceId: collection.container.databaseAccount().id,
           keyspaceId: collection.databaseId,
           tableId: collection.id()
-      },
+        }),
-      beforeSend: this.setAuthorizationHeader,
+        headers: {
-      error: this.handleAjaxError,
+          [authorizationHeader.header]: authorizationHeader.token,
-      cache: false
+          [Constants.HttpHeaders.contentType]: "application/json"
-    })
+        }
-      .then(
+      });
-        (data: any) => {
+
+      if (!response.ok) {
+        displayTokenRenewalPromptForStatus(response.status);
+        throw Error(`Failed to fetch schema for table ${collection.id()}`);
+      }
+
+      const data = await response.json();
       collection.cassandraSchema = data.columns;
       NotificationConsoleUtils.logConsoleMessage(
         ConsoleDataType.Info,
         `Successfully fetched schema for table ${collection.id()}`
       );
-          deferred.resolve(data.columns);
+
-        },
+      return data.columns;
-        (error: any) => {
+    } catch (error) {
       handleError(error, "FetchSchemaCassandra", `Error fetching schema for table ${collection.id()}`);
-          deferred.reject(error);
+      throw error;
-        }
+    } finally {
-      )
-      .done(() => {
       NotificationConsoleUtils.clearInProgressMessageWithId(notificationId);
-      });
+    }
-    return deferred.promise;
   }
 
-  private createOrDeleteQuery(
+  private async createOrDeleteQuery(
     cassandraEndpoint: string,
     resourceId: string,
     query: string,
     explorer: Explorer
-  ): Q.Promise<any> {
+  ): Promise<void> {
-    const deferred = Q.defer();
     const authType = window.authType;
     const apiEndpoint: string =
       authType === AuthType.EncryptedToken
         ? Constants.CassandraBackend.guestCreateOrDeleteApi
         : Constants.CassandraBackend.createOrDeleteApi;
-    $.ajax(`${configContext.BACKEND_ENDPOINT}/${apiEndpoint}`, {
+    const authorizationHeader = getAuthorizationHeader();
-      type: "POST",
+
-      data: {
+    const response = await fetch(`${configContext.BACKEND_ENDPOINT}/${apiEndpoint}`, {
+      method: "POST",
+      body: JSON.stringify({
         accountName: explorer.databaseAccount() && explorer.databaseAccount().name,
         cassandraEndpoint: this.trimCassandraEndpoint(cassandraEndpoint),
-        resourceId: resourceId,
+        resourceId,
-        query: query
+        query
-      },
+      }),
-      beforeSend: this.setAuthorizationHeader,
+      headers: {
-      error: this.handleAjaxError,
+        [authorizationHeader.header]: authorizationHeader.token,
-      cache: false
+        [Constants.HttpHeaders.contentType]: "application/json"
-    }).then(
+      }
-      (data: any) => {
+    });
-        deferred.resolve();
+
-      },
+    if (!response.ok) {
-      reason => {
+      displayTokenRenewalPromptForStatus(response.status);
-        deferred.reject(reason);
+      throw Error(`Failed to create or delete keyspace/table`);
     }
-    );
-    return deferred.promise;
   }
 
   private trimCassandraEndpoint(cassandraEndpoint: string): string {
@@ -600,13 +621,6 @@ export class CassandraAPIDataClient extends TableDataClient {
     return cassandraEndpoint;
   }
 
-  private setAuthorizationHeader: (xhr: XMLHttpRequest) => boolean = (xhr: XMLHttpRequest): boolean => {
-    const authorizationHeaderMetadata: ViewModels.AuthorizationTokenHeaderMetadata = getAuthorizationHeader();
-    xhr.setRequestHeader(authorizationHeaderMetadata.header, authorizationHeaderMetadata.token);
-
-    return true;
-  };
-
   private isStringType(dataType: string): boolean {
     // TODO figure out rest of types that are considered strings by Cassandra (if any have been missed)
     return (
@@ -620,12 +634,4 @@ export class CassandraAPIDataClient extends TableDataClient {
   private getCassandraPartitionKeyProperty(collection: ViewModels.Collection): string {
     return collection.cassandraKeys.partitionKeys[0].property;
   }
-
-  private handleAjaxError = (xhrObj: XMLHttpRequest, textStatus: string, errorThrown: string): void => {
-    if (!xhrObj) {
-      return;
-    }
-
-    displayTokenRenewalPromptForStatus(xhrObj.status);
-  };
 }

src/Platform/Hosted/Authorization.ts

@@ -10,6 +10,7 @@ import { DefaultExperienceUtility } from "../../Shared/DefaultExperienceUtility"
 import * as Logger from "../../Common/Logger";
 import { configContext } from "../../ConfigContext";
 import { userContext } from "../../UserContext";
+import { getErrorMessage } from "../../Common/ErrorHandlingUtils";
 
 export default class AuthHeadersUtil {
   public static serverId: string = Constants.ServerIds.productionPortal;
@@ -37,8 +38,7 @@ export default class AuthHeadersUtil {
     cacheLocation: window.navigator.userAgent.indexOf("Edge") > -1 ? "localStorage" : undefined
   });
 
-  public static getAccessInputMetadata(accessInput: string): Q.Promise<DataModels.AccessInputMetadata> {
+  public static async getAccessInputMetadata(accessInput: string): Promise<DataModels.AccessInputMetadata> {
-    const deferred: Q.Deferred<DataModels.AccessInputMetadata> = Q.defer<DataModels.AccessInputMetadata>();
     const url = `${configContext.BACKEND_ENDPOINT}${Constants.ApiEndpoints.guestRuntimeProxy}/accessinputmetadata`;
     const authType: string = (<any>window).authType;
     const headers: { [headerName: string]: string } = {};
@@ -49,58 +49,55 @@ export default class AuthHeadersUtil {
       headers[Constants.HttpHeaders.connectionString] = accessInput;
     }
 
-    $.ajax({
+    let responseText: string;
-      url: url,
+    try {
-      type: "GET",
+      const timeout = setTimeout(() => {
-      headers: headers,
+        throw Error("Request timed out while fetching access input metadata");
-      cache: false,
+      }, Constants.ClientDefaults.requestTimeoutMs);
-      dataType: "text"
+
-    }).then(
+      const response = await fetch(url, {
-      (data: string, textStatus: string, xhr: JQueryXHR<any>) => {
+        headers,
-        if (!data) {
+        method: "GET"
+      });
+
+      clearTimeout(timeout);
+
+      responseText = await response.text();
+      if (!response.ok || !responseText) {
         NotificationConsoleUtils.logConsoleMessage(ConsoleDataType.Error, `Failed to get access input metadata`);
-          deferred.reject(`Failed to get access input metadata`);
+        throw Error("Failed to get access input metadata");
+      }
+    } catch (error) {
+      const errorMessage: string = getErrorMessage(error);
+      NotificationConsoleUtils.logConsoleMessage(
+        ConsoleDataType.Error,
+        `Error while fetching access input metadata: ${errorMessage}`
+      );
+      throw error;
     }
 
     try {
-          const metadata: DataModels.AccessInputMetadata = JSON.parse(JSON.parse(data));
+      const metadata: DataModels.AccessInputMetadata = JSON.parse(JSON.parse(responseText));
-          deferred.resolve(metadata); // TODO: update to a single JSON parse once backend response is stringified exactly once
+      return metadata; // TODO: update to a single JSON parse once backend response is stringified exactly once
     } catch (error) {
       NotificationConsoleUtils.logConsoleMessage(ConsoleDataType.Error, "Failed to parse access input metadata");
-          deferred.reject("Failed to parse access input metadata");
       throw error;
     }
-      },
-      (xhr: JQueryXHR<any>, textStatus: string, error: any) => {
-        NotificationConsoleUtils.logConsoleMessage(
-          ConsoleDataType.Error,
-          `Error while fetching access input metadata: ${JSON.stringify(xhr.responseText)}`
-        );
-        deferred.reject(xhr.responseText);
-      }
-    );
-
-    return deferred.promise.timeout(Constants.ClientDefaults.requestTimeoutMs);
   }
 
-  public static generateEncryptedToken(): Q.Promise<DataModels.GenerateTokenResponse> {
+  public static async generateEncryptedToken(): Promise<DataModels.GenerateTokenResponse> {
     const url = configContext.BACKEND_ENDPOINT + "/api/tokens/generateToken" + AuthHeadersUtil._generateResourceUrl();
     const explorer = window.dataExplorer;
     const headers: any = { authorization: userContext.authorizationToken };
     headers[Constants.HttpHeaders.getReadOnlyKey] = !explorer.hasWriteAccess();
+    headers[Constants.HttpHeaders.contentType] = "application/json";
 
-    return AuthHeadersUtil._initiateGenerateTokenRequest({
+    return await AuthHeadersUtil._initiateGenerateTokenRequest(url, "POST", headers);
-      url: url,
-      type: "POST",
-      headers: headers,
-      contentType: "application/json",
-      cache: false
-    });
   }
 
-  public static generateUnauthenticatedEncryptedTokenForConnectionString(
+  public static async generateUnauthenticatedEncryptedTokenForConnectionString(
     connectionString: string
-  ): Q.Promise<DataModels.GenerateTokenResponse> {
+  ): Promise<DataModels.GenerateTokenResponse> {
     if (!connectionString) {
       return Q.reject("None or empty connection string specified");
     }
@@ -108,14 +105,9 @@ export default class AuthHeadersUtil {
     const url = configContext.BACKEND_ENDPOINT + "/api/guest/tokens/generateToken";
     const headers: any = {};
     headers[Constants.HttpHeaders.connectionString] = connectionString;
+    headers[Constants.HttpHeaders.contentType] = "application/json";
 
-    return AuthHeadersUtil._initiateGenerateTokenRequest({
+    return await AuthHeadersUtil._initiateGenerateTokenRequest(url, "POST", headers);
-      url: url,
-      type: "POST",
-      headers: headers,
-      contentType: "application/json",
-      cache: false
-    });
   }
 
   public static isUserSignedIn(): boolean {
@@ -282,24 +274,27 @@ export default class AuthHeadersUtil {
     return `?resourceUrl=${resourceUrl}&rid=${rid}&rtype=${rtype}&sid=${sid}&rg=${rg}&dba=${dba}&api=${apiKind}`;
   }
 
-  private static _initiateGenerateTokenRequest(
+  private static async _initiateGenerateTokenRequest(
-    requestSettings: JQueryAjaxSettings<any>
+    url: string,
-  ): Q.Promise<DataModels.GenerateTokenResponse> {
+    method: string,
-    const deferred: Q.Deferred<DataModels.GenerateTokenResponse> = Q.defer<DataModels.GenerateTokenResponse>();
+    headers: any
+  ): Promise<DataModels.GenerateTokenResponse> {
+    const timeout = setTimeout(() => {
+      throw Error("Request timed out while generating token");
+    }, Constants.ClientDefaults.requestTimeoutMs);
 
-    $.ajax(requestSettings).then(
+    const response = await fetch(url, {
-      (data: string, textStatus: string, xhr: JQueryXHR<any>) => {
+      headers,
-        if (!data) {
+      method
-          deferred.reject("No token generated");
+    });
+
+    clearTimeout(timeout);
+
+    const token: string = await response.json();
+    if (response.ok && token) {
+      return JSON.parse(token);
     }
 
-        deferred.resolve(JSON.parse(data));
+    throw Error("No token generated");
-      },
-      (xhr: JQueryXHR<any>, textStatus: string, error: any) => {
-        deferred.reject(xhr.responseText);
-      }
-    );
-
-    return deferred.promise.timeout(Constants.ClientDefaults.requestTimeoutMs);
   }
 }