Receive Real-Time Updates

A reliable real-time view combines two operations:

1. Fetch recent records through corvaDataAPI.
2. Subscribe to the next records through socketClient.

This avoids an empty screen while the application waits for its first live event.

import { useEffect, useState } from 'react';
import { corvaDataAPI, socketClient } from '@corva/ui/clients';

const provider = 'corva';
const dataset = 'wits';

export function LiveHoleDepth({ assetId }) {
  const [records, setRecords] = useState([]);

  useEffect(() => {
    let mounted = true;

    async function loadInitialData() {
      const initial = await corvaDataAPI.get(
        `/api/v1/data/${provider}/${dataset}/`,
        {
          query: JSON.stringify({ asset_id: assetId }),
          sort: JSON.stringify({ timestamp: -1 }),
          limit: 100,
          fields: 'timestamp,asset_id,data.hole_depth',
        }
      );

      if (mounted) setRecords(initial.reverse());
    }

    loadInitialData();

    const unsubscribe = socketClient.subscribe(
      { provider, dataset, assetId },
      {
        onDataReceive: event => {
          if (mounted) {
            setRecords(current => current.concat(event.data));
          }
        },
      }
    );

    return () => {
      mounted = false;
      unsubscribe();
    };
  }, [assetId]);

  return (
    <ul>
      {records.map(record => (
        <li key={record._id || record.timestamp}>
          {record.timestamp}: {record.data.hole_depth}
        </li>
      ))}
    </ul>
  );
}

Subscription fields

Name	Type	Requirement	Description
provider	String	Required	Dataset provider.
dataset	String	Required	Dataset name.
assetId	Integer	Required for time/depth data	Well or other operational asset.
companyId	Integer	Required for reference data	Company associated with reference records.
event	String	Optional	Empty for creates, update, or destroy.

Operational guidance

• Always call the returned unsubscribe function.
• Recreate the subscription when the selected asset changes.
• Deduplicate records if historical loading and the subscription can overlap.
• Re-fetch recent data after reconnecting when every record matters.
• Use polling instead when changes are infrequent and live updates add no user value.

See the complete socketClient guide for event-specific examples.