Bug #204894 [ALL] React APP Telemetry not working for root url

Sunbird-ALL · Sep 18, 2023 · 457edcf · 457edcf
1 parent 2efaeac
commit 457edcf
Show file tree

Hide file tree

Showing 8 changed files with 42 additions and 34 deletions.
diff --git a/src/App.js b/src/App.js
@@ -5,6 +5,7 @@ import {
   Routes,
   Route,
   Link,
+  useLocation,
 } from 'react-router-dom';
 import { initialize, end } from './services/telementryService';
 import '@project-sunbird/telemetry-sdk/index.js';
@@ -23,21 +24,25 @@ import FingerprintJS from '@fingerprintjs/fingerprintjs';
 import StartLearn4 from './pages/PlayAndLearn/StartLearn';
 
 function App() {
+  const location = useLocation();
   let ranonce = false;
 
+
+
   useEffect(() => {
     const setFp = async () => {
       const fp = await FingerprintJS.load();
 
       const { visitorId } = await fp.get();
 
       localStorage.setItem('did', visitorId);
+      initService();
     };
 
     setFp();
-    const initService = () => {
 
 
+    const initService = () => {
       if (localStorage.getItem('fpDetails_v2') !== null) {
         let fpDetails_v2 = localStorage.getItem('fpDetails_v2');
         var did = fpDetails_v2.result;
@@ -73,21 +78,22 @@ function App() {
         // tslint:disable-next-line:max-line-length
         metadata: {},
       });
-    };
-    initService();
-    if (!ranonce) {
 
-      if (localStorage.getItem('contentSessionId') === null) {
-        startEvent();
+      if (!ranonce) {
+
+        if (localStorage.getItem('contentSessionId') === null) {
+          startEvent(location.pathname);
+        }
+        ranonce = true;
       }
+    };
+
 
-      ranonce = true;
-    }
   }, []);
   useEffect(() => {
     const cleanup = () => {
       if (localStorage.getItem('contentSessionId') === null) {
-        end();
+        end(location.pathname);
       }
     };
 
@@ -98,9 +104,9 @@ function App() {
     };
   }, []);
 
-  return (
-    <HashRouter>
 
+  return (
+    <>
       <Link to={'/exploreandlearn/score'} id="link_score_proto3" className="hide">
         score
       </Link>
@@ -125,7 +131,7 @@ function App() {
         <Route path={'/playandlearn/startlearn'} element={<StartLearn4/>} />
       </Routes>
       <Dots />
-    </HashRouter>
+    </>
   );
 }
 

diff --git a/src/index.js b/src/index.js
@@ -4,15 +4,18 @@ import * as ReactDOM from 'react-dom/client';
 import App from './App';
 import * as serviceWorker from './serviceWorker';
 
-import "./index.css";
+import './index.css';
+import { HashRouter } from 'react-router-dom';
 
 const container = document.getElementById('root');
 const root = ReactDOM.createRoot(container);
 
 root.render(
   <>
-    <ColorModeScript />
-    <App />
+    <HashRouter>
+      <ColorModeScript />
+      <App />
+    </HashRouter>
   </>
 );
 

diff --git a/src/pages/ExploreAndLearn/Score/Score.js b/src/pages/ExploreAndLearn/Score/Score.js
@@ -540,12 +540,12 @@ function Score() {
             >
               {isFeedbackDone === true ? (
                 <>
-                  <img
+                  {/* <img
                     style={{ marginRight: '40px' }}
                     src={Thumbs_up}
                     alt="thumbs-up-dis"
                   />
-                  <img src={Thumbs_Down} alt="thumbs-down-dis" />
+                  <img src={Thumbs_Down} alt="thumbs-down-dis" /> */}
                 </>
               ) : (
                 <>

diff --git a/src/pages/ExploreAndLearn/StartLearn/StartLearn.js b/src/pages/ExploreAndLearn/StartLearn/StartLearn.js
@@ -21,13 +21,13 @@ function StartLearn() {
   const [temp_audio, set_temp_audio] = useState(null);
   const [flag, setFlag] = useState(true);
   const playAudio = () => {
-    interactCall("playAudio", "startlearn","DT", "");
+    interactCall("playAudio", "startlearn","DT", "play");
     set_temp_audio(new Audio(content[sel_lang].audio));
   };
   // console.log(isAudioPlay);
 
   const pauseAudio = () => {
-    interactCall("pauseAudio", "startlearn","DT", "");
+    interactCall("pauseAudio", "startlearn","DT", "pause");
     if (temp_audio !== null) {
       temp_audio.pause();
       setFlag(!false);
@@ -37,7 +37,7 @@ function StartLearn() {
   const learnAudio = () => {
     if (temp_audio !== null) {
       temp_audio.play();
-      interactCall("learnAudio", "startlearn","DT", "");
+      interactCall("learnAudio", "startlearn","DT", "learn");
       setFlag(!flag);
       temp_audio.addEventListener('ended', () => setFlag(true));
     }

diff --git a/src/pages/PlayAndLearn/Score.js b/src/pages/PlayAndLearn/Score.js
@@ -57,11 +57,11 @@ function Score() {
 
   const [temp_audio, set_temp_audio] = useState(null);
   const playAudio = () => {
-    interactCall("playAudio", "score","DT", "");
+    interactCall("playAudio", "score","DT", "play");
     set_temp_audio(new Audio(recordedAudio));
   };
   const pauseAudio = () => {
-    interactCall("pauseAudio", "startlearn","DT", "");
+    interactCall("pauseAudio", "startlearn","DT", "pause");
     if (temp_audio !== null) {
       temp_audio.pause();
       setFlag(!false);
@@ -584,12 +584,12 @@ function Score() {
               >
                 {isFeedbackDone === true ? (
                   <>
-                    <img
+                    {/* <img
                       style={{ marginRight: '40px' }}
                       src={Thumbs_up}
                       alt="thumbs-up-dis"
                     />
-                    <img src={Thumbs_Down} alt="thumbs-down-dis" />
+                    <img src={Thumbs_Down} alt="thumbs-down-dis" /> */}
                   </>
                 ) : (
                   <>

diff --git a/src/pages/PlayAndLearn/StartLearn.js b/src/pages/PlayAndLearn/StartLearn.js
@@ -28,12 +28,12 @@ function StartLearn() {
   const location = useLocation();
 
   const playAudio = () => {
-    interactCall("playAudio", "score","DT", "");
+    interactCall("playAudio", "score","DT", "play");
     set_temp_audio(new Audio(content[sel_lang].audio));
   };
 
   const pauseAudio = () => {
-    interactCall("pauseAudio", "score","DT", "");
+    interactCall("pauseAudio", "score","DT", "pause");
     if (temp_audio !== null) {
       temp_audio.pause();
       setFlag(!false);

diff --git a/src/services/callTelemetryIntract.js b/src/services/callTelemetryIntract.js
@@ -6,8 +6,9 @@ export const interactCall = (id, uri, telemetryMode, currentPage, ) => {
   interact(id, uri, telemetryMode, currentPage)
 };
 
-export const  startEvent=()=>{
+export const  startEvent=(pageUrl)=>{
  start(
-    duration
+    duration,
+    pageUrl
   );
 }
diff --git a/src/services/telementryService.js b/src/services/telementryService.js
@@ -29,8 +29,6 @@ if (localStorage.getItem('contentSessionId') !== null) {
   localStorage.setItem('allAppContentSessionId', contentSessionId);
 }
 
-let getUrl = window.location.href;
-url = getUrl && getUrl.includes('#') && getUrl.split('#')[1].split('/')[1];
 
 export const initialize = ({ context, config, metadata }) => {
   context = context;
@@ -65,13 +63,13 @@ export const initialize = ({ context, config, metadata }) => {
   }
 };
 
-export const start = duration => {
+export const start = (duration, stageId) => {
     CsTelemetryModule.instance.telemetryService.raiseStartTelemetry({
       options: getEventOptions(),
       edata: {
         type: 'content',
         mode: 'play',
-        stageid: url,
+        pageid: stageId,
         duration: Number((duration / 1e3).toFixed(2)),
       },
     });
@@ -89,12 +87,12 @@ export const response = (context, telemetryMode) => {
 
 };
 
-export const end = () => {
+export const end = (pageUrl) => {
     CsTelemetryModule.instance.telemetryService.raiseEndTelemetry({
       edata: {
         type: 'content',
         mode: 'play',
-        pageid: url,
+        pageid: pageUrl,
         summary: [],
         duration: '000',
       },