Added useTotalPlaces hook

app/places/[placeId]/page.tsx

@@ -1,6 +1,6 @@
 import fetchedMeta from 'fetch-meta-tags'
 import type { fetchedMeta as FetchedMetadata } from 'fetch-meta-tags'
-import { getPlaceData } from '../../../src/api/place'
+import { getPlace } from '../../../src/api/place'
 import { SafeImage } from '../../../src/views/safe-image'
 import styles from './place.module.css'
 
@@ -13,7 +13,7 @@ type PlacePageProps = {
 type PlaceMeta = FetchedMetadata | null
 
 export default async function PlacePage({ params }: PlacePageProps) {
-  const place = await getPlaceData(params.placeId)
+  const place = await getPlace(params.placeId)
 
   const placeMeta: PlaceMeta = place.site
     ? await fetchedMeta(place.site || '')

app/places/page.tsx

@@ -1,14 +1,14 @@
 import Link from 'next/link'
 import { getCountryCodes } from '../../src/api/country'
-import { getPlacesData } from '../../src/api/place'
+import { getPlaces } from '../../src/api/place'
 import styles from './places.module.css'
 
 export const dynamic = 'force-dynamic'
 
 export default async function PlacesPage() {
   const [countryCodes, places] = await Promise.all([
     getCountryCodes(),
-    getPlacesData()
+    getPlaces()
   ])
 
   return places.map((place) => (

src/api/place/index.ts

@@ -1,7 +1,7 @@
 import { Place } from '../../../src/types/place'
 import clientPromise from '../../config/mongodb'
 
-export const getPlacesData = async (): Promise<Place[]> => {
+export const getPlaces = async (): Promise<Place[]> => {
   const mongoClient = await clientPromise
   const data = await mongoClient
     .db('ua-db')
@@ -14,7 +14,7 @@ export const getPlacesData = async (): Promise<Place[]> => {
   return JSON.parse(JSON.stringify(data))
 }
 
-export const getPlaceData = async (placeId: string): Promise<Place> => {
+export const getPlace = async (placeId: string): Promise<Place> => {
   const mongoClient = await clientPromise
   const data = await mongoClient
     .db('ua-db')
@@ -23,3 +23,13 @@ export const getPlaceData = async (placeId: string): Promise<Place> => {
 
   return JSON.parse(JSON.stringify(data))
 }
+
+export const totalPlaces = async (): Promise<number> => {
+  const mongoClient = await clientPromise
+  const data = await mongoClient
+    .db('ua-db')
+    .collection('ua-places')
+    .countDocuments()
+
+  return data
+}

src/hooks/useTotalPlaces.ts

@@ -0,0 +1,39 @@
+'use client'
+
+import { useEffect, useState } from 'react'
+import { totalPlaces } from '../api/place'
+
+export type UseTotalPlacesHook = () => UseTotalPlacesHookResult
+
+export type UseTotalPlacesHookResult = {
+  data: number
+  isLoading: boolean
+  error: boolean
+}
+
+export const useTotalPlaces: UseTotalPlacesHook = () => {
+  const [data, setData] = useState(0)
+  const [isLoading, setIsLoading] = useState(false)
+  const [error, setError] = useState(false)
+
+  useEffect(() => {
+    const fetchTotalPlaces = async () => {
+      setIsLoading(true)
+
+      try {
+        // const total = await totalPlaces()
+        // setData(total)
+        setData(12)
+      } catch {
+        setError(true)
+      } finally {
+        setIsLoading(false)
+      }
+    }
+
+    fetchTotalPlaces()
+    return () => {}
+  }, [])
+
+  return { data, isLoading, error }
+}