react-activity-tracker/dist/index.esm.js

A library to track user interactions and API activity in React apps

import t from"axios";let e=[];const n=(t,n)=>{const o=(new Date).toISOString();e.push({type:t,timestamp:o,...n})},o=()=>e,r=t=>{t&&e.length>0&&fetch(t,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(e)}).then((()=>{e=[]}))};function a(t){try{return"string"==typeof t?JSON.parse(t):t}catch{return t}}function s(t){try{return"string"==typeof t?JSON.parse(t):t}catch{return t}}function i(t){try{return"string"==typeof t?JSON.parse(t):t}catch{return t}}function c(){const e=t=>{n(t)};!function(t){const e=window.fetch;window.fetch=async function(n,o={},r=""){const s=o.method||"GET",i=o.body?a(o.body):null;try{const c=await e(n,o),d=c.clone(),u=a(await d.text());return t({type:"api",label:r,url:n,method:s,requestBody:i,responseBody:u,status:c.status}),c}catch(e){throw t({type:"api",label:r,url:n,method:s,requestBody:i,responseBody:{error:e.message},status:"error"}),e}}}(e),function(t){const e=XMLHttpRequest.prototype.open,n=XMLHttpRequest.prototype.send;XMLHttpRequest.prototype.open=function(t,n){return this._method=t,this._url=n,e.apply(this,arguments)},XMLHttpRequest.prototype.send=function(e){const o=this,r=e?s(e):null;return o.addEventListener("loadend",(function(){const e=s(o.responseText);t({type:"api",label:"",url:o._url,method:o._method,requestBody:r,responseBody:e,status:o.status})})),n.apply(this,arguments)}}(e),function(e){t.interceptors.request.use((t=>(t.metadata={requestBody:t.data?i(t.data):null},t))),t.interceptors.response.use((t=>(e({type:"api",label:t.config.label||"",url:t.config.url,method:t.config.method,requestBody:t.config.metadata?.requestBody||null,responseBody:t.data,status:t.status}),t)),(t=>{const n=t.config||{};return e({type:"api",label:n.label||"",url:n.url,method:n.method||"UNKNOWN",requestBody:n.metadata?.requestBody||null,responseBody:{error:t.message},status:t.response?.status||"error"}),Promise.reject(t)}))}(e),function(t){const e=window.WebSocket;window.WebSocket=function(...n){const o=new e(...n),[r]=n;o.addEventListener("message",(e=>{t({type:"websocket-receive",url:r,data:e.data,time:(new Date).toISOString()})}));const a=o.send;return o.send=function(e){return t({type:"websocket-send",url:r,data:e,time:(new Date).toISOString()}),a.call(o,e)},o}}(e),function(t){const e=navigator.sendBeacon;navigator.sendBeacon=function(n,o){return t({type:"beacon",url:n,data:o,time:(new Date).toISOString()}),e.call(this,n,o)}}(e)}function d(t){return t.name||t.id||t.innerText&&t.innerText.trim().substring(0,50)||t.placeholder||t.className||""}function u(){const t=t=>{n(t)};!function(t){document.addEventListener("click",(e=>{const n=e.target;t({type:"click",element:n.tagName,id:n.id,className:n.className,label:d(n),time:(new Date).toISOString()})})),document.addEventListener("input",(e=>{const n=e.target;t({type:"input",element:n.tagName,id:n.id,name:n.name,value:n.value,label:d(n),time:(new Date).toISOString()})}))}(t),function(t){window.addEventListener("error",(e=>{t({type:"error",message:e.message,filename:e.filename,line:e.lineno,col:e.colno,time:(new Date).toISOString()})})),window.addEventListener("unhandledrejection",(e=>{t({type:"unhandledrejection",reason:e.reason,time:(new Date).toISOString()})}))}(t),function(t){window.addEventListener("load",(()=>{const e=performance.timing;t({type:"performance",pageLoad:e.loadEventEnd-e.navigationStart,dns:e.domainLookupEnd-e.domainLookupStart,connect:e.connectEnd-e.connectStart,time:(new Date).toISOString()})}))}(t)}export{o as getEvents,c as initGlobalTracker,u as initUserActivityTracker,n as logEvent,r as sendToServer};