From 3859f053359ee3258a31f259365aa2c331ff9193 Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Wed, 11 Mar 2026 13:54:33 +0000
Subject: [PATCH 01/11] added kpi keys to front

---
 frontend/src/entities/Railway/locales/en.json | 12 +++++++++---
 frontend/src/locales/en.json                  |  2 +-
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/frontend/src/entities/Railway/locales/en.json b/frontend/src/entities/Railway/locales/en.json
index c7dd336c..d863b08d 100644
--- a/frontend/src/entities/Railway/locales/en.json
+++ b/frontend/src/entities/Railway/locales/en.json
@@ -3,10 +3,10 @@
   "card.event_type.HARDWARE": "Hardware",
   "card.event_type.IMPACT": "Impact",
   "card.event_type.INFRASTRUCTURE": "Infrastructure",
-  "card.event_type.PASSENGER": "Passenger",
+  "card.event_type.PASSENGER": "Passengers",
   "card.event_type.RAIL": "Rail",
   "event.button.primary": "Get recommendation from maze",
-  "event.button.primary.passenger": "Show procedure",
+  "event.button.primary.passenger": "Get recommendation",
   "event.button.secondary": "Continue the procedure follow-up",
   "event.button.secondary.passenger": "Put on hold",
   "event.text": "{event} detected. Would you like help recalculating transportation plans?",
@@ -19,5 +19,11 @@
   "recommendations.button3": "Cost",
   "recommendations.button4": "Client impact",
   "recommendations.description": "Solution description",
-  "recommendations.modal": "You are about to apply {recommendation}. Do you want to continue?"
+  "recommendations.modal": "You are about to apply {recommendation}. Do you want to continue?",
+  "Railway.kpis.cost": "Cost",
+  "Railway.kpis.nb_impacted_passengers": "Number of impacted passengers",
+  "Railway.kpis.total_cost": "Total cost",
+  "Railway.kpis.delay": "Delay",
+  "Railway.kpis.best": "Best"
+
 }
diff --git a/frontend/src/locales/en.json b/frontend/src/locales/en.json
index e8e93dfc..f48a5436 100644
--- a/frontend/src/locales/en.json
+++ b/frontend/src/locales/en.json
@@ -12,7 +12,7 @@
   "cab": "InteractiveAI",
   "cab.assistant": "Assistant",
   "cab.assistant.correlations": "Correlations",
-  "cab.assistant.procedure": "Procedure monitoring",
+  "cab.assistant.procedure": "Recommendations",
   "cab.assistant.procedure.collaborate": "Collaborate with {cab}",
   "cab.assistant.recommendations": "Recommendations",
   "cab.context.notification.expanded.false": "Open notification",

From 492a65abe17a4906aaef49ddbb624d1ed7bbd882 Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Wed, 11 Mar 2026 14:03:44 +0000
Subject: [PATCH 02/11] refactor(assistant): unify recommendations view and add
 KPI comparison table

---
 .../src/entities/Railway/CAB/Assistant.vue    | 59 +++++++++++++------
 1 file changed, 42 insertions(+), 17 deletions(-)

diff --git a/frontend/src/entities/Railway/CAB/Assistant.vue b/frontend/src/entities/Railway/CAB/Assistant.vue
index 82d4f777..b00d5649 100644
--- a/frontend/src/entities/Railway/CAB/Assistant.vue
+++ b/frontend/src/entities/Railway/CAB/Assistant.vue
@@ -5,19 +5,12 @@
         <template v-if="appStore.tab.assistant === 2">
           {{ $t('cab.assistant.recommendations') }}
         </template>
-        <template v-if="appStore.tab.assistant === 3">{{ $t('cab.assistant.procedure') }}</template>
+        <template v-if="appStore.tab.assistant === 3">{{ $t('cab.assistant.recommendations') }}</template>
       </template>
       <Event
         v-if="appStore.tab.assistant === 1 && appStore.card('Railway')"
         :card="appStore.card('Railway')!"
-        :primary-action="
-          appStore.card('Railway')?.data.metadata.event_type === 'INFRASTRUCTURE' &&
-          !cardsStore
-            .cards('Railway')
-            .find((card) => card.data.parent_event_id === appStore.card('Railway')?.processInstanceId)
-            ? null
-            : primaryAction
-        ">
+        :primary-action="primaryAction">
         <template #event>
           <i18n-t
             scope="global"
@@ -54,7 +47,7 @@
         </template>
       </Event>
       <Recommendations
-        v-if="appStore.tab.assistant === 2 && appStore.card('Railway')"
+        v-if="(appStore.tab.assistant === 2 || appStore.tab.assistant === 3) && appStore.card('Railway')"
         v-model:recommendations="recommendations"
         :buttons="[
           $t('recommendations.button1'),
@@ -63,10 +56,10 @@
           $t('recommendations.button4')
         ]"
         @selected="onSelection">
-        <template #default="{ recommendation }">
+        <template #default="{ recommendation, index }">
           <div class="flex">
             <main>
-              <h2>{{ recommendation.title }}</h2>
+              <h2>R{{ index }}: {{ recommendation.title }}</h2>
             </main>
           </div>
         </template>
@@ -82,6 +75,38 @@
         <template #button>
           <Button color="secondary">{{ $t('recommendations.button.secondary') }}</Button>
         </template>
+          <template #footer="{ selected }">
+            <div style="flex: none; overflow: auto">
+              <table v-if="recommendations.length">
+                <thead>
+                  <tr>
+                    <th>KPI</th>
+                    <th
+                      v-for="(recommendation, index) of recommendations"
+                      :key="recommendation.title"
+                      :class="{ active: selected?.title === recommendation.title }">
+                      R{{ index }}
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr v-for="key of ['cost', 'nb_impacted_passengers', 'total_cost', 'delay']" :key="key">
+                    <td>{{ $t(`Railway.kpis.${key}`) }}</td>
+                    <td
+                      v-for="recommendation of recommendations"
+                      :key="recommendation.title"
+                      :class="{ active: selected?.title === recommendation.title }">
+                      {{
+                        isFinite(Number(recommendation.kpis?.[key]))
+                          ? Number(recommendation.kpis?.[key])
+                          : recommendation.kpis?.[key]
+                      }}
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </template>
       </Recommendations>
       <Procedure
         v-if="appStore.tab.assistant === 3 && procedure && appStore.card('Railway')"
@@ -132,8 +157,10 @@ watch(
         recommendations.value = servicesStore.recommendations('Railway')
         break
       case 3:
-        procedure.value = (await getProcedure('PASSENGER')).data.procedure
-        procedure.value[0].tasks[0].state = 'doing'
+        // procedure.value = (await getProcedure('PASSENGER')).data.procedure
+        // procedure.value[0].tasks[0].state = 'doing'
+        await servicesStore.getRecommendation(appStore.card('Railway')!)
+        recommendations.value = servicesStore.recommendations('Railway')
     }
   }
 )
@@ -157,8 +184,6 @@ function primaryAction() {
     use_case: route.params.entity as Entity,
     step: 'ASKFORHELP'
   })
-  if (appStore.card('Railway')?.data.metadata.event_type === 'PASSENGER') {
-    appStore.tab.assistant = 3
-  } else appStore.tab.assistant = 2
+  appStore.tab.assistant = 3
 }
 </script>

From 5002179722820e2faddb230796801ee6ab376f91 Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Wed, 11 Mar 2026 14:09:04 +0000
Subject: [PATCH 03/11] feat(railway): update manager and schema and add mock
 recommendations

---
 .../resources/Railway/event_manager.py        |   3 +-
 .../resources/Railway/schemas.py              |   1 +
 .../resources/Railway/manager.py              |  48 +++-
 .../mockRecommendations.py                    | 249 ++++++++++++++++++
 4 files changed, 287 insertions(+), 14 deletions(-)
 create mode 100644 backend/recommendation-service/resources/Railway/mockRecommendations/mockRecommendations.py

diff --git a/backend/event-service/resources/Railway/event_manager.py b/backend/event-service/resources/Railway/event_manager.py
index 1fac9b5c..eab32eb3 100644
--- a/backend/event-service/resources/Railway/event_manager.py
+++ b/backend/event-service/resources/Railway/event_manager.py
@@ -10,6 +10,7 @@ def __init__(self):
     
     # Optional: Customize Event Uniqueness
     def get_unique_fields(self, data):
+        id_event = data["data"].get("id_event")
         id_train = data["data"].get("id_train")
         event_type = data["data"].get("event_type")
-        return {"id_train": id_train, "event_type": event_type}
+        return {"id_event": id_event, "id_train": id_train, "event_type": event_type}
diff --git a/backend/event-service/resources/Railway/schemas.py b/backend/event-service/resources/Railway/schemas.py
index f088708a..51951c8a 100644
--- a/backend/event-service/resources/Railway/schemas.py
+++ b/backend/event-service/resources/Railway/schemas.py
@@ -7,6 +7,7 @@
 class MetadataSchemaRailway(MetadataSchema):
     agent_id = String(allow_none=True, required=True)
     event_type = String(required=True)
+    id_event = String(allow_none=True, required=True)
     agent_position = List(
         Integer(allow_none=True), allow_none=True, default=None
     )
diff --git a/backend/recommendation-service/resources/Railway/manager.py b/backend/recommendation-service/resources/Railway/manager.py
index 881de5c0..cf44bc54 100644
--- a/backend/recommendation-service/resources/Railway/manager.py
+++ b/backend/recommendation-service/resources/Railway/manager.py
@@ -1,25 +1,47 @@
 # backend/recommendation-service/resources/Railway/manager.py
-
+import json
 from api.manager.base_manager import BaseRecommendationManager
+from .mockRecommendations.mockRecommendations import RECOMMENDATION_CATALOG
+
+import logging
+
+logger = logging.getLogger(__name__)
 
 class RailwayManager(BaseRecommendationManager):
     def __init__(self):
         super().__init__()
 
+    def _transform_recommendation(self, reco_json):
+        """Transform a recommendation from catalog to output format."""
+        reco = json.loads(reco_json)
+        return {
+            "title": reco["data"]["title"],
+            "description": reco["data"]["description"],
+            "use_case": reco["data"]["use_case"],
+            "agent_type": reco["data"]["agent_type"],
+            "actions": [{}],
+            "kpis": reco["data"]["kpis"],
+        }
+
     def get_recommendation(self, request_data):
         """
-        Override to provide recommendations specific to the RTE use case.
+        Override to provide recommendations specific to the Railway use case.
         
-        This method generates and returns recommendations tailored for RTE.
+        This method generates and returns recommendations tailored for Railway events.
         """
-        action_dict = {}
-
-        output_json = {
-            "title": "recommendation",
-            "description": "description",
-            "use_case": "Railway",
-            "agent_type": "agent_type",
-            "actions": [action_dict],
-        }
+        event_data = request_data.get("event", {})
+        event_id = str(event_data.get("id_event", "1"))
+
+        logger.info(f"Processing event_id: {event_id}")
+
+        # Get recommendations from catalog 
+        if event_id == "1":
+            recommendations = RECOMMENDATION_CATALOG.get(event_id, RECOMMENDATION_CATALOG["1"])
+        elif event_id == "2":
+            recommendations = RECOMMENDATION_CATALOG.get(event_id, RECOMMENDATION_CATALOG["1"])
+        elif event_id == "3":
+            recommendations = RECOMMENDATION_CATALOG.get(event_id, RECOMMENDATION_CATALOG["1"])
+        # Transform each recommendation to output format
+        return [self._transform_recommendation(reco) for reco in recommendations]
+    
 
-        return [output_json]
\ No newline at end of file
diff --git a/backend/recommendation-service/resources/Railway/mockRecommendations/mockRecommendations.py b/backend/recommendation-service/resources/Railway/mockRecommendations/mockRecommendations.py
new file mode 100644
index 00000000..fbccba57
--- /dev/null
+++ b/backend/recommendation-service/resources/Railway/mockRecommendations/mockRecommendations.py
@@ -0,0 +1,249 @@
+
+import json
+
+
+################################################################
+######### Event 1 Recommendations ##############################
+################################################################
+
+Reco11 = json.dumps({
+"data": {
+                "title": "Stay at the St Pierre des Corps station",
+                "description" : "Hold the train in the St Pierre des Corps station until traffic resumes.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "78",
+                        "nb_impacted_passengers" : "468",
+                        "total_cost" : "32838",
+                        "delay" : "1h30",
+                        "best": "True",
+                        }
+                    
+        }
+}
+)
+
+Reco12 = json.dumps({
+"data": {
+                "title": "Delay",
+                "description" : "Hold the train on the track until traffic resumes. Arrangements for passenger support.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "87",
+                        "nb_impacted_passengers" : "398",
+                        "total_cost" : "34626",
+                        "delay" : "1h30",
+                        "best": "False",
+                        }
+                    
+        }
+}
+)
+
+
+Reco13 = json.dumps({
+"data": {
+                "title": "Reroute",
+                "description" : "Reroute the trains. Passengers traveling to and from Poitiers are being assisted.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "102",
+                        "nb_impacted_passengers" : "350",
+                        "total_cost" : "35700",
+                        "delay" : "1h40",
+                        "best": "False",
+                        }
+                    
+        }
+}
+)
+
+
+Reco14 = json.dumps({
+"data": {
+                "title": "Cancel",
+                "description" : "Train services are cancelled. Passengers are advised to postpone their journey.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "233",
+                        "nb_impacted_passengers" : "468",
+                        "total_cost" : "109044",
+                        "delay" : "1h45",
+                        "best": "False",
+                        }
+                    
+        }
+}
+)
+
+################################################################
+######### Event 2 Recommendations ##############################
+################################################################
+
+
+Reco21 = json.dumps({
+"data": {
+                "title": "Stay at the station",
+                "description" : "Hold the train in the Poitiers station until traffic resumes.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "123",
+                        "nb_impacted_passengers" : "459",
+                        "total_cost" : "56457",
+                        "delay" : "1h05",
+                        "best": "False",
+                        }
+                    
+        }
+}
+)
+
+
+
+
+
+Reco22 = json.dumps({
+"data": {
+                "title": "Delay",
+                "description" : "Hold the train on the track until traffic resumes. Arrangements for passenger support.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "129",
+                        "nb_impacted_passengers" : "459",
+                        "total_cost" : "59211",
+                        "delay" : "1h00",
+                        "best": "False",
+                        }
+                    
+        }
+}
+)
+
+Reco23 = json.dumps({
+"data": {
+                "title": "Reroute",
+                "description" : "Diversion and rerouting of trains to the standard line between Angoulême and Poitiers. ",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "73",
+                        "nb_impacted_passengers" : "459",
+                        "total_cost" : "33507",
+                        "delay" : "1h00",
+                        "best": "True",
+                        }
+                    
+        }
+}
+)
+
+
+Reco24 = json.dumps({
+"data": {
+                "title": "Cancel",
+                "description" : "Train services are cancelled. Passengers are advised to postpone their journey.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "221",
+                        "nb_impacted_passengers" : "459",
+                        "total_cost" : "101439",
+                        "delay" : "1h00",
+                        "best": "False",
+                        }
+                    
+        }
+}
+)
+
+
+################################################################
+######### Event 3 Recommendations ##############################
+################################################################
+
+Reco31 = json.dumps({
+"data": {
+                "title": "Wait at the Bordeaux station",
+                "description" : "Hold the train at the station until traffic resumes.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "94",
+                        "nb_impacted_passengers" : "348",
+                        "total_cost" : "32712",
+                        "delay" : "00h30",
+                        "best": "True",
+                        }
+                    
+        }
+}
+)
+
+
+Reco32 = json.dumps({
+"data": {
+                "title": "Delay",
+                "description" : "Hold the train on the track until traffic resumes. Arrangements for passenger support.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "94",
+                        "nb_impacted_passengers" : "347",
+                        "total_cost" : "32618",
+                        "delay" : "00h53",
+                        "best": "False",
+                        }
+                    
+        }
+}
+)
+
+
+Reco33 = json.dumps({
+"data": {
+                "title": "Rerouting from Bordeaux to Angoulême ",
+                "description" : "Diversion and rerouting of trains to the standard line between Angoulême and Poitiers.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "95",
+                        "nb_impacted_passengers" : "348",
+                        "total_cost" : "33060",
+                        "delay" : "1h24",
+                        "best": "False",
+                        }
+                    
+        }
+}
+)
+
+Reco34 = json.dumps({
+"data": {
+                "title": "Supprimer",
+                "description" : "Train services are cancelled. Passengers are advised to postpone their journey.",
+                "use_case": "Railway",
+                "agent_type": "AI",
+                "kpis": {
+                        "cost" : "257",
+                        "nb_impacted_passengers" : "348",
+                        "total_cost" : "89436",
+                        "delay" : "00h40",
+                        "best": "False",
+                        }
+                    
+        }
+}
+)
+
+
+RECOMMENDATION_CATALOG = {
+    "1": [Reco11, Reco12, Reco13, Reco14],
+    "2": [Reco21, Reco22, Reco23, Reco24],
+    "3": [Reco31, Reco32, Reco33, Reco34],
+}

From fd264d066fc9af8ff4fa2f26beb1272ceb30f9f5 Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Tue, 17 Mar 2026 16:26:39 +0000
Subject: [PATCH 04/11] feat(frontend): add session trace export utility

Introduce browser-side session trace storage and export helpers.\nSupports JSON/CSV generation, safe session-id fallback, and download handling.
---
 frontend/src/utils/traceSessionExport.ts | 159 +++++++++++++++++++++++
 1 file changed, 159 insertions(+)
 create mode 100644 frontend/src/utils/traceSessionExport.ts

diff --git a/frontend/src/utils/traceSessionExport.ts b/frontend/src/utils/traceSessionExport.ts
new file mode 100644
index 00000000..529899eb
--- /dev/null
+++ b/frontend/src/utils/traceSessionExport.ts
@@ -0,0 +1,159 @@
+import type { Trace } from '@/types/services'
+
+type ExportFormat = 'json' | 'csv'
+
+type StoredTrace = {
+  date: string
+  use_case: Trace['use_case']
+  step: Trace['step']
+  data: Trace['data']
+}
+
+type TraceSession = {
+  sessionId: string
+  startedAt: string
+  userLogin?: string
+  traces: StoredTrace[]
+}
+
+type ExportOptions = {
+  force?: boolean
+  userLogin?: string
+}
+
+const STORAGE_KEY = 'interactiveai.trace-session.v1'
+
+function generateSessionId() {
+  if (window.isSecureContext && typeof crypto.randomUUID === 'function') {
+    return crypto.randomUUID()
+  }
+  return '10000000-1000-4000-8000-100000000000'.replace(/[018]/g, (char) =>
+    (+char ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (+char / 4)))).toString(16)
+  )
+}
+
+function createSession(userLogin?: string): TraceSession {
+  return {
+    sessionId: generateSessionId(),
+    startedAt: new Date().toISOString(),
+    userLogin,
+    traces: []
+  }
+}
+
+function loadSession(): TraceSession | undefined {
+  const raw = localStorage.getItem(STORAGE_KEY)
+  if (!raw) return undefined
+  try {
+    return JSON.parse(raw) as TraceSession
+  } catch {
+    localStorage.removeItem(STORAGE_KEY)
+    return undefined
+  }
+}
+
+function saveSession(session: TraceSession) {
+  localStorage.setItem(STORAGE_KEY, JSON.stringify(session))
+}
+
+function escapeCsv(value: unknown): string {
+  const normalized = typeof value === 'string' ? value : JSON.stringify(value)
+  return `"${(normalized ?? '').replace(/"/g, '""')}"`
+}
+
+function buildCsv(session: TraceSession, endedAt: string) {
+  const header = [
+    'session_id',
+    'user_login',
+    'session_started_at',
+    'session_ended_at',
+    'trace_date',
+    'use_case',
+    'step',
+    'data'
+  ]
+
+  const rows = session.traces.map((trace) =>
+    [
+      session.sessionId,
+      session.userLogin ?? '',
+      session.startedAt,
+      endedAt,
+      trace.date,
+      trace.use_case,
+      trace.step,
+      trace.data
+    ]
+      .map((item) => escapeCsv(item))
+      .join(',')
+  )
+
+  return [header.join(','), ...rows].join('\n')
+}
+
+function download(content: string, mimeType: string, fileName: string) {
+  const blob = new Blob([content], { type: mimeType })
+  const url = URL.createObjectURL(blob)
+  const anchor = document.createElement('a')
+  anchor.href = url
+  anchor.download = fileName
+  document.body.appendChild(anchor)
+  anchor.click()
+  anchor.remove()
+  URL.revokeObjectURL(url)
+}
+
+function sessionFileName(session: TraceSession, extension: 'json' | 'csv') {
+  const started = session.startedAt.replace(/:/g, '-').replace('.', '-')
+  const user = session.userLogin ?? 'unknown'
+  return `historic-session-${user}-${started}.${extension}`
+}
+
+export function startTraceSession(userLogin?: string) {
+  saveSession(createSession(userLogin))
+}
+
+export function recordTraceForSession(
+  trace: Pick<Trace, 'data' | 'step' | 'use_case'> & { date?: string }
+) {
+  const session = loadSession() ?? createSession()
+  session.traces.push({
+    date: trace.date ? String(trace.date) : new Date().toISOString(),
+    use_case: trace.use_case,
+    step: trace.step,
+    data: trace.data
+  })
+  saveSession(session)
+}
+
+export function exportTraceSession(format: ExportFormat = 'json', options: ExportOptions = {}) {
+  const force = options.force ?? false
+  const session = loadSession() ?? (force ? createSession(options.userLogin) : undefined)
+  if (!session) return
+  if (!force && session.traces.length === 0) return
+
+  const endedAt = new Date().toISOString()
+
+  if (format === 'csv') {
+    const csv = buildCsv(session, endedAt)
+    download(csv, 'text/csv;charset=utf-8', sessionFileName(session, 'csv'))
+    return
+  }
+
+  const json = JSON.stringify(
+    {
+      sessionId: session.sessionId,
+      userLogin: session.userLogin,
+      startedAt: session.startedAt,
+      endedAt,
+      traces: session.traces
+    },
+    null,
+    2
+  )
+  download(json, 'application/json;charset=utf-8', sessionFileName(session, 'json'))
+}
+
+export function clearTraceSession() {
+  localStorage.removeItem(STORAGE_KEY)
+}

From 0e7e01fc4d10b1e372da777b48189d985c36efe2 Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Tue, 17 Mar 2026 16:27:11 +0000
Subject: [PATCH 05/11] feat(frontend): record traces in session exporter

Update sendTrace to persist each outgoing trace in the local session timeline before posting to historic-service.
---
 frontend/src/api/services.ts | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/frontend/src/api/services.ts b/frontend/src/api/services.ts
index d972a740..2a80e3ec 100644
--- a/frontend/src/api/services.ts
+++ b/frontend/src/api/services.ts
@@ -5,6 +5,7 @@ import type { Card } from '@/types/cards'
 import type { Action, Context, Entity } from '@/types/entities'
 import type { Procedure } from '@/types/procedure'
 import type { FullContext, Recommendation, Trace } from '@/types/services'
+import { recordTraceForSession } from '@/utils/traceSessionExport'
 
 export function getRecommendation<E extends Entity = Entity>(payload: {
   event: Card<E>['data']['metadata']
@@ -18,10 +19,12 @@ export function getContext<E extends Entity = Entity>() {
 }
 
 export function sendTrace(payload: Trace) {
-  return http.post<Required<Trace>>('/cabhistoric/api/v1/traces', {
+  const tracePayload = {
     ...payload,
     date: new Date().toISOString()
-  })
+  }
+  recordTraceForSession(tracePayload)
+  return http.post<Required<Trace>>('/cabhistoric/api/v1/traces', tracePayload)
 }
 
 export function applyRecommendation<E extends Entity = Entity>(data: Action<E>) {

From 99d9a3b2cad52cfdf981eb44624b4759d52eca48 Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Tue, 17 Mar 2026 16:27:37 +0000
Subject: [PATCH 06/11] feat(auth): export session traces on logout

Start a trace session after login and export it during logout.\nKeep auth flow robust by guarding export/session errors and always clearing auth state.
---
 frontend/src/stores/auth.ts | 24 ++++++++++++++++++++----
 1 file changed, 20 insertions(+), 4 deletions(-)

diff --git a/frontend/src/stores/auth.ts b/frontend/src/stores/auth.ts
index 4a8dc939..1288d3bd 100644
--- a/frontend/src/stores/auth.ts
+++ b/frontend/src/stores/auth.ts
@@ -4,6 +4,7 @@ import { computed, ref } from 'vue'
 import * as auth from '@/api/auth'
 import type { LoginResponse, UserResponse } from '@/types/auth'
 import { ENTITIES, type Entity } from '@/types/entities'
+import { clearTraceSession, exportTraceSession, startTraceSession } from '@/utils/traceSessionExport'
 
 export const useAuthStore = defineStore(
   'auth',
@@ -25,6 +26,11 @@ export const useAuthStore = defineStore(
       expireDate.value = Date.now() + tokenRes.data.expires_in * 1000
       const userRes = await auth.getCurrentUser()
       user.value = userRes.data
+      try {
+        startTraceSession(userRes.data.userData.login)
+      } catch (error) {
+        console.warn('Unable to start trace session export:', error)
+      }
     }
 
     async function checkToken() {
@@ -32,10 +38,20 @@ export const useAuthStore = defineStore(
       return data.active
     }
 
-    function logout() {
-      token.value = undefined
-      user.value = undefined
-      localStorage.removeItem('context')
+    function logout(format: 'json' | 'csv' = 'json') {
+      try {
+        exportTraceSession(format, {
+          force: true,
+          userLogin: user.value?.userData.login
+        })
+      } catch (error) {
+        console.warn('Unable to export trace session:', error)
+      } finally {
+        clearTraceSession()
+        token.value = undefined
+        user.value = undefined
+        localStorage.removeItem('context')
+      }
     }
 
     return { token, user, entities, login, logout, checkToken }

From 0d93a5cbe72e55cf07abc74f261a7d0a44f82a0d Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Wed, 25 Mar 2026 08:00:56 +0000
Subject: [PATCH 07/11] feat(frontend): record EVENT traces on card add/update
 and ASKFORHELP fallback

---
 frontend/src/api/services.ts | 20 ++++++++++++++++++++
 frontend/src/stores/cards.ts | 18 ++++++++++++++++++
 2 files changed, 38 insertions(+)

diff --git a/frontend/src/api/services.ts b/frontend/src/api/services.ts
index 2a80e3ec..1a6cfa91 100644
--- a/frontend/src/api/services.ts
+++ b/frontend/src/api/services.ts
@@ -1,5 +1,6 @@
 import http from '@/plugins/http'
 import { useAppStore } from '@/stores/app'
+import { useCardsStore } from '@/stores/cards'
 import { useServicesStore } from '@/stores/services'
 import type { Card } from '@/types/cards'
 import type { Action, Context, Entity } from '@/types/entities'
@@ -19,6 +20,25 @@ export function getContext<E extends Entity = Entity>() {
 }
 
 export function sendTrace(payload: Trace) {
+  if (payload.step === 'ASKFORHELP' && typeof payload.data === 'object' && payload.data !== null) {
+    const cardId = (payload.data as { id?: unknown }).id
+    if (typeof cardId === 'string') {
+      const cardsStore = useCardsStore()
+      const card = cardsStore._cards.find((item) => item.id === cardId)
+      recordTraceForSession({
+        use_case: payload.use_case,
+        step: 'EVENT',
+        data: {
+          card_id: cardId,
+          process_instance_id: card?.processInstanceId,
+          start_date: card?.startDate ? new Date(card.startDate).toISOString() : undefined,
+          metadata: card?.data.metadata
+        },
+        date: new Date().toISOString()
+      })
+    }
+  }
+
   const tracePayload = {
     ...payload,
     date: new Date().toISOString()
diff --git a/frontend/src/stores/cards.ts b/frontend/src/stores/cards.ts
index 4205cbae..5cb4b740 100644
--- a/frontend/src/stores/cards.ts
+++ b/frontend/src/stores/cards.ts
@@ -7,6 +7,7 @@ import eventBus from '@/plugins/eventBus'
 import i18n from '@/plugins/i18n'
 import { type Card, type CardEvent, CardOperationType } from '@/types/cards'
 import { type Entity } from '@/types/entities'
+import { recordTraceForSession } from '@/utils/traceSessionExport'
 import { uuid } from '@/utils/utils'
 
 import { useAppStore } from './app'
@@ -70,6 +71,23 @@ export const useCardsStore = defineStore('cards', () => {
       switch (cardEvent.type) {
         case CardOperationType.ADD:
         case CardOperationType.UPDATE:
+          if (cardEvent.type === CardOperationType.ADD || existingCard === -1) {
+            try {
+              recordTraceForSession({
+                use_case: entity,
+                step: 'EVENT',
+                data: {
+                  card_id: cardEvent.card.id,
+                  process_instance_id: cardEvent.card.processInstanceId,
+                  start_date: new Date(cardEvent.card.startDate).toISOString(),
+                  metadata: cardEvent.card.data.metadata
+                },
+                date: new Date().toISOString()
+              })
+            } catch (error) {
+              console.warn('Unable to record EVENT trace for session export:', error)
+            }
+          }
           // eslint-disable-next-line no-case-declarations
           let hydratedCard: Card<Entity> | undefined = undefined
           if (hydrated) {

From 53ac0aeab24710cf83d7c98eb8db44500a8890ab Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Wed, 25 Mar 2026 08:01:11 +0000
Subject: [PATCH 08/11] feat(frontend): record FEEDBACK traces on user
 recommendation interactions

---
 .../CAB/Assistant/Recommendations.vue         | 31 +++++++++++++++++++
 1 file changed, 31 insertions(+)

diff --git a/frontend/src/components/organisms/CAB/Assistant/Recommendations.vue b/frontend/src/components/organisms/CAB/Assistant/Recommendations.vue
index 5b9aff79..a499c8a7 100644
--- a/frontend/src/components/organisms/CAB/Assistant/Recommendations.vue
+++ b/frontend/src/components/organisms/CAB/Assistant/Recommendations.vue
@@ -71,6 +71,7 @@ import Card from '@/components/atoms/Card.vue'
 import Modal from '@/components/atoms/Modal.vue'
 import type { Entity } from '@/types/entities'
 import type { Recommendation } from '@/types/services'
+import { recordTraceForSession } from '@/utils/traceSessionExport'
 
 const props = withDefaults(
   defineProps<{ buttons: string[]; recommendations: Recommendation<E>[]; collapsed?: boolean }>(),
@@ -93,6 +94,15 @@ onBeforeMount(() => {
 
 async function close(success: boolean) {
   if (success) {
+    recordTraceForSession({
+      use_case: selected.value!.use_case,
+      step: 'FEEDBACK',
+      date: new Date().toISOString(),
+      data: {
+        action: 'confirm_recommendation',
+        recommendation: selected.value!.title
+      }
+    })
     await sendFeedback(selected.value!, true)
     emit('selected', selected.value!)
   }
@@ -100,10 +110,31 @@ async function close(success: boolean) {
 }
 
 function closeKpi(kpi: (typeof props)['buttons'][number]) {
+  const useCase = selected.value?.use_case ?? props.recommendations[0]?.use_case
+  if (useCase)
+    recordTraceForSession({
+      use_case: useCase,
+      step: 'FEEDBACK',
+      date: new Date().toISOString(),
+      data: {
+        action: 'dismiss_kpi',
+        kpi,
+        selected_recommendation: selected.value?.title
+      }
+    })
   buttons.value?.splice(buttons.value.indexOf(kpi), 1)
 }
 
 async function downvote(recommendation: Recommendation<E>) {
+  recordTraceForSession({
+    use_case: recommendation.use_case,
+    step: 'FEEDBACK',
+    date: new Date().toISOString(),
+    data: {
+      action: 'downvote_recommendation',
+      recommendation: recommendation.title
+    }
+  })
   await sendFeedback(recommendation)
   emit(
     'update:recommendations',

From dbd9b54e7dbcea6f65ff3f586ac102ed70389a8a Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Wed, 25 Mar 2026 08:01:27 +0000
Subject: [PATCH 09/11] feat(frontend): structured JSON export with per-event
 and session KPIs

---
 frontend/src/utils/traceSessionExport.ts | 137 ++++++++++++++++++++++-
 1 file changed, 133 insertions(+), 4 deletions(-)

diff --git a/frontend/src/utils/traceSessionExport.ts b/frontend/src/utils/traceSessionExport.ts
index 529899eb..34af2fde 100644
--- a/frontend/src/utils/traceSessionExport.ts
+++ b/frontend/src/utils/traceSessionExport.ts
@@ -1,12 +1,13 @@
 import type { Trace } from '@/types/services'
 
 type ExportFormat = 'json' | 'csv'
+type SessionStep = Trace['step'] | 'FEEDBACK'
 
 type StoredTrace = {
   date: string
   use_case: Trace['use_case']
-  step: Trace['step']
-  data: Trace['data']
+  step: SessionStep
+  data: unknown
 }
 
 type TraceSession = {
@@ -56,6 +57,107 @@ function saveSession(session: TraceSession) {
   localStorage.setItem(STORAGE_KEY, JSON.stringify(session))
 }
 
+function eventKey(data: unknown): string | undefined {
+  if (!data || typeof data !== 'object') return undefined
+  const candidate = data as { card_id?: unknown; process_instance_id?: unknown }
+  if (typeof candidate.card_id === 'string') return `card:${candidate.card_id}`
+  if (typeof candidate.process_instance_id === 'string') return `process:${candidate.process_instance_id}`
+  return undefined
+}
+
+/**
+ * Build a structured view: nest ASKFORHELP/FEEDBACK/AWARD under the EVENT they belong to.
+ *
+ * Algorithm:
+ *  1. Walk traces in chronological order.
+ *  2. Every EVENT becomes a top-level structured entry (with an `interactions` array).
+ *  3. An ASKFORHELP opens a "current interaction group" linked to an EVENT via card_id.
+ *  4. Subsequent FEEDBACK / AWARD traces are appended to that group until a new ASKFORHELP or EVENT appears.
+ *  5. Traces that cannot be linked to any EVENT remain at the top level as-is.
+ */
+type StructuredEvent = StoredTrace & {
+  interactions: StoredTrace[]
+  /** Time in ms between ASKFORHELP and AWARD. null when the user didn't choose a solution. */
+  decision_time_ms: number | null
+}
+
+type StructuredTrace = StoredTrace | StructuredEvent
+
+type SessionKpis = {
+  /** Total session duration in ms (endedAt − startedAt) */
+  total_session_time_ms: number
+  /** Average decision time across ALL events (sum of decision times / total events). null if no events. */
+  avg_decision_time_ms: number | null
+}
+
+function isStructuredEvent(t: StructuredTrace): t is StructuredEvent {
+  return 'interactions' in t
+}
+
+function computeDecisionTime(interactions: StoredTrace[]): number | null {
+  let askDate: string | undefined
+  let awardDate: string | undefined
+  for (let i = 0; i < interactions.length; i++) {
+    if (interactions[i].step === 'ASKFORHELP' && !askDate) askDate = interactions[i].date
+    if (interactions[i].step === 'AWARD' && !awardDate) awardDate = interactions[i].date
+  }
+  if (!askDate || !awardDate) return null
+  return new Date(awardDate).getTime() - new Date(askDate).getTime()
+}
+
+function buildStructuredTraces(flat: StoredTrace[]): StructuredTrace[] {
+  // Index: card_id → structured event entry
+  const eventByCardId: Record<string, StructuredEvent> = {}
+  const result: StructuredTrace[] = []
+
+  // Pointer to the currently "active" interaction group
+  let currentEvent: StructuredEvent | undefined
+
+  for (const trace of flat) {
+    if (trace.step === 'EVENT') {
+      const structured: StructuredEvent = { ...trace, interactions: [], decision_time_ms: null }
+      const data = trace.data as Record<string, unknown> | undefined
+      const cardId = data?.card_id as string | undefined
+      if (cardId) eventByCardId[cardId] = structured
+      result.push(structured)
+      // Don't change currentEvent here – EVENTs are async / independent
+      continue
+    }
+
+    if (trace.step === 'ASKFORHELP') {
+      // Resolve the parent EVENT via the card id stored in data.id
+      const data = trace.data as Record<string, unknown> | undefined
+      const cardId = data?.id as string | undefined
+      const parent = cardId ? eventByCardId[cardId] : undefined
+      if (parent) {
+        currentEvent = parent
+        currentEvent.interactions.push(trace)
+      } else {
+        // Orphan ASKFORHELP – keep at top level
+        currentEvent = undefined
+        result.push(trace)
+      }
+      continue
+    }
+
+    // FEEDBACK / AWARD / anything else → attach to current group if open
+    if (currentEvent) {
+      currentEvent.interactions.push(trace)
+    } else {
+      result.push(trace)
+    }
+  }
+
+  // Compute per-event decision time KPIs
+  for (const entry of result) {
+    if (isStructuredEvent(entry)) {
+      entry.decision_time_ms = computeDecisionTime(entry.interactions)
+    }
+  }
+
+  return result
+}
+
 function escapeCsv(value: unknown): string {
   const normalized = typeof value === 'string' ? value : JSON.stringify(value)
   return `"${(normalized ?? '').replace(/"/g, '""')}"`
@@ -114,9 +216,20 @@ export function startTraceSession(userLogin?: string) {
 }
 
 export function recordTraceForSession(
-  trace: Pick<Trace, 'data' | 'step' | 'use_case'> & { date?: string }
+  trace: { step: SessionStep; use_case: Trace['use_case']; data: unknown; date?: string }
 ) {
   const session = loadSession() ?? createSession()
+
+  if (trace.step === 'EVENT') {
+    const key = eventKey(trace.data)
+    if (key) {
+      const alreadyRecorded = session.traces.some(
+        (item) => item.step === 'EVENT' && eventKey(item.data) === key
+      )
+      if (alreadyRecorded) return
+    }
+  }
+
   session.traces.push({
     date: trace.date ? String(trace.date) : new Date().toISOString(),
     use_case: trace.use_case,
@@ -140,13 +253,29 @@ export function exportTraceSession(format: ExportFormat = 'json', options: Expor
     return
   }
 
+  const structured = buildStructuredTraces(session.traces)
+
+  // --- Session-level KPIs ---
+  const totalSessionTimeMs = new Date(endedAt).getTime() - new Date(session.startedAt).getTime()
+  const events = structured.filter(isStructuredEvent)
+  const totalEvents = events.length
+  const sumDecisionTime = events.reduce(
+    (sum, evt) => sum + (evt.decision_time_ms ?? 0),
+    0
+  )
+  const kpis: SessionKpis = {
+    total_session_time_ms: totalSessionTimeMs,
+    avg_decision_time_ms: totalEvents > 0 ? sumDecisionTime / totalEvents : null
+  }
+
   const json = JSON.stringify(
     {
       sessionId: session.sessionId,
       userLogin: session.userLogin,
       startedAt: session.startedAt,
       endedAt,
-      traces: session.traces
+      kpis,
+      traces: structured
     },
     null,
     2

From 3973aa4157a206d44a55dae7f11ee029b40891ee Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Wed, 25 Mar 2026 13:44:07 +0000
Subject: [PATCH 10/11] feat(frontend): add HTML session summary builder

---
 frontend/src/utils/traceSessionExport.ts | 182 +++++++++++++++++++++++
 1 file changed, 182 insertions(+)

diff --git a/frontend/src/utils/traceSessionExport.ts b/frontend/src/utils/traceSessionExport.ts
index 34af2fde..98829b11 100644
--- a/frontend/src/utils/traceSessionExport.ts
+++ b/frontend/src/utils/traceSessionExport.ts
@@ -193,6 +193,188 @@ function buildCsv(session: TraceSession, endedAt: string) {
   return [header.join(','), ...rows].join('\n')
 }
 
+function formatMs(ms: number | null): string {
+  if (ms === null) return '—'
+  if (ms < 1000) return ms + ' ms'
+  const totalSec = Math.round(ms / 1000)
+  const min = Math.floor(totalSec / 60)
+  const sec = totalSec % 60
+  return min > 0 ? min + 'm ' + sec + 's' : sec + 's'
+}
+
+function escapeHtml(str: string): string {
+  return str
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+}
+
+function formatTime(iso: string): string {
+  try {
+    return new Date(iso).toLocaleString()
+  } catch {
+    return iso
+  }
+}
+
+function stepBadge(step: string): string {
+  const colors: Record<string, string> = {
+    EVENT: '#2563eb',
+    ASKFORHELP: '#d97706',
+    FEEDBACK: '#7c3aed',
+    AWARD: '#059669',
+    SOLUTION: '#0891b2'
+  }
+  const bg = colors[step] || '#6b7280'
+  return '<span style="display:inline-block;padding:2px 8px;border-radius:4px;color:#fff;font-size:12px;font-weight:600;background:' + bg + '">' + escapeHtml(step) + '</span>'
+}
+
+function feedbackLabel(data: unknown): string {
+  if (!data || typeof data !== 'object') return ''
+  const d = data as Record<string, unknown>
+  const action = typeof d.action === 'string' ? d.action : ''
+  const rec = typeof d.recommendation === 'string' ? d.recommendation : ''
+  if (action === 'confirm_recommendation') return '<span style="color:#059669">&#10003; Confirmed</span> — ' + escapeHtml(rec)
+  if (action === 'downvote_recommendation') return '<span style="color:#dc2626">&#10007; Downvoted</span> — ' + escapeHtml(rec)
+  if (action === 'dismiss_kpi') return '<span style="color:#6b7280">Dismissed KPI</span>'
+  return escapeHtml(action) + (rec ? ' — ' + escapeHtml(rec) : '')
+}
+
+function eventMetadataHtml(data: unknown): string {
+  if (!data || typeof data !== 'object') return ''
+  const d = data as Record<string, unknown>
+  const meta = d.metadata as Record<string, unknown> | undefined
+  if (!meta) return ''
+  const rows: string[] = []
+  const keys = Object.keys(meta)
+  for (let i = 0; i < keys.length; i++) {
+    rows.push('<tr><td style="padding:2px 10px 2px 0;color:#6b7280;font-size:13px">' + escapeHtml(keys[i]) + '</td><td style="font-size:13px">' + escapeHtml(String(meta[keys[i]])) + '</td></tr>')
+  }
+  return '<table style="margin:4px 0 0 16px">' + rows.join('') + '</table>'
+}
+
+function awardHtml(trace: StoredTrace): string {
+  const d = trace.data as Record<string, unknown> | undefined
+  if (!d) return ''
+  const title = typeof d.title === 'string' ? d.title : ''
+  const desc = typeof d.description === 'string' ? d.description : ''
+  const kpis = d.kpis as Record<string, unknown> | undefined
+  let html = '<div style="margin:6px 0 6px 16px;padding:8px 12px;background:#ecfdf5;border-left:3px solid #059669;border-radius:4px">'
+  html += '<strong style="color:#059669">' + escapeHtml(title) + '</strong>'
+  if (desc) html += '<div style="font-size:13px;color:#374151;margin-top:2px">' + escapeHtml(desc) + '</div>'
+  if (kpis) {
+    html += '<div style="display:flex;gap:12px;flex-wrap:wrap;margin-top:6px">'
+    const kpiKeys = Object.keys(kpis)
+    for (let i = 0; i < kpiKeys.length; i++) {
+      html += '<span style="font-size:12px;background:#d1fae5;padding:2px 6px;border-radius:3px"><b>' + escapeHtml(kpiKeys[i]) + ':</b> ' + escapeHtml(String(kpis[kpiKeys[i]])) + '</span>'
+    }
+    html += '</div>'
+  }
+  html += '</div>'
+  return html
+}
+
+function buildHtmlSummary(
+  session: TraceSession,
+  endedAt: string,
+  structured: StructuredTrace[],
+  kpis: SessionKpis
+): string {
+  const events = structured.filter(isStructuredEvent)
+
+  // --- Session header ---
+  let html = '<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1">'
+  html += '<title>Session Summary — ' + escapeHtml(session.userLogin ?? 'unknown') + '</title>'
+  html += '<style>'
+  html += 'body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;margin:0;padding:24px;background:#f9fafb;color:#111827}'
+  html += '.card{background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:20px;margin-bottom:16px;box-shadow:0 1px 3px rgba(0,0,0,.06)}'
+  html += '.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:16px 0}'
+  html += '.kpi-box{background:#f0f9ff;border:1px solid #bfdbfe;border-radius:6px;padding:12px;text-align:center}'
+  html += '.kpi-box .value{font-size:24px;font-weight:700;color:#1d4ed8}'
+  html += '.kpi-box .label{font-size:12px;color:#6b7280;margin-top:4px}'
+  html += '.timeline{border-left:2px solid #d1d5db;margin-left:12px;padding-left:16px}'
+  html += '.tl-item{position:relative;margin-bottom:10px;padding:4px 0}'
+  html += '.tl-item::before{content:"";position:absolute;left:-22px;top:8px;width:10px;height:10px;border-radius:50%;background:#d1d5db;border:2px solid #fff}'
+  html += '.tl-item.ask::before{background:#d97706}'
+  html += '.tl-item.feedback::before{background:#7c3aed}'
+  html += '.tl-item.award::before{background:#059669}'
+  html += '.time{font-size:11px;color:#9ca3af}'
+  html += 'h1{margin:0 0 4px 0;font-size:22px}'
+  html += 'h2{margin:24px 0 8px 0;font-size:18px;color:#374151}'
+  html += 'h3{margin:0 0 6px 0;font-size:15px}'
+  html += '.tag{display:inline-block;padding:1px 6px;border-radius:3px;font-size:12px;background:#e5e7eb;color:#374151;margin-right:4px}'
+  html += '.no-solution{color:#dc2626;font-style:italic;font-size:13px}'
+  html += '@media print{body{padding:12px}.card{box-shadow:none;break-inside:avoid}}'
+  html += '</style></head><body>'
+
+  // Header
+  html += '<div class="card">'
+  html += '<h1>Session Summary</h1>'
+  html += '<div style="color:#6b7280;font-size:14px">User: <b>' + escapeHtml(session.userLogin ?? 'unknown') + '</b> &middot; Session: <span style="font-family:monospace;font-size:12px">' + escapeHtml(session.sessionId) + '</span></div>'
+  html += '<div style="color:#6b7280;font-size:13px;margin-top:4px">' + formatTime(session.startedAt) + ' &rarr; ' + formatTime(endedAt) + '</div>'
+  html += '</div>'
+
+  // KPIs
+  html += '<div class="kpi-grid">'
+  html += '<div class="kpi-box"><div class="value">' + formatMs(kpis.total_session_time_ms) + '</div><div class="label">Total Session Time</div></div>'
+  html += '<div class="kpi-box"><div class="value">' + String(events.length) + '</div><div class="label">Events Handled</div></div>'
+
+  const resolved = events.filter(function (e) { return e.decision_time_ms !== null })
+  html += '<div class="kpi-box"><div class="value">' + resolved.length + ' / ' + events.length + '</div><div class="label">Events Resolved (with AWARD)</div></div>'
+  html += '<div class="kpi-box"><div class="value">' + formatMs(kpis.avg_decision_time_ms) + '</div><div class="label">Avg Decision Time (across all events)</div></div>'
+  html += '</div>'
+
+  // Per-event details
+  html += '<h2>Event Details</h2>'
+  for (let ei = 0; ei < events.length; ei++) {
+    const evt = events[ei]
+    const d = evt.data as Record<string, unknown> | undefined
+    const meta = (d?.metadata ?? {}) as Record<string, unknown>
+    const eventType = typeof meta.event_type === 'string' ? meta.event_type : 'Unknown'
+    const eventId = typeof meta.id_event === 'string' ? meta.id_event : String(meta.id_event ?? '')
+
+    html += '<div class="card">'
+    html += '<h3>' + stepBadge('EVENT') + ' Event #' + (ei + 1)
+    if (eventId) html += ' <span class="tag">ID: ' + escapeHtml(eventId) + '</span>'
+    html += ' <span class="tag">' + escapeHtml(eventType) + '</span>'
+    html += '</h3>'
+    html += '<div class="time">' + formatTime(evt.date) + '</div>'
+    html += eventMetadataHtml(evt.data)
+
+    // Decision time
+    if (evt.decision_time_ms !== null) {
+      html += '<div style="margin-top:8px;font-size:13px">&#9201; Decision time: <b>' + formatMs(evt.decision_time_ms) + '</b></div>'
+    } else {
+      html += '<div class="no-solution" style="margin-top:8px">No solution selected</div>'
+    }
+
+    // Timeline of interactions
+    if (evt.interactions.length > 0) {
+      html += '<div style="margin-top:10px;font-size:13px;color:#6b7280;font-weight:600">Interactions</div>'
+      html += '<div class="timeline">'
+      for (let ii = 0; ii < evt.interactions.length; ii++) {
+        const inter = evt.interactions[ii]
+        const cls = inter.step === 'ASKFORHELP' ? 'ask' : inter.step === 'FEEDBACK' ? 'feedback' : inter.step === 'AWARD' ? 'award' : ''
+        html += '<div class="tl-item ' + cls + '">'
+        html += stepBadge(inter.step) + ' <span class="time">' + formatTime(inter.date) + '</span>'
+        if (inter.step === 'FEEDBACK') {
+          html += '<div style="margin-top:2px;font-size:13px">' + feedbackLabel(inter.data) + '</div>'
+        } else if (inter.step === 'AWARD') {
+          html += awardHtml(inter)
+        }
+        html += '</div>'
+      }
+      html += '</div>'
+    }
+
+    html += '</div>'
+  }
+
+  html += '</body></html>'
+  return html
+}
+
 function download(content: string, mimeType: string, fileName: string) {
   const blob = new Blob([content], { type: mimeType })
   const url = URL.createObjectURL(blob)

From c89465f847754f2e99342544526dd259943fb9df Mon Sep 17 00:00:00 2001
From: Abderrahman AIT SAID <aitsaidabderrahman@gmail.com>
Date: Wed, 25 Mar 2026 13:44:48 +0000
Subject: [PATCH 11/11] feat(frontend): open HTML summary on logout and
 download as backup

---
 frontend/src/utils/traceSessionExport.ts | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/frontend/src/utils/traceSessionExport.ts b/frontend/src/utils/traceSessionExport.ts
index 98829b11..139d698d 100644
--- a/frontend/src/utils/traceSessionExport.ts
+++ b/frontend/src/utils/traceSessionExport.ts
@@ -387,7 +387,7 @@ function download(content: string, mimeType: string, fileName: string) {
   URL.revokeObjectURL(url)
 }
 
-function sessionFileName(session: TraceSession, extension: 'json' | 'csv') {
+function sessionFileName(session: TraceSession, extension: 'json' | 'csv' | 'html') {
   const started = session.startedAt.replace(/:/g, '-').replace('.', '-')
   const user = session.userLogin ?? 'unknown'
   return `historic-session-${user}-${started}.${extension}`
@@ -463,6 +463,20 @@ export function exportTraceSession(format: ExportFormat = 'json', options: Expor
     2
   )
   download(json, 'application/json;charset=utf-8', sessionFileName(session, 'json'))
+
+  // Open HTML summary in a new tab (use <a target="_blank"> to avoid popup blocker)
+  const summaryHtml = buildHtmlSummary(session, endedAt, structured, kpis)
+  const summaryBlob = new Blob([summaryHtml], { type: 'text/html;charset=utf-8' })
+  const summaryUrl = URL.createObjectURL(summaryBlob)
+  const summaryAnchor = document.createElement('a')
+  summaryAnchor.href = summaryUrl
+  summaryAnchor.target = '_blank'
+  summaryAnchor.rel = 'noopener'
+  document.body.appendChild(summaryAnchor)
+  summaryAnchor.click()
+  summaryAnchor.remove()
+  // Also download the HTML file as a backup
+  download(summaryHtml, 'text/html;charset=utf-8', sessionFileName(session, 'html'))
 }
 
 export function clearTraceSession() {