mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2024-12-22 17:10:26 +03:00
Code Issues Projects Releases Packages Wiki Activity

Update bootstrap and chart.js

Browse source
This commit is contained in:
Alejandro Celaya 2023-08-08 13:01:27 +02:00
parent f420c7f767
commit 221eb7605f
3 changed files with 37 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

46
package-lock.json generated
View file

@ -15,10 +15,10 @@
"@fortawesome/react-fontawesome": "^0.2.0",
"@json2csv/plainjs": "^6.1.2",
"@reduxjs/toolkit": "^1.9.5",
"bootstrap": "^5.2.3",
"bootstrap": "^5.3.1",
"bottlejs": "^2.0.1",
"bowser": "^2.11.0",
"chart.js": "^4.1.1",
"chart.js": "^4.3.3",
"classnames": "^2.3.2",
"compare-versions": "^5.0.3",
"csvtojson": "^2.0.10",
@ -29,7 +29,7 @@
"qs": "^6.11.0",
"ramda": "^0.27.2",
"react": "^18.2.0",
"react-chartjs-2": "^5.1.0",
"react-chartjs-2": "^5.2.0",
"react-colorful": "^5.6.1",
"react-copy-to-clipboard": "^5.1.0",
"react-datepicker": "^4.8.0",
@ -2824,8 +2824,9 @@
}
},
"node_modules/@popperjs/core": {
"version": "2.11.6",
"license": "MIT",
"version": "2.11.8",
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
"integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==",
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/popperjs"
@ -4457,7 +4458,9 @@
"license": "MIT"
},
"node_modules/bootstrap": {
"version": "5.2.3",
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.1.tgz",
"integrity": "sha512-jzwza3Yagduci2x0rr9MeFSORjcHpt0lRZukZPZQJT1Dth5qzV7XcgGqYzi39KGAVYR8QEDVoO0ubFKOxzMG+g==",
"funding": [
{
"type": "github",
@ -4468,9 +4471,8 @@
"url": "https://opencollective.com/bootstrap"
}
],
"license": "MIT",
"peerDependencies": {
"@popperjs/core": "^2.11.6"
"@popperjs/core": "^2.11.8"
}
},
"node_modules/bottlejs": {
@ -4671,13 +4673,14 @@
}
},
"node_modules/chart.js": {
"version": "4.1.1",
"license": "MIT",
"version": "4.3.3",
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.3.3.tgz",
"integrity": "sha512-aTk7pBw+x6sQYhon/NR3ikfUJuym/LdgpTlgZRe2PaEhjUMKBKyNaFCMVRAyTEWYFNO7qRu7iQVqOw/OqzxZxQ==",
"dependencies": {
"@kurkle/color": "^0.3.0"
},
"engines": {
"pnpm": "^7.0.0"
"pnpm": ">=7"
}
},
"node_modules/check-error": {
@ -8701,8 +8704,9 @@
}
},
"node_modules/react-chartjs-2": {
"version": "5.1.0",
"license": "MIT",
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-5.2.0.tgz",
"integrity": "sha512-98iN5aguJyVSxp5U3CblRLH67J8gkfyGNbiK3c+l1QI/G4irHMPQw44aEPmjVag+YKTyQ260NcF82GTQ3bdscA==",
"peerDependencies": {
"chart.js": "^4.1.1",
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
@ -13153,7 +13157,9 @@
}
},
"@popperjs/core": {
"version": "2.11.6"
"version": "2.11.8",
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
"integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A=="
},
"@react-leaflet/core": {
"version": "2.1.0",
@ -14265,7 +14271,9 @@
"version": "3.7.2"
},
"bootstrap": {
"version": "5.2.3",
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.1.tgz",
"integrity": "sha512-jzwza3Yagduci2x0rr9MeFSORjcHpt0lRZukZPZQJT1Dth5qzV7XcgGqYzi39KGAVYR8QEDVoO0ubFKOxzMG+g==",
"requires": {}
},
"bottlejs": {
@ -14382,7 +14390,9 @@
"dev": true
},
"chart.js": {
"version": "4.1.1",
"version": "4.3.3",
"resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.3.3.tgz",
"integrity": "sha512-aTk7pBw+x6sQYhon/NR3ikfUJuym/LdgpTlgZRe2PaEhjUMKBKyNaFCMVRAyTEWYFNO7qRu7iQVqOw/OqzxZxQ==",
"requires": {
"@kurkle/color": "^0.3.0"
}
@ -17072,7 +17082,9 @@
}
},
"react-chartjs-2": {
"version": "5.1.0",
"version": "5.2.0",
"resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-5.2.0.tgz",
"integrity": "sha512-98iN5aguJyVSxp5U3CblRLH67J8gkfyGNbiK3c+l1QI/G4irHMPQw44aEPmjVag+YKTyQ260NcF82GTQ3bdscA==",
"requires": {}
},
"react-colorful": {

6
package.json
View file

@ -31,10 +31,10 @@
"@fortawesome/react-fontawesome": "^0.2.0",
"@json2csv/plainjs": "^6.1.2",
"@reduxjs/toolkit": "^1.9.5",
"bootstrap": "^5.2.3",
"bootstrap": "^5.3.1",
"bottlejs": "^2.0.1",
"bowser": "^2.11.0",
"chart.js": "^4.1.1",
"chart.js": "^4.3.3",
"classnames": "^2.3.2",
"compare-versions": "^5.0.3",
"csvtojson": "^2.0.10",
@ -45,7 +45,7 @@
"qs": "^6.11.0",
"ramda": "^0.27.2",
"react": "^18.2.0",
"react-chartjs-2": "^5.1.0",
"react-chartjs-2": "^5.2.0",
"react-colorful": "^5.6.1",
"react-copy-to-clipboard": "^5.1.0",
"react-datepicker": "^4.8.0",

7
shlink-web-component/src/visits/charts/DoughnutChart.tsx
View file

@ -38,7 +38,8 @@ const generateChartData = (labels: string[], data: number[]): ChartData => ({
});
export const DoughnutChart: FC<DoughnutChartProps> = memo(({ stats }) => {
const [chartRef, setChartRef] = useState<Chart | undefined>(); // Cannot use useRef here
// Cannot use useRef here, as we need to re-render as soon as the ref is set
const [chartRef, setChartRef] = useState<Chart>();
const labels = keys(stats);
const data = values(stats);
@ -61,7 +62,9 @@ export const DoughnutChart: FC<DoughnutChartProps> = memo(({ stats }) => {
data={chartData as any}
options={options as any}
ref={(element) => {
setChartRef(element ?? undefined);
if (element) {
setChartRef(element as Chart);
}
}}
/>
</div>