diff --git a/src/features/dashboard/components/sightingStack/SightingItem.tsx b/src/features/dashboard/components/sightingStack/SightingItem.tsx
index 0c29b49..3470770 100644
--- a/src/features/dashboard/components/sightingStack/SightingItem.tsx
+++ b/src/features/dashboard/components/sightingStack/SightingItem.tsx
@@ -1,4 +1,5 @@
import type { SightingType } from "../../../../utils/types";
+import { timeAgo } from "../../../../utils/utils";
import NumberPlate from "../platePatch/NumberPlate";
type SightingItemProps = {
@@ -7,11 +8,17 @@ type SightingItemProps = {
const SightingItem = ({ sighting }: SightingItemProps) => {
const motion = sighting.motion.toLowerCase() === "away" ? true : false;
+
+ const timeStamp = timeAgo(sighting.timeStampMillis);
+
return (
+
+ {timeStamp}
+
- VRM: {sighting.vrm}
+ {sighting.vrm}
diff --git a/src/utils/utils.ts b/src/utils/utils.ts
index 0e208a4..2c9a3f3 100644
--- a/src/utils/utils.ts
+++ b/src/utils/utils.ts
@@ -4,3 +4,20 @@ export const formatNumberPlate = (plate: string) => {
const formattedPlate = splittedPlate?.join("");
return formattedPlate;
};
+
+export const timeAgo = (timestampmili: number) => {
+ const diffMs = Date.now() - new Date(timestampmili).getTime();
+ const diffMins = Math.floor(diffMs / 60000);
+ if (diffMins < 60) {
+ if (diffMins < 1) {
+ return "just now";
+ }
+ return `${diffMins === 1 ? "1 minute" : diffMins + " minutes"} ago`;
+ } else {
+ const diffHours = Math.floor(diffMins / 60);
+ if (diffHours < 1) {
+ return "just now";
+ }
+ return `${diffHours === 1 ? "1 hour" : diffHours + " hours"} ago`;
+ }
+};