feat: Implement the all highlights page. Fixes #620

1 files changed, 22 insertions, 0 deletions

diff --git a/apps/web/lib/hooks/relative-time.ts b/apps/web/lib/hooks/relative-time.ts
new file mode 100644
index 00000000..f7c38497
--- /dev/null
+++ b/apps/web/lib/hooks/relative-time.ts
@@ -0,0 +1,22 @@
+import { useEffect, useState } from "react";
+import dayjs from "dayjs";
+import relativeTime from "dayjs/plugin/relativeTime";
+
+dayjs.extend(relativeTime);
+
+export default function useRelativeTime(date: Date) {
+  const [state, setState] = useState({
+    fromNow: "",
+    localCreatedAt: "",
+  });
+
+  // This is to avoid hydration errors when server and clients are in different timezones
+  useEffect(() => {
+    setState({
+      fromNow: dayjs(date).fromNow(),
+      localCreatedAt: date.toLocaleString(),
+    });
+  }, [date]);
+
+  return state;
+}