From 728472d7bcfe9947d9951fb15c19ebbd2b7a0fb1 Mon Sep 17 00:00:00 2001
From: Alejandro Gomez <alejandro@strike.me>
Date: Sun, 12 Feb 2023 22:26:43 +0100
Subject: [PATCH] rename

---
 packages/app/src/Element/ProfileImage.tsx |  2 +-
 packages/app/src/Hooks/usePageWidth.tsx   | 20 ++++++++++++++++++++
 2 files changed, 21 insertions(+), 1 deletion(-)
 create mode 100644 packages/app/src/Hooks/usePageWidth.tsx

diff --git a/packages/app/src/Element/ProfileImage.tsx b/packages/app/src/Element/ProfileImage.tsx
index 07519e5e..d365ac0f 100644
--- a/packages/app/src/Element/ProfileImage.tsx
+++ b/packages/app/src/Element/ProfileImage.tsx
@@ -8,7 +8,7 @@ import Avatar from "Element/Avatar";
 import Nip05 from "Element/Nip05";
 import { HexKey } from "@snort/nostr";
 import { MetadataCache } from "State/Users";
-import useClientWidth from "Hooks/useClientWidth";
+import usePageWidth from "Hooks/usePageWidth";
 
 export interface ProfileImageProps {
   pubkey: HexKey;
diff --git a/packages/app/src/Hooks/usePageWidth.tsx b/packages/app/src/Hooks/usePageWidth.tsx
new file mode 100644
index 00000000..9c8ff798
--- /dev/null
+++ b/packages/app/src/Hooks/usePageWidth.tsx
@@ -0,0 +1,20 @@
+import { useRef, useState, useEffect } from "react";
+
+export default function usePageWidth() {
+  const ref = useRef<HTMLDivElement | null>(document.querySelector(".page"));
+  const [width, setWidth] = useState(0);
+
+  useEffect(() => {
+    const updateSize = () => {
+      if (ref.current) {
+        setWidth(ref.current.offsetWidth);
+      }
+    };
+
+    window.addEventListener("resize", updateSize);
+    updateSize();
+    return () => window.removeEventListener("resize", updateSize);
+  }, [ref]);
+
+  return width;
+}