diff --git a/web/package-lock.json b/web/package-lock.json
index 4e2fcd18a..997f27d4a 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -2741,6 +2741,37 @@
"resolved": "https://registry.npmjs.org/character-reference-invalid/-/character-reference-invalid-1.1.4.tgz",
"integrity": "sha512-mKKUkUbhPpQlCOfIuZkvSEgktjPFIsZKRRbC6KWVEMvlzblj3i3asQv5ODsrwt0N3pHAEvjP8KTQPHkp0+6jOg=="
},
+ "chart.js": {
+ "version": "2.9.4",
+ "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-2.9.4.tgz",
+ "integrity": "sha512-B07aAzxcrikjAPyV+01j7BmOpxtQETxTSlQ26BEYJ+3iUkbNKaOJ/nDbT6JjyqYxseM0ON12COHYdU2cTIjC7A==",
+ "requires": {
+ "chartjs-color": "^2.1.0",
+ "moment": "^2.10.2"
+ }
+ },
+ "chartjs-color": {
+ "version": "2.4.1",
+ "resolved": "https://registry.npmjs.org/chartjs-color/-/chartjs-color-2.4.1.tgz",
+ "integrity": "sha512-haqOg1+Yebys/Ts/9bLo/BqUcONQOdr/hoEr2LLTRl6C5LXctUdHxsCYfvQVg5JIxITrfCNUDr4ntqmQk9+/0w==",
+ "requires": {
+ "chartjs-color-string": "^0.6.0",
+ "color-convert": "^1.9.3"
+ }
+ },
+ "chartjs-color-string": {
+ "version": "0.6.0",
+ "resolved": "https://registry.npmjs.org/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz",
+ "integrity": "sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==",
+ "requires": {
+ "color-name": "^1.0.0"
+ }
+ },
+ "chartkick": {
+ "version": "3.2.1",
+ "resolved": "https://registry.npmjs.org/chartkick/-/chartkick-3.2.1.tgz",
+ "integrity": "sha512-zV0kUeZNqrX28AmPt10QEDXHKadbVFOTAFkCMyJifHzGFkKzGCDXxVR8orZ0fC1HbePzRn5w6kLCOVxDQbMUCg=="
+ },
"chokidar": {
"version": "2.1.8",
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-2.1.8.tgz",
@@ -2982,11 +3013,6 @@
"toggle-selection": "^1.0.6"
}
},
- "core-js": {
- "version": "2.6.11",
- "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.11.tgz",
- "integrity": "sha512-5wjnpaT/3dV+XB4borEsnAYQchn00XSgTAWKDkEqv+K8KevjbzmofK6hfJ9TZIlpj2N0xQpazy7PiRQiWHqzWg=="
- },
"core-js-compat": {
"version": "3.6.5",
"resolved": "https://registry.npmjs.org/core-js-compat/-/core-js-compat-3.6.5.tgz",
@@ -3211,72 +3237,6 @@
"type": "^1.0.1"
}
},
- "d3-array": {
- "version": "2.8.0",
- "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.8.0.tgz",
- "integrity": "sha512-6V272gsOeg7+9pTW1jSYOR1QE37g95I3my1hBmY+vOUNHRrk9yt4OTz/gK7PMkVAVDrYYq4mq3grTiZ8iJdNIw=="
- },
- "d3-collection": {
- "version": "1.0.7",
- "resolved": "https://registry.npmjs.org/d3-collection/-/d3-collection-1.0.7.tgz",
- "integrity": "sha512-ii0/r5f4sjKNTfh84Di+DpztYwqKhEyUlKoPrzUFfeSkWxjW49xU2QzO9qrPrNkpdI0XJkfzvmTu8V2Zylln6A=="
- },
- "d3-color": {
- "version": "2.0.0",
- "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-2.0.0.tgz",
- "integrity": "sha512-SPXi0TSKPD4g9tw0NMZFnR95XVgUZiBH+uUTqQuDu1OsE2zomHU7ho0FISciaPvosimixwHFl3WHLGabv6dDgQ=="
- },
- "d3-format": {
- "version": "2.0.0",
- "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-2.0.0.tgz",
- "integrity": "sha512-Ab3S6XuE/Q+flY96HXT0jOXcM4EAClYFnRGY5zsjRGNy6qCYrQsMffs7cV5Q9xejb35zxW5hf/guKw34kvIKsA=="
- },
- "d3-interpolate": {
- "version": "2.0.1",
- "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-2.0.1.tgz",
- "integrity": "sha512-c5UhwwTs/yybcmTpAVqwSFl6vrQ8JZJoT5F7xNFK9pymv5C0Ymcc9/LIJHtYIggg/yS9YHw8i8O8tgb9pupjeQ==",
- "requires": {
- "d3-color": "1 - 2"
- }
- },
- "d3-path": {
- "version": "1.0.9",
- "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-1.0.9.tgz",
- "integrity": "sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg=="
- },
- "d3-scale": {
- "version": "3.2.3",
- "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-3.2.3.tgz",
- "integrity": "sha512-8E37oWEmEzj57bHcnjPVOBS3n4jqakOeuv1EDdQSiSrYnMCBdMd3nc4HtKk7uia8DUHcY/CGuJ42xxgtEYrX0g==",
- "requires": {
- "d3-array": "^2.3.0",
- "d3-format": "1 - 2",
- "d3-interpolate": "1.2.0 - 2",
- "d3-time": "1 - 2",
- "d3-time-format": "2 - 3"
- }
- },
- "d3-shape": {
- "version": "1.3.7",
- "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-1.3.7.tgz",
- "integrity": "sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==",
- "requires": {
- "d3-path": "1"
- }
- },
- "d3-time": {
- "version": "2.0.0",
- "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-2.0.0.tgz",
- "integrity": "sha512-2mvhstTFcMvwStWd9Tj3e6CEqtOivtD8AUiHT8ido/xmzrI9ijrUUihZ6nHuf/vsScRBonagOdj0Vv+SEL5G3Q=="
- },
- "d3-time-format": {
- "version": "3.0.0",
- "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-3.0.0.tgz",
- "integrity": "sha512-UXJh6EKsHBTjopVqZBhFysQcoXSv/5yLONZvkQ5Kk3qbwiUYkdX17Xa1PT6U1ZWXGGfB1ey5L8dKMlFq2DO0Ag==",
- "requires": {
- "d3-time": "1 - 2"
- }
- },
"damerau-levenshtein": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.6.tgz",
@@ -3309,11 +3269,6 @@
"ms": "2.1.2"
}
},
- "decimal.js-light": {
- "version": "2.5.1",
- "resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz",
- "integrity": "sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg=="
- },
"decode-uri-component": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
@@ -3446,14 +3401,6 @@
"resolved": "https://registry.npmjs.org/dom-align/-/dom-align-1.12.0.tgz",
"integrity": "sha512-YkoezQuhp3SLFGdOlr5xkqZ640iXrnHAwVYcDg8ZKRUtO7mSzSC2BA5V0VuyAwPSJA4CLIc6EDDJh4bEsD2+zA=="
},
- "dom-helpers": {
- "version": "3.4.0",
- "resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-3.4.0.tgz",
- "integrity": "sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA==",
- "requires": {
- "@babel/runtime": "^7.1.2"
- }
- },
"dom-serializer": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.0.1.tgz",
@@ -5492,21 +5439,11 @@
"resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
"integrity": "sha1-soqmKIorn8ZRA1x3EfZathkDMaY="
},
- "lodash.debounce": {
- "version": "4.0.8",
- "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
- "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168="
- },
"lodash.sortby": {
"version": "4.7.0",
"resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
"integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg="
},
- "lodash.throttle": {
- "version": "4.1.1",
- "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz",
- "integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ="
- },
"loose-envify": {
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
@@ -5551,11 +5488,6 @@
"object-visit": "^1.0.0"
}
},
- "math-expression-evaluator": {
- "version": "1.2.22",
- "resolved": "https://registry.npmjs.org/math-expression-evaluator/-/math-expression-evaluator-1.2.22.tgz",
- "integrity": "sha512-L0j0tFVZBQQLeEjmWOvDLoRciIY8gQGWahvkztXUal8jH8R5Rlqo9GCvgqvXcy9LQhEWdQCVvzqAbxgYNt4blQ=="
- },
"md5.js": {
"version": "1.3.5",
"resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
@@ -7299,6 +7231,14 @@
"prop-types": "^15.6.2"
}
},
+ "react-chartkick": {
+ "version": "0.4.1",
+ "resolved": "https://registry.npmjs.org/react-chartkick/-/react-chartkick-0.4.1.tgz",
+ "integrity": "sha512-ydShYzYGCkphlUUMaN6gHHyS+Na9hRj1nvkSvB+cIU3E9JkGkj0Eiin7Y/NJ5165uiQtIbvuWvrPq2vbZHQmCA==",
+ "requires": {
+ "chartkick": "^3.2.0"
+ }
+ },
"react-dom": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.13.1.tgz",
@@ -7351,39 +7291,6 @@
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.8.3.tgz",
"integrity": "sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg=="
},
- "react-resize-detector": {
- "version": "2.3.0",
- "resolved": "https://registry.npmjs.org/react-resize-detector/-/react-resize-detector-2.3.0.tgz",
- "integrity": "sha512-oCAddEWWeFWYH5FAcHdBYcZjAw9fMzRUK9sWSx6WvSSOPVRxcHd5zTIGy/mOus+AhN/u6T4TMiWxvq79PywnJQ==",
- "requires": {
- "lodash.debounce": "^4.0.8",
- "lodash.throttle": "^4.1.1",
- "prop-types": "^15.6.0",
- "resize-observer-polyfill": "^1.5.0"
- }
- },
- "react-smooth": {
- "version": "1.0.5",
- "resolved": "https://registry.npmjs.org/react-smooth/-/react-smooth-1.0.5.tgz",
- "integrity": "sha512-eW057HT0lFgCKh8ilr0y2JaH2YbNcuEdFpxyg7Gf/qDKk9hqGMyXryZJ8iMGJEuKH0+wxS0ccSsBBB3W8yCn8w==",
- "requires": {
- "lodash": "~4.17.4",
- "prop-types": "^15.6.0",
- "raf": "^3.4.0",
- "react-transition-group": "^2.5.0"
- }
- },
- "react-transition-group": {
- "version": "2.9.0",
- "resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-2.9.0.tgz",
- "integrity": "sha512-+HzNTCHpeQyl4MJ/bdE0u6XRMe9+XG/+aL4mCxVN4DnPBQ0/5bfHWPDuOZUzYdMj94daZaZdCCc1Dzt9R/xSSg==",
- "requires": {
- "dom-helpers": "^3.4.0",
- "loose-envify": "^1.4.0",
- "prop-types": "^15.6.2",
- "react-lifecycles-compat": "^3.0.4"
- }
- },
"read-pkg": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-2.0.0.tgz",
@@ -7497,108 +7404,6 @@
"readable-stream": "^2.0.2"
}
},
- "recharts": {
- "version": "1.8.5",
- "resolved": "https://registry.npmjs.org/recharts/-/recharts-1.8.5.tgz",
- "integrity": "sha512-tM9mprJbXVEBxjM7zHsIy6Cc41oO/pVYqyAsOHLxlJrbNBuLs0PHB3iys2M+RqCF0//k8nJtZF6X6swSkWY3tg==",
- "requires": {
- "classnames": "^2.2.5",
- "core-js": "^2.6.10",
- "d3-interpolate": "^1.3.0",
- "d3-scale": "^2.1.0",
- "d3-shape": "^1.2.0",
- "lodash": "^4.17.5",
- "prop-types": "^15.6.0",
- "react-resize-detector": "^2.3.0",
- "react-smooth": "^1.0.5",
- "recharts-scale": "^0.4.2",
- "reduce-css-calc": "^1.3.0"
- },
- "dependencies": {
- "d3-array": {
- "version": "1.2.4",
- "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-1.2.4.tgz",
- "integrity": "sha512-KHW6M86R+FUPYGb3R5XiYjXPq7VzwxZ22buHhAEVG5ztoEcZZMLov530mmccaqA1GghZArjQV46fuc8kUqhhHw=="
- },
- "d3-color": {
- "version": "1.4.1",
- "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-1.4.1.tgz",
- "integrity": "sha512-p2sTHSLCJI2QKunbGb7ocOh7DgTAn8IrLx21QRc/BSnodXM4sv6aLQlnfpvehFMLZEfBc6g9pH9SWQccFYfJ9Q=="
- },
- "d3-format": {
- "version": "1.4.5",
- "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-1.4.5.tgz",
- "integrity": "sha512-J0piedu6Z8iB6TbIGfZgDzfXxUFN3qQRMofy2oPdXzQibYGqPB/9iMcxr/TGalU+2RsyDO+U4f33id8tbnSRMQ=="
- },
- "d3-interpolate": {
- "version": "1.4.0",
- "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-1.4.0.tgz",
- "integrity": "sha512-V9znK0zc3jOPV4VD2zZn0sDhZU3WAE2bmlxdIwwQPPzPjvyLkd8B3JUVdS1IDUFDkWZ72c9qnv1GK2ZagTZ8EA==",
- "requires": {
- "d3-color": "1"
- }
- },
- "d3-scale": {
- "version": "2.2.2",
- "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-2.2.2.tgz",
- "integrity": "sha512-LbeEvGgIb8UMcAa0EATLNX0lelKWGYDQiPdHj+gLblGVhGLyNbaCn3EvrJf0A3Y/uOOU5aD6MTh5ZFCdEwGiCw==",
- "requires": {
- "d3-array": "^1.2.0",
- "d3-collection": "1",
- "d3-format": "1",
- "d3-interpolate": "1",
- "d3-time": "1",
- "d3-time-format": "2"
- }
- },
- "d3-time": {
- "version": "1.1.0",
- "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-1.1.0.tgz",
- "integrity": "sha512-Xh0isrZ5rPYYdqhAVk8VLnMEidhz5aP7htAADH6MfzgmmicPkTo8LhkLxci61/lCB7n7UmE3bN0leRt+qvkLxA=="
- },
- "d3-time-format": {
- "version": "2.3.0",
- "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-2.3.0.tgz",
- "integrity": "sha512-guv6b2H37s2Uq/GefleCDtbe0XZAuy7Wa49VGkPVPMfLL9qObgBST3lEHJBMUp8S7NdLQAGIvr2KXk8Hc98iKQ==",
- "requires": {
- "d3-time": "1"
- }
- }
- }
- },
- "recharts-scale": {
- "version": "0.4.3",
- "resolved": "https://registry.npmjs.org/recharts-scale/-/recharts-scale-0.4.3.tgz",
- "integrity": "sha512-t8p5sccG9Blm7c1JQK/ak9O8o95WGhNXD7TXg/BW5bYbVlr6eCeRBNpgyigD4p6pSSMehC5nSvBUPj6F68rbFA==",
- "requires": {
- "decimal.js-light": "^2.4.1"
- }
- },
- "reduce-css-calc": {
- "version": "1.3.0",
- "resolved": "https://registry.npmjs.org/reduce-css-calc/-/reduce-css-calc-1.3.0.tgz",
- "integrity": "sha1-dHyRTgSWFKTJz7umKYca0dKSdxY=",
- "requires": {
- "balanced-match": "^0.4.2",
- "math-expression-evaluator": "^1.2.14",
- "reduce-function-call": "^1.0.1"
- },
- "dependencies": {
- "balanced-match": {
- "version": "0.4.2",
- "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-0.4.2.tgz",
- "integrity": "sha1-yz8+PHMtwPAe5wtAPzAuYddwmDg="
- }
- }
- },
- "reduce-function-call": {
- "version": "1.0.3",
- "resolved": "https://registry.npmjs.org/reduce-function-call/-/reduce-function-call-1.0.3.tgz",
- "integrity": "sha512-Hl/tuV2VDgWgCSEeWMLwxLZqX7OK59eU1guxXsRKTAyeYimivsKdtcV4fu3r710tpG5GmDKDhQ0HSZLExnNmyQ==",
- "requires": {
- "balanced-match": "^1.0.0"
- }
- },
"regenerate": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.1.tgz",
diff --git a/web/package.json b/web/package.json
index 1a4134572..f05b73cc9 100644
--- a/web/package.json
+++ b/web/package.json
@@ -10,17 +10,16 @@
"dependencies": {
"@ant-design/icons": "^4.2.2",
"antd": "^4.6.6",
+ "chart.js": "^2.9.4",
"classnames": "^2.2.6",
- "d3-scale": "^3.2.3",
- "d3-time-format": "^3.0.0",
"date-fns": "^2.16.1",
"next": "^10.0.0",
"prop-types": "^15.7.2",
"react": "16.13.1",
+ "react-chartkick": "^0.4.1",
"react-dom": "16.13.1",
"react-linkify": "^1.0.0-alpha",
"react-markdown": "^5.0.2",
- "recharts": "^1.8.5",
"sass": "^1.26.11"
},
"devDependencies": {
diff --git a/web/pages/components/chart.tsx b/web/pages/components/chart.tsx
index 6af5eacb6..6dc48e7bd 100644
--- a/web/pages/components/chart.tsx
+++ b/web/pages/components/chart.tsx
@@ -1,13 +1,6 @@
-import { LineChart, XAxis, YAxis, Line, Tooltip, Legend } from "recharts";
-import { timeFormat } from "d3-time-format";
-import useWindowSize from '../../utils/hook-windowresize';
+import { LineChart } from 'react-chartkick'
import styles from '../../styles/styles.module.css';
-
-interface ToolTipProps {
- active?: boolean,
- payload?: {name: string, payload: {value: string, time: Date}}[],
- unit?: string
-}
+import 'chart.js'
const defaultProps = {
active: false,
@@ -28,102 +21,45 @@ interface ChartProps {
dataCollections?: any[],
}
-function CustomizedTooltip(props: ToolTipProps) {
- const { active, payload, unit } = props;
- if (active && payload && payload[0]) {
- const time = payload[0].payload ? timeFormat("%I:%M")(new Date(payload[0].payload.time)) : "";
-
- const tooltipDetails = payload.map(data => {
- return
- {data.payload.value}{unit} {data.name}
-
- });
- return (
-
- {time}
- {tooltipDetails}
-
- );
- }
- return null;
+function createGraphDataset(dataArray) {
+ const dataValues = {};
+ dataArray.forEach(item => {
+ const dateObject = new Date(item.time);
+ const dateString = `${dateObject.getFullYear() }-${ dateObject.getMonth() }-${ dateObject.getDay() } ${ dateObject.getHours() }:${ dateObject.getMinutes()}`;
+ dataValues[dateString] = item.value;
+ })
+ return dataValues;
}
-CustomizedTooltip.defaultProps = defaultProps;
export default function Chart({ data, title, color, unit, dataCollections }: ChartProps) {
- if (!data && !dataCollections) {
- return null;
- }
-
- const windowSize = useWindowSize();
- const chartWidth = windowSize.width * .68;
- const chartHeight = chartWidth * .333;
+ const renderData = [];
- const timeFormatter = (tick: string) => {
- return timeFormat("%I:%M")(new Date(tick));
- };
-
- let ticks = [];
- if (dataCollections.length > 0) {
- ticks = dataCollections[0].data?.map((collection) => {
- return collection?.time;
- })
- } else if (data?.length > 0){
- ticks = data?.map(item => {
- return item?.time;
+ if (data && data.length > 0) {
+ renderData.push({
+ name: title,
+ color,
+ data: createGraphDataset(data)
});
}
- const line = data && data?.length > 0 ? (
-
- ) : null;
+ dataCollections.forEach(collection => {
+ renderData.push(
+ {name: collection.name, data: createGraphDataset(collection.data), color: collection.color}
+ )
+ });
return (
-
-
-
-
- } />
-
- {line}
- {dataCollections?.map((s) => (
-
- ))}
-
-
- );
+
+ )
}
Chart.defaultProps = {
diff --git a/web/pages/components/log-table.tsx b/web/pages/components/log-table.tsx
index b63e1236a..282e0f716 100644
--- a/web/pages/components/log-table.tsx
+++ b/web/pages/components/log-table.tsx
@@ -1,5 +1,4 @@
import React from "react";
-import { timeFormat } from "d3-time-format";
import { Table, Tag, Typography } from "antd";
import Linkify from "react-linkify";
import { SortOrder } from "antd/lib/table/interface";
@@ -59,8 +58,10 @@ export default function LogTable({ logs, pageSize }: Props) {
title: "Timestamp",
dataIndex: "time",
key: "time",
- render: (timestamp) =>
- timeFormat("%H:%M:%S %m/%d/%Y")(new Date(timestamp)),
+ render: (timestamp) => {
+ const dateObject = new Date(timestamp);
+ return dateObject.getHours() + ":" + dateObject.getMinutes() + ":" + dateObject.getSeconds() + ' ' + dateObject.getFullYear() + "-" + (dateObject.getMonth() + 1) + "-" + dateObject.getDate();
+ },
sorter: (a, b) => new Date(a.time).getTime() - new Date(b.time).getTime(),
sortDirections: ["descend", "ascend"] as SortOrder[],
defaultSortOrder: "descend" as SortOrder,
diff --git a/web/pages/components/main-layout.tsx b/web/pages/components/main-layout.tsx
index b6ddebd8c..8043a01d0 100644
--- a/web/pages/components/main-layout.tsx
+++ b/web/pages/components/main-layout.tsx
@@ -60,7 +60,6 @@ export default function MainLayout(props) {
useEffect(() => {
if (!performedUpgradeCheck && !context.disableUpgradeChecks) {
checkForUpgrade();
- console.log('checking')
performedUpgradeCheck = true
}
});
diff --git a/web/pages/hardware-info.tsx b/web/pages/hardware-info.tsx
index 87ed4dc88..2185f2ff9 100644
--- a/web/pages/hardware-info.tsx
+++ b/web/pages/hardware-info.tsx
@@ -73,7 +73,6 @@ const series = [
return (
diff --git a/web/pages/viewer-info.tsx b/web/pages/viewer-info.tsx
index 1408ea43c..e3c0e577d 100644
--- a/web/pages/viewer-info.tsx
+++ b/web/pages/viewer-info.tsx
@@ -15,12 +15,12 @@ import {
fetchData,
} from "../utils/apis";
-const FETCH_INTERVAL = 5 * 60 * 1000; // 5 mins
+const FETCH_INTERVAL = 60 * 1000; // 1 min
export default function ViewersOverTime() {
const context = useContext(ServerStatusContext);
const {
- broadcastActive,
+ online,
viewerCount,
overallPeakViewerCount,
sessionPeakViewerCount,
@@ -49,7 +49,7 @@ export default function ViewersOverTime() {
let getStatusIntervalId = null;
getInfo();
- if (broadcastActive) {
+ if (online) {
getStatusIntervalId = setInterval(getInfo, FETCH_INTERVAL);
// returned function will be called on component unmount
return () => {
@@ -58,7 +58,7 @@ export default function ViewersOverTime() {
}
return () => [];
- }, []);
+ }, [online]);
// todo - check to see if broadcast active has changed. if so, start polling.
@@ -103,7 +103,6 @@ export default function ViewersOverTime() {
return (
-
+