Minor PR adjustments.

Author: swoocn

src/app/[locale]/page.tsx

@@ -8,9 +8,9 @@ import Image from 'next/image';
 import Link from 'next/link';
 import { useContext, useEffect, useState, useRef } from 'react';
 
-import { fetchSellers } from '@/services/sellerApi';
 import { Button } from '@/components/shared/Forms/Buttons/Buttons';
 import SearchBar from '@/components/shared/SearchBar/SearchBar';
+import { fetchSellers } from '@/services/sellerApi';
 import { fetchUserLocation } from '@/services/userSettingsApi';
 
 import { AppContext } from '../../../context/AppContextProvider';
@@ -21,6 +21,7 @@ export default function Index() {
   const DynamicMap = dynamic(() => import('@/components/shared/map/Map'), {
     ssr: false,
   });
+  const mapRef = useRef<L.Map | null>(null);
 
   const [mapCenter, setMapCenter] = useState<{ lat: number; lng: number }>({
     lat: 0,
@@ -73,8 +74,6 @@ export default function Index() {
     }
   };
 
-  const mapRef = useRef<L.Map | null>(null);
-
   // handle search query update from SearchBar and associated results
   const handleSearch = async (query: string) => {
     setSearchQuery(query);

src/components/shared/map/Map.tsx

@@ -1,5 +1,5 @@
 import { useTranslations } from 'next-intl';
-import React, { useEffect, useState, useCallback, useContext, useRef, MutableRefObject } from 'react';
+import React, { useEffect, useState, useCallback, useContext } from 'react';
 import { MapContainer, Marker, Popup, TileLayer, useMapEvents } from 'react-leaflet';
 import L, { LatLngExpression, LatLngBounds, LatLngTuple } from 'leaflet';
 import _ from 'lodash';
@@ -42,7 +42,7 @@ const fetchSellerCoordinates = async (
 restricted to one shop at the time of registration. */
 const removeDuplicates = (sellers: ISellerWithSettings[]): ISellerWithSettings[] => {
   const uniqueSellers: { [key: string]: ISellerWithSettings } = {};
-  sellers.forEach((seller) => {
+  sellers.forEach(seller => {
     uniqueSellers[seller.seller_id] = seller;
   });
   return Object.values(uniqueSellers);

src/components/shared/map/MapCenter.tsx

@@ -228,7 +228,7 @@ const MapCenter = ({ entryType }: MapCenterProps) => {
         <Image
           src="/images/icons/scope.png"
           alt="Scope"
-          layout="fill" // Automatically fills the parent container
+          layout="fill"
           className="w-full h-full object-contain" // Ensure proper scaling
         />
       </div>