From 9a5f80980118c8dbc771a1dcd3c8f87ac39f29d4 Mon Sep 17 00:00:00 2001
From: =?utf8?q?J=C3=A9r=C3=B4me=20Benoit?= <jerome.benoit@sap.com>
Date: Wed, 23 Jul 2025 21:27:10 +0200
Subject: [PATCH] feat(ui): allow to authorize RFID tag at start transaction
MIME-Version: 1.0
Content-Type: text/plain; charset=utf8
Content-Transfer-Encoding: 8bit

closes #1476
closes #1475

Signed-off-by: Jérôme Benoit <jerome.benoit@sap.com>
---
 README.md                                     | 16 ++++
 .../UIServiceWorkerBroadcastChannel.ts        | 20 +++--
 src/types/UIProtocol.ts                       |  1 +
 .../components/actions/StartTransaction.vue   | 84 ++++++++++++++-----
 .../charging-stations/CSConnector.vue         |  4 +
 ui/web/src/composables/UIClient.ts            |  7 ++
 ui/web/src/types/UIProtocol.ts                |  2 +
 7 files changed, 104 insertions(+), 30 deletions(-)

diff --git a/README.md b/README.md
index c03b3f5e..410da5d1 100644
--- a/README.md
+++ b/README.md
@@ -848,6 +848,22 @@ Set the Websocket header _Sec-Websocket-Protocol_ to `ui0.0.1`.
 
 Examples:
 
+- **Authorize**
+- Request:  
+   `ProcedureName`: 'authorize'  
+   `PDU`: {  
+   `hashIds`: charging station unique identifier strings array (optional, default: all charging stations),  
+   `idTag`: RFID tag string  
+   }
+
+- Response:  
+   `PDU`: {  
+   `status`: 'success' | 'failure',  
+   `hashIdsSucceeded`: charging station unique identifier strings array,  
+   `hashIdsFailed`: charging station unique identifier strings array (optional),  
+   `responsesFailed`: failed responses payload array (optional)  
+   }
+
 - **Start Transaction**
   - Request:  
     `ProcedureName`: 'startTransaction'  
diff --git a/src/charging-station/broadcast-channel/UIServiceWorkerBroadcastChannel.ts b/src/charging-station/broadcast-channel/UIServiceWorkerBroadcastChannel.ts
index 48bf1691..12bc6824 100644
--- a/src/charging-station/broadcast-channel/UIServiceWorkerBroadcastChannel.ts
+++ b/src/charging-station/broadcast-channel/UIServiceWorkerBroadcastChannel.ts
@@ -34,16 +34,18 @@ export class UIServiceWorkerBroadcastChannel extends WorkerBroadcastChannel {
     const responsesStatus =
       this.responses
         .get(uuid)
-        ?.responses.every(({ status }) => status === ResponseStatus.SUCCESS) === true
+        // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+        ?.responses.every(response => response?.status === ResponseStatus.SUCCESS) === true
         ? ResponseStatus.SUCCESS
         : ResponseStatus.FAILURE
     return {
       // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
       hashIdsSucceeded: this.responses
         .get(uuid)
-        ?.responses.map(({ hashId, status }) => {
-          if (hashId != null && status === ResponseStatus.SUCCESS) {
-            return hashId
+        ?.responses.map(response => {
+          // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+          if (response?.hashId != null && response?.status === ResponseStatus.SUCCESS) {
+            return response.hashId
           }
           return undefined
         })
@@ -53,9 +55,10 @@ export class UIServiceWorkerBroadcastChannel extends WorkerBroadcastChannel {
         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion, @typescript-eslint/no-non-null-asserted-optional-chain
         hashIdsFailed: this.responses
           .get(uuid)
-          ?.responses.map(({ hashId, status }) => {
-            if (hashId != null && status === ResponseStatus.FAILURE) {
-              return hashId
+          ?.responses.map(response => {
+            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+            if (response?.hashId != null && response?.status === ResponseStatus.FAILURE) {
+              return response.hashId
             }
             return undefined
           })
@@ -66,7 +69,8 @@ export class UIServiceWorkerBroadcastChannel extends WorkerBroadcastChannel {
         responsesFailed: this.responses
           .get(uuid)
           ?.responses.map(response => {
-            if (response.status === ResponseStatus.FAILURE) {
+            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+            if (response?.status === ResponseStatus.FAILURE) {
               return response
             }
             return undefined
diff --git a/src/types/UIProtocol.ts b/src/types/UIProtocol.ts
index 76e3ee7e..9418d8be 100644
--- a/src/types/UIProtocol.ts
+++ b/src/types/UIProtocol.ts
@@ -46,6 +46,7 @@ export enum Protocol {
 export enum ProtocolVersion {
   '0.0.1' = '0.0.1',
 }
+
 export enum ResponseStatus {
   FAILURE = 'failure',
   SUCCESS = 'success',
diff --git a/ui/web/src/components/actions/StartTransaction.vue b/ui/web/src/components/actions/StartTransaction.vue
index d6829d46..a4510948 100644
--- a/ui/web/src/components/actions/StartTransaction.vue
+++ b/ui/web/src/components/actions/StartTransaction.vue
@@ -4,31 +4,70 @@
   </h1>
   <h2>{{ chargingStationId }}</h2>
   <h3>Connector {{ connectorId }}</h3>
-  <p>Scan RFID tag:</p>
-  <input
-    id="idtag"
-    v-model.trim="state.idTag"
-    name="idtag"
-    placeholder="RFID tag"
-    type="text"
-  >
+  <p>
+    RFID tag:
+    <input
+      id="idtag"
+      v-model.trim="state.idTag"
+      name="idtag"
+      placeholder="RFID tag"
+      type="text"
+    >
+  </p>
+  <p>
+    Authorize RFID tag:
+    <input
+      v-model="state.authorizeIdTag"
+      false-value="false"
+      true-value="true"
+      type="checkbox"
+    >
+  </p>
   <br>
   <Button
     id="action-button"
     @click="
       () => {
-        $uiClient
-          ?.startTransaction(hashId, convertToInt(connectorId), state.idTag)
-          .then(() => {
-            $toast.success('Transaction successfully started')
-          })
-          .catch((error: Error) => {
-            $toast.error('Error at starting transaction')
-            console.error('Error at starting transaction:', error)
-          })
-          .finally(() => {
-            $router.push({ name: 'charging-stations' })
-          })
+        state.authorizeIdTag = convertToBoolean(state.authorizeIdTag)
+        if (state.authorizeIdTag) {
+          if (state.idTag == null || state.idTag.trim().length === 0) {
+            $toast.error('Please provide an RFID tag to authorize')
+            return
+          }
+          $uiClient
+            ?.authorize(hashId, state.idTag)
+            .then(() => {
+              $uiClient
+                ?.startTransaction(hashId, convertToInt(connectorId), state.idTag)
+                .then(() => {
+                  $toast.success('Transaction successfully started')
+                })
+                .catch((error: Error) => {
+                  $toast.error('Error at starting transaction')
+                  console.error('Error at starting transaction:', error)
+                })
+                .finally(() => {
+                  $router.push({ name: 'charging-stations' })
+                })
+            })
+            .catch((error: Error) => {
+              $toast.error('Error at authorizing RFID tag')
+              console.error('Error at authorizing RFID tag:', error)
+            })
+        } else {
+          $uiClient
+            ?.startTransaction(hashId, convertToInt(connectorId), state.idTag)
+            .then(() => {
+              $toast.success('Transaction successfully started')
+            })
+            .catch((error: Error) => {
+              $toast.error('Error at starting transaction')
+              console.error('Error at starting transaction:', error)
+            })
+            .finally(() => {
+              $router.push({ name: 'charging-stations' })
+            })
+        }
       }
     "
   >
@@ -40,7 +79,7 @@
 import { ref } from 'vue'
 
 import Button from '@/components/buttons/Button.vue'
-import { convertToInt } from '@/composables'
+import { convertToBoolean, convertToInt } from '@/composables'
 
 defineProps<{
   chargingStationId: string
@@ -48,7 +87,8 @@ defineProps<{
   hashId: string
 }>()
 
-const state = ref<{ idTag: string }>({
+const state = ref<{ authorizeIdTag: boolean; idTag: string }>({
+  authorizeIdTag: false,
   idTag: '',
 })
 </script>
diff --git a/ui/web/src/components/charging-stations/CSConnector.vue b/ui/web/src/components/charging-stations/CSConnector.vue
index a6a57292..8503d8f3 100644
--- a/ui/web/src/components/charging-stations/CSConnector.vue
+++ b/ui/web/src/components/charging-stations/CSConnector.vue
@@ -70,6 +70,10 @@ const uiClient = useUIClient()
 const $toast = useToast()
 
 const stopTransaction = (): void => {
+  if (props.connector.transactionId == null) {
+    $toast.error('No transaction to stop')
+    return
+  }
   uiClient
     .stopTransaction(props.hashId, props.connector.transactionId)
     .then(() => {
diff --git a/ui/web/src/composables/UIClient.ts b/ui/web/src/composables/UIClient.ts
index 60e6c665..faa8e922 100644
--- a/ui/web/src/composables/UIClient.ts
+++ b/ui/web/src/composables/UIClient.ts
@@ -59,6 +59,13 @@ export class UIClient {
     })
   }
 
+  public async authorize (hashId: string, idTag: string): Promise<ResponsePayload> {
+    return this.sendRequest(ProcedureName.AUTHORIZE, {
+      hashIds: [hashId],
+      idTag,
+    })
+  }
+
   public async closeConnection (hashId: string): Promise<ResponsePayload> {
     return this.sendRequest(ProcedureName.CLOSE_CONNECTION, {
       hashIds: [hashId],
diff --git a/ui/web/src/types/UIProtocol.ts b/ui/web/src/types/UIProtocol.ts
index 169a713e..1d8422ab 100644
--- a/ui/web/src/types/UIProtocol.ts
+++ b/ui/web/src/types/UIProtocol.ts
@@ -11,6 +11,7 @@ export enum AuthenticationType {
 
 export enum ProcedureName {
   ADD_CHARGING_STATIONS = 'addChargingStations',
+  AUTHORIZE = 'authorize',
   CLOSE_CONNECTION = 'closeConnection',
   DELETE_CHARGING_STATIONS = 'deleteChargingStations',
   LIST_CHARGING_STATIONS = 'listChargingStations',
@@ -35,6 +36,7 @@ export enum Protocol {
 export enum ProtocolVersion {
   '0.0.1' = '0.0.1',
 }
+
 export enum ResponseStatus {
   FAILURE = 'failure',
   SUCCESS = 'success',
-- 
2.43.0