diff --git a/plugins/home/package.json b/plugins/home/package.json index 9a692557b1..f69db9d4ee 100644 --- a/plugins/home/package.json +++ b/plugins/home/package.json @@ -50,8 +50,8 @@ "@rjsf/utils": "5.13.0", "@rjsf/validator-ajv8": "5.13.0", "@types/react": "^16.13.1 || ^17.0.0", - "date-fns": "^2.30.0", "lodash": "^4.17.21", + "luxon": "^3.4.3", "react-grid-layout": "^1.3.4", "react-resizable": "^3.0.4", "react-use": "^17.2.4", diff --git a/plugins/home/src/components/VisitList/ItemDetail.tsx b/plugins/home/src/components/VisitList/ItemDetail.tsx index 5bdbdc0db4..3f55557f73 100644 --- a/plugins/home/src/components/VisitList/ItemDetail.tsx +++ b/plugins/home/src/components/VisitList/ItemDetail.tsx @@ -17,7 +17,7 @@ import React from 'react'; import { Typography } from '@material-ui/core'; import { Visit } from '../../api/VisitsApi'; -import { format, formatDistance, formatISO, isToday } from 'date-fns'; +import { DateTime } from 'luxon'; const ItemDetailHits = ({ visit }: { visit: Visit }) => ( @@ -25,20 +25,22 @@ const ItemDetailHits = ({ visit }: { visit: Visit }) => ( ); -const ItemDetailTimeAgo = ({ visit }: { visit: Visit }) => ( - - {isToday(visit.timestamp) - ? format(visit.timestamp, 'HH:mm') - : formatDistance(visit.timestamp, Date.now(), { - addSuffix: true, - })} - -); +const ItemDetailTimeAgo = ({ visit }: { visit: Visit }) => { + const visitDate = DateTime.fromMillis(visit.timestamp); + + return ( + + {visitDate >= DateTime.now().startOf('day') + ? visitDate.toFormat('HH:mm') + : visitDate.toRelative()} + + ); +}; export type ItemDetailType = 'time-ago' | 'hits'; diff --git a/yarn.lock b/yarn.lock index 65ba1a0ec0..c9aa122ad9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7409,8 +7409,8 @@ __metadata: "@testing-library/user-event": ^14.0.0 "@types/react": ^16.13.1 || ^17.0.0 "@types/react-grid-layout": ^1.3.2 - date-fns: ^2.30.0 lodash: ^4.17.21 + luxon: ^3.4.3 msw: ^1.0.0 react-grid-layout: ^1.3.4 react-resizable: ^3.0.4 @@ -31784,7 +31784,7 @@ __metadata: languageName: node linkType: hard -"luxon@npm:^3.0.0, luxon@npm:^3.3.0": +"luxon@npm:^3.0.0, luxon@npm:^3.3.0, luxon@npm:^3.4.3": version: 3.4.3 resolution: "luxon@npm:3.4.3" checksum: 3eade81506224d038ed24035a0cd0dd4887848d7eba9361dce9ad8ef81380596a68153240be3988721f9690c624fb449fcf8fd8c3fc0681a6a8496faf48e92a3