From af3ab4d978956f2340f4cc1c8d3b938d3c7bd32e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jes=C3=BAs=20Espino?= <jespinog@gmail.com>
Date: Tue, 30 Mar 2021 15:20:37 +0200
Subject: [PATCH] Using the card listener in the gallery

---
 webapp/src/components/gallery/galleryCard.tsx | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/webapp/src/components/gallery/galleryCard.tsx b/webapp/src/components/gallery/galleryCard.tsx
index 9fa0ad44d..0922649f5 100644
--- a/webapp/src/components/gallery/galleryCard.tsx
+++ b/webapp/src/components/gallery/galleryCard.tsx
@@ -7,6 +7,8 @@ import {Card} from '../../blocks/card'
 import {CardTree, MutableCardTree} from '../../viewModel/cardTree'
 import {IContentBlock} from '../../blocks/contentBlock'
 
+import useCardListener from '../../hooks/cardListener'
+
 import ImageElement from '../content/imageElement'
 import ContentElement from '../content/contentElement'
 
@@ -20,6 +22,17 @@ type Props = {
 const GalleryCard = React.memo((props: Props) => {
     const {card} = props
     const [cardTree, setCardTree] = useState<CardTree>()
+    useCardListener(
+        card.id,
+        async (blocks) => {
+            const newCardTree = cardTree ? MutableCardTree.incrementalUpdate(cardTree, blocks) : await MutableCardTree.sync(card.id)
+            setCardTree(newCardTree)
+        },
+        async () => {
+            const newCardTree = await MutableCardTree.sync(card.id)
+            setCardTree(newCardTree)
+        },
+    )
 
     useEffect(() => {
         const f = async () => setCardTree(await MutableCardTree.sync(card.id))