TOCA

Toca metrics collector for React

Install

npm install toca

Utilisation

TrackingProvider

Get your AppID et AppSecret from the Toca backoffice

<TrackingProvider appId="AppID" appSecret="AppSecret">
    <App />
</TrackingProvider>

EventTracker

Supported events:

• Click
• Hover
• Blur
• Focus
• Submit

Attributes:

• name: the name of the element to trac
• event: the event type to track (list above)

<EventTracker name="Click me button" event="click">
    <button onClick={...}>Click me</button>
</EventTracker>

MouseTracker

Tracks the cursor on a specified area

<MouseTracker>
    <div
    style={{
        display: "flex",
        justifyContent: "center",
        alignItems: "center",
        border: "1px solid red",
        width: 600,
        height: 600,
    }}
    >
    Move your mouse here
    </div>
</MouseTracker>

UserSession

Tracks the users sessions

<TrackingProvider appId="AppID" appSecret="AppSecret">
    <UserSession>
        <App />
    </UserSession>
</TrackingProvider>

PageView

Captures views on elements

title: the name of the element/page

<PageView title="Payment modal">
    <div />
</PageView>