- client: 2237 Update graph drawing library

Squashed commit of the following:

commit 980e9c2f37640ee204ce0365f6c3bcc74741cc7c
Merge: cb4cae82b 394fc5a9d
Author: Artem Baskal <a.baskal@adguard.com>
Date:   Mon Nov 16 14:52:26 2020 +0300

    Merge branch 'master' into fix/2237

commit cb4cae82b5b605894d123d6442ea23b24cc90c12
Author: ArtemBaskal <asbaskal@miem.hse.ru>
Date:   Thu Nov 12 12:07:49 2020 +0300

    minor

commit 5c07dac48067b4ed201aeb59a44e8592ed2b0b67
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Nov 11 19:47:38 2020 +0300

    minor

commit 53f60762e520427a080bdfcd94b08b9ed3a63ca4
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Nov 11 19:06:06 2020 +0300

    Adapt mobile version

commit 7659ac733ce4606f6fadf30e0eaddbeefd6095d6
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Wed Nov 11 18:31:53 2020 +0300

    Fix empty graph offset, return background area below graph

commit 45499adb20a90024dba4b0b4e44ad4f01a1782d5
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Tue Nov 10 17:46:47 2020 +0300

    - client: 2237 Update graph drawing library
This commit is contained in:
Artem Baskal 2020-11-16 15:22:30 +03:00
parent 394fc5a9d8
commit a19523b258
10 changed files with 306 additions and 174 deletions

337
client/package-lock.json generated vendored
View File

@ -2014,72 +2014,168 @@
} }
} }
}, },
"@nivo/axes": { "@nivo/annotations": {
"version": "0.49.1", "version": "0.64.0",
"resolved": "https://registry.npmjs.org/@nivo/axes/-/axes-0.49.1.tgz", "resolved": "https://registry.npmjs.org/@nivo/annotations/-/annotations-0.64.0.tgz",
"integrity": "sha512-2ZqpKtnZ9HE30H+r565VCrypKRQzAoMbAg1hsht88dlNQRtghBSxbAS0Y4IUW/wgN/AzvOIBJHvxH7bgaB8Oow==", "integrity": "sha512-b9VAVuAn2HztOZckU2GcBwptjCobYV5VgX/jwZTSFeZFLtjZza+QinNL2AbQ2cnmeU3nVCw1dTbJMMZ9fTCCNQ==",
"requires": { "requires": {
"@nivo/core": "0.49.0", "@nivo/colors": "0.64.0",
"d3-format": "^1.3.2", "lodash": "^4.17.11",
"react-spring": "^8.0.27"
}
},
"@nivo/axes": {
"version": "0.64.0",
"resolved": "https://registry.npmjs.org/@nivo/axes/-/axes-0.64.0.tgz",
"integrity": "sha512-Pm+Y3C67OuBb3JqHpyFKWAoPAnNojb1s5/LFQYVYN1QpKyjeqilGAoLCjHK6ckgfzreiGf7NG+oBgpH8Ncz2fQ==",
"requires": {
"@nivo/scales": "0.64.0",
"d3-format": "^1.4.4",
"d3-time": "^1.0.11",
"d3-time-format": "^2.1.3", "d3-time-format": "^2.1.3",
"lodash": "^4.17.4", "react-spring": "^8.0.27"
"react-motion": "^0.5.2", },
"recompose": "^0.26.0" "dependencies": {
"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-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"
}
}
}
},
"@nivo/colors": {
"version": "0.64.0",
"resolved": "https://registry.npmjs.org/@nivo/colors/-/colors-0.64.0.tgz",
"integrity": "sha512-3CKIkSjKgwSgBsiJoTlZpFUUpaGTl60pF6rFsIiFT30os9jMxP/J4ikQGQ/vMLPTXskZYoxByaMHGKJy5wypqg==",
"requires": {
"d3-color": "^1.2.3",
"d3-scale": "^3.0.0",
"d3-scale-chromatic": "^1.3.3",
"lodash.get": "^4.4.2",
"lodash.isplainobject": "^4.0.6",
"react-motion": "^0.5.2"
} }
}, },
"@nivo/core": { "@nivo/core": {
"version": "0.49.0", "version": "0.64.0",
"resolved": "https://registry.npmjs.org/@nivo/core/-/core-0.49.0.tgz", "resolved": "https://registry.npmjs.org/@nivo/core/-/core-0.64.0.tgz",
"integrity": "sha512-TCPMUO2aJ7fI+ZB6t3d3EBQtNxJnTzaxLJsrVyn/3AQIjUwccAeo2aIy81wLBGWGtlGNUDNdAbnFzXiJosH0yg==", "integrity": "sha512-tupETbvxgv4B9y3pcXy/lErMwY2aZht+FKSyah1dPFd88LnMD/DOL+to6ociBHmpLQNUMA7wid6R7BlXRY/bmg==",
"requires": { "requires": {
"d3-color": "^1.0.3", "d3-color": "^1.2.3",
"d3-format": "^1.3.2", "d3-format": "^1.4.4",
"d3-hierarchy": "^1.1.8", "d3-hierarchy": "^1.1.8",
"d3-interpolate": "^1.3.2", "d3-interpolate": "^2.0.1",
"d3-scale": "^2.1.2", "d3-scale": "^3.0.0",
"d3-scale-chromatic": "^1.3.3", "d3-scale-chromatic": "^1.3.3",
"d3-shape": "^1.2.2", "d3-shape": "^1.3.5",
"d3-time-format": "^2.1.3", "d3-time-format": "^2.1.3",
"lodash": "^4.17.4", "lodash": "^4.17.11",
"react-measure": "^2.0.2", "react-spring": "^8.0.27",
"react-motion": "^0.5.2", "recompose": "^0.30.0",
"recompose": "^0.26.0" "resize-observer-polyfill": "^1.5.1"
},
"dependencies": {
"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-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"
}
}
} }
}, },
"@nivo/legends": { "@nivo/legends": {
"version": "0.49.0", "version": "0.64.0",
"resolved": "https://registry.npmjs.org/@nivo/legends/-/legends-0.49.0.tgz", "resolved": "https://registry.npmjs.org/@nivo/legends/-/legends-0.64.0.tgz",
"integrity": "sha512-8KbUFYozqwD+/rj4in0mnF9b9CuyNFjVgXqm2KW3ODVlWIgYgjTVlEhlg9VZIArFPlIyyAjEYC88YSRcALHugg==", "integrity": "sha512-L7Mp/of/jY4qE7ef6PXJ8/e3aASBTfsf5BTOh3imSXZT6I4hXa5ppmGAgZ0gOSpcPXuMEjBc0aSIEJoeoytQ/g==",
"requires": { "requires": {
"lodash": "^4.17.4", "@nivo/core": "0.64.0",
"recompose": "^0.26.0" "lodash": "^4.17.11",
"recompose": "^0.30.0"
} }
}, },
"@nivo/line": { "@nivo/line": {
"version": "0.49.1", "version": "0.64.0",
"resolved": "https://registry.npmjs.org/@nivo/line/-/line-0.49.1.tgz", "resolved": "https://registry.npmjs.org/@nivo/line/-/line-0.64.0.tgz",
"integrity": "sha512-wKkOmpnwK2psmZbJReDq+Eh/WV9r1JA8V4Vl4eIRuf971CW0KUT9nCAoc/FcKio0qsiq5wyFt3J5LuAhfzlV/w==", "integrity": "sha512-WkQU28ZL9Mxq42AdmybWe+2qFh/TiUXu+7e6nj41e/8DO95Guxg1XQ+i5zQKuw/UZlqXZs6WOsMW8EMNE4GzXw==",
"requires": { "requires": {
"@nivo/axes": "0.49.1", "@nivo/annotations": "0.64.0",
"@nivo/core": "0.49.0", "@nivo/axes": "0.64.0",
"@nivo/legends": "0.49.0", "@nivo/colors": "0.64.0",
"@nivo/scales": "0.49.0", "@nivo/legends": "0.64.0",
"d3-format": "^1.3.2", "@nivo/scales": "0.64.0",
"d3-scale": "^2.1.2", "@nivo/tooltip": "0.64.0",
"d3-shape": "^1.2.2", "@nivo/voronoi": "0.64.0",
"lodash": "^4.17.4", "d3-shape": "^1.3.5",
"react-motion": "^0.5.2", "react-spring": "^8.0.27"
"recompose": "^0.26.0"
} }
}, },
"@nivo/scales": { "@nivo/scales": {
"version": "0.49.0", "version": "0.64.0",
"resolved": "https://registry.npmjs.org/@nivo/scales/-/scales-0.49.0.tgz", "resolved": "https://registry.npmjs.org/@nivo/scales/-/scales-0.64.0.tgz",
"integrity": "sha512-+5Leu4zX6mDSAunf4ZJHeqVlT+ZsqiKXLB6hT/u7r3GjxZP9A+n3rHePhIzikBiBRMlLjyiBlylLzhKBAYbGWQ==", "integrity": "sha512-Jbr1rlfe/gLCippndPaCM7doJzzx1K9oXPxS4JiyvrIUkQoMWiozymZQdEp8kgigI6uwWu5xvPwCOFXalCIhKg==",
"requires": { "requires": {
"d3-scale": "^2.1.2", "d3-scale": "^3.0.0",
"d3-time-format": "^2.1.3", "d3-time-format": "^2.1.3",
"lodash": "^4.17.4" "lodash": "^4.17.11"
},
"dependencies": {
"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"
}
}
}
},
"@nivo/tooltip": {
"version": "0.64.0",
"resolved": "https://registry.npmjs.org/@nivo/tooltip/-/tooltip-0.64.0.tgz",
"integrity": "sha512-iGsuCi42uw/8F7OVvPyWdQgxJXVOPTEdtl2WK2FlSJIH7bfnEsZ+R/lTdElY2JAvGHuNW6hQwpNUZdC/2rOatg==",
"requires": {
"react-spring": "^8.0.27"
}
},
"@nivo/voronoi": {
"version": "0.64.0",
"resolved": "https://registry.npmjs.org/@nivo/voronoi/-/voronoi-0.64.0.tgz",
"integrity": "sha512-YdNRzD2rFc1NcAZe9D8gxos+IT2CRPOV/7fUfBCG9SoNw1TtSwSKtEs4xsxmUFmLT1FadWcyKeKuhgJUQnof/A==",
"requires": {
"@nivo/core": "0.64.0",
"d3-delaunay": "^5.1.1",
"d3-scale": "^3.0.0",
"recompose": "^0.30.0"
} }
}, },
"@nodelib/fs.scandir": { "@nodelib/fs.scandir": {
@ -4681,24 +4777,27 @@
"dev": true "dev": true
}, },
"d3-array": { "d3-array": {
"version": "1.2.4", "version": "2.8.0",
"resolved": "https://registry.npmjs.org/d3-array/-/d3-array-1.2.4.tgz", "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.8.0.tgz",
"integrity": "sha512-KHW6M86R+FUPYGb3R5XiYjXPq7VzwxZ22buHhAEVG5ztoEcZZMLov530mmccaqA1GghZArjQV46fuc8kUqhhHw==" "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": { "d3-color": {
"version": "1.4.1", "version": "1.4.1",
"resolved": "https://registry.npmjs.org/d3-color/-/d3-color-1.4.1.tgz", "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-1.4.1.tgz",
"integrity": "sha512-p2sTHSLCJI2QKunbGb7ocOh7DgTAn8IrLx21QRc/BSnodXM4sv6aLQlnfpvehFMLZEfBc6g9pH9SWQccFYfJ9Q==" "integrity": "sha512-p2sTHSLCJI2QKunbGb7ocOh7DgTAn8IrLx21QRc/BSnodXM4sv6aLQlnfpvehFMLZEfBc6g9pH9SWQccFYfJ9Q=="
}, },
"d3-delaunay": {
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/d3-delaunay/-/d3-delaunay-5.3.0.tgz",
"integrity": "sha512-amALSrOllWVLaHTnDLHwMIiz0d1bBu9gZXd1FiLfXf8sHcX9jrcj81TVZOqD4UX7MgBZZ07c8GxzEgBpJqc74w==",
"requires": {
"delaunator": "4"
}
},
"d3-format": { "d3-format": {
"version": "1.4.4", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/d3-format/-/d3-format-1.4.4.tgz", "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-2.0.0.tgz",
"integrity": "sha512-TWks25e7t8/cqctxCmxpUuzZN11QxIA7YrMbram94zMQ0PXjE4LVIMe/f6a4+xxL8HQ3OsAFULOINQi1pE62Aw==" "integrity": "sha512-Ab3S6XuE/Q+flY96HXT0jOXcM4EAClYFnRGY5zsjRGNy6qCYrQsMffs7cV5Q9xejb35zxW5hf/guKw34kvIKsA=="
}, },
"d3-hierarchy": { "d3-hierarchy": {
"version": "1.1.9", "version": "1.1.9",
@ -4706,11 +4805,11 @@
"integrity": "sha512-j8tPxlqh1srJHAtxfvOUwKNYJkQuBFdM1+JAUfq6xqH5eAqf93L7oG1NVqDa4CpFZNvnNKtCYEUC8KY9yEn9lQ==" "integrity": "sha512-j8tPxlqh1srJHAtxfvOUwKNYJkQuBFdM1+JAUfq6xqH5eAqf93L7oG1NVqDa4CpFZNvnNKtCYEUC8KY9yEn9lQ=="
}, },
"d3-interpolate": { "d3-interpolate": {
"version": "1.4.0", "version": "2.0.1",
"resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-1.4.0.tgz", "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-2.0.1.tgz",
"integrity": "sha512-V9znK0zc3jOPV4VD2zZn0sDhZU3WAE2bmlxdIwwQPPzPjvyLkd8B3JUVdS1IDUFDkWZ72c9qnv1GK2ZagTZ8EA==", "integrity": "sha512-c5UhwwTs/yybcmTpAVqwSFl6vrQ8JZJoT5F7xNFK9pymv5C0Ymcc9/LIJHtYIggg/yS9YHw8i8O8tgb9pupjeQ==",
"requires": { "requires": {
"d3-color": "1" "d3-color": "1 - 2"
} }
}, },
"d3-path": { "d3-path": {
@ -4719,16 +4818,15 @@
"integrity": "sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg==" "integrity": "sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg=="
}, },
"d3-scale": { "d3-scale": {
"version": "2.2.2", "version": "3.2.3",
"resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-2.2.2.tgz", "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-3.2.3.tgz",
"integrity": "sha512-LbeEvGgIb8UMcAa0EATLNX0lelKWGYDQiPdHj+gLblGVhGLyNbaCn3EvrJf0A3Y/uOOU5aD6MTh5ZFCdEwGiCw==", "integrity": "sha512-8E37oWEmEzj57bHcnjPVOBS3n4jqakOeuv1EDdQSiSrYnMCBdMd3nc4HtKk7uia8DUHcY/CGuJ42xxgtEYrX0g==",
"requires": { "requires": {
"d3-array": "^1.2.0", "d3-array": "^2.3.0",
"d3-collection": "1", "d3-format": "1 - 2",
"d3-format": "1", "d3-interpolate": "1.2.0 - 2",
"d3-interpolate": "1", "d3-time": "1 - 2",
"d3-time": "1", "d3-time-format": "2 - 3"
"d3-time-format": "2"
} }
}, },
"d3-scale-chromatic": { "d3-scale-chromatic": {
@ -4738,6 +4836,16 @@
"requires": { "requires": {
"d3-color": "1", "d3-color": "1",
"d3-interpolate": "1" "d3-interpolate": "1"
},
"dependencies": {
"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-shape": { "d3-shape": {
@ -4749,16 +4857,16 @@
} }
}, },
"d3-time": { "d3-time": {
"version": "1.1.0", "version": "2.0.0",
"resolved": "https://registry.npmjs.org/d3-time/-/d3-time-1.1.0.tgz", "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-2.0.0.tgz",
"integrity": "sha512-Xh0isrZ5rPYYdqhAVk8VLnMEidhz5aP7htAADH6MfzgmmicPkTo8LhkLxci61/lCB7n7UmE3bN0leRt+qvkLxA==" "integrity": "sha512-2mvhstTFcMvwStWd9Tj3e6CEqtOivtD8AUiHT8ido/xmzrI9ijrUUihZ6nHuf/vsScRBonagOdj0Vv+SEL5G3Q=="
}, },
"d3-time-format": { "d3-time-format": {
"version": "2.2.3", "version": "3.0.0",
"resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-2.2.3.tgz", "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-3.0.0.tgz",
"integrity": "sha512-RAHNnD8+XvC4Zc4d2A56Uw0yJoM7bsvOlJR33bclxq399Rak/b9bhvu/InjxdWhPtkgU53JJcleJTGkNRnN6IA==", "integrity": "sha512-UXJh6EKsHBTjopVqZBhFysQcoXSv/5yLONZvkQ5Kk3qbwiUYkdX17Xa1PT6U1ZWXGGfB1ey5L8dKMlFq2DO0Ag==",
"requires": { "requires": {
"d3-time": "1" "d3-time": "1 - 2"
} }
}, },
"damerau-levenshtein": { "damerau-levenshtein": {
@ -4963,6 +5071,11 @@
} }
} }
}, },
"delaunator": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/delaunator/-/delaunator-4.0.1.tgz",
"integrity": "sha512-WNPWi1IRKZfCt/qIDMfERkDp93+iZEmOxN2yy4Jg+Xhv8SLk2UTqqbe1sfiipn0and9QrE914/ihdx82Y/Giag=="
},
"delayed-stream": { "delayed-stream": {
"version": "1.0.0", "version": "1.0.0",
"resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
@ -5253,11 +5366,21 @@
"dev": true "dev": true
}, },
"encoding": { "encoding": {
"version": "0.1.12", "version": "0.1.13",
"resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.12.tgz", "resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.13.tgz",
"integrity": "sha1-U4tm8+5izRq1HsMjgp0flIDHS+s=", "integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==",
"requires": { "requires": {
"iconv-lite": "~0.4.13" "iconv-lite": "^0.6.2"
},
"dependencies": {
"iconv-lite": {
"version": "0.6.2",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.2.tgz",
"integrity": "sha512-2y91h5OpQlolefMPmUlivelittSWy0rP+oYVpn6A7GwVHNE8AWzoYOBNmlwks3LobaJxgHCYZAnyNo2GgpNRNQ==",
"requires": {
"safer-buffer": ">= 2.1.2 < 3.0.0"
}
}
} }
}, },
"end-of-stream": { "end-of-stream": {
@ -6766,11 +6889,6 @@
"integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==", "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
"dev": true "dev": true
}, },
"get-node-dimensions": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/get-node-dimensions/-/get-node-dimensions-1.2.1.tgz",
"integrity": "sha512-2MSPMu7S1iOTL+BOa6K1S62hB2zUAYNF/lV0gSVlOaacd087lc6nR1H1r0e3B1CerTo+RceOmi1iJW+vp21xcQ=="
},
"get-package-type": { "get-package-type": {
"version": "0.1.0", "version": "0.1.0",
"resolved": "https://registry.npmjs.org/get-package-type/-/get-package-type-0.1.0.tgz", "resolved": "https://registry.npmjs.org/get-package-type/-/get-package-type-0.1.0.tgz",
@ -7430,6 +7548,7 @@
"version": "0.4.24", "version": "0.4.24",
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
"integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==", "integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
"dev": true,
"requires": { "requires": {
"safer-buffer": ">= 2.1.2 < 3" "safer-buffer": ">= 2.1.2 < 3"
} }
@ -10194,6 +10313,16 @@
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.15.tgz", "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.15.tgz",
"integrity": "sha512-rlrc3yU3+JNOpZ9zj5pQtxnx2THmvRykwL4Xlxoa8I9lHBlVbbyPhgyPMioxVZ4NqyxaVVtaJnzsyOidQIhyyQ==" "integrity": "sha512-rlrc3yU3+JNOpZ9zj5pQtxnx2THmvRykwL4Xlxoa8I9lHBlVbbyPhgyPMioxVZ4NqyxaVVtaJnzsyOidQIhyyQ=="
}, },
"lodash.get": {
"version": "4.4.2",
"resolved": "https://registry.npmjs.org/lodash.get/-/lodash.get-4.4.2.tgz",
"integrity": "sha1-LRd/ZS+jHpObRDjVNBSZ36OCXpk="
},
"lodash.isplainobject": {
"version": "4.0.6",
"resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
"integrity": "sha1-fFJqUtibRcRcxpC4gWO+BJf1UMs="
},
"lodash.sortby": { "lodash.sortby": {
"version": "4.7.0", "version": "4.7.0",
"resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz", "resolved": "https://registry.npmjs.org/lodash.sortby/-/lodash.sortby-4.7.0.tgz",
@ -12403,17 +12532,6 @@
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
}, },
"react-measure": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/react-measure/-/react-measure-2.3.0.tgz",
"integrity": "sha512-dwAvmiOeblj5Dvpnk8Jm7Q8B4THF/f1l1HtKVi0XDecsG6LXwGvzV5R1H32kq3TW6RW64OAf5aoQxpIgLa4z8A==",
"requires": {
"@babel/runtime": "^7.2.0",
"get-node-dimensions": "^1.2.1",
"prop-types": "^15.6.2",
"resize-observer-polyfill": "^1.5.0"
}
},
"react-modal": { "react-modal": {
"version": "3.11.2", "version": "3.11.2",
"resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.11.2.tgz", "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.11.2.tgz",
@ -12576,6 +12694,15 @@
} }
} }
}, },
"react-spring": {
"version": "8.0.27",
"resolved": "https://registry.npmjs.org/react-spring/-/react-spring-8.0.27.tgz",
"integrity": "sha512-nDpWBe3ZVezukNRandTeLSPcwwTMjNVu1IDq9qA/AMiUqHuRN4BeSWvKr3eIxxg1vtiYiOLy4FqdfCP5IoP77g==",
"requires": {
"@babel/runtime": "^7.3.1",
"prop-types": "^15.5.8"
}
},
"react-table": { "react-table": {
"version": "6.11.4", "version": "6.11.4",
"resolved": "https://registry.npmjs.org/react-table/-/react-table-6.11.4.tgz", "resolved": "https://registry.npmjs.org/react-table/-/react-table-6.11.4.tgz",
@ -12663,13 +12790,15 @@
} }
}, },
"recompose": { "recompose": {
"version": "0.26.0", "version": "0.30.0",
"resolved": "https://registry.npmjs.org/recompose/-/recompose-0.26.0.tgz", "resolved": "https://registry.npmjs.org/recompose/-/recompose-0.30.0.tgz",
"integrity": "sha512-KwOu6ztO0mN5vy3+zDcc45lgnaUoaQse/a5yLVqtzTK13czSWnFGmXbQVmnoMgDkI5POd1EwIKSbjU1V7xdZog==", "integrity": "sha512-ZTrzzUDa9AqUIhRk4KmVFihH0rapdCSMFXjhHbNrjAWxBuUD/guYlyysMnuHjlZC/KRiOKRtB4jf96yYSkKE8w==",
"requires": { "requires": {
"@babel/runtime": "^7.0.0",
"change-emitter": "^0.1.2", "change-emitter": "^0.1.2",
"fbjs": "^0.8.1", "fbjs": "^0.8.1",
"hoist-non-react-statics": "^2.3.1", "hoist-non-react-statics": "^2.3.1",
"react-lifecycles-compat": "^3.0.2",
"symbol-observable": "^1.0.4" "symbol-observable": "^1.0.4"
} }
}, },
@ -15067,9 +15196,9 @@
} }
}, },
"ua-parser-js": { "ua-parser-js": {
"version": "0.7.21", "version": "0.7.22",
"resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.21.tgz", "resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.22.tgz",
"integrity": "sha512-+O8/qh/Qj8CgC6eYBVBykMrNtp5Gebn4dlGD/kKXVkJNDwyrAwSIqwz8CDf+tsAIWVycKcku6gIXJ0qwx/ZXaQ==" "integrity": "sha512-YUxzMjJ5T71w6a8WWVcMGM6YWOTX27rCoIQgLXiWaxqXSx9D7DNjiGWn1aJIRSQ5qr0xuhra77bSIh6voR/46Q=="
}, },
"unherit": { "unherit": {
"version": "1.1.3", "version": "1.1.3",
@ -16086,9 +16215,9 @@
} }
}, },
"whatwg-fetch": { "whatwg-fetch": {
"version": "3.0.0", "version": "3.5.0",
"resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz", "resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-3.5.0.tgz",
"integrity": "sha512-9GSJUgz1D4MfyKU7KRqwOjXCXTqWdFNvEr7eUBYchQiVc744mqK/MzXPNR2WsPkmkOa4ywfg8C2n8h+13Bey1Q==" "integrity": "sha512-jXkLtsR42xhXg7akoDKvKWE40eJeI+2KZqcp2h3NsOrRnDvtWX36KcKl30dy+hxECivdk2BVUHVNrPtoMBUx6A=="
}, },
"whatwg-mimetype": { "whatwg-mimetype": {
"version": "2.3.0", "version": "2.3.0",

2
client/package.json vendored
View File

@ -13,7 +13,7 @@
"test:watch": "jest --watch" "test:watch": "jest --watch"
}, },
"dependencies": { "dependencies": {
"@nivo/line": "^0.49.1", "@nivo/line": "^0.64.0",
"axios": "^0.19.2", "axios": "^0.19.2",
"classnames": "^2.2.6", "classnames": "^2.2.6",
"date-fns": "^1.29.0", "date-fns": "^1.29.0",

View File

@ -22,11 +22,6 @@
border-bottom: 6px solid #585965; border-bottom: 6px solid #585965;
} }
.card-chart-bg {
left: -20px;
width: calc(100% + 20px);
}
@media (max-width: 1279.98px) { @media (max-width: 1279.98px) {
.table__action { .table__action {
position: absolute; position: absolute;

View File

@ -12,6 +12,7 @@
--gray-4d: #4D4D4D; --gray-4d: #4D4D4D;
--gray-f3: #F3F3F3; --gray-f3: #F3F3F3;
--gray-8: #888; --gray-8: #888;
--gray-3: #333;
--danger: #DF3812; --danger: #DF3812;
--white80: rgba(255, 255, 255, 0.8); --white80: rgba(255, 255, 255, 0.8);

View File

@ -80,7 +80,6 @@
.card-body-stats { .card-body-stats {
position: relative; position: relative;
flex: 1 1 auto; flex: 1 1 auto;
height: calc(100% - 3rem);
margin: 0; margin: 0;
padding: 1rem 1.5rem; padding: 1rem 1.5rem;
} }

View File

@ -1,9 +1,16 @@
.line__tooltip { .line__tooltip {
padding: 2px 10px 7px; padding: 2px 10px 7px;
line-height: 1.1; line-height: 1.1;
color: #fff; color: var(--white);
background-color: var(--gray-3);
border-radius: 4px;
opacity: 90%;
} }
.line__tooltip-text { .line__tooltip-text {
font-size: 0.7rem; font-size: 0.7rem;
} }
.card-chart-bg path[d^="M0,32"] {
transform: translateY(32px);
}

View File

@ -1,56 +1,75 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types';
import { ResponsiveLine } from '@nivo/line'; import { ResponsiveLine } from '@nivo/line';
import addDays from 'date-fns/add_days';
import addHours from 'date-fns/add_hours';
import subDays from 'date-fns/sub_days';
import subHours from 'date-fns/sub_hours';
import dateFormat from 'date-fns/format';
import round from 'lodash/round';
import { useSelector } from 'react-redux';
import PropTypes from 'prop-types';
import './Line.css'; import './Line.css';
const Line = ({ data, color }) => data const Line = ({
&& <ResponsiveLine data, color = 'black',
}) => {
const interval = useSelector((state) => state.stats.interval);
return <ResponsiveLine
enableArea
animate
enableSlices="x"
curve="linear"
colors={[color]}
data={data} data={data}
margin={{ theme={{
top: data[0].data.every(({ y }) => y === 0) ? 62 : 15, crosshair: {
right: 0, line: {
bottom: 1, stroke: 'black',
left: 20, strokeWidth: 1,
strokeOpacity: 0.35,
},
},
}} }}
minY="auto" xScale={{
stacked={false} type: 'linear',
curve='linear' min: 0,
axisBottom={null} max: 'auto',
axisLeft={null} }}
crosshairType="x"
axisLeft={false}
axisBottom={false}
enableGridX={false} enableGridX={false}
enableGridY={false} enableGridY={false}
enableDots={false} enablePoints={false}
enableArea={true} xFormat={(x) => {
animate={false} if (interval === 1 || interval === 7) {
colorBy={() => (color)} const hoursAgo = subHours(Date.now(), 24 * interval);
tooltip={(slice) => ( return dateFormat(addHours(hoursAgo, x), 'D MMM HH:00');
<div> }
{slice.data.map((d) => (
<div key={d.serie.id} className="line__tooltip"> const daysAgo = subDays(Date.now(), interval - 1);
return dateFormat(addDays(daysAgo, x), 'D MMM YYYY');
}}
yFormat={(y) => round(y, 2)}
sliceTooltip={(slice) => {
const { xFormatted, yFormatted } = slice.slice.points[0].data;
return <div className="line__tooltip">
<span className="line__tooltip-text"> <span className="line__tooltip-text">
<strong>{d.data.y}</strong> <strong>{yFormatted}</strong>
<br /> <br />
<small>{d.data.x}</small> <small>{xFormatted}</small>
</span> </span>
</div> </div>;
))}
</div>
)}
theme={{
tooltip: {
container: {
padding: '0',
background: '#333',
borderRadius: '4px',
},
},
}} }}
/>; />;
};
Line.propTypes = { Line.propTypes = {
data: PropTypes.array.isRequired, data: PropTypes.array.isRequired,
color: PropTypes.string.isRequired, color: PropTypes.string,
width: PropTypes.number,
height: PropTypes.number,
}; };
export default Line; export default Line;

View File

@ -13452,10 +13452,8 @@ a.icon:hover {
.card-chart-bg { .card-chart-bg {
height: 4rem; height: 4rem;
margin-top: -1rem;
position: relative; position: relative;
z-index: 1; z-index: 1;
overflow: hidden;
} }
.card-options { .card-options {

View File

@ -1,10 +1,6 @@
import 'url-polyfill'; import 'url-polyfill';
import dateParse from 'date-fns/parse'; import dateParse from 'date-fns/parse';
import dateFormat from 'date-fns/format'; import dateFormat from 'date-fns/format';
import subHours from 'date-fns/sub_hours';
import addHours from 'date-fns/add_hours';
import addDays from 'date-fns/add_days';
import subDays from 'date-fns/sub_days';
import round from 'lodash/round'; import round from 'lodash/round';
import axios from 'axios'; import axios from 'axios';
import i18n from 'i18next'; import i18n from 'i18next';
@ -105,21 +101,10 @@ export const normalizeLogs = (logs) => logs.map((log) => {
}; };
}); });
export const normalizeHistory = (history, interval) => { export const normalizeHistory = (history) => history.map((item, idx) => ({
if (interval === 1 || interval === 7) { x: idx,
const hoursAgo = subHours(Date.now(), 24 * interval); y: item,
return history.map((item, index) => ({
x: dateFormat(addHours(hoursAgo, index), 'D MMM HH:00'),
y: round(item, 2),
})); }));
}
const daysAgo = subDays(Date.now(), interval - 1);
return history.map((item, index) => ({
x: dateFormat(addDays(daysAgo, index), 'D MMM YYYY'),
y: round(item, 2),
}));
};
export const normalizeTopStats = (stats) => ( export const normalizeTopStats = (stats) => (
stats.map((item) => ({ stats.map((item) => ({

View File

@ -44,7 +44,6 @@ const getDevServerConfig = (proxyUrl = BASE_URL) => {
proxy: { proxy: {
[proxyUrl]: `http://${devServerHost}:${port}`, [proxyUrl]: `http://${devServerHost}:${port}`,
}, },
open: true,
}; };
}; };