chore: deprecate cubejsApi prop in favor of cubeApi (#7300)

Author: vasilev-alex

packages/cubejs-client-core/src/index.js

@@ -375,5 +375,5 @@ class CubejsApi {
 
 export default (apiToken, options) => new CubejsApi(apiToken, options);
 
-export { CubejsApi, HttpTransport, ResultSet, RequestError, Meta };
+export { CubejsApi, CubejsApi as CubeApi, HttpTransport, ResultSet, RequestError, Meta };
 export * from './utils';

packages/cubejs-client-react/index.d.ts

@@ -457,9 +457,15 @@ declare module '@cubejs-client/react' {
 
   type UseCubeQueryOptions = {
     /**
+     * @deprecated Use the `cubeApi` option
      * A `CubejsApi` instance to use. Taken from the context if the param is not passed
      */
     cubejsApi?: CubejsApi;
+    
+    /**
+     * A `CubejsApi` instance to use. Taken from the context if the param is not passed
+     */
+    cubeApi?: CubejsApi;
     /**
      * Query execution will be skipped when `skip` is set to `true`. You can use this flag to avoid sending incomplete queries.
      */
@@ -491,6 +497,7 @@ declare module '@cubejs-client/react' {
    */
   type CubeFetchOptions = {
     skip?: boolean;
+    cubeApi?: CubejsApi;
     cubejsApi?: CubejsApi;
     query?: Query;
   };

packages/cubejs-client-react/src/CubeProvider.jsx

@@ -1,10 +1,17 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import CubeContext from './CubeContext';
 
-export default function CubeProvider({ cubejsApi, children, options = {} }) {
+export default function CubeProvider({ cubeApi, cubejsApi, children, options = {} }) {
+  useEffect(() => {
+    if (cubejsApi && !cubeApi) {
+      console.warn('"cubejsApi" is deprecated and will be removed in the following version. Use "cubeApi" instead.');
+    }
+  }, [cubeApi, cubejsApi]);
+  
   return (
     <CubeContext.Provider value={{
       cubejsApi,
+      cubeApi,
       options
     }}
     >

packages/cubejs-client-react/src/hooks/cube-fetch.js

@@ -19,12 +19,12 @@ export function useCubeFetch(method, options = {}) {
   const { skip = false } = options;
 
   async function load(loadOptions = {}, ignoreSkip = false) {
-    const cubejsApi = options.cubejsApi || context?.cubejsApi;
+    const cubeApi = options.cubeApi || options.cubejsApi || context?.cubeApi || context?.cubejsApi;
     const query = loadOptions.query || options.query;
 
     const queryCondition = method === 'meta' ? true : query && isQueryPresent(query);
 
-    if (cubejsApi && (ignoreSkip || !skip) && queryCondition) {
+    if (cubeApi && (ignoreSkip || !skip) && queryCondition) {
       setError(null);
       setResponse({
         isLoading: true,
@@ -38,7 +38,7 @@ export function useCubeFetch(method, options = {}) {
       const args = method === 'meta' ? [coreOptions] : [query, coreOptions];
 
       try {
-        const response = await cubejsApi[method](...args);
+        const response = await cubeApi[method](...args);
 
         if (isMounted()) {
           setResponse({

packages/cubejs-client-react/src/hooks/cube-query.js

@@ -18,12 +18,18 @@ export function useCubeQuery(query, options = {}) {
   let subscribeRequest = null;
 
   const progressCallback = ({ progressResponse }) => setProgress(progressResponse);
+  
+  useEffect(() => {
+    if (options.cubejsApi && !options.cubeApi) {
+      console.warn('"cubejsApi" is deprecated and will be removed in the following version. Use "cubeApi" instead.');
+    }
+  }, [options.cubeApi, options.cubejsApi]);
 
   async function fetch() {
     const { resetResultSetOnChange } = options;
-    const cubejsApi = options.cubejsApi || context?.cubejsApi;
+    const cubeApi = options.cubeApi || options.cubejsApi || context?.cubeApi || context?.cubejsApi;
 
-    if (!cubejsApi) {
+    if (!cubeApi) {
       throw new Error('Cube API client is not provided');
     }
 
@@ -35,7 +41,7 @@ export function useCubeQuery(query, options = {}) {
     setLoading(true);
 
     try {
-      const response = await cubejsApi.load(query, {
+      const response = await cubeApi.load(query, {
         mutexObj: mutexRef.current,
         mutexKey: 'query',
         progressCallback,
@@ -62,9 +68,9 @@ export function useCubeQuery(query, options = {}) {
   useEffect(() => {
     const { skip = false, resetResultSetOnChange } = options;
 
-    const cubejsApi = options.cubejsApi || context?.cubejsApi;
+    const cubeApi = options.cubeApi || options.cubejsApi || context?.cubeApi || context?.cubejsApi;
 
-    if (!cubejsApi) {
+    if (!cubeApi) {
       throw new Error('Cube API client is not provided');
     }
 
@@ -87,7 +93,7 @@ export function useCubeQuery(query, options = {}) {
           }
 
           if (options.subscribe) {
-            subscribeRequest = cubejsApi.subscribe(
+            subscribeRequest = cubeApi.subscribe(
               query,
               {
                 mutexObj: mutexRef.current,