diff --git a/frontend/src/components/c-ramp.vue b/frontend/src/components/c-ramp.vue
index 5ca70a7b81..7440e6d2e1 100644
--- a/frontend/src/components/c-ramp.vue
+++ b/frontend/src/components/c-ramp.vue
@@ -142,8 +142,15 @@ export default defineComponent({
       }
 
       const zoomUser = { ...user };
-      // Type cast here is unsafe
-      zoomUser.commits = user.dailyCommits as Commit[];
+      // Calculate total commit result insertion and deletion for the daily/weekly commit selected
+      zoomUser.commits = user.dailyCommits.map(
+        (dailyCommit) => ({
+          insertions: dailyCommit.commitResults.reduce((acc, currCommitResult) => acc + currCommitResult.insertions, 0),
+          deletions: dailyCommit.commitResults.reduce((acc, currCommitResult) => acc + currCommitResult.deletions, 0),
+          ...dailyCommit,
+          commitResults: dailyCommit.commitResults.map((commitResult) => ({ ...commitResult, isOpen: true })),
+        }),
+      ) as Commit[];
 
       const info = {
         zRepo: user.repoName,