Web SDK

npm install @formo/analytics --save

// App.tsx (or App.js)

  import React from 'react';
  import ReactDOM from 'react-dom/client';
  import { FormoAnalyticsProvider } from '@formo/analytics';
  import App from './App';

  const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);

  root.render(
    <React.StrictMode>
      <FormoAnalyticsProvider writeKey="<YOUR_WRITE_KEY>">
        <App />
      </FormoAnalyticsProvider> 
    </React.StrictMode>
  );

// Usage on a page component

import React, { useEffect } from 'react';
  import { useFormo } from '@formo/analytics';

  const HomePage = () => {
    const analytics = useFormo();

    useEffect(() => {
      // Track a custom event
      analytics.track('custom_event', { points: 100 });
    }, [analytics]);

    return <div>Welcome to the Home Page!</div>;
  };

  export default HomePage;

analytics.identify({ address });

OR

window.formo.identify(...);

analytics.track(
  "Liquidity Added",  // event name
  {
    pool_id: "LINK/ETH",
    revenue: 99.99,     // revenue or fees
    currency: "USD",    // currency
    points: 99.99        // points for XP or rewards
  }
)

OR 

window.formo.track(...)

<AnalyticsProvider
    writeKey={WRITE_KEY}
    options={{
        trackLocalhost: true,
    }}
>

<AnalyticsProvider
    writeKey={WRITE_KEY}
    options={{
        logger: {
            enabled: true,
            levels: ["error", "warn", "info"],
        },
    }}
>

<AnalyticsProvider
    writeKey={WRITE_KEY}
    options={{
        flushAt: 20, // defaults to batches of 20 events
        flushInterval: 1000 * 60, // defaults to 1 min
    }}
>