fix(carto): Add missing 'client' parameter to query requests (#8913)

---------

Co-authored-by: Felix Palmer <[email protected]>

modules/carto/src/api/query.ts

@@ -10,6 +10,7 @@ type UrlParameters = {q: string; queryParameters?: string};
 export const query = async function (options: QueryOptions): Promise<QueryResult> {
   const {
     apiBaseUrl = SOURCE_DEFAULTS.apiBaseUrl,
+    clientId = SOURCE_DEFAULTS.clientId,
     connectionName,
     sqlQuery,
     queryParameters
@@ -22,16 +23,17 @@ export const query = async function (options: QueryOptions): Promise<QueryResult
 
   const baseUrl = buildQueryUrl({apiBaseUrl, connectionName});
   const headers = {Authorization: `Bearer ${options.accessToken}`, ...options.headers};
+  const parameters = {client: clientId, ...urlParameters};
 
   const errorContext: APIErrorContext = {
     requestType: 'SQL',
     connection: options.connectionName,
     type: 'query',
-    source: JSON.stringify(urlParameters, undefined, 2)
+    source: JSON.stringify(parameters, undefined, 2)
   };
   return await requestWithParameters<QueryResult>({
     baseUrl,
-    parameters: urlParameters,
+    parameters,
     headers,
     errorContext
   });

test/modules/carto/api/query.spec.ts

@@ -0,0 +1,26 @@
+import {query} from '@deck.gl/carto';
+import test from 'tape-catch';
+import {withMockFetchMapsV3, QUERY_RESPONSE} from '../mock-fetch';
+
+test('query', async t => {
+  await withMockFetchMapsV3(async calls => {
+    const response = await query({
+      connectionName: 'carto_dw',
+      clientId: 'CUSTOM_CLIENT',
+      accessToken: '<token>',
+      sqlQuery: 'SELECT * FROM a.b.h3_table'
+    });
+
+    t.is(calls.length, 1, 'calls fetch() x1');
+
+    const [queryCall] = calls;
+
+    t.match(queryCall.url, /v3\/sql\/carto_dw\/query/, 'connection');
+    t.match(queryCall.url, /q=SELECT%20\*%20FROM%20a\.b\.h3_table/, 'query');
+    t.match(queryCall.url, /client\=CUSTOM_CLIENT/, 'clientId');
+
+    t.ok(response, 'returns response');
+    t.deepEqual(response, QUERY_RESPONSE, 'correct response');
+  }).catch(t.fail);
+  t.end();
+});

test/modules/carto/index.ts

@@ -3,6 +3,7 @@ import './api/carto-api-error.spec';
 import './api/fetch-map.spec';
 import './api/layer-map.spec';
 import './api/parse-map.spec';
+import './api/query.spec';
 import './api/request-with-parameters.spec';
 import './utils.spec';
 import './layers/carto-vector-tile.spec';

test/modules/carto/mock-fetch.ts

@@ -51,6 +51,8 @@ export const TILESTATS_RESPONSE = {
   type: 'Number'
 };
 
+export const QUERY_RESPONSE = [{id: 1, value: 'string'}];
+
 const createDefaultResponse = (
   url: string,
   headers: HeadersInit,
@@ -75,6 +77,9 @@ const createDefaultResponse = (
       if (url.indexOf('stats') !== -1) {
         return TILESTATS_RESPONSE;
       }
+      if (url.indexOf('sql') !== -1) {
+        return QUERY_RESPONSE;
+      }
       if (url.indexOf('query') !== -1 || url.indexOf('table')) {
         return {
           tilejson: {

test/modules/carto/sources/h3-query-source.spec.ts

@@ -6,6 +6,7 @@ test('h3QuerySource', async t => {
   await withMockFetchMapsV3(async calls => {
     const tilejson = await h3QuerySource({
       connectionName: 'carto_dw',
+      clientId: 'CUSTOM_CLIENT',
       accessToken: '<token>',
       sqlQuery: 'SELECT * FROM a.b.h3_table',
       aggregationExp: 'SUM(population) as pop'
@@ -20,6 +21,7 @@ test('h3QuerySource', async t => {
     t.match(initCall.url, /spatialDataColumn=h3/, 'spatialDataColumn');
     t.match(initCall.url, /spatialDataType=h3/, 'spatialDataType');
     t.match(initCall.url, /q=SELECT%20\*%20FROM%20a\.b\.h3_table/, 'query');
+    t.match(initCall.url, /client\=CUSTOM_CLIENT/, 'clientId');
 
     t.match(tilesetCall.url, /^https:\/\/xyz\.com\?format\=tilejson\&cache\=/, 'tileset URL');