web/admin: prefer using datefns over moment.js (#13143)
* web: Add InvalidationFlow to Radius Provider dialogues
## What
- Bugfix: adds the InvalidationFlow to the Radius Provider dialogues
- Repairs: `{"invalidation_flow":["This field is required."]}` message, which was *not* propagated
to the Notification.
- Nitpick: Pretties `?foo=${true}` expressions: `s/\?([^=]+)=\$\{true\}/\1/`
## Note
Yes, I know I'm going to have to do more magic when we harmonize the forms, and no, I didn't add the
Property Mappings to the wizard, and yes, I know I'm going to have pain with the *new* version of
the wizard. But this is a serious bug; you can't make Radius servers with *either* of the current
dialogues at the moment.
* This (temporary) change is needed to prevent the unit tests from failing.
\# What
\# Why
\# How
\# Designs
\# Test Steps
\# Other Notes
* Revert "This (temporary) change is needed to prevent the unit tests from failing."
This reverts commit dddde09be5
.
* ## What
Replaces `moment.js` with `date-fns` as a runtime dependency for Chart.js and other features
requiring date manipulation libraries. `date-fns` (and `chartjs-adapter-date-fns`) provides a 1:1
compatible API with Moment.js, is significantly faster and smaller. Moment.js adds
74KB to our bundle; in constrast, using DateFns adds only 18KB.
## Why
[Because ChartJS recommends it](https://github.com/chartjs/chartjs-adapter-moment#overview), and
because DateFns are easier to import and use.
It's worth noting that chartjs-adapter-date-fns was last updated three years ago, but
chartjs-adapter-moment was last updated *four* years ago. Both can be considered stable at this
point, so this cannot be considered an untested swap.
## Testing
1. In the *built* version of the product, assert that in the `./dist/admin/*` folder, no instance of
`node_modules/moment` is included. `grep "node_modules/moment" ./dist/admin/*` is sufficient for
this. On the other hand, searching for `date-fns` will get you entries in the maps:
```
// ... many lines of date-fns inclusion; this is near the end, to show the chartjs adapter is
// also included.
admin/chunk-TRZMFVHL.js:// node_modules/date-fns/startOfSecond.js
admin/chunk-TRZMFVHL.js:// node_modules/date-fns/parseISO.js
admin/chunk-TRZMFVHL.js:// node_modules/chartjs-adapter-date-fns/dist/chartjs-adapter-date-fns.esm.js
admin/chunk-TRZMFVHL.js: _id: "date-fns",
admin/chunk-TRZMFVHL.js:chartjs-adapter-date-fns/dist/chartjs-adapter-date-fns.esm.js:
```
2. Visually inspect and assert that the graphs in Dashboard➜Overview, User➜Statistics, and
Directory➜Users➜A User are functioning unchanged.
## Documentation Changes Required
None. No developer or user documentation changes are required.
---------
Co-authored-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
25
web/package-lock.json
generated
25
web/package-lock.json
generated
@ -37,11 +37,12 @@
|
||||
"@webcomponents/webcomponentsjs": "^2.8.0",
|
||||
"base64-js": "^1.5.1",
|
||||
"chart.js": "^4.4.4",
|
||||
"chartjs-adapter-moment": "^1.0.1",
|
||||
"chartjs-adapter-date-fns": "^3.0.0",
|
||||
"codemirror": "^6.0.1",
|
||||
"construct-style-sheets-polyfill": "^3.1.0",
|
||||
"core-js": "^3.38.1",
|
||||
"country-flag-icons": "^1.5.13",
|
||||
"date-fns": "^4.1.0",
|
||||
"dompurify": "^3.2.4",
|
||||
"fuse.js": "^7.0.0",
|
||||
"guacamole-common-js": "^1.5.0",
|
||||
@ -9532,13 +9533,13 @@
|
||||
"pnpm": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/chartjs-adapter-moment": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/chartjs-adapter-moment/-/chartjs-adapter-moment-1.0.1.tgz",
|
||||
"integrity": "sha512-Uz+nTX/GxocuqXpGylxK19YG4R3OSVf8326D+HwSTsNw1LgzyIGRo+Qujwro1wy6X+soNSnfj5t2vZ+r6EaDmA==",
|
||||
"node_modules/chartjs-adapter-date-fns": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/chartjs-adapter-date-fns/-/chartjs-adapter-date-fns-3.0.0.tgz",
|
||||
"integrity": "sha512-Rs3iEB3Q5pJ973J93OBTpnP7qoGwvq3nUnoMdtxO+9aoJof7UFcRbWcIDteXuYd1fgAvct/32T9qaLyLuZVwCg==",
|
||||
"peerDependencies": {
|
||||
"chart.js": ">=3.0.0",
|
||||
"moment": "^2.10.2"
|
||||
"chart.js": ">=2.8.0",
|
||||
"date-fns": ">=2.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/cheerio": {
|
||||
@ -10770,6 +10771,15 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/date-fns": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/date-fns/-/date-fns-4.1.0.tgz",
|
||||
"integrity": "sha512-Ukq0owbQXxa/U3EGtsdVBkR1w7KOQ5gIBqdH2hkvknzZPYvBxb/aa6E8L7tmjFtkwZBu3UXBbjIgPo/Ez4xaNg==",
|
||||
"funding": {
|
||||
"type": "github",
|
||||
"url": "https://github.com/sponsors/kossnocorp"
|
||||
}
|
||||
},
|
||||
"node_modules/dayjs": {
|
||||
"version": "1.11.13",
|
||||
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.13.tgz",
|
||||
@ -16580,6 +16590,7 @@
|
||||
"version": "2.30.1",
|
||||
"resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz",
|
||||
"integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": "*"
|
||||
}
|
||||
|
@ -25,11 +25,12 @@
|
||||
"@webcomponents/webcomponentsjs": "^2.8.0",
|
||||
"base64-js": "^1.5.1",
|
||||
"chart.js": "^4.4.4",
|
||||
"chartjs-adapter-moment": "^1.0.1",
|
||||
"chartjs-adapter-date-fns": "^3.0.0",
|
||||
"codemirror": "^6.0.1",
|
||||
"construct-style-sheets-polyfill": "^3.1.0",
|
||||
"core-js": "^3.38.1",
|
||||
"country-flag-icons": "^1.5.13",
|
||||
"date-fns": "^4.1.0",
|
||||
"dompurify": "^3.2.4",
|
||||
"fuse.js": "^7.0.0",
|
||||
"guacamole-common-js": "^1.5.0",
|
||||
|
@ -17,7 +17,7 @@ import { Legend, Tooltip } from "chart.js";
|
||||
import { BarController, DoughnutController, LineController } from "chart.js";
|
||||
import { ArcElement, BarElement } from "chart.js";
|
||||
import { LinearScale, TimeScale } from "chart.js";
|
||||
import "chartjs-adapter-moment";
|
||||
import "chartjs-adapter-date-fns";
|
||||
|
||||
import { msg } from "@lit/localize";
|
||||
import { CSSResult, TemplateResult, css, html } from "lit";
|
||||
|
Reference in New Issue
Block a user