Add database watching method for checkin and bookings

Signed-off-by: Gabriela Guedes <gabrielabguedes@gmail.com>
GabrielDVpereira · Nov 27, 2022 · 392b9b3 · 392b9b3
1 parent 164ee6a
commit 392b9b3
Show file tree

Hide file tree

Showing 5 changed files with 51 additions and 17 deletions.
diff --git a/src/contexts/BookingContext.tsx b/src/contexts/BookingContext.tsx
@@ -1,5 +1,5 @@
 import { createContext, ReactNode, useContext, useEffect, useState } from 'react'
-import { Booking } from '_/models/booking'
+import { Booking } from '_/models'
 import { IBookingService } from '_/services'
 import { useAuth } from './AuthContext'
 
@@ -24,19 +24,16 @@ export function BookingContextProvider({ children, bookingService }: Props){
 
     useEffect(() => {
         if(!isAuthenticated) return
-        getAllBookings()
+        bookingService.watchBookings(setBookings)
+
+        return () => bookingService.unwatchBookings()
     }, [isAuthenticated])
 
     const createBooking = async (booking: Booking) => {
         setIsCreatingBooking(true)
         await bookingService.createBooking(booking)
         setIsCreatingBooking(false)
-    } 
-
-    const getAllBookings = async () => {
-        const bookings = await bookingService.listBookings()
-        setBookings(bookings || [])
-    } 
+    }
 
     return(
         <BookingContext.Provider value={{ bookings, createBooking , isCreatingBooking}}>

diff --git a/src/contexts/CheckinContext.tsx b/src/contexts/CheckinContext.tsx
@@ -24,7 +24,9 @@ export function CheckinContextProvider({ children, checkinService }: Props){
 
     useEffect(() => {
         if(!isAuthenticated) return
-        getAllCheckins()
+        checkinService.watchCheckins(setCheckins)
+
+        return () => checkinService.unwatchCheckins()
     }, [isAuthenticated])
 
     const createCheckin = async (checkin: Checkin) => {
@@ -33,11 +35,6 @@ export function CheckinContextProvider({ children, checkinService }: Props){
         setIsCreatingCheckin(false)
     }
 
-    const getAllCheckins = async () => {
-        const checkinsResponse = await checkinService.listCheckins()
-        setCheckins(checkinsResponse || [])
-    }
-
     return(
         <CheckinContext.Provider value={{ checkins, createCheckin , isCreatingCheckin}}>
             {children}

diff --git a/src/repositories/database.ts b/src/repositories/database.ts
@@ -1,17 +1,32 @@
-import { getFirestore, setDoc, doc, Firestore, collection, query, getDocs, QueryConstraint, where, Query, DocumentData  } from 'firebase/firestore';
+import { getFirestore, setDoc, doc, Firestore, collection, query, getDocs, where, Query, DocumentData, onSnapshot, QuerySnapshot, Unsubscribe, DocumentSnapshot  } from 'firebase/firestore';
 
 
 export interface DatabaseRepository {
     getAll<T>(): Promise<T[]>
     create(data: any): Promise<void>
     findBy<T>(field: string, value: string): Promise<T[]>
+    watch(callback: (data: any) => void): void
+    unsubscribe(): void
 }
 
 export class FirebaseDatabaseRepository implements DatabaseRepository {
     private readonly firestore: Firestore = getFirestore()
+    private unsub: Unsubscribe | null = null
 
     constructor( private readonly collection: string){}
 
+    async watch(callback: (data: any) => void){
+        this.unsub = onSnapshot(collection(this.firestore, this.collection), async (snap) => {
+            const data: any[] = snap.docs.map(doc => doc.data())
+            callback(data)
+        })
+    }
+
+    async unsubscribe(){
+        if(this.unsub === null) return
+        this.unsub()
+    }
+
     async getAll<T>(): Promise<T[]> {
         const docsRef = query(collection(this.firestore, this.collection));
         return await this.parseQueryResult(docsRef)
@@ -28,9 +43,8 @@ export class FirebaseDatabaseRepository implements DatabaseRepository {
         return await this.parseQueryResult(docsRef)
     }
 
-    async parseQueryResult<T>(query: Query<DocumentData>){
+    async parseQueryResult<T>(query: Query<DocumentData>):Promise<T[]>{
         const docsSnap = await getDocs(query)
-
         const result: T[] = []
 
         docsSnap.forEach(snap => {

diff --git a/src/services/bookingService.ts b/src/services/bookingService.ts
@@ -5,6 +5,8 @@ import { DatabaseRepository } from "_/repositories"
 export interface IBookingService {
     createBooking(booking: Booking): Promise<void>
     listBookings(): Promise<Booking[] | undefined>
+    watchBookings(callback: (data: any) => void): void
+    unwatchBookings(): void
 }
 
 export class BookingService implements IBookingService {
@@ -31,4 +33,15 @@ export class BookingService implements IBookingService {
             this.alertHelper.alertError("Não foi possível recuperar as reservas.")
         }
     }
+
+    watchBookings(callback: (data: Booking[]) => void){
+        this.bookingDatabaseRepository.watch((data: any) => {
+            const bookings: Booking[] = data.map((item: any) => mapResponseToBooking(item))
+            callback(bookings)
+        })
+    }
+
+    unwatchBookings(){
+        this.bookingDatabaseRepository.unsubscribe()
+    }
 }
diff --git a/src/services/checkinService.ts b/src/services/checkinService.ts
@@ -5,6 +5,8 @@ import { DatabaseRepository } from "_/repositories"
 export interface ICheckinService {
     createCheckin(checkin: Checkin): Promise<void>
     listCheckins(): Promise<Checkin[] | undefined>
+    watchCheckins(callback: (data: Checkin[]) => void): void
+    unwatchCheckins(): void
 }
 
 export class CheckinService implements ICheckinService {
@@ -31,4 +33,15 @@ export class CheckinService implements ICheckinService {
             this.alertHelper.alertError("Não foi possível recuperar os checkins.")
         }
     }
+
+    watchCheckins(callback: (data: Checkin[]) => void){
+        this.checkinDatabaseRepository.watch((data: any) => {
+            const checkins: Checkin[] = data.map((item: any) => mapResponseToCheckin(item))
+            callback(checkins)
+        })
+    }
+
+    unwatchCheckins(){
+        this.checkinDatabaseRepository.unsubscribe()
+    }
 }