How to use @cubejs-client/core - 9 common examples
To help you get started, we’ve selected a few @cubejs-client/core examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
cube-js / cube.js / packages / cubejs-playground / src / ExplorePage.js View on Github 
cubejsApi() {
const { cubejsToken, apiUrl } = this.state;
if (!this.cubejsApiInstance && cubejsToken) {
this.cubejsApiInstance = cubejs(cubejsToken, {
apiUrl: `${apiUrl}/cubejs-api/v1`
});
}
return this.cubejsApiInstance;
}import React, { Component } from 'react';
import { Container, Row, Col } from 'reactstrap';
import { AreaChart, Area, XAxis, YAxis, Tooltip, ResponsiveContainer, PieChart, Pie, Cell, Legend, BarChart, Bar } from 'recharts';
import moment from 'moment';
import numeral from 'numeral';
import cubejs from '@cubejs-client/core';
import Chart from './Chart.js';
import GithubCorner from 'react-github-corner';
const cubejsApi = cubejs(process.env.REACT_APP_CUBEJS_TOKEN);
const currencyFormatter = (item) => numeral(item).format('$0,0')
const dateFormatter = (item) => moment(item).format('MMM YY')
class App extends Component {
render() {
return (import React, { useEffect } from "react";
import "./App.css";
import { Layout } from "antd";
import cubejs from "@cubejs-client/core";
import { CubeProvider } from "@cubejs-client/react";
import Header from "./components/Header";
import WebSocketTransport from "@cubejs-client/ws-transport";
import tracker from "./tracker";
const CUBEJS_TOKEN = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpYXQiOjE1NzM2MjI5MjR9.iD_sSpXRBQSO0ywh5zSPHpHV-1O37oQMakrkG03kR-o";
let WS_URL;
if (process.env.NODE_ENV === 'production') {
WS_URL = window.location.origin.replace('http', 'ws').replace('https', 'wss')
} else {
WS_URL = "ws://localhost:4000/"
}
const cubejsApi = cubejs({
transport: new WebSocketTransport({
authorization: CUBEJS_TOKEN,
apiUrl: WS_URL
})
});
const AppLayout = ({ children }) => (
<header>
{children}
);</header>Area,
XAxis,
YAxis,
Tooltip,
ResponsiveContainer,
Legend,
BarChart,
Bar
} from "recharts";
import moment from "moment";
import numeral from "numeral";
import cubejs from "@cubejs-client/core";
import Chart from "./Chart.js";
import GithubCorner from 'react-github-corner';
const cubejsApi = cubejs(process.env.REACT_APP_CUBEJS_TOKEN, {
apiUrl: process.env.REACT_APP_API_URL
});
const numberFormatter = item => numeral(item).format("0,0");
const dateFormatter = item => moment(item).format("MMM YY");
const renderSingleValue = (resultSet, key) => (
<h1 height="{300}">{numberFormatter(resultSet.chartPivot()[0][key])}</h1>
);
class App extends Component {
render() {
return ((
resultSet && renderChart(resultSet) || ()
)}
/>import './body.css';
import 'antd/dist/antd.css';
import React from "react";
import { ApolloProvider } from '@apollo/react-hooks';
import { Layout } from "antd";
import cubejs from '@cubejs-client/core';
import { CubeProvider } from "@cubejs-client/react";
import client from "./graphql/client";
import Header from "./components/Header";
const API_URL = undefined;
const CUBEJS_TOKEN = undefined;
const cubejsApi = cubejs(
CUBEJS_TOKEN,
{ apiUrl: `${API_URL}/cubejs-api/v1` }
);
const AppLayout = ({ children }) => (
<header>
{children}
);
const App = ({ children }) => (</header>render() {
const cubejsApi = cubejs('eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpIjo0MDEzN30.8Slfo_q1LUFAflOoLksmtNxT0MnrwKkf3SX1N6d77Rw');
return (
<h1>React E-Commerce Dashboard built with Cube.js</h1>cubejsApi() {
const { cubejsToken, apiUrl } = this.state;
if (!this.cubejsApiInstance && cubejsToken) {
this.cubejsApiInstance = cubejs(cubejsToken, {
apiUrl: `${apiUrl}/cubejs-api/v1`
});
}
return this.cubejsApiInstance;
}import './body.css';
import 'antd/dist/antd.css';
import React from "react";
import { Layout } from "antd";
import cubejs from '@cubejs-client/core';
import { CubeProvider } from "@cubejs-client/react";
import Header from "./components/Header";
const API_URL = undefined;
const CUBEJS_TOKEN = undefined;
const cubejsApi = cubejs(
CUBEJS_TOKEN,
{ apiUrl: `${API_URL}/cubejs-api/v1` }
);
const AppLayout = ({ children }) => (
<header>
{children}
);
const App = ({ children }) => (</header>
