ref: add useCreationDate hook

hooks/useExpiryDate.ts

@@ -0,0 +1,35 @@
+import { useEffect, useState } from "react";
+import { memberSince } from "../utils/profile";
+
+export default function useExpiryDate(identity: Identity | undefined) {
+  const [sinceDate, setSinceDate] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (!identity || !identity.addr) return;
+    fetch(
+      `https://${
+        process.env.NEXT_PUBLIC_IS_TESTNET === "true" ? "api-testnet" : "api"
+      }.starkscan.co/api/v0/transactions?from_block=1&limit=1&order_by=asc&contract_address=${
+        identity.addr
+      }`,
+      {
+        method: "GET",
+        headers: {
+          "Content-Type": "application/json",
+          "x-api-key": `${process.env.NEXT_PUBLIC_STARKSCAN}`,
+        },
+      }
+    )
+      .then((res) => res.json())
+      .then((data) => {
+        if (data.data[0].timestamp) {
+          const sinceData = memberSince(data.data[0].timestamp);
+          setSinceDate(sinceData);
+        } else {
+          setSinceDate(null);
+        }
+      });
+  }, [identity]);
+
+  return sinceDate;
+}

pages/[addressOrDomain].tsx

@@ -13,10 +13,11 @@ import { utils } from "starknetid.js";
 import ErrorScreen from "../components/UI/screens/errorScreen";
 import ProfileCard from "../components/UI/profileCard";
 import { Land } from "../components/lands/land";
-import { hasVerifiedSocials, memberSince } from "../utils/profile";
+import { hasVerifiedSocials } from "../utils/profile";
 import { useMediaQuery } from "@mui/material";
 import VerifiedIcon from "../components/UI/iconsComponents/icons/verifiedIcon";
 import CopyIcon from "../components/UI/iconsComponents/icons/copyIcon";
+import useExpiryDate from "../hooks/useExpiryDate";
 
 const AddressOrDomain: NextPage = () => {
   const router = useRouter();
@@ -31,10 +32,10 @@ const AddressOrDomain: NextPage = () => {
   const [isOwner, setIsOwner] = useState(false);
   const dynamicRoute = useRouter().asPath;
   const isMobile = useMediaQuery("(max-width:768px)");
-  const [sinceDate, setSinceDate] = useState<string | null>(null);
   const [achievements, setAchievements] = useState<BuildingsInfo[]>([]);
   const [soloBuildings, setSoloBuildings] = useState<BuildingsInfo[]>([]);
   const [selectedTab, setSelectedTab] = useState<LandTabs>("nfts");
+  const sinceDate = useExpiryDate(identity);
 
   useEffect(() => setNotFound(false), [dynamicRoute]);
 
@@ -193,33 +194,6 @@ const AddressOrDomain: NextPage = () => {
     }
   }, [addressOrDomain, address, dynamicRoute]);
 
-  useEffect(() => {
-    if (!identity || !identity.addr) return;
-    fetch(
-      `https://${
-        process.env.NEXT_PUBLIC_IS_TESTNET === "true" ? "api-testnet" : "api"
-      }.starkscan.co/api/v0/transactions?from_block=1&limit=1&order_by=asc&contract_address=${
-        identity.addr
-      }`,
-      {
-        method: "GET",
-        headers: {
-          "Content-Type": "application/json",
-          "x-api-key": `${process.env.NEXT_PUBLIC_STARKSCAN}`,
-        },
-      }
-    )
-      .then((res) => res.json())
-      .then((data) => {
-        if (data.data[0].timestamp) {
-          const sinceData = memberSince(data.data[0].timestamp);
-          setSinceDate(sinceData);
-        } else {
-          setSinceDate(null);
-        }
-      });
-  }, [identity]);
-
   const copyToClipboard = () => {
     setCopied(true);
     navigator.clipboard.writeText(identity?.addr as string);