Show total read/written blocks size in IO grid (tooltip)

Fixes dalibo#814

Author: pgiraud

src/components/IoTimingsRow.vue

@@ -9,6 +9,7 @@ import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"
 import { directive as vTippy } from "vue-tippy"
 import { HelpService } from "@/services/help-service"
 import { faInfoCircle } from "@fortawesome/free-solid-svg-icons"
+import { blocksAsBytes } from "@/filters"
 import useNode from "@/node"
 
 interface Props {
@@ -38,13 +39,19 @@ const readSpeedProp = (exclusivePrefix +
   "AVERAGE_" +
   scope +
   "IO_READ_SPEED") as keyof typeof NodeProp
+const readBlocksProp = (exclusivePrefix +
+  scope +
+  "READ_BLOCKS") as keyof typeof NodeProp
 const writeTimeProp = (exclusivePrefix +
   scope +
   "IO_WRITE_TIME") as keyof typeof NodeProp
 const writeSpeedProp = (exclusivePrefix +
   "AVERAGE_" +
   scope +
   "IO_WRITE_SPEED") as keyof typeof NodeProp
+const writtenBlocksProp = (exclusivePrefix +
+  scope +
+  "WRITTEN_BLOCKS") as keyof typeof NodeProp
 </script>
 
 <template>
@@ -53,6 +60,10 @@ const writeSpeedProp = (exclusivePrefix +
     <td class="text-end" v-if="node[NodeProp[readTimeProp]]">
       {{ formattedProp(readTimeProp) }}
       <br />
+      <small>{{
+        blocksAsBytes(node[NodeProp[readBlocksProp]] as number)
+      }}</small>
+      <br />
       <small>~{{ formattedProp(readSpeedProp) }}</small>
       <FontAwesomeIcon
         :icon="faInfoCircle"
@@ -70,6 +81,10 @@ const writeSpeedProp = (exclusivePrefix +
     <td class="text-end" v-if="node[NodeProp[writeTimeProp]]">
       {{ formattedProp(writeTimeProp) }}
       <br />
+      <small>{{
+        blocksAsBytes(node[NodeProp[writtenBlocksProp]] as number)
+      }}</small>
+      <br />
       <small>~{{ formattedProp(writeSpeedProp) }}</small>
     </td>
     <td class="text-end" v-else>-</td>

src/enums.ts

@@ -78,8 +78,10 @@ export enum NodeProp {
   WORKERS_LAUNCHED = "Workers Launched",
   SHARED_HIT_BLOCKS = "Shared Hit Blocks",
   SHARED_READ_BLOCKS = "Shared Read Blocks",
+  READ_BLOCKS = "*Read Blocks",
   SHARED_DIRTIED_BLOCKS = "Shared Dirtied Blocks",
   SHARED_WRITTEN_BLOCKS = "Shared Written Blocks",
+  WRITTEN_BLOCKS = "*Written Blocks",
   TEMP_READ_BLOCKS = "Temp Read Blocks",
   TEMP_WRITTEN_BLOCKS = "Temp Written Blocks",
   LOCAL_HIT_BLOCKS = "Local Hit Blocks",
@@ -133,6 +135,8 @@ export enum NodeProp {
   EXCLUSIVE_LOCAL_READ_BLOCKS = "*Local Read Blocks (exclusive)",
   EXCLUSIVE_LOCAL_DIRTIED_BLOCKS = "*Local Dirtied Blocks (exclusive)",
   EXCLUSIVE_LOCAL_WRITTEN_BLOCKS = "*Local Written Blocks (exclusive)",
+  EXCLUSIVE_READ_BLOCKS = "*Read Blocks (exclusive)",
+  EXCLUSIVE_WRITTEN_BLOCKS = "*Written Blocks (exclusive)",
 
   AVERAGE_IO_READ_SPEED = "*I/O Read Speed",
   AVERAGE_IO_WRITE_SPEED = "*I/O Write Speed",

src/interfaces.ts

@@ -89,6 +89,8 @@ export class Node {
   [NodeProp.EXCLUSIVE_SHARED_HIT_BLOCKS]!: number;
   [NodeProp.EXCLUSIVE_SHARED_READ_BLOCKS]!: number;
   [NodeProp.EXCLUSIVE_SHARED_WRITTEN_BLOCKS]!: number;
+  [NodeProp.EXCLUSIVE_READ_BLOCKS]!: number;
+  [NodeProp.EXCLUSIVE_WRITTEN_BLOCKS]!: number;
   [NodeProp.EXCLUSIVE_TEMP_READ_BLOCKS]!: number;
   [NodeProp.EXCLUSIVE_TEMP_WRITTEN_BLOCKS]!: number;
   [NodeProp.FILTER]!: string;

src/services/help-service.ts

@@ -310,6 +310,8 @@ const notMiscProperties: string[] = [
   NodeProp.WORKERS,
   NodeProp.WORKERS_PLANNED,
   NodeProp.WORKERS_LAUNCHED,
+  NodeProp.READ_BLOCKS,
+  NodeProp.WRITTEN_BLOCKS,
   NodeProp.EXCLUSIVE_SHARED_HIT_BLOCKS,
   NodeProp.EXCLUSIVE_SHARED_READ_BLOCKS,
   NodeProp.EXCLUSIVE_SHARED_DIRTIED_BLOCKS,
@@ -320,6 +322,8 @@ const notMiscProperties: string[] = [
   NodeProp.EXCLUSIVE_LOCAL_READ_BLOCKS,
   NodeProp.EXCLUSIVE_LOCAL_DIRTIED_BLOCKS,
   NodeProp.EXCLUSIVE_LOCAL_WRITTEN_BLOCKS,
+  NodeProp.EXCLUSIVE_READ_BLOCKS,
+  NodeProp.EXCLUSIVE_WRITTEN_BLOCKS,
   NodeProp.SHARED_HIT_BLOCKS,
   NodeProp.SHARED_READ_BLOCKS,
   NodeProp.SHARED_DIRTIED_BLOCKS,

src/services/plan-service.ts

@@ -1406,6 +1406,8 @@ export class PlanService {
               `${prefix}${bufferScope}_${buffersOperation}_blocks`.toUpperCase() as keyof typeof NodeProp
             return (node[NodeProp[bufferProp]] as number) || 0
           })
+          const buffersProp = `${prefix}${buffersOperation}_blocks`.toUpperCase() as keyof typeof NodeProp;
+          node[NodeProp[buffersProp] as unknown as keyof typeof Node] = buffers;
           if (time) {
             node[NodeProp[speedProp] as unknown as keyof typeof Node] = Number(
               (buffers / (time / 1000)).toFixed(3),