From ee1f70cf629a8594b80ca2e35bb0640736901f9e Mon Sep 17 00:00:00 2001
From: Kartikey Tiwari <139932313+monkCommits@users.noreply.github.com>
Date: Thu, 12 Dec 2024 11:22:47 +0530
Subject: [PATCH] fix: removed europe region and converted jitter values from s
 to ms (#3417)

Co-authored-by: Kaustubh Kumar <kaustubhkumar05@gmail.com>
Co-authored-by: Ravi theja <ravi.theja@100ms.live>
---
 .../src/Diagnostics/ConnectivityTest.tsx            |  5 ++---
 .../src/Prebuilt/components/StatsForNerds.jsx       |  4 ++--
 packages/roomkit-react/src/Stats/Stats.tsx          | 13 +++++++++++--
 3 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/packages/roomkit-react/src/Diagnostics/ConnectivityTest.tsx b/packages/roomkit-react/src/Diagnostics/ConnectivityTest.tsx
index 008d06505f..a721ef0a81 100644
--- a/packages/roomkit-react/src/Diagnostics/ConnectivityTest.tsx
+++ b/packages/roomkit-react/src/Diagnostics/ConnectivityTest.tsx
@@ -11,7 +11,6 @@ import { DiagnosticsStep, useDiagnostics } from './DiagnosticsContext';
 
 const Regions = {
   in: 'India',
-  eu: 'Europe',
   us: 'United States',
 };
 
@@ -164,7 +163,7 @@ const AudioStats = ({ stats }: { stats: DiagnosticsRTCStats | undefined }) => {
           <DetailedInfo title="Bitrate Sent" value={formatBytes(stats.bitrateSent, 'b/s')} />
           <DetailedInfo title="Bitrate Received" value={formatBytes(stats.bitrateReceived, 'b/s')} />
           <DetailedInfo title="Round Trip Time" value={`${stats.roundTripTime} ms`} />
-          <DetailedInfo title="Jitter" value={`${stats.jitter} s`} />
+          <DetailedInfo title="Jitter" value={`${stats.jitter * 1000} ms`} />
         </Flex>
       )}
     </ConnectivityTestStepResult>
@@ -183,7 +182,7 @@ const VideoStats = ({ stats }: { stats: DiagnosticsRTCStats | undefined }) => {
           <DetailedInfo title="Bitrate Sent" value={formatBytes(stats.bitrateSent, 'b/s')} />
           <DetailedInfo title="Bitrate Received" value={formatBytes(stats.bitrateReceived, 'b/s')} />
           <DetailedInfo title="Round Trip Time" value={`${stats.roundTripTime} ms`} />
-          <DetailedInfo title="Jitter" value={`${stats.jitter} s`} />
+          <DetailedInfo title="Jitter" value={`${stats.jitter * 1000} ms`} />
         </Flex>
       )}
     </ConnectivityTestStepResult>
diff --git a/packages/roomkit-react/src/Prebuilt/components/StatsForNerds.jsx b/packages/roomkit-react/src/Prebuilt/components/StatsForNerds.jsx
index 989f5ab648..dfff376585 100644
--- a/packages/roomkit-react/src/Prebuilt/components/StatsForNerds.jsx
+++ b/packages/roomkit-react/src/Prebuilt/components/StatsForNerds.jsx
@@ -275,7 +275,7 @@ const LocalPeerStats = () => {
   return (
     <Flex css={{ flexWrap: 'wrap', gap: '$10' }}>
       <StatsRow label="Packets Lost" value={stats.subscribe?.packetsLost} />
-      <StatsRow label="Jitter" value={stats.subscribe?.jitter} />
+      <StatsRow label="Jitter" value={`${((stats.subscribe?.jitter ?? 0) * 1000).toFixed(2)} ms`} />
       <StatsRow label="Publish Bitrate" value={formatBytes(stats.publish?.bitrate, 'b/s')} />
       <StatsRow label="Subscribe Bitrate" value={formatBytes(stats.subscribe?.bitrate, 'b/s')} />
       <StatsRow
@@ -316,7 +316,7 @@ const TrackStats = ({ trackID, layer, local }) => {
       <StatsRow label="Type" value={stats.type + ' ' + stats.kind} />
       <StatsRow label="Bitrate" value={formatBytes(stats.bitrate, 'b/s')} />
       <StatsRow label="Packets Lost" value={stats.packetsLost} />
-      <StatsRow label="Jitter" value={stats.jitter?.toFixed(3)} />
+      <StatsRow label="Jitter" value={`${((stats.subscribe?.jitter ?? 0) * 1000).toFixed(2)} ms`} />
       <StatsRow
         label={inbound ? 'Bytes Received' : 'Bytes Sent'}
         value={formatBytes(inbound ? stats.bytesReceived : stats.bytesSent)}
diff --git a/packages/roomkit-react/src/Stats/Stats.tsx b/packages/roomkit-react/src/Stats/Stats.tsx
index b7ee4532bd..65c2ba91d0 100644
--- a/packages/roomkit-react/src/Stats/Stats.tsx
+++ b/packages/roomkit-react/src/Stats/Stats.tsx
@@ -159,12 +159,21 @@ const PacketLostAndJitter = ({
   const isLocalPeer = audioTrackStats?.type.includes('outbound') || videoTrackStats?.type.includes('outbound');
   const audioStats = isLocalPeer ? audioTrackStats?.remote : audioTrackStats;
   const videoStats = isLocalPeer ? videoTrackStats?.remote : videoTrackStats;
+
   return (
     <>
       <TrackPacketsLostRow label="Packet Loss(V)" stats={videoStats} />
       <TrackPacketsLostRow label="Packet Loss(A)" stats={audioStats} />
-      <StatsRow show={isNotNullish(videoStats?.jitter)} label="Jitter(V)" value={videoStats?.jitter?.toFixed(4)} />
-      <StatsRow show={isNotNullish(audioStats?.jitter)} label="Jitter(A)" value={audioStats?.jitter?.toFixed(4)} />
+      <StatsRow
+        show={isNotNullish(videoStats?.jitter)}
+        label="Jitter(V)"
+        value={`${((videoStats?.jitter ?? 0) * 1000).toFixed(2)} ms`}
+      />
+      <StatsRow
+        show={isNotNullish(audioStats?.jitter)}
+        label="Jitter(A)"
+        value={`${((audioStats?.jitter ?? 0) * 1000).toFixed(2)} ms`}
+      />
     </>
   );
 };