fix: footer text format

src/components/layouts/Footer.tsx

@@ -1,18 +1,16 @@
 "use client";
-import React, { useEffect, useState } from "react";
+
 import Image from "next/image";
+import { useEffect } from "react";
 import { useLatestPropertyQuery } from "../../services/hooks/property";
+import { formatCurrency } from "@/utils/general";
 
 export default function Footer() {
   const { data, _fetch } = useLatestPropertyQuery();
-  const [isDataFetched, setIsDataFetched] = useState(false);
 
   useEffect(() => {
-    if (!isDataFetched) {
+    _fetch();
-      _fetch();
+  }, []);
-      setIsDataFetched(true);
-    }
-  }, [isDataFetched, _fetch]);
 
   const latestProperties = data ? data.slice(0, 2) : [];
 
@@ -29,23 +27,14 @@ export default function Footer() {
                 latestProperties.map((property, index) => (
                   <a key={index} className="post-minimal" href={`single-property/${property.slug}`}>
                     <div className="post-minimal-image">
-                      <Image
+                      <Image src={property.images?.[0]?.url ?? ""} alt={property.title} width={161} height={136} />
-                        src={
-                          property.images && property.images.length > 0
-                            ? property.images[0].url
-                            : "/images/featured-properties-17-480x287.jpg"
-                        }
-                        alt={property.title}
-                        width={161}
-                        height={136}
-                      />
                     </div>
                     <div className="post-minimal-body">
                       <div className="post-minimal-title">
                         <span className="text-colorFooterText! hover:text-colorFooterTextHover!">{property.title}</span>
                       </div>
                       <div className="post-minimal-text">
-                        <span>From ${property.price}/month</span>
+                        <span>From {formatCurrency(property.price)}/month</span>
                       </div>
                     </div>
                   </a>