From a3b6b01bf3232350ba9dc38953362231553be64e Mon Sep 17 00:00:00 2001 From: John Wu <76966357+jwu-fisker@users.noreply.github.com> Date: Wed, 23 Jun 2021 14:48:19 -0700 Subject: [PATCH 1/3] CEC-287 Car connection status (#59) * Car connection status * Formatting --- .../Cars/CarSelectionTable/index.jsx | 10 ++++++ src/components/Contexts/VehicleContext.jsx | 35 ++++++++++++++++--- .../Contexts/VehicleContext.test.jsx | 20 +++++------ .../Contexts/__mocks__/VehicleContext.jsx | 13 +++++-- src/services/__mocks__/vehicles.js | 11 +++++- src/services/vehicles.js | 9 +++++ 6 files changed, 79 insertions(+), 19 deletions(-) diff --git a/src/components/Cars/CarSelectionTable/index.jsx b/src/components/Cars/CarSelectionTable/index.jsx index 24d3e55..392d840 100644 --- a/src/components/Cars/CarSelectionTable/index.jsx +++ b/src/components/Cars/CarSelectionTable/index.jsx @@ -10,6 +10,7 @@ import { TablePagination, TableRow, } from "@material-ui/core"; +import CheckCircleIcon from "@material-ui/icons/CheckCircle"; import { useVehicleContext } from "../../Contexts/VehicleContext"; import { useStatusContext } from "../../Contexts/StatusContext"; @@ -133,6 +134,14 @@ const CarSelectionTable = (props) => { /> + {row.connected && ( + <> + +   + + )} {row.vin} {row.model} @@ -177,6 +186,7 @@ CarSelectionTable.propTypes = { selected: PropTypes.array.isRequired, onSelect: PropTypes.func.isRequired, onSelectAll: PropTypes.func.isRequired, + connectionStatus: PropTypes.bool, }; export default CarSelectionTable; diff --git a/src/components/Contexts/VehicleContext.jsx b/src/components/Contexts/VehicleContext.jsx index ef25261..4811695 100644 --- a/src/components/Contexts/VehicleContext.jsx +++ b/src/components/Contexts/VehicleContext.jsx @@ -39,11 +39,11 @@ export const VehicleProvider = ({ children }) => { if (result.error) { setVehicles([]); throw new Error(`Get vehicles error. ${result.message}`); - } else { - setVehicles(result.data); - if (result.total) { - setTotalVehicles(result.total); - } + } + await addConnections(result.data, token); + setVehicles(result.data); + if (result.total) { + setTotalVehicles(result.total); } } finally { setBusy(false); @@ -96,6 +96,30 @@ export const VehicleProvider = ({ children }) => { } }; + const addConnections = async (cars, token) => { + const vins = cars.map((car) => car.vin); + const result = await api.getConnections(vins, token); + + if (result.error) { + throw new Error(`Get connections error. ${result.message}`); + } + cars.forEach((car) => { + car.connected = result[car.vin] || false; + }); + }; + + const getConnections = async (vins, token) => { + try { + setBusy(true); + const result = await api.getConnections(vins, token); + if (result.error) + throw new Error(`Get connections error. ${result.message}`); + return result; + } finally { + setBusy(false); + } + }; + return ( { getModels, getYears, sendCommand, + getConnections, }} > {children} diff --git a/src/components/Contexts/VehicleContext.test.jsx b/src/components/Contexts/VehicleContext.test.jsx index efd4a7e..d45e782 100644 --- a/src/components/Contexts/VehicleContext.test.jsx +++ b/src/components/Contexts/VehicleContext.test.jsx @@ -133,14 +133,12 @@ describe("VehicleContext", () => { }); }); -const expectedVehicleData = { - data: [ - { vin: "3C4PDCBG0ET127145" }, - { vin: "1G1FP87S3GN100062" }, - { vin: "1HGCG325XYA062256" }, - { vin: "1J4GZ78YXWC160024" }, - { vin: "2C3CCAAG8CH222800" }, - { vin: "KNADM4A39C6028108" }, - { vin: "1G11C5SL9FF153507" }, - ], -}; +const expectedVehicleData = [ + { vin: "3C4PDCBG0ET127145", connected: true }, + { vin: "1G1FP87S3GN100062", connected: true }, + { vin: "1HGCG325XYA062256", connected: true }, + { vin: "1J4GZ78YXWC160024", connected: true }, + { vin: "2C3CCAAG8CH222800", connected: true }, + { vin: "KNADM4A39C6028108", connected: true }, + { vin: "1G11C5SL9FF153507", connected: true }, +]; diff --git a/src/components/Contexts/__mocks__/VehicleContext.jsx b/src/components/Contexts/__mocks__/VehicleContext.jsx index 46dac8d..92d1ac8 100644 --- a/src/components/Contexts/__mocks__/VehicleContext.jsx +++ b/src/components/Contexts/__mocks__/VehicleContext.jsx @@ -25,11 +25,20 @@ export const useVehicleContext = () => ({ getYears: jest.fn(() => { years = [2023, 2024]; }), - sendCommand: jest.fn((vin, command, parameters, token) => ({ - vin, + sendCommand: jest.fn((vins, command, parameters, token) => ({ + vins, command, parameters, })), + getConnections: jest.fn((vins, token) => { + const result = {}; + + vins.forEach((vin) => { + result[vin] = true; + }); + + return result; + }), }); export const setBusy = (val) => { diff --git a/src/services/__mocks__/vehicles.js b/src/services/__mocks__/vehicles.js index 4825e45..1f6662b 100644 --- a/src/services/__mocks__/vehicles.js +++ b/src/services/__mocks__/vehicles.js @@ -10,7 +10,7 @@ const data = [ ]; const vehiclesAPI = { - getVehicles: async (search, token) => { return { data: { data } }; }, + getVehicles: async (search, token) => { return { data }; }, addVehicle: async (vehicle, token) => { data.push(vehicle); return vehicle; @@ -30,6 +30,15 @@ const vehiclesAPI = { vin, command, parameters } }, + getConnections: async (vins, token) => { + const result = {}; + + vins.forEach(vin => { + result[vin] = true; + }); + + return result; + } }; export default vehiclesAPI; diff --git a/src/services/vehicles.js b/src/services/vehicles.js index 4381a25..07b7ea2 100644 --- a/src/services/vehicles.js +++ b/src/services/vehicles.js @@ -39,6 +39,15 @@ const vehiclesAPI = { }), }) .then(fetchRespHandler), + + getConnections: async (vins, token) => { + const u = `${API_ENDPOINT}/carsconnected?vins=${vins.join(",")}` + return fetch(u, { + method: "GET", + headers: Object.assign({ "Content-Type": "application/json" }, getAuthHeaderOptions(token)), + }) + .then(fetchRespHandler) + }, }; export default vehiclesAPI; From f4e4261d01adb0f91e72de9da73d07463940ab7f Mon Sep 17 00:00:00 2001 From: John Wu <76966357+jwu-fisker@users.noreply.github.com> Date: Wed, 23 Jun 2021 16:33:35 -0700 Subject: [PATCH 2/3] CEC-287, CEC-279 Fix car connections and add logger (#61) * Display cars if connection statuses call errors * Fix connection error Add logger --- package-lock.json | 239 ++++++++++++--------- package.json | 1 + src/components/Contexts/VehicleContext.jsx | 19 +- src/services/monitoring.js | 24 ++- 4 files changed, 170 insertions(+), 113 deletions(-) diff --git a/package-lock.json b/package-lock.json index c2f5be0..475765d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1289,6 +1289,30 @@ } } }, + "@datadog/browser-logs": { + "version": "2.15.0", + "resolved": "https://registry.npmjs.org/@datadog/browser-logs/-/browser-logs-2.15.0.tgz", + "integrity": "sha512-kZb0nKx1XoZibs3nkBwcP2iff23kX11yUcQj0aXHLL4yulO5I0AqEhoZXwVFfG8KP82sflX+uyssdNIUwMr1cg==", + "requires": { + "@datadog/browser-core": "2.15.0", + "tslib": "^1.10.0" + }, + "dependencies": { + "@datadog/browser-core": { + "version": "2.15.0", + "resolved": "https://registry.npmjs.org/@datadog/browser-core/-/browser-core-2.15.0.tgz", + "integrity": "sha512-qWTAysGYQXVpM5FOdstaqIF6B99nyQ2N/rJsi1ruPgFmU9yMM9tRdvqiJ7NZcy+OOsZWiinvFRFUMv9SOsHeUA==", + "requires": { + "tslib": "^1.10.0" + } + }, + "tslib": { + "version": "1.14.1", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz", + "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==" + } + } + }, "@datadog/browser-rum": { "version": "2.8.1", "resolved": "https://registry.npmjs.org/@datadog/browser-rum/-/browser-rum-2.8.1.tgz", @@ -5060,9 +5084,9 @@ "integrity": "sha1-s55/HabrCnW6nBcySzR1PEfgZU0=" }, "dns-packet": { - "version": "1.3.1", - "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.1.tgz", - "integrity": "sha512-0UxfQkMhYAUaZI+xrNZOz/as5KgDU0M/fQ9b6SpkyLbk3GEswDi6PADJVaYJradtRVsRIlF1zLyOodbcTCDzUg==", + "version": "1.3.4", + "resolved": "https://registry.npmjs.org/dns-packet/-/dns-packet-1.3.4.tgz", + "integrity": "sha512-BQ6F4vycLXBvdrJZ6S3gZewt6rcrks9KBgM9vrhW+knGRqc8uEdT7fuCwloc7nny5xNoMJ17HGH0R/6fpo8ECA==", "requires": { "ip": "^1.1.0", "safe-buffer": "^5.0.1" @@ -5155,11 +5179,18 @@ } }, "domhandler": { - "version": "2.4.2", - "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-2.4.2.tgz", - "integrity": "sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==", + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-4.2.0.tgz", + "integrity": "sha512-zk7sgt970kzPks2Bf+dwT/PLzghLnsivb9CcxkvR8Mzr66Olr0Ofd8neSbglHJHaHa2MadfoSdNlKYAaafmWfA==", "requires": { - "domelementtype": "1" + "domelementtype": "^2.2.0" + }, + "dependencies": { + "domelementtype": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz", + "integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A==" + } } }, "domutils": { @@ -7323,22 +7354,40 @@ } }, "htmlparser2": { - "version": "3.10.1", - "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-3.10.1.tgz", - "integrity": "sha512-IgieNijUMbkDovyoKObU1DUhm1iwNYE/fuifEoEHfd1oZKZDaONBSkal7Y01shxsM49R4XaMdGez3WnF9UfiCQ==", + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-6.1.0.tgz", + "integrity": "sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==", "requires": { - "domelementtype": "^1.3.1", - "domhandler": "^2.3.0", - "domutils": "^1.5.1", - "entities": "^1.1.1", - "inherits": "^2.0.1", - "readable-stream": "^3.1.1" + "domelementtype": "^2.0.1", + "domhandler": "^4.0.0", + "domutils": "^2.5.2", + "entities": "^2.0.0" }, "dependencies": { - "entities": { - "version": "1.1.2", - "resolved": "https://registry.npmjs.org/entities/-/entities-1.1.2.tgz", - "integrity": "sha512-f2LZMYl1Fzu7YSBKg+RoROelpOaNrcGmE9AZubeDfrCEia483oW4MI4VyFd5VNHIgQ/7qm1I0wUHK1eJnn2y2w==" + "dom-serializer": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz", + "integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==", + "requires": { + "domelementtype": "^2.0.1", + "domhandler": "^4.2.0", + "entities": "^2.0.0" + } + }, + "domelementtype": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz", + "integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A==" + }, + "domutils": { + "version": "2.7.0", + "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.7.0.tgz", + "integrity": "sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==", + "requires": { + "dom-serializer": "^1.0.1", + "domelementtype": "^2.2.0", + "domhandler": "^4.2.0" + } } } }, @@ -10622,9 +10671,9 @@ "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs=" }, "postcss": { - "version": "7.0.35", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.35.tgz", - "integrity": "sha512-3QT8bBJeX/S5zKTTjTCIjRF3If4avAT6kqxcASlTWEtAFCb9NH0OUxNDfgZSWdP5fJnBYCMEWkIFfWeugjzYMg==", + "version": "7.0.36", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz", + "integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==", "requires": { "chalk": "^2.4.2", "source-map": "^0.6.1", @@ -12472,15 +12521,15 @@ "integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8=" }, "renderkid": { - "version": "2.0.5", - "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.5.tgz", - "integrity": "sha512-ccqoLg+HLOHq1vdfYNm4TBeaCDIi1FLt3wGojTDSvdewUv65oTmI3cnT2E4hRjl1gzKZIPK+KZrXzlUYKnR+vQ==", + "version": "2.0.7", + "resolved": "https://registry.npmjs.org/renderkid/-/renderkid-2.0.7.tgz", + "integrity": "sha512-oCcFyxaMrKsKcTY59qnCAtmDVSLfPbrv6A3tVbPdFMMrv5jaK10V6m40cKsoPNhAqN6rmHW9sswW4o3ruSrwUQ==", "requires": { - "css-select": "^2.0.2", - "dom-converter": "^0.2", - "htmlparser2": "^3.10.1", - "lodash": "^4.17.20", - "strip-ansi": "^3.0.0" + "css-select": "^4.1.3", + "dom-converter": "^0.2.0", + "htmlparser2": "^6.1.0", + "lodash": "^4.17.21", + "strip-ansi": "^3.0.1" }, "dependencies": { "ansi-regex": { @@ -12488,6 +12537,56 @@ "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz", "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=" }, + "css-select": { + "version": "4.1.3", + "resolved": "https://registry.npmjs.org/css-select/-/css-select-4.1.3.tgz", + "integrity": "sha512-gT3wBNd9Nj49rAbmtFHj1cljIAOLYSX1nZ8CB7TBO3INYckygm5B7LISU/szY//YmdiSLbJvDLOx9VnMVpMBxA==", + "requires": { + "boolbase": "^1.0.0", + "css-what": "^5.0.0", + "domhandler": "^4.2.0", + "domutils": "^2.6.0", + "nth-check": "^2.0.0" + } + }, + "css-what": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/css-what/-/css-what-5.0.1.tgz", + "integrity": "sha512-FYDTSHb/7KXsWICVsxdmiExPjCfRC4qRFBdVwv7Ax9hMnvMmEjP9RfxTEZ3qPZGmADDn2vAKSo9UcN1jKVYscg==" + }, + "dom-serializer": { + "version": "1.3.2", + "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.3.2.tgz", + "integrity": "sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==", + "requires": { + "domelementtype": "^2.0.1", + "domhandler": "^4.2.0", + "entities": "^2.0.0" + } + }, + "domelementtype": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.2.0.tgz", + "integrity": "sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A==" + }, + "domutils": { + "version": "2.7.0", + "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.7.0.tgz", + "integrity": "sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==", + "requires": { + "dom-serializer": "^1.0.1", + "domelementtype": "^2.2.0", + "domhandler": "^4.2.0" + } + }, + "nth-check": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.0.0.tgz", + "integrity": "sha512-i4sc/Kj8htBrAiH1viZ0TgU8Y5XqCaV/FziYK6TBczxmeKm3AEFWqqF3195yKudrarqy7Zu80Ra5dobFjn9X/Q==", + "requires": { + "boolbase": "^1.0.0" + } + }, "strip-ansi": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", @@ -12640,9 +12739,9 @@ "integrity": "sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo=" }, "resolve-url-loader": { - "version": "3.1.3", - "resolved": "https://registry.npmjs.org/resolve-url-loader/-/resolve-url-loader-3.1.3.tgz", - "integrity": "sha512-WbDSNFiKPPLem1ln+EVTE+bFUBdTTytfQZWbmghroaFNFaAVmGq0Saqw6F/306CwgPXsGwXVxbODE+3xAo/YbA==", + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/resolve-url-loader/-/resolve-url-loader-3.1.4.tgz", + "integrity": "sha512-D3sQ04o0eeQEySLrcz4DsX3saHfsr8/N6tfhblxgZKXxMT2Louargg12oGNfoTRLV09GXhVUe5/qgA5vdgNigg==", "requires": { "adjust-sourcemap-loader": "3.0.0", "camelcase": "5.3.1", @@ -12650,68 +12749,22 @@ "convert-source-map": "1.7.0", "es6-iterator": "2.0.3", "loader-utils": "1.2.3", - "postcss": "7.0.21", + "postcss": "7.0.36", "rework": "1.0.1", "rework-visit": "1.0.0", "source-map": "0.6.1" }, "dependencies": { - "ansi-styles": { - "version": "3.2.1", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz", - "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==", - "requires": { - "color-convert": "^1.9.0" - } - }, "camelcase": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz", "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==" }, - "chalk": { - "version": "2.4.2", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz", - "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==", - "requires": { - "ansi-styles": "^3.2.1", - "escape-string-regexp": "^1.0.5", - "supports-color": "^5.3.0" - }, - "dependencies": { - "supports-color": { - "version": "5.5.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", - "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==", - "requires": { - "has-flag": "^3.0.0" - } - } - } - }, - "color-convert": { - "version": "1.9.3", - "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz", - "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==", - "requires": { - "color-name": "1.1.3" - } - }, - "color-name": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", - "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=" - }, "emojis-list": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz", "integrity": "sha1-TapNnbAPmBmIDHn6RXrlsJof04k=" }, - "has-flag": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz", - "integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=" - }, "json5": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.1.tgz", @@ -12729,24 +12782,6 @@ "emojis-list": "^2.0.0", "json5": "^1.0.1" } - }, - "postcss": { - "version": "7.0.21", - "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.21.tgz", - "integrity": "sha512-uIFtJElxJo29QC753JzhidoAhvp/e/Exezkdhfmt8AymWT6/5B7W1WmponYWkHk2eg6sONyTch0A3nkMPun3SQ==", - "requires": { - "chalk": "^2.4.2", - "source-map": "^0.6.1", - "supports-color": "^6.1.0" - } - }, - "supports-color": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz", - "integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==", - "requires": { - "has-flag": "^3.0.0" - } } } }, @@ -16347,9 +16382,9 @@ } }, "ws": { - "version": "7.4.5", - "resolved": "https://registry.npmjs.org/ws/-/ws-7.4.5.tgz", - "integrity": "sha512-xzyu3hFvomRfXKH8vOFMU3OguG6oOvhXMo3xsGy3xWExqaM2dxBbVxuD99O7m3ZUFMvvscsZDqxfgMaRr/Nr1g==" + "version": "7.5.0", + "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.0.tgz", + "integrity": "sha512-6ezXvzOZupqKj4jUqbQ9tXuJNo+BR2gU8fFRk3XCP3e0G6WT414u5ELe6Y0vtp7kmSJ3F7YWObSNr1ESsgi4vw==" }, "xml-name-validator": { "version": "3.0.0", diff --git a/package.json b/package.json index 04a551d..b5ebb0e 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,7 @@ "version": "0.1.1", "private": true, "dependencies": { + "@datadog/browser-logs": "^2.15.0", "@datadog/browser-rum": "^2.8.1", "@material-ui/core": "^4.11.4", "@material-ui/icons": "^4.11.2", diff --git a/src/components/Contexts/VehicleContext.jsx b/src/components/Contexts/VehicleContext.jsx index 4811695..5787192 100644 --- a/src/components/Contexts/VehicleContext.jsx +++ b/src/components/Contexts/VehicleContext.jsx @@ -1,4 +1,5 @@ import React, { useContext, useState } from "react"; +import { logger } from "../../services/monitoring"; import api from "../../services/vehicles"; const VehicleContext = React.createContext(); @@ -97,15 +98,19 @@ export const VehicleProvider = ({ children }) => { }; const addConnections = async (cars, token) => { - const vins = cars.map((car) => car.vin); - const result = await api.getConnections(vins, token); + try { + const vins = cars.map((car) => car.vin); + const result = await api.getConnections(vins, token); - if (result.error) { - throw new Error(`Get connections error. ${result.message}`); + if (result.error) { + throw new Error(`Get connections error. ${result.message}`); + } + cars.forEach((car) => { + car.connected = result[car.vin] || false; + }); + } catch (e) { + logger.error(e.stack); } - cars.forEach((car) => { - car.connected = result[car.vin] || false; - }); }; const getConnections = async (vins, token) => { diff --git a/src/services/monitoring.js b/src/services/monitoring.js index ac2338b..4d30de2 100644 --- a/src/services/monitoring.js +++ b/src/services/monitoring.js @@ -1,12 +1,28 @@ import { datadogRum } from '@datadog/browser-rum'; +import { datadogLogs } from "@datadog/browser-logs"; + +const applicationId = '8ecd160c-ad5c-4e06-8d88-3a6b89833246'; +const clientToken = 'pubeb25449bb91773fc993855c7378e375a'; +const site = 'datadoghq.com'; datadogRum.init({ - applicationId: '8ecd160c-ad5c-4e06-8d88-3a6b89833246', - clientToken: 'pubeb25449bb91773fc993855c7378e375a', - site: 'datadoghq.com', + applicationId, + clientToken, + site, service:'ota-portal', // Specify a version number to identify the deployed version of your application in Datadog // version: '1.0.0', sampleRate: 100, trackInteractions: true -}); \ No newline at end of file +}); + +datadogLogs.init({ + clientToken, + site, + forwardErrorsToLogs: true, + sampleRate: 100, +}); + +const logger = datadogLogs.logger; + +export { logger }; From 8bb245a417d9c19bbe883ede9bf2f761f25f58ee Mon Sep 17 00:00:00 2001 From: John Wu <76966357+jwu-fisker@users.noreply.github.com> Date: Thu, 24 Jun 2021 10:17:34 -0700 Subject: [PATCH 3/3] CEC-279 Add logger (#62) * CEC-279 Add logger * Error log 500 status requests --- src/components/CarUpdates/Deploy/index.jsx | 24 ++++++--- src/components/CarUpdates/Status/index.jsx | 53 +++++++++++-------- src/components/Cars/Add/index.jsx | 4 +- src/components/Cars/CarSelection/index.jsx | 6 +-- .../Cars/CarSelectionTable/index.jsx | 16 +++--- src/components/Cars/List/index.jsx | 34 ++++++------ src/components/Cars/SendCommand/index.jsx | 4 +- src/components/Cars/SendCommandBulk/index.jsx | 21 +++++--- src/components/Cars/Status/index.jsx | 51 ++++++++++-------- src/components/Cars/StatusModal/index.jsx | 2 +- src/components/Dashboard/index.jsx | 2 +- src/components/Home/index.jsx | 2 +- .../UpdatePackages/Create/index.jsx | 7 ++- src/components/UpdatePackages/Edit/index.jsx | 5 +- src/components/UpdatePackages/List/index.jsx | 6 ++- src/services/monitoring.js | 4 +- src/utils/http.js | 18 +++++-- 17 files changed, 159 insertions(+), 100 deletions(-) diff --git a/src/components/CarUpdates/Deploy/index.jsx b/src/components/CarUpdates/Deploy/index.jsx index f9a7100..2ee06fd 100644 --- a/src/components/CarUpdates/Deploy/index.jsx +++ b/src/components/CarUpdates/Deploy/index.jsx @@ -12,6 +12,7 @@ import useStyles from "../../useStyles"; import { tsLocalDateTimeString } from "../../../utils/dates"; import SearchField from "../../Controls/SearchField"; import CarSelectionTable from "../../Cars/CarSelectionTable"; +import { logger } from "../../../services/monitoring"; const MainForm = () => { const { packageid } = useParams(); @@ -41,14 +42,18 @@ const MainForm = () => { }; const handleSelect = (event, key) => { - let newSelected; - if (event.target.checked) { - newSelected = [...selected]; - newSelected.push(key); - } else { - newSelected = selected.filter((vin) => vin !== key); + try { + let newSelected; + if (event.target.checked) { + newSelected = [...selected]; + newSelected.push(key); + } else { + newSelected = selected.filter((vin) => vin !== key); + } + setSelected(newSelected); + } catch (e) { + logger.warn(e.stack); } - setSelected(newSelected); }; const onSubmit = async (event) => { @@ -65,13 +70,16 @@ const MainForm = () => { setRedirect(`/carupdate-status/${packageid}`); } catch (e) { setMessage(e.message); + logger.warn(e.stack); } }; + const getData = async () => { try { getPackages({ id: parseInt(packageid) }, token); } catch (e) { setMessage(e.message); + logger.warn(e.stack); } }; @@ -82,7 +90,7 @@ const MainForm = () => { useEffect(() => { setTitle(`Deploy ${packageName} ${version}`); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, [packageName, version]); useEffect(() => { diff --git a/src/components/CarUpdates/Status/index.jsx b/src/components/CarUpdates/Status/index.jsx index 5ca0779..b38e816 100644 --- a/src/components/CarUpdates/Status/index.jsx +++ b/src/components/CarUpdates/Status/index.jsx @@ -20,6 +20,7 @@ import { useUserContext } from "../../Contexts/UserContext"; import { useStatusContext } from "../../Contexts/StatusContext"; import useStyles from "../../useStyles"; import { LocalDateTimeString } from "../../../utils/dates"; +import { logger } from "../../../services/monitoring"; const MainForm = () => { const { packageid } = useParams(); @@ -43,36 +44,41 @@ const MainForm = () => { } = useUserContext(); useEffect(() => { - try { - getPackages({ id: packageid }, token); - } catch (e) { - setMessage(e.message); - } - // eslint-disable-next-line + (async () => { + try { + await getPackages({ id: packageid }, token); + } catch (e) { + setMessage(e.message); + logger.warn(e.stack); + } + })(); + // eslint-disable-next-line react-hooks/exhaustive-deps }, [token]); useEffect(() => { if (!packages || packages.length === 0) return; setTitle(`Package ${packages[0].package_name} ${packages[0].version}`); - - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, [packages]); useEffect(() => { - try { - stopMonitor(); - getCarUpdates( - { - packageid, - limit: pageSize, - offset: pageSize * pageIndex, - }, - token - ); - } catch (e) { - setMessage(e.message); - } - // eslint-disable-next-line + (async () => { + try { + stopMonitor(); + await getCarUpdates( + { + packageid, + limit: pageSize, + offset: pageSize * pageIndex, + }, + token + ); + } catch (e) { + setMessage(e.message); + logger.warn(e.stack); + } + })(); + // eslint-disable-next-line react-hooks/exhaustive-deps }, [pageIndex, pageSize, token]); useEffect(() => { @@ -81,11 +87,12 @@ const MainForm = () => { startMonitor(token); } catch (e) { setMessage(e.message); + logger.warn(e.stack); } return () => { stopMonitor(); }; - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, [carUpdates]); const handleChangePageIndex = (event, newIndex) => { diff --git a/src/components/Cars/Add/index.jsx b/src/components/Cars/Add/index.jsx index 0b7c8b6..ddf8dbd 100644 --- a/src/components/Cars/Add/index.jsx +++ b/src/components/Cars/Add/index.jsx @@ -8,6 +8,7 @@ import { import { useStatusContext } from "../../Contexts/StatusContext"; import { useUserContext } from "../../Contexts/UserContext"; import { Button, TextField } from "@material-ui/core"; +import { logger } from "../../../services/monitoring"; const MainForm = () => { const { addVehicle, busy } = useVehicleContext(); @@ -25,7 +26,7 @@ const MainForm = () => { useEffect(() => { setTitle("Add Vehicle"); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); const onSubmit = async (event) => { try { @@ -44,6 +45,7 @@ const MainForm = () => { vinEl.current.value = ""; } catch (e) { setMessage(e.message); + logger.warn(e.stack); } }; diff --git a/src/components/Cars/CarSelection/index.jsx b/src/components/Cars/CarSelection/index.jsx index 4fffdc7..baaa909 100644 --- a/src/components/Cars/CarSelection/index.jsx +++ b/src/components/Cars/CarSelection/index.jsx @@ -40,7 +40,7 @@ const Control = (props) => { await getYears(token); } catch (e) {} })(); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, [token]); useEffect(() => { @@ -56,14 +56,14 @@ const Control = (props) => { useEffect(() => { if (model === null || year === -1) return; getVehicles({ model, year, trim }, token); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, [model, year, trim]); useEffect(() => { if (!props.onSelection) return; const vins = vehicles.map((item) => item.vin); props.onSelection(vins); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, [vehicles]); return ( diff --git a/src/components/Cars/CarSelectionTable/index.jsx b/src/components/Cars/CarSelectionTable/index.jsx index 392d840..2550b8e 100644 --- a/src/components/Cars/CarSelectionTable/index.jsx +++ b/src/components/Cars/CarSelectionTable/index.jsx @@ -16,6 +16,7 @@ import { useVehicleContext } from "../../Contexts/VehicleContext"; import { useStatusContext } from "../../Contexts/StatusContext"; import { LocalDateTimeString } from "../../../utils/dates"; import TableHeaderSortable from "../../Table/HeaderSortable"; +import { logger } from "../../../services/monitoring"; const tableColumns = [ { @@ -100,12 +101,15 @@ const CarSelectionTable = (props) => { offset: pageSize * pageIndex, order: `${orderBy} ${order}`, }; - try { - getVehicles(Object.assign(options, search), token); - } catch (e) { - setMessage(e.message); - } - // eslint-disable-next-line + (async () => { + try { + await getVehicles(Object.assign(options, search), token); + } catch (e) { + setMessage(e.message); + logger.warn(e.stack); + } + })(); + // eslint-disable-next-line react-hooks/exhaustive-deps }, [pageIndex, pageSize, orderBy, order, search, token]); return ( diff --git a/src/components/Cars/List/index.jsx b/src/components/Cars/List/index.jsx index c2f00ae..0eaec4e 100644 --- a/src/components/Cars/List/index.jsx +++ b/src/components/Cars/List/index.jsx @@ -20,6 +20,7 @@ import useStyles from "../../useStyles"; import { LocalDateTimeString } from "../../../utils/dates"; import TableHeaderSortable from "../../Table/HeaderSortable"; import SearchField from "../../Controls/SearchField"; +import { logger } from "../../../services/monitoring"; const tableColumns = [ { @@ -78,24 +79,27 @@ const MainForm = () => { useEffect(() => { setTitle("Vehicles"); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); useEffect(() => { - try { - getVehicles( - { - limit: pageSize, - offset: pageSize * pageIndex, - order: `${orderBy} ${order}`, - search, - }, - token - ); - } catch (e) { - setMessage(e.message); - } - // eslint-disable-next-line + (async () => { + try { + await getVehicles( + { + limit: pageSize, + offset: pageSize * pageIndex, + order: `${orderBy} ${order}`, + search, + }, + token + ); + } catch (e) { + setMessage(e.message); + logger.warn(e.stack); + } + })(); + // eslint-disable-next-line react-hooks/exhaustive-deps }, [pageIndex, pageSize, token, orderBy, order, search]); const handleChangePageIndex = (event, newIndex) => { diff --git a/src/components/Cars/SendCommand/index.jsx b/src/components/Cars/SendCommand/index.jsx index eee3b42..a3d67f1 100644 --- a/src/components/Cars/SendCommand/index.jsx +++ b/src/components/Cars/SendCommand/index.jsx @@ -8,6 +8,7 @@ import commands from "../../../services/commands"; import useStyles from "../../useStyles"; import { useUserContext } from "../../Contexts/UserContext"; import { useStatusContext } from "../../Contexts/StatusContext"; +import { logger } from "../../../services/monitoring"; const SendCommand = ({ vins }) => { const classes = useStyles(); @@ -50,6 +51,7 @@ const SendCommand = ({ vins }) => { } } catch (e) { setMessage(e.message); + logger.error(e.stack); } }; @@ -69,7 +71,7 @@ const SendCommand = ({ vins }) => { useEffect(() => { if (!commands || commands.length === 0) return; selectCommand(commands[0].value); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return ( diff --git a/src/components/Cars/SendCommandBulk/index.jsx b/src/components/Cars/SendCommandBulk/index.jsx index 181b545..6206b9f 100644 --- a/src/components/Cars/SendCommandBulk/index.jsx +++ b/src/components/Cars/SendCommandBulk/index.jsx @@ -8,6 +8,7 @@ import useStyles from "../../useStyles"; import SendCommand from "../SendCommand"; import SearchField from "../../Controls/SearchField"; import CarSelectionTable from "../CarSelectionTable"; +import { logger } from "../../../services/monitoring"; const MainForm = () => { const classes = useStyles(); @@ -30,19 +31,23 @@ const MainForm = () => { }; const handleSelect = (event, key) => { - let newSelected; - if (event.target.checked) { - newSelected = [...selected]; - newSelected.push(key); - } else { - newSelected = selected.filter((vin) => vin !== key); + try { + let newSelected; + if (event.target.checked) { + newSelected = [...selected]; + newSelected.push(key); + } else { + newSelected = selected.filter((vin) => vin !== key); + } + setSelected(newSelected); + } catch (e) { + logger.warn(e.stack); } - setSelected(newSelected); }; useEffect(() => { setTitle("Send Command"); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return ( diff --git a/src/components/Cars/Status/index.jsx b/src/components/Cars/Status/index.jsx index 706d9b3..a4709c3 100644 --- a/src/components/Cars/Status/index.jsx +++ b/src/components/Cars/Status/index.jsx @@ -19,6 +19,7 @@ import { useStatusContext } from "../../Contexts/StatusContext"; import useStyles from "../../useStyles"; import { LocalDateTimeString } from "../../../utils/dates"; import TableHeaderSortable from "../../Table/HeaderSortable"; +import { logger } from "../../../services/monitoring"; const tableColumns = [ { @@ -60,23 +61,27 @@ const MainForm = () => { useEffect(() => { setTitle(`Vehicle ${vin} Details`); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, [vin]); + useEffect(() => { - try { - getCarUpdates( - { - vin, - limit: pageSize, - offset: pageSize * pageIndex, - order: `${orderBy} ${order}`, - }, - token - ); - } catch (e) { - setMessage(e.message); - } - // eslint-disable-next-line + (async () => { + try { + await getCarUpdates( + { + vin, + limit: pageSize, + offset: pageSize * pageIndex, + order: `${orderBy} ${order}`, + }, + token + ); + } catch (e) { + setMessage(e.message); + logger.warn(e.stack); + } + })(); + // eslint-disable-next-line react-hooks/exhaustive-deps }, [pageIndex, pageSize, token, orderBy, order]); const handleChangePageIndex = (event, newIndex) => { @@ -89,15 +94,19 @@ const MainForm = () => { }; const handleSort = (event, property) => { - if (property === orderBy) { - if (order === "asc") { - setOrder("desc"); + try { + if (property === orderBy) { + if (order === "asc") { + setOrder("desc"); + } else { + setOrder("asc"); + } } else { + setOrderBy(property); setOrder("asc"); } - } else { - setOrderBy(property); - setOrder("asc"); + } catch (e) { + logger.warn(e.stack); } }; diff --git a/src/components/Cars/StatusModal/index.jsx b/src/components/Cars/StatusModal/index.jsx index fc12d97..43b315f 100644 --- a/src/components/Cars/StatusModal/index.jsx +++ b/src/components/Cars/StatusModal/index.jsx @@ -41,7 +41,7 @@ export default function CarStatusModal(props) { setMessage(e.message); } })(); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, [props.vin]); return (
diff --git a/src/components/Dashboard/index.jsx b/src/components/Dashboard/index.jsx index 371ec6c..816dcdf 100644 --- a/src/components/Dashboard/index.jsx +++ b/src/components/Dashboard/index.jsx @@ -12,7 +12,7 @@ const Dashboard = () => { useEffect(() => { setTitle("Dashboard"); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return ( diff --git a/src/components/Home/index.jsx b/src/components/Home/index.jsx index d97e939..57eb9e7 100644 --- a/src/components/Home/index.jsx +++ b/src/components/Home/index.jsx @@ -27,7 +27,7 @@ const Home = () => { useEffect(() => { setTitle(""); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return ( diff --git a/src/components/UpdatePackages/Create/index.jsx b/src/components/UpdatePackages/Create/index.jsx index 8aaedc0..2272d2e 100644 --- a/src/components/UpdatePackages/Create/index.jsx +++ b/src/components/UpdatePackages/Create/index.jsx @@ -1,6 +1,8 @@ import React, { useEffect, useRef, useState } from "react"; +import { Redirect } from "react-router"; import { Button, TextField } from "@material-ui/core"; import { DropzoneArea } from "material-ui-dropzone"; + import { useUserContext } from "../../Contexts/UserContext"; import { useStatusContext } from "../../Contexts/StatusContext"; import { @@ -9,7 +11,7 @@ import { } from "../../Contexts/FileUploadContext"; import ModalProgressBar from "../../ModalProgressBar"; import useStyles from "../../useStyles"; -import { Redirect } from "react-router"; +import { logger } from "../../../services/monitoring"; const FileUploadZone = ({ classes, token }) => { const { setFiles } = useFileUploadContext(); @@ -52,7 +54,7 @@ const MainForm = () => { useEffect(() => { setTitle("Create Update Package"); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); const onSubmit = async (event) => { @@ -76,6 +78,7 @@ const MainForm = () => { setRedirect(`/carupdate-deploy/${result.id}`); } catch (e) { setMessage(e.message); + logger.warn(e.stack); } }; diff --git a/src/components/UpdatePackages/Edit/index.jsx b/src/components/UpdatePackages/Edit/index.jsx index 56f2eda..e86283f 100644 --- a/src/components/UpdatePackages/Edit/index.jsx +++ b/src/components/UpdatePackages/Edit/index.jsx @@ -10,6 +10,7 @@ import { useUserContext } from "../../Contexts/UserContext"; import { useStatusContext } from "../../Contexts/StatusContext"; import useStyles from "../../useStyles"; import { tsLocalDateTimeString } from "../../../utils/dates"; +import { logger } from "../../../services/monitoring"; const MainForm = () => { const { id } = useParams(); @@ -42,6 +43,7 @@ const MainForm = () => { setMessage(`Updated ${packageName} ${version}`); } catch (e) { setMessage(e.message); + logger.warn(e.stack); } }; const getData = async () => { @@ -49,6 +51,7 @@ const MainForm = () => { getPackages({ id: parseInt(id) }, token); } catch (e) { setMessage(e.message); + logger.warn(e.stack); } }; const handleChange = (event) => { @@ -70,7 +73,7 @@ const MainForm = () => { useEffect(() => { setTitle(`Edit Update Package ${id}`); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); useEffect(() => { diff --git a/src/components/UpdatePackages/List/index.jsx b/src/components/UpdatePackages/List/index.jsx index 560eb55..4b46b3a 100644 --- a/src/components/UpdatePackages/List/index.jsx +++ b/src/components/UpdatePackages/List/index.jsx @@ -24,6 +24,7 @@ import { LocalDateTimeString } from "../../../utils/dates"; import { Roles, hasRole } from "../../../utils/roles"; import TableHeaderSortable from "../../Table/HeaderSortable"; import SearchField from "../../Controls/SearchField"; +import { logger } from "../../../services/monitoring"; const tableColumns = [ { @@ -67,7 +68,7 @@ const UpdatePackagesList = () => { useEffect(() => { setTitle("Deploy Packages"); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); useEffect(() => { @@ -80,7 +81,7 @@ const UpdatePackagesList = () => { }, token ); - // eslint-disable-next-line + // eslint-disable-next-line react-hooks/exhaustive-deps }, [pageIndex, pageSize, token, orderBy, order, search]); const handleChangePageIndex = (event, newIndex) => { @@ -114,6 +115,7 @@ const UpdatePackagesList = () => { await deletePackage(parseInt(package_id), token); } catch (e) { setMessage(e.message); + logger.warn(e.stack); } }; diff --git a/src/services/monitoring.js b/src/services/monitoring.js index 4d30de2..6cf5297 100644 --- a/src/services/monitoring.js +++ b/src/services/monitoring.js @@ -4,12 +4,13 @@ import { datadogLogs } from "@datadog/browser-logs"; const applicationId = '8ecd160c-ad5c-4e06-8d88-3a6b89833246'; const clientToken = 'pubeb25449bb91773fc993855c7378e375a'; const site = 'datadoghq.com'; +const service = 'ota-portal'; datadogRum.init({ applicationId, clientToken, site, - service:'ota-portal', + service, // Specify a version number to identify the deployed version of your application in Datadog // version: '1.0.0', sampleRate: 100, @@ -19,6 +20,7 @@ datadogRum.init({ datadogLogs.init({ clientToken, site, + service, forwardErrorsToLogs: true, sampleRate: 100, }); diff --git a/src/utils/http.js b/src/utils/http.js index 8ff605e..e3f176c 100644 --- a/src/utils/http.js +++ b/src/utils/http.js @@ -1,3 +1,5 @@ +import { logger } from "../services/monitoring"; + export const getAuthHeaderOptions = (token) => ({ "Authorization": `Bearer ${token}`, }); @@ -6,11 +8,17 @@ export const fetchRespHandler = (response) => { if (response.ok) return response.json(); return response.text() - .then((text) => JSON.parse(text)) - .catch((e) => ({ - error: response.statusText, - message: `${response.status} ${response.statusText}`, - })) + .then((text) => { + if (response.status >= 500) logger.error(text); + return JSON.parse(text); + }) + .catch((e) => { + logger.error(e.stack); + return { + error: response.statusText, + message: `${response.status} ${response.statusText}`, + }; + }) } export const addQueryParams = (url, params) => {