chore: de-dedupe dependencies and make the build green 🤞

Signed-off-by: blam <ben@blam.sh>

plugins/cicd-statistics/package.json

@@ -29,20 +29,21 @@
     "clean": "backstage-cli clean"
   },
   "devDependencies": {
-    "@types/luxon": "^2.0.9"
+    "@types/luxon": "^2.0.5"
   },
   "dependencies": {
     "@backstage/catalog-model": "^0.9.8",
     "@backstage/core-plugin-api": "^0.4.1",
     "@backstage/plugin-catalog-react": "^0.6.9",
-    "@date-io/luxon": "^1.3.13",
+    "@date-io/luxon": "2.x",
     "@material-ui/core": "^4.9.13",
     "@material-ui/icons": "^4.11.2",
     "@material-ui/lab": "4.0.0-alpha.57",
     "@material-ui/pickers": "^3.3.10",
+    "humanize-duration": "^3.27.0",
     "already": "^3.2.0",
     "lodash": "^4.17.21",
-    "luxon": "^2.3.0",
+    "luxon": "^2.0.2",
     "react-use": "^17.3.1",
     "recharts": "^2.1.5"
   },

plugins/cicd-statistics/src/components/progress.tsx

@@ -15,7 +15,7 @@
  */
 
 import React, { CSSProperties, DependencyList } from 'react';
-import { useAsync } from 'react-use';
+import useAsync from 'react-use/lib/useAsync';
 import { Box, LinearProgress } from '@material-ui/core';
 import Timeline from '@material-ui/lab/Timeline';
 import TimelineItem from '@material-ui/lab/TimelineItem';

plugins/cicd-statistics/src/components/utils.tsx

@@ -16,6 +16,7 @@
 
 import React, { CSSProperties } from 'react';
 import { DateTime, Duration } from 'luxon';
+import humanizeDuration from 'humanize-duration';
 import { capitalize } from 'lodash';
 
 const infoText: CSSProperties = { color: 'InfoText' };
@@ -124,7 +125,7 @@ export function formatDuration(millis: number) {
     ...(seconds && !days && !hours && { seconds }),
   });
 
-  return dur.toHuman({ unitDisplay: 'narrow' }).replace(/, /g, '');
+  return humanizeDuration(dur.toMillis(), { round: true });
 }
 
 export function formatDurationFromSeconds(seconds: number) {