jan/openreplay
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat ui: map of clicks for session

Browse source
This commit is contained in:
nick-delirium 2024-06-27 18:02:41 +02:00
parent fa51d8caa1
commit e2593fe93b
No known key found for this signature in database
GPG key ID: 93ABD695DF5FDBA0
2 changed files with 15 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
frontend/app/components/Session_/PageInsightsPanel/PageInsightsPanel.tsx
View file

@ -1,7 +1,7 @@
import React, { useEffect, useState } from 'react';
import { Loader, Icon } from 'UI';
import { connect } from 'react-redux';
import { fetchInsights } from 'Duck/sessions';
import { fetchSessionClickmap } from 'Duck/sessions';
import SelectorsList from './components/SelectorsList/SelectorsList';
import { PlayerContext } from 'App/components/Session/playerContext';
import { compareJsonObjects } from 'App/utils';
@ -13,7 +13,7 @@ import Period from 'Types/app/period';
const JUMP_OFFSET = 1000;
interface Props {
filters: any;
fetchInsights: (filters: Record<string, any>) => void;
fetchSessionClickmap: (sessionId: string, filters: Record<string, any>) => void;
insights: any;
events: Array<any>;
urlOptions: Array<any>;
@ -23,7 +23,7 @@ interface Props {
sessionId: string;
}
function PageInsightsPanel({ filters, fetchInsights, events = [], insights, urlOptions, host, loading = true, setActiveTab, sessionId }: Props) {
function PageInsightsPanel({ filters, fetchSessionClickmap, events = [], insights, urlOptions, host, loading = true, setActiveTab, sessionId }: Props) {
const { player: Player } = React.useContext(PlayerContext)
const markTargets = (t: any) => Player.markTargets(t)
const defaultValue = urlOptions && urlOptions[0] ? urlOptions[0].value : '';
@ -55,7 +55,7 @@ function PageInsightsPanel({ filters, fetchInsights, events = [], insights, urlO
if (urlOptions && urlOptions[0]) {
const url = insightsFilters.url ? insightsFilters.url : host + urlOptions[0].value;
Player.pause();
fetchInsights({ ...insightsFilters, sessionId, url });
fetchSessionClickmap(sessionId, { ...insightsFilters, sessionId, url });
markTargets([]);
}
prevInsights.current = insightsFilters;
@ -118,5 +118,5 @@ export default connect(
sessionId: state.getIn(['sessions', 'current']).sessionId,
};
},
{ fetchInsights }
{ fetchSessionClickmap }
)(PageInsightsPanel);

10
frontend/app/duck/sessions.ts
View file

@ -34,6 +34,7 @@ const FETCH_LIVE_LIST = new RequestTypes('sessions/FETCH_LIVE_LIST');
const TOGGLE_FAVORITE = new RequestTypes('sessions/TOGGLE_FAVORITE');
const FETCH_ERROR_STACK = new RequestTypes('sessions/FETCH_ERROR_STACK');
const FETCH_INSIGHTS = new RequestTypes('sessions/FETCH_INSIGHTS');
const FETCH_SESSION_CLICKMAP = new RequestTypes('sessions/FETCH_SESSION_CLICKMAP');
const SORT = 'sessions/SORT';
const REDEFINE_TARGET = 'sessions/REDEFINE_TARGET';
const SET_TIMEZONE = 'sessions/SET_TIMEZONE';
@ -374,6 +375,7 @@ const reducer = (state = initialState, action: IAction) => {
return state.set('timezone', action.timezone);
case TOGGLE_CHAT_WINDOW:
return state.set('showChatWindow', action.state);
case FETCH_SESSION_CLICKMAP.SUCCESS:
case FETCH_INSIGHTS.SUCCESS:
return state.set(
'insights',
@ -587,6 +589,14 @@ export function fetchInsights(params) {
};
}
export function fetchSessionClickmap(sessionId, params) {
return {
types: FETCH_SESSION_CLICKMAP.toArray(),
call: (client) => client.post(`/sessions/${sessionId}/clickmaps`, params),
};
}
export function fetchLiveList(params = {}) {
return {
types: FETCH_LIVE_LIST.toArray(),