From 513c162683b320ecbab0b2a6c74d9cf14c6b508e Mon Sep 17 00:00:00 2001
From: =?utf8?q?J=C3=A9r=C3=B4me=20Benoit?= <jerome.benoit@sap.com>
Date: Tue, 30 Aug 2022 21:04:32 +0200
Subject: [PATCH] Web UI: Fix NPE at template loading
MIME-Version: 1.0
Content-Type: text/plain; charset=utf8
Content-Transfer-Encoding: 8bit

Signed-off-by: Jérôme Benoit <jerome.benoit@sap.com>
---
 src/ui/web/.gitignore                          |  3 ++-
 src/ui/web/.vscode/launch.json                 | 18 ++++++++++++++++++
 .../charging-stations/CSInfoModal.vue          |  4 ++--
 .../components/charging-stations/CSTable.vue   |  2 +-
 src/ui/web/tests/unit/CSTable.spec.ts          |  6 +-----
 src/ui/web/vue.config.js                       |  3 +++
 6 files changed, 27 insertions(+), 9 deletions(-)
 create mode 100644 src/ui/web/.vscode/launch.json

diff --git a/src/ui/web/.gitignore b/src/ui/web/.gitignore
index 403adbc1..9141c8ee 100644
--- a/src/ui/web/.gitignore
+++ b/src/ui/web/.gitignore
@@ -15,7 +15,8 @@ pnpm-debug.log*
 
 # Editor directories and files
 .idea
-.vscode
+.vscode/*
+!.vscode/launch.json
 *.suo
 *.ntvs*
 *.njsproj
diff --git a/src/ui/web/.vscode/launch.json b/src/ui/web/.vscode/launch.json
new file mode 100644
index 00000000..de60ec86
--- /dev/null
+++ b/src/ui/web/.vscode/launch.json
@@ -0,0 +1,18 @@
+{
+  // Use IntelliSense to learn about possible attributes.
+  // Hover to view descriptions of existing attributes.
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "type": "chrome",
+      "request": "launch",
+      "name": "vuejs: chrome",
+      "url": "http://localhost:8081",
+      "webRoot": "${workspaceFolder}/src",
+      "sourceMapPathOverrides": {
+        "webpack:///src/*": "${webRoot}/*"
+      }
+    }
+  ]
+}
diff --git a/src/ui/web/src/components/charging-stations/CSInfoModal.vue b/src/ui/web/src/components/charging-stations/CSInfoModal.vue
index f9481b58..aa9bcd5d 100644
--- a/src/ui/web/src/components/charging-stations/CSInfoModal.vue
+++ b/src/ui/web/src/components/charging-stations/CSInfoModal.vue
@@ -1,6 +1,6 @@
 <template>
   <Modal :visibility="props.isVisible">
-    <div class="card-info">vendor: {{ props.info.chargePointVendor }}</div>
+    <div class="card-info">vendor: {{ props.stationInfo.chargePointVendor }}</div>
   </Modal>
 </template>
 
@@ -9,8 +9,8 @@ import Modal from '@/components/Modal.vue';
 import type { ChargingStationInfo } from '@/types/ChargingStationType';
 
 const props = defineProps<{
+  stationInfo: ChargingStationInfo;
   isVisible: boolean;
-  info: ChargingStationInfo;
 }>();
 </script>
 
diff --git a/src/ui/web/src/components/charging-stations/CSTable.vue b/src/ui/web/src/components/charging-stations/CSTable.vue
index ccd7db14..97298b1a 100644
--- a/src/ui/web/src/components/charging-stations/CSTable.vue
+++ b/src/ui/web/src/components/charging-stations/CSTable.vue
@@ -17,7 +17,7 @@
     <tbody id="cs-table__body">
       <CSData
         v-for="chargingStation in chargingStations"
-        :key="chargingStation.stationInfo.hashId"
+        :key="chargingStation.stationInfo?.hashId"
         :charging-station="chargingStation"
         :idTag="props.idTag"
       />
diff --git a/src/ui/web/tests/unit/CSTable.spec.ts b/src/ui/web/tests/unit/CSTable.spec.ts
index b6084d9c..b77fab86 100644
--- a/src/ui/web/tests/unit/CSTable.spec.ts
+++ b/src/ui/web/tests/unit/CSTable.spec.ts
@@ -6,11 +6,7 @@ import type { ChargingStationData } from '@/types/ChargingStationType';
 describe('CSTable.vue', () => {
   it('renders CS table columns name', () => {
     const chargingStations: Record<string, ChargingStationData> = {
-      '0': {
-        stationInfo: {
-          hashId: '0',
-        },
-      } as unknown as ChargingStationData,
+      '0': {} as unknown as ChargingStationData,
     };
     const wrapper = shallowMount(CSTable, {
       props: { chargingStations, idTag: '0' },
diff --git a/src/ui/web/vue.config.js b/src/ui/web/vue.config.js
index 34f64656..779217b8 100644
--- a/src/ui/web/vue.config.js
+++ b/src/ui/web/vue.config.js
@@ -2,4 +2,7 @@ const { defineConfig } = require('@vue/cli-service');
 module.exports = defineConfig({
   transpileDependencies: true,
   lintOnSave: false,
+  configureWebpack: {
+    devtool: 'source-map',
+  },
 });
-- 
2.34.1