From a71dc884070422f5a9af349d8d3ddabec3630ac3 Mon Sep 17 00:00:00 2001
From: Sosthene <contact@sosthene.net>
Date: Fri, 13 Jun 2025 16:12:13 +0200
Subject: [PATCH] Display all commitments for each process

---
 src/components/ProcessesViewer.tsx | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/components/ProcessesViewer.tsx b/src/components/ProcessesViewer.tsx
index 5f0da7c..31f6f4b 100644
--- a/src/components/ProcessesViewer.tsx
+++ b/src/components/ProcessesViewer.tsx
@@ -4,6 +4,7 @@ import './ProcessesViewer.css';
 interface BlockState {
   commited_in: string;
   state_id: string;
+  pcd_commitment: Record<string, string>;
   public_data: {
     memberPublicName?: string | number[];
     pairedAddresses?: string[] | number[];
@@ -128,19 +129,29 @@ function ProcessesViewer({ processes, myProcesses }: ProcessesViewerProps) {
               {isExpanded && (
                 <div className="block-details">
                   <div className="block-complete-id">
-                    <strong>ID complet:</strong> {processId}
+                    <strong>Process ID:</strong> {processId}
                   </div>
 
                   {process.states.map((state, index) => {
-                    if (index === stateCount - 1) return null;
+                    if (index === stateCount) return null;
                     return (
                       <div key={`${processId}-state-${index}`} className="state-item">
                         <h4>État {index + 1}</h4>
                         <div className="state-detail">
-                          <strong>State ID:</strong> {state.state_id}
+                          <strong>TransactionId:</strong> {state.commited_in}
                         </div>
                         <div className="state-detail">
-                          <strong>Commited dans:</strong> {state.commited_in}
+                          <strong>Empreinte totale de l'état:</strong> {state.state_id}
+                        </div>
+                        <div className="state-detail">
+                          <strong>Empreinte par information:</strong>
+                          <ul>
+                            {Object.entries(state.pcd_commitment).map(([key, value]) => (
+                              <div key={key}>
+                                <strong>{key}:</strong> {value}
+                              </div>
+                            ))}
+                          </ul>
                         </div>
 
                         <div className="state-public-data">