Merge pull request #65 from ajinkyapandetekdi/latest-all-0.5

Bug #204894 [ALL] React APP Telemetry not working for root url for
Sunbird-ALL · Sep 18, 2023 · f2d21de · f2d21de
2 parents 69597aa + 2c25383
commit f2d21de
Show file tree

Hide file tree

Showing 8 changed files with 50 additions and 45 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,6 +24,7 @@ import FingerprintJS from '@fingerprintjs/fingerprintjs';
 import StartLearn4 from './pages/PlayAndLearn/StartLearn';
 
 function App() {
+  const location = useLocation();
   let ranonce = false;
 
   useEffect(() => {
@@ -32,12 +34,11 @@ function App() {
       const { visitorId } = await fp.get();
 
       localStorage.setItem('did', visitorId);
+      initService();
     };
+    setFp();  
 
-    setFp();
     const initService = () => {
-
-
       if (localStorage.getItem('fpDetails_v2') !== null) {
         let fpDetails_v2 = localStorage.getItem('fpDetails_v2');
         var did = fpDetails_v2.result;
@@ -73,21 +74,21 @@ function App() {
         // tslint:disable-next-line:max-line-length
         metadata: {},
       });
-    };
-    initService();
-    if (!ranonce) {
 
-      if (localStorage.getItem('contentSessionId') === null) {
-        startEvent();
-      }
+      if (!ranonce) {
 
-      ranonce = true;
-    }
+        if (localStorage.getItem('contentSessionId') === null) {
+          startEvent(location.pathname);
+        }
+        ranonce = true;
+      }
+    };
   }, []);
+
   useEffect(() => {
     const cleanup = () => {
       if (localStorage.getItem('contentSessionId') === null) {
-        end();
+        end(location.pathname);
       }
     };
 
@@ -98,9 +99,9 @@ function App() {
     };
   }, []);
 
-  return (
-    <HashRouter>
 
+  return (
+    <>
       <Link to={'/exploreandlearn/score'} id="link_score_proto3" className="hide">
         score
       </Link>
@@ -125,7 +126,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('DT');
+    interactCall("playAudio", "startlearn","DT", "play");
     set_temp_audio(new Audio(content[sel_lang].audio));
   };
   // console.log(isAudioPlay);
 
   const pauseAudio = () => {
-    interactCall('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('DT');
+      interactCall("learnAudio", "startlearn","DT", "learn");
       setFlag(!flag);
       temp_audio.addEventListener('ended', () => setFlag(true));
     }
@@ -49,7 +49,7 @@ function StartLearn() {
   };
 
   const newSentence = () => {
-    interactCall('DT');
+    interactCall("newSentence", "startlearn","DT", "");
     handleChangeWord()
   };
   useEffect(() => {

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('DT');
+    interactCall("playAudio", "score","DT", "play");
     set_temp_audio(new Audio(recordedAudio));
   };
   const pauseAudio = () => {
-    interactCall('DT');
+    interactCall("pauseAudio", "startlearn","DT", "pause");
     if (temp_audio !== null) {
       temp_audio.pause();
       setFlag(!false);
@@ -82,11 +82,11 @@ function Score() {
   };
 
   const newSentence = () => {
-    interactCall('DT');
+    interactCall("newSentence", "startlearn","DT", "");
     navigate(-1);
   };
   const trySameSentence = () => {
-    interactCall('DT');
+    interactCall("trySameSentence", "startlearn","DT", "");
     localStorage.setItem('trysame', 'yes');
     navigate(-1);
   };
@@ -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('DT');
+    interactCall("playAudio", "score","DT", "play");
     set_temp_audio(new Audio(content[sel_lang].audio));
   };
 
   const pauseAudio = () => {
-    interactCall('DT');
+    interactCall("pauseAudio", "score","DT", "pause");
     if (temp_audio !== null) {
       temp_audio.pause();
       setFlag(!false);
@@ -55,7 +55,7 @@ function StartLearn() {
   };
 
   const newSentence = () => {
-    interactCall('DT');
+    interactCall("newSentence", "score","DT", "");
     handleChangeWord()
   };
 

diff --git a/src/services/callTelemetryIntract.js b/src/services/callTelemetryIntract.js
@@ -1,12 +1,14 @@
 import React from 'react';
 import { interact,start } from '../services/telementryService';
 const duration = new Date().getTime();
-export const interactCall = (telemetryMode) => {
-  interact(telemetryMode)
+
+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,23 +87,24 @@ 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',
       },
     });
 };
 
-export const interact = (telemetryMode) => {
+
+export const interact = (id, url, telemetryMode, currentPage) => {
   if (checkTelemetryMode(telemetryMode)) {
     CsTelemetryModule.instance.telemetryService.raiseInteractTelemetry({
       options: getEventOptions(),
-      edata: { type: 'TOUCH', subtype: '', pageid: url },
+      edata: { type: "TOUCH", id: id, pageid: url, subtype: currentPage || "" },
     });
   }
 };