add verdict, interface top level storing

frontend/src/components/PacketViewer.tsx

@@ -1111,6 +1111,10 @@ export default function PacketViewer(): ReactElement {
     const flowRows: PacketTableRow[] = [];
     for (const [flowId, flowPackets] of grouped.entries()) {
       const sortedPackets = [...flowPackets].sort(sortPacketsByTimestampDesc);
+      const packetOrderIndex = new Map<string, number>();
+      [...flowPackets].sort(sortPacketsByTimestampAsc).forEach((packet, index) => {
+        packetOrderIndex.set(packetKey(packet), index + 1);
+      });
       if (sortedPackets.length === 1) {
         flowRows.push({
           ...sortedPackets[0],
@@ -1128,7 +1132,7 @@ export default function PacketViewer(): ReactElement {
         key: packetKey(packet),
         __kind: 'packet' as const,
         flow_packet_count: sortedPackets.length,
-        flow_packet_index: index + 1,
+        flow_packet_index: packetOrderIndex.get(packetKey(packet)) ?? index + 1,
         flow_has_siblings: sortedPackets.length > 1,
       }));
       flowRows.push({