-1

I'm using cubejs with React. I want to display real time data.

I tried using React lifecycle methods & state , where the <QueryRender> component is triggered every 2 seconds. But it does not work.

shahaf
  • 4,750
  • 2
  • 29
  • 32
Prashant Dhage
  • 57
  • 1
  • 6
  • 2
    You'll have more success with your question (and the answers you get) if you include some of the code you've tried and how your results are different from what you expected. – ebbishop Oct 25 '19 at 16:33
  • Welcome to stackoverflow. Please read [ask]. Then [edit] your question and add the code you've tried so far. Be precise; "It does not work" is not a helpful problem description. Good luck! – Robert Oct 26 '19 at 00:20

1 Answers1

0

You can switch transport to Web Sockets:

import cubejs from '@cubejs-client/core';
import WebSocketTransport from '@cubejs-client/ws-transport';

const cubejsApi = cubejs({
  transport: new WebSocketTransport({ authentication: CUBEJS_TOKEN, apiUrl: 'ws://localhost:4000/' })
});

And use react hooks subscriptions:

import { useCubeQuery } from '@cubejs-client/react';

const Chart = ({ query }) => {
  const { resultSet, error, isLoading } = useCubeQuery(query, { subscribe: true });

  if (isLoading) {
    return <div>Loading...</div>;
  }

  if (error) {
    return <pre>{error.toString()}</pre>;
  }

  return <LineChart resultSet={resultSet}/>;
};

To learn more: https://cube.dev/docs/real-time-data-fetch

Pavel Tiunov
  • 1,163
  • 6
  • 8