@semapps/activitypub-components 0.6.7 → 0.8.0

package/dist/index.cjs.js

@@ -8,10 +8,10 @@ var $583VT$muistylesmakeStyles = require("@mui/styles/makeStyles");
 var $583VT$muiiconsmaterialSend = require("@mui/icons-material/Send");
 var $583VT$semappssemanticdataprovider = require("@semapps/semantic-data-provider");
 var $583VT$semappsauthprovider = require("@semapps/auth-provider");
+var $583VT$reactquery = require("react-query");
 var $583VT$tiptapcore = require("@tiptap/core");
 var $583VT$tiptapextensionmention = require("@tiptap/extension-mention");
 var $583VT$semappsfieldcomponents = require("@semapps/field-components");
-var $583VT$reactquery = require("react-query");
 var $583VT$tiptapreact = require("@tiptap/react");
 var $583VT$tippyjs = require("tippy.js");
 
@@ -28,9 +28,9 @@ $parcel$export(module.exports, "CommentsField", () => $2e5504cc4159ca8d$export$2
 $parcel$export(module.exports, "CollectionList", () => $505d598a33288aad$export$2e2bcd8739ae039);
 $parcel$export(module.exports, "ReferenceCollectionField", () => $b0c94a9bdea99da5$export$2e2bcd8739ae039);
 $parcel$export(module.exports, "useCollection", () => $5ca5f7e9fc1c3544$export$2e2bcd8739ae039);
-$parcel$export(module.exports, "useInbox", () => $97664763db3c0a46$export$2e2bcd8739ae039);
-$parcel$export(module.exports, "useNodeinfo", () => $30fd77858150739b$export$2e2bcd8739ae039);
-$parcel$export(module.exports, "useOutbox", () => $decfdd34cc00b80e$export$2e2bcd8739ae039);
+$parcel$export(module.exports, "useInbox", () => $486f741c94cd8f74$export$2e2bcd8739ae039);
+$parcel$export(module.exports, "useNodeinfo", () => $59fc2d2cba62bd8e$export$2e2bcd8739ae039);
+$parcel$export(module.exports, "useOutbox", () => $456aea3814dded7d$export$2e2bcd8739ae039);
 $parcel$export(module.exports, "useWebfinger", () => $5b61553556e35016$export$2e2bcd8739ae039);
 $parcel$export(module.exports, "useMentions", () => $968ea07fb81eda0b$export$2e2bcd8739ae039);
 $parcel$export(module.exports, "ACTIVITY_TYPES", () => $ebea823cebb2f44b$export$1ec8e53e7d982d22);
@@ -108,102 +108,400 @@ const $ebea823cebb2f44b$export$4d8d554031975581 = "https://www.w3.org/ns/activit
 
 
 
-const $decfdd34cc00b80e$var$useOutbox = ()=>{
+
+
+
+const $03510abb28fd3d8a$export$e57ff0f701c44363 = (value)=>{
+    // If the field is null-ish, we suppose there are no values.
+    if (value === null || value === undefined) return [];
+    // Return as is.
+    if (Array.isArray(value)) return value;
+    // Single value is made an array.
+    return [
+        value
+    ];
+};
+var $03510abb28fd3d8a$export$2e2bcd8739ae039 = {
+    arrayOf: $03510abb28fd3d8a$export$e57ff0f701c44363
+};
+const $03510abb28fd3d8a$export$34aed805e991a647 = (iterable, predicate)=>{
+    const seen = new Set();
+    return iterable.filter((item)=>{
+        const key = predicate(item);
+        if (seen.has(key)) return false;
+        seen.add(key);
+        return true;
+    });
+};
+
+
+const $5ca5f7e9fc1c3544$var$useItemsFromPages = (pages, dereferenceItems)=>{
+    const dataProvider = (0, $583VT$reactadmin.useDataProvider)();
+    const items = (0, $583VT$react.useMemo)(()=>pages.flatMap((p)=>(0, $03510abb28fd3d8a$export$e57ff0f701c44363)(p.orderedItems || p.items)), [
+        pages
+    ]);
+    // We will force dereference, if some items are not URI string references.
+    const shouldDereference = (0, $583VT$react.useMemo)(()=>{
+        return dereferenceItems || items.some((item)=>typeof item !== "string");
+    }, [
+        dereferenceItems,
+        items
+    ]);
+    // Dereference all items, if necessary (even if shouldDereference is false, the hook needs to be called).
+    const itemQueries = (0, $583VT$reactquery.useQueries)(!shouldDereference ? [] : items.filter((item)=>typeof item === "string").map((itemUri)=>({
+            queryKey: [
+                "resource",
+                itemUri
+            ],
+            queryFn: async ()=>(await dataProvider.fetch(itemUri)).json,
+            staleTime: Infinity
+        })));
+    if (!shouldDereference) return {
+        loadedItems: items,
+        isLoading: false,
+        isFetching: false
+    };
+    // Put all loaded items together (might be dereferenced already, so concatenate).
+    const loadedItems = items.filter((item)=>typeof item !== "string").concat(itemQueries.flatMap((itemQuery)=>{
+        return itemQuery.isSuccess && itemQuery.data || [];
+    }));
+    const errors = itemQueries.filter((q)=>q.error);
+    return {
+        loadedItems: loadedItems,
+        isLoading: itemQueries.some((q)=>q.isLoading),
+        isFetching: itemQueries.some((q)=>q.isFetching),
+        errors: errors.length > 0 ? errors : undefined
+    };
+};
+/**
+ * Subscribe a collection. Supports pagination.
+ * @param predicateOrUrl The collection URI or the predicate to get the collection URI from the identity (webId).
+ * @param {UseCollectionOptions} options Defaults to `{ dereferenceItems: false, liveUpdates: true }`
+ */ const $5ca5f7e9fc1c3544$var$useCollection = (predicateOrUrl, options = {})=>{
+    const { dereferenceItems: dereferenceItems = false, liveUpdates: liveUpdates = true } = options;
     const { data: identity } = (0, $583VT$reactadmin.useGetIdentity)();
-    const outboxUrl = (0, $583VT$react.useMemo)(()=>{
-        if (identity?.webIdData) return identity?.webIdData?.outbox;
+    const [totalItems, setTotalItems] = (0, $583VT$react.useState)();
+    const queryClient = (0, $583VT$reactquery.useQueryClient)();
+    const [hasLiveUpdates, setHasLiveUpdates] = (0, $583VT$react.useState)({
+        status: "connecting"
+    });
+    const dataProvider = (0, $583VT$reactadmin.useDataProvider)();
+    const webSocketRef = (0, $583VT$react.useRef)(null);
+    // Get collectionUrl from webId predicate or URL.
+    const collectionUrl = (0, $583VT$react.useMemo)(()=>{
+        if (predicateOrUrl) {
+            if (predicateOrUrl.startsWith("http")) return predicateOrUrl;
+            if (identity?.webIdData) return identity?.webIdData?.[predicateOrUrl];
+        }
+        return undefined;
+    // throw new Error(`No URL available for useCollection: ${predicateOrUrl}.`);
     }, [
-        identity
+        identity,
+        predicateOrUrl
     ]);
-    const sparqlEndpoint = (0, $583VT$react.useMemo)(()=>{
-        if (identity?.webIdData) return identity?.webIdData?.endpoints?.["void:sparqlEndpoint"] || `${identity?.id}/sparql`;
+    // Fetch page of collection item references (if pageParam provided)
+    //  or default to `collectionUrl` (which should give you the first page).
+    const fetchCollection = (0, $583VT$react.useCallback)(async ({ pageParam: nextPageUrl })=>{
+        // Fetch page or first page (collectionUrl)
+        let { json: json } = await dataProvider.fetch(nextPageUrl || collectionUrl);
+        if (json.totalItems) setTotalItems(json.totalItems);
+        // If first page, handle this here.
+        if ((json.type === "OrderedCollection" || json.type === "Collection") && json.first) {
+            if (json.first?.items) {
+                if (json.first?.items.length === 0 && json.first?.next) // Special case where the first property is an object without items
+                ({ json: json } = await dataProvider.fetch(json.first?.next));
+                else json = json.first;
+            } else // Fetch the first page
+            ({ json: json } = await dataProvider.fetch(json.first));
+        }
+        return json;
     }, [
-        identity
+        dataProvider,
+        collectionUrl,
+        identity,
+        setTotalItems
     ]);
-    // Post an activity to the logged user's outbox and return its URI
-    const post = (0, $583VT$react.useCallback)(async (activity)=>{
-        if (!outboxUrl) throw new Error("Cannot post to outbox before user identity is loaded. Please use the loaded argument of useOutbox");
-        const token = localStorage.getItem("token");
-        const { headers: headers } = await (0, $583VT$reactadmin.fetchUtils).fetchJson(outboxUrl, {
-            method: "POST",
-            body: JSON.stringify({
-                "@context": "https://www.w3.org/ns/activitystreams",
-                ...activity
-            }),
-            headers: new Headers({
-                "Content-Type": "application/ld+json",
-                Authorization: `Bearer ${token}`
-            })
+    // Use infiniteQuery to handle pagination, fetching, etc.
+    const { data: pageData, error: collectionError, fetchNextPage: fetchNextPage, refetch: refetch, hasNextPage: hasNextPage, isLoading: isLoadingPage, isFetching: isFetchingPage, isFetchingNextPage: isFetchingNextPage } = (0, $583VT$reactquery.useInfiniteQuery)([
+        "collection",
+        {
+            collectionUrl: collectionUrl
+        }
+    ], fetchCollection, {
+        enabled: !!(collectionUrl && identity?.id),
+        getNextPageParam: (lastPage)=>lastPage.next,
+        getPreviousPageParam: (firstPage)=>firstPage.prev
+    });
+    // Put all items together in a list (and dereference, if required).
+    const { loadedItems: items, isLoading: isLoadingItems, isFetching: isFetchingItems, errors: itemErrors } = $5ca5f7e9fc1c3544$var$useItemsFromPages(pageData?.pages ?? [], dereferenceItems);
+    const allErrors = (0, $03510abb28fd3d8a$export$e57ff0f701c44363)(collectionError).concat((0, $03510abb28fd3d8a$export$e57ff0f701c44363)(itemErrors));
+    const addItem = (0, $583VT$react.useCallback)((item, shouldRefetch = true)=>{
+        queryClient.setQueryData([
+            "collection",
+            {
+                collectionUrl: collectionUrl
+            }
+        ], (oldData)=>{
+            if (!oldData) return oldData;
+            setTotalItems(totalItems && totalItems + 1);
+            // Destructure, so react knows, it needs to re-render the pages.
+            const pages = [
+                ...oldData.pages
+            ];
+            const firstPageItems = pages?.[0]?.orderedItems || pages?.[0]?.items || [];
+            firstPageItems.unshift(item);
+            oldData.pages = pages;
+            return oldData;
         });
-        return headers.get("Location");
+        if (shouldRefetch) setTimeout(()=>queryClient.refetchQueries([
+                "collection",
+                {
+                    collectionUrl: collectionUrl
+                }
+            ], {
+                active: true,
+                exact: true
+            }), typeof shouldRefetch === "number" ? shouldRefetch : 2000);
     }, [
-        outboxUrl
+        queryClient,
+        collectionUrl
     ]);
-    const fetch = (0, $583VT$react.useCallback)(async ()=>{
-        if (!sparqlEndpoint || !outboxUrl) return;
-        const token = localStorage.getItem("token");
-        const blankNodesQuery = (0, $583VT$semappssemanticdataprovider.buildBlankNodesQuery)([
-            "as:object"
-        ]);
-        const query = `
-      PREFIX as: <https://www.w3.org/ns/activitystreams#>
-      CONSTRUCT {
-        ?s1 ?p1 ?o1 .
-        ${blankNodesQuery.construct}
-      }
-      WHERE {
-        <${outboxUrl}> as:items ?s1 .
-        ?s1 ?p1 ?o1 .
-        ${blankNodesQuery.where}
-      }
-    `;
-        const { json: json } = await (0, $583VT$reactadmin.fetchUtils).fetchJson(sparqlEndpoint, {
-            method: "POST",
-            body: query,
-            headers: new Headers({
-                Accept: "application/ld+json",
-                Authorization: token ? `Bearer ${token}` : undefined
-            })
+    const removeItem = (0, $583VT$react.useCallback)((item, shouldRefetch = true)=>{
+        queryClient.setQueryData([
+            "collection",
+            {
+                collectionUrl: collectionUrl
+            }
+        ], (oldData)=>{
+            if (!oldData) return oldData;
+            setTotalItems(totalItems && totalItems - 1);
+            // Destructure, so react knows, it needs to re-render the pages array.
+            const pages = [
+                ...oldData.pages
+            ];
+            // Find the item in all pages and remove the item to be removed (either item.id or just item)
+            pages.forEach((page)=>{
+                if (page.orderedItems) page.orderedItems = page.orderedItems.filter((i)=>(i.id || i) !== (item.id || item));
+                else if (page.items) page.items = page.items.filter((i)=>(i.id || i) !== (item?.id || item));
+            });
+            oldData.pages = pages;
+            return oldData;
+        });
+        if (shouldRefetch) setTimeout(()=>queryClient.refetchQueries([
+                "collection",
+                {
+                    collectionUrl: collectionUrl
+                }
+            ], {
+                active: true,
+                exact: true
+            }), typeof shouldRefetch === "number" ? shouldRefetch : 2000);
+    }, [
+        queryClient,
+        collectionUrl
+    ]);
+    // Live Updates
+    (0, $583VT$react.useEffect)(()=>{
+        if (liveUpdates && collectionUrl) // Create ws that listens to collectionUri changes
+        (0, $583VT$semappssemanticdataprovider.getOrCreateWsChannel)(dataProvider.fetch, collectionUrl).then((ws)=>{
+            webSocketRef.current = ws; // Keep a ref to the webSocket so that it can be used elsewhere
+            webSocketRef.current.addEventListener("message", (e)=>{
+                const data = JSON.parse(e.data);
+                if (data.type === "Add") addItem(data.object, true);
+                else if (data.type === "Remove") removeItem(data.object, true);
+            });
+            webSocketRef.current.addEventListener("error", (e)=>{
+                setHasLiveUpdates({
+                    status: "error",
+                    error: e
+                });
+            // TODO: Retry after a while
+            });
+            webSocketRef.current.addEventListener("close", (e)=>{
+                if (!hasLiveUpdates.error) setHasLiveUpdates({
+                    ...hasLiveUpdates,
+                    status: "closed"
+                });
+            });
+            setHasLiveUpdates({
+                status: "connected"
+            });
+        }).catch(()=>{}); // If it fails, we won't receive live updates. But that's okay.
+    }, [
+        collectionUrl,
+        liveUpdates,
+        dataProvider,
+        webSocketRef
+    ]);
+    const awaitWebSocketConnection = (0, $583VT$react.useCallback)((options = {})=>{
+        const { timeout: timeout = 30000 } = options;
+        return new Promise((resolve, reject)=>{
+            if (webSocketRef?.current) resolve(webSocketRef);
+            else {
+                const timeoutId = setTimeout(()=>{
+                    reject(`No WebSocket connection found within ${Math.round(timeout / 1000)}s`);
+                }, timeout);
+                const intervalId = setInterval(()=>{
+                    if (webSocketRef?.current) {
+                        clearInterval(intervalId);
+                        clearTimeout(timeoutId);
+                        resolve(webSocketRef);
+                    } else console.log("WebSocket is not initialized yet, waiting...");
+                }, 100);
+            }
         });
-        if (json["@graph"]) return json["@graph"];
-        return null;
     }, [
-        sparqlEndpoint,
-        outboxUrl
+        webSocketRef
     ]);
     return {
-        post: post,
-        fetch: fetch,
-        url: outboxUrl,
-        loaded: !!outboxUrl,
-        owner: identity?.id
+        items: items,
+        totalItems: totalItems,
+        error: allErrors.length > 0 && allErrors,
+        refetch: refetch,
+        fetchNextPage: fetchNextPage,
+        addItem: addItem,
+        removeItem: removeItem,
+        hasNextPage: hasNextPage,
+        isLoading: isLoadingPage || isLoadingItems,
+        isFetching: isFetchingPage || isFetchingItems,
+        isFetchingNextPage: isFetchingNextPage,
+        url: collectionUrl,
+        hasLiveUpdates: hasLiveUpdates,
+        awaitWebSocketConnection: awaitWebSocketConnection,
+        webSocketRef: webSocketRef
     };
 };
-var $decfdd34cc00b80e$export$2e2bcd8739ae039 = $decfdd34cc00b80e$var$useOutbox;
+var $5ca5f7e9fc1c3544$export$2e2bcd8739ae039 = $5ca5f7e9fc1c3544$var$useCollection;
 
 
 
 
-// Fix a bug in the current version of the mention extension
-// (The { id, label } object is located inside the id property)
-// See https://github.com/ueberdosis/tiptap/pull/1322
-const $9b1343b281972d72$var$CustomMention = (0, ($parcel$interopDefault($583VT$tiptapextensionmention))).extend({
-    renderHTML ({ node: node, HTMLAttributes: HTMLAttributes }) {
-        return [
-            "span",
-            (0, $583VT$tiptapcore.mergeAttributes)(this.options.HTMLAttributes, HTMLAttributes),
-            `@${node.attrs.id.label}`
-        ];
-    },
-    addAttributes () {
-        return {
-            label: {
-                default: null,
-                parseHTML: (element)=>{
-                    return {
-                        label: element.getAttribute("data-mention-label")
-                    };
-                },
+/**
+ * Hook used internally by useInbox and useOutbox. This is not exported.
+ * @param awaitWebSocketConnection Promise returning the WebSocket which allow to listen to the inbox or outbox
+ * @param existingActivities Partial list of activities already received in the inbox and outbox
+ */ const $5e70f9d0635e25dd$var$useAwaitActivity = (awaitWebSocketConnection, existingActivities)=>{
+    const dataProvider = (0, $583VT$reactadmin.useDataProvider)();
+    // TODO Allow to pass an  object, and automatically dereference it if required, like on the @semapps/activitypub matchActivity util
+    return (0, $583VT$react.useCallback)((matchActivity, options = {})=>{
+        const { timeout: timeout = 30000, checkExistingActivities: checkExistingActivities = false } = options;
+        return new Promise((resolve, reject)=>{
+            awaitWebSocketConnection().then((webSocketRef)=>{
+                const onMessage = (event)=>{
+                    const data = JSON.parse(event.data);
+                    if (data.type === "Add") dataProvider.fetch(data.object).then(({ json: json })=>{
+                        if (matchActivity(json)) {
+                            removeListeners();
+                            return resolve(json);
+                        }
+                    });
+                };
+                const onError = (e)=>{
+                    // TODO reconnect if connection closed
+                    removeListeners();
+                    reject(e);
+                };
+                const onClose = (e)=>{
+                    removeListeners();
+                    reject(new Error(`${e.reason} (Code: ${e.code})`));
+                };
+                const removeListeners = ()=>{
+                    webSocketRef.current?.removeEventListener("message", onMessage);
+                    webSocketRef.current?.removeEventListener("error", onError);
+                    webSocketRef.current?.removeEventListener("close", onClose);
+                };
+                webSocketRef.current?.addEventListener("message", onMessage);
+                webSocketRef.current?.addEventListener("error", onError);
+                webSocketRef.current?.addEventListener("close", onClose);
+                // If a list of activities is already loaded, verify if there is a match
+                if (existingActivities && checkExistingActivities) for (const a of existingActivities){
+                    if (typeof a !== "string") {
+                        if (matchActivity(a)) {
+                            removeListeners();
+                            return resolve(a);
+                        }
+                    }
+                }
+                setTimeout(()=>{
+                    removeListeners();
+                    reject(new Error("Timeout"));
+                }, timeout);
+            }).catch((e)=>{
+                reject(e);
+            });
+        });
+    }, [
+        awaitWebSocketConnection,
+        existingActivities,
+        dataProvider
+    ]);
+};
+var $5e70f9d0635e25dd$export$2e2bcd8739ae039 = $5e70f9d0635e25dd$var$useAwaitActivity;
+
+
+/**
+ * Hook to fetch and post to the outbox of the logged user.
+ * Returns the same data as the useCollection hooks, plus:
+ * - `post`: a function to post a new activity in the user's outbox
+ * - `awaitActivity`: a function to wait for a certain activity to be posted
+ * - `owner`: the WebID of the outbox's owner
+ * See https://semapps.org/docs/frontend/activitypub-components#useoutbox for usage
+ * @param {UseCollectionOptions} options Defaults to `{ dereferenceItems: false, liveUpdates: true }`
+ */ const $456aea3814dded7d$var$useOutbox = (options = {})=>{
+    const dataProvider = (0, $583VT$reactadmin.useDataProvider)();
+    const { data: identity } = (0, $583VT$reactadmin.useGetIdentity)();
+    const { url: url, items: items, awaitWebSocketConnection: awaitWebSocketConnection, ...rest } = (0, $5ca5f7e9fc1c3544$export$2e2bcd8739ae039)("outbox", options);
+    const awaitActivity = (0, $5e70f9d0635e25dd$export$2e2bcd8739ae039)(awaitWebSocketConnection, items);
+    // Post an activity to the logged user's outbox and return its URI
+    const post = (0, $583VT$react.useCallback)(async (activity)=>{
+        if (!url) throw new Error("Cannot post to outbox before user identity is loaded. Please use the isLoading argument of useOutbox");
+        const { headers: headers } = await dataProvider.fetch(url, {
+            method: "POST",
+            body: JSON.stringify({
+                "@context": "https://www.w3.org/ns/activitystreams",
+                ...activity
+            })
+        });
+        return headers.get("Location");
+    }, [
+        url,
+        dataProvider
+    ]);
+    return {
+        url: url,
+        items: items,
+        awaitWebSocketConnection: awaitWebSocketConnection,
+        post: post,
+        awaitActivity: awaitActivity,
+        owner: identity?.id,
+        ...rest
+    };
+};
+var $456aea3814dded7d$export$2e2bcd8739ae039 = $456aea3814dded7d$var$useOutbox;
+
+
+
+
+// Fix a bug in the current version of the mention extension
+// (The { id, label } object is located inside the id property)
+// See https://github.com/ueberdosis/tiptap/pull/1322
+const $9b1343b281972d72$var$CustomMention = (0, ($parcel$interopDefault($583VT$tiptapextensionmention))).extend({
+    renderHTML ({ node: node, HTMLAttributes: HTMLAttributes }) {
+        return [
+            "span",
+            (0, $583VT$tiptapcore.mergeAttributes)(this.options.HTMLAttributes, HTMLAttributes),
+            `@${node.attrs.id.label}`
+        ];
+    },
+    addAttributes () {
+        return {
+            label: {
+                default: null,
+                parseHTML: (element)=>{
+                    return {
+                        label: element.getAttribute("data-mention-label")
+                    };
+                },
                 renderHTML: (attributes)=>{
                     if (!attributes.id.label) return {};
                     return {
@@ -284,7 +582,7 @@ const $703eba3e46be7ee5$var$PostCommentForm = ({ context: context, placeholder:
     const userDataModel = (0, $583VT$semappssemanticdataprovider.useDataModel)(userResource);
     const classes = $703eba3e46be7ee5$var$useStyles();
     const notify = (0, $583VT$reactadmin.useNotify)();
-    const outbox = (0, $decfdd34cc00b80e$export$2e2bcd8739ae039)();
+    const outbox = (0, $456aea3814dded7d$export$2e2bcd8739ae039)();
     const [expanded, setExpanded] = (0, $583VT$react.useState)(false);
     const [openAuth, setOpenAuth] = (0, $583VT$react.useState)(false);
     const onSubmit = (0, $583VT$react.useCallback)(async (values)=>{
@@ -544,186 +842,9 @@ var $d68cd57b2d06b6d5$export$2e2bcd8739ae039 = $d68cd57b2d06b6d5$var$CommentsLis
 
 
 
-
-
-
-const $03510abb28fd3d8a$export$e57ff0f701c44363 = (value)=>{
-    // If the field is null-ish, we suppose there are no values.
-    if (value === null || value === undefined) return [];
-    // Return as is.
-    if (Array.isArray(value)) return value;
-    // Single value is made an array.
-    return [
-        value
-    ];
-};
-var $03510abb28fd3d8a$export$2e2bcd8739ae039 = {
-    arrayOf: $03510abb28fd3d8a$export$e57ff0f701c44363
-};
-const $03510abb28fd3d8a$export$34aed805e991a647 = (iterable, predicate)=>{
-    const seen = new Set();
-    return iterable.filter((item)=>{
-        const key = predicate(item);
-        if (seen.has(key)) return false;
-        seen.add(key);
-        return true;
-    });
-};
-
-
-const $2b75a2f49c9ef165$var$useItemsFromPagesAndNotifications = (pages, notifications, dereferenceItems)=>{
-    const dataProvider = (0, $583VT$reactadmin.useDataProvider)();
-    // Add all items from pages and process notifications (possibly new and deleted items).
-    const items = (0, $583VT$react.useMemo)(()=>{
-        const addItems = notifications.map((n)=>n.type === "Add").map((n)=>n.object);
-        const removeItems = notifications.map((n)=>n.type === "Remove").map((n)=>n.object.id || n.object);
-        const currentItems = !pages ? [] : pages.flatMap((p)=>(0, $03510abb28fd3d8a$export$e57ff0f701c44363)(p.orderedItems || p.items));
-        const currentAndNew = currentItems.concat(addItems);
-        return currentAndNew// Filter out removed items.
-        .filter((item)=>!removeItems.some((r)=>(r.id ?? r) === (item.id ?? item)))// Filter duplicates.
-        .filter((item)=>currentAndNew.some((i2)=>(i2.id ?? i2) === (item.id ?? item)));
-    }, pages, notifications);
-    if (!dereferenceItems) return {
-        loadedItems: items,
-        isLoading: false,
-        isFetching: false
-    };
-    // Dereference all items, if they are not yet.
-    const itemQueries = (0, $583VT$reactquery.useQueries)(items.filter((item)=>typeof item === "string").map((itemUri)=>({
-            queryKey: [
-                "resource",
-                itemUri
-            ],
-            queryFn: async ()=>(await dataProvider.fetch(itemUri)).json,
-            staleTime: Infinity
-        })));
-    // Put all loaded items together (might be dereferenced already, so concatenate).
-    const loadedItems = items.filter((item)=>typeof item !== "string").concat(itemQueries.flatMap((itemQuery)=>{
-        return itemQuery.isSuccess && itemQuery.data || [];
-    }));
-    console.log("loadedItems", loadedItems.length, "total", items.length);
-    const errors = itemQueries.filter((q)=>q.error);
-    return {
-        loadedItems: loadedItems,
-        isLoading: itemQueries.some((q)=>q.isLoading),
-        isFetching: itemQueries.some((q)=>q.isFetching),
-        errors: errors.length > 0 && errors
-    };
-};
-const $2b75a2f49c9ef165$var$useCollection = (predicateOrUrl, options = {})=>{
-    const { dereferenceItems: dereferenceItems = false, liveUpdates: liveUpdates = true } = options;
-    const { data: identity } = (0, $583VT$reactadmin.useGetIdentity)();
-    const [totalItems, setTotalItems] = (0, $583VT$react.useState)();
-    const [notifications, setNotifications] = (0, $583VT$react.useState)([]);
-    const [hasLiveUpdates, setHasLiveUpdates] = (0, $583VT$react.useState)({
-        status: "disconnected",
-        error: undefined
-    });
-    const dataProvider = (0, $583VT$reactadmin.useDataProvider)();
-    // Get collectionUrl from webId predicate or URL.
-    const collectionUrl = (0, $583VT$react.useMemo)(()=>{
-        if (predicateOrUrl) {
-            if (predicateOrUrl.startsWith("http")) return predicateOrUrl;
-            if (identity?.webIdData) return identity?.webIdData?.[predicateOrUrl];
-        }
-        return undefined;
-    // throw new Error(`No URL available for useCollection: ${predicateOrUrl}.`);
-    }, [
-        identity,
-        predicateOrUrl
-    ]);
-    // Fetch page of collection item references (if pageParam provided)
-    //  or default to `collectionUrl` (which should give you the first page).
-    const fetchCollection = (0, $583VT$react.useCallback)(async ({ pageParam: nextPageUrl })=>{
-        // Fetch page or first page (collectionUrl)
-        let { json: json } = await dataProvider.fetch(nextPageUrl || collectionUrl);
-        if (json.totalItems) setTotalItems(json.totalItems);
-        // If first page, handle this here.
-        if ((json.type === "OrderedCollection" || json.type === "Collection") && json.first) {
-            if (json.first?.items) {
-                if (json.first?.items.length === 0 && json.first?.next) // Special case where the first property is an object without items
-                ({ json: json } = await dataProvider.fetch(json.first?.next));
-                else json = json.first;
-            } else // Fetch the first page
-            ({ json: json } = await dataProvider.fetch(json.first));
-        }
-        return json;
-    }, [
-        dataProvider,
-        collectionUrl,
-        identity,
-        setTotalItems
-    ]);
-    // Use infiniteQuery to handle pagination, fetching, etc.
-    const { data: data, error: collectionError, fetchNextPage: fetchNextPage, refetch: refetch, hasNextPage: hasNextPage, isLoading: isLoadingPage, isFetching: isFetchingPage, isFetchingNextPage: isFetchingNextPage } = (0, $583VT$reactquery.useInfiniteQuery)([
-        "collection",
-        {
-            collectionUrl: collectionUrl
-        }
-    ], fetchCollection, {
-        enabled: !!(collectionUrl && identity?.id),
-        getNextPageParam: (lastPage)=>lastPage.next,
-        getPreviousPageParam: (firstPage)=>firstPage.prev
-    });
-    // Put all items together in a list.
-    const { loadedItems: items, isLoading: isLoadingItems, isFetching: isFetchingItems, errors: itemErrors } = $2b75a2f49c9ef165$var$useItemsFromPagesAndNotifications(data?.pages, notifications, dereferenceItems);
-    // Notifications have been processed after hook call, so reset.
-    // useEffect(() => {
-    //   setNotifications([]);
-    // }, [notifications])
-    // Live Updates
-    (0, $583VT$react.useEffect)(()=>{
-        if (liveUpdates && collectionUrl) // Create ws that listens to collectionUri changes
-        (0, $583VT$semappssemanticdataprovider.getOrCreateWsChannel)(dataProvider.fetch, collectionUrl).then((webSocket)=>{
-            webSocket.addEventListener("message", (e)=>{
-                if (e.data && e.data.type === "Add" || e.data.type === "Remove") setNotifications([
-                    ...notifications,
-                    e.data
-                ]);
-            });
-            webSocket.addEventListener("error", (e)=>{
-                setHasLiveUpdates({
-                    status: "error",
-                    error: e
-                });
-            // TODO: Retry after a while
-            });
-            webSocket.addEventListener("close", (e)=>{
-                setHasLiveUpdates({
-                    ...hasLiveUpdates,
-                    status: "disconnected"
-                });
-            });
-            setHasLiveUpdates({
-                status: "connected"
-            });
-        }).catch(()=>{}); // If it fails, we won't receive live updates. But that's okay.
-    }, [
-        collectionUrl,
-        liveUpdates,
-        dataProvider.fetch
-    ]);
-    const allErrors = (0, $03510abb28fd3d8a$export$e57ff0f701c44363)(collectionError).concat((0, $03510abb28fd3d8a$export$e57ff0f701c44363)(itemErrors));
-    return {
-        items: items,
-        totalItems: totalItems,
-        error: allErrors.length > 0 && allErrors,
-        refetch: refetch,
-        fetchNextPage: fetchNextPage,
-        hasNextPage: hasNextPage,
-        isLoading: isLoadingPage || isLoadingItems,
-        isFetching: isFetchingPage || isFetchingItems,
-        isFetchingNextPage: isFetchingNextPage,
-        url: collectionUrl,
-        hasLiveUpdates: hasLiveUpdates
-    };
-};
-var $2b75a2f49c9ef165$export$2e2bcd8739ae039 = $2b75a2f49c9ef165$var$useCollection;
-
-
 const $2e5504cc4159ca8d$var$CommentsField = ({ source: source, context: context, helperText: helperText, placeholder: placeholder, userResource: userResource, mentions: mentions })=>{
     const record = (0, $583VT$reactadmin.useRecordContext)();
-    const { items: comments, loading: loading, addItem: addItem, removeItem: removeItem } = (0, $2b75a2f49c9ef165$export$2e2bcd8739ae039)(record.replies);
+    const { items: comments, loading: loading, addItem: addItem, removeItem: removeItem } = (0, $5ca5f7e9fc1c3544$export$2e2bcd8739ae039)(record.replies);
     if (!userResource) throw new Error("No userResource defined for CommentsField");
     return /*#__PURE__*/ (0, $583VT$reactjsxruntime.jsxs)((0, $583VT$reactjsxruntime.Fragment), {
         children: [
@@ -759,7 +880,7 @@ var $2e5504cc4159ca8d$export$2e2bcd8739ae039 = $2e5504cc4159ca8d$var$CommentsFie
 
 const $505d598a33288aad$var$CollectionList = ({ collectionUrl: collectionUrl, resource: resource, children: children })=>{
     if ((0, ($parcel$interopDefault($583VT$react))).Children.count(children) !== 1) throw new Error("<CollectionList> only accepts a single child");
-    const { items: actorsUris } = (0, $2b75a2f49c9ef165$export$2e2bcd8739ae039)(collectionUrl);
+    const { items: actorsUris } = (0, $5ca5f7e9fc1c3544$export$2e2bcd8739ae039)(collectionUrl);
     const { data: data, isLoading: isLoading, isFetching: isFetching } = (0, $583VT$reactadmin.useGetMany)(resource, {
         ids: Array.isArray(actorsUris) ? actorsUris : [
             actorsUris
@@ -802,302 +923,49 @@ var $b0c94a9bdea99da5$export$2e2bcd8739ae039 = $b0c94a9bdea99da5$var$ReferenceCo
 
 
 
-
-const $5ca5f7e9fc1c3544$var$useItemsFromPages = (pages, dereferenceItems)=>{
-    const dataProvider = (0, $583VT$reactadmin.useDataProvider)();
-    const items = (0, $583VT$react.useMemo)(()=>pages.flatMap((p)=>(0, $03510abb28fd3d8a$export$e57ff0f701c44363)(p.orderedItems || p.items)), [
-        pages
-    ]);
-    // We will force dereference, if some items are not URI string references.
-    const shouldDereference = (0, $583VT$react.useMemo)(()=>{
-        return dereferenceItems || items.some((item)=>typeof item !== "string");
-    }, [
-        dereferenceItems,
-        items
-    ]);
-    // Dereference all items, if necessary (even if shouldDereference is false, the hook needs to be called).
-    const itemQueries = (0, $583VT$reactquery.useQueries)(!shouldDereference ? [] : items.filter((item)=>typeof item === "string").map((itemUri)=>({
-            queryKey: [
-                "resource",
-                itemUri
-            ],
-            queryFn: async ()=>(await dataProvider.fetch(itemUri)).json,
-            staleTime: Infinity
-        })));
-    if (!shouldDereference) return {
-        loadedItems: items,
-        isLoading: false,
-        isFetching: false
-    };
-    // Put all loaded items together (might be dereferenced already, so concatenate).
-    const loadedItems = items.filter((item)=>typeof item !== "string").concat(itemQueries.flatMap((itemQuery)=>{
-        return itemQuery.isSuccess && itemQuery.data || [];
-    }));
-    const errors = itemQueries.filter((q)=>q.error);
-    return {
-        loadedItems: loadedItems,
-        isLoading: itemQueries.some((q)=>q.isLoading),
-        isFetching: itemQueries.some((q)=>q.isFetching),
-        errors: errors.length > 0 ? errors : undefined
-    };
-};
 /**
- * Subscribe a collection. Supports pagination.
- * @param predicateOrUrl The collection URI or the predicate to get the collection URI from the identity (webId).
+ * Hook to fetch the inbox of the logged user.
+ * Returns the same data as the useCollection hooks, plus:
+ * - `awaitActivity`: a function to wait for a certain activity to be received
+ * - `owner`: the WebID of the inbox's owner
+ * See https://semapps.org/docs/frontend/activitypub-components#useinbox for usage
  * @param {UseCollectionOptions} options Defaults to `{ dereferenceItems: false, liveUpdates: true }`
- */ const $5ca5f7e9fc1c3544$var$useCollection = (predicateOrUrl, options = {})=>{
-    const { dereferenceItems: dereferenceItems = false, liveUpdates: liveUpdates = true } = options;
+ */ const $486f741c94cd8f74$var$useInbox = (options = {})=>{
     const { data: identity } = (0, $583VT$reactadmin.useGetIdentity)();
-    const [totalItems, setTotalItems] = (0, $583VT$react.useState)();
-    const queryClient = (0, $583VT$reactquery.useQueryClient)();
-    const [hasLiveUpdates, setHasLiveUpdates] = (0, $583VT$react.useState)({
-        status: "connecting"
-    });
-    const dataProvider = (0, $583VT$reactadmin.useDataProvider)();
-    // Get collectionUrl from webId predicate or URL.
-    const collectionUrl = (0, $583VT$react.useMemo)(()=>{
-        if (predicateOrUrl) {
-            if (predicateOrUrl.startsWith("http")) return predicateOrUrl;
-            if (identity?.webIdData) return identity?.webIdData?.[predicateOrUrl];
-        }
-        return undefined;
-    // throw new Error(`No URL available for useCollection: ${predicateOrUrl}.`);
-    }, [
-        identity,
-        predicateOrUrl
-    ]);
-    // Fetch page of collection item references (if pageParam provided)
-    //  or default to `collectionUrl` (which should give you the first page).
-    const fetchCollection = (0, $583VT$react.useCallback)(async ({ pageParam: nextPageUrl })=>{
-        // Fetch page or first page (collectionUrl)
-        let { json: json } = await dataProvider.fetch(nextPageUrl || collectionUrl);
-        if (json.totalItems) setTotalItems(json.totalItems);
-        // If first page, handle this here.
-        if ((json.type === "OrderedCollection" || json.type === "Collection") && json.first) {
-            if (json.first?.items) {
-                if (json.first?.items.length === 0 && json.first?.next) // Special case where the first property is an object without items
-                ({ json: json } = await dataProvider.fetch(json.first?.next));
-                else json = json.first;
-            } else // Fetch the first page
-            ({ json: json } = await dataProvider.fetch(json.first));
-        }
-        return json;
-    }, [
-        dataProvider,
-        collectionUrl,
-        identity,
-        setTotalItems
-    ]);
-    // Use infiniteQuery to handle pagination, fetching, etc.
-    const { data: pageData, error: collectionError, fetchNextPage: fetchNextPage, refetch: refetch, hasNextPage: hasNextPage, isLoading: isLoadingPage, isFetching: isFetchingPage, isFetchingNextPage: isFetchingNextPage } = (0, $583VT$reactquery.useInfiniteQuery)([
-        "collection",
-        {
-            collectionUrl: collectionUrl
-        }
-    ], fetchCollection, {
-        enabled: !!(collectionUrl && identity?.id),
-        getNextPageParam: (lastPage)=>lastPage.next,
-        getPreviousPageParam: (firstPage)=>firstPage.prev
-    });
-    // Put all items together in a list (and dereference, if required).
-    const { loadedItems: items, isLoading: isLoadingItems, isFetching: isFetchingItems, errors: itemErrors } = $5ca5f7e9fc1c3544$var$useItemsFromPages(pageData?.pages ?? [], dereferenceItems);
-    const allErrors = (0, $03510abb28fd3d8a$export$e57ff0f701c44363)(collectionError).concat((0, $03510abb28fd3d8a$export$e57ff0f701c44363)(itemErrors));
-    const addItem = (0, $583VT$react.useCallback)((item, shouldRefetch = true)=>{
-        queryClient.setQueryData([
-            "collection",
-            {
-                collectionUrl: collectionUrl
-            }
-        ], (oldData)=>{
-            if (!oldData) return oldData;
-            setTotalItems(totalItems && totalItems + 1);
-            // Destructure, so react knows, it needs to re-render the pages.
-            const pages = [
-                ...oldData.pages
-            ];
-            const firstPageItems = pages?.[0]?.orderedItems || pages?.[0]?.items || [];
-            firstPageItems.unshift(item);
-            oldData.pages = pages;
-            return oldData;
-        });
-        if (shouldRefetch) setTimeout(()=>queryClient.refetchQueries([
-                "collection",
-                {
-                    collectionUrl: collectionUrl
-                }
-            ], {
-                active: true,
-                exact: true
-            }), typeof shouldRefetch === "number" ? shouldRefetch : 2000);
-    }, [
-        queryClient,
-        collectionUrl
-    ]);
-    const removeItem = (0, $583VT$react.useCallback)((item, shouldRefetch = true)=>{
-        queryClient.setQueryData([
-            "collection",
-            {
-                collectionUrl: collectionUrl
-            }
-        ], (oldData)=>{
-            if (!oldData) return oldData;
-            setTotalItems(totalItems && totalItems - 1);
-            // Destructure, so react knows, it needs to re-render the pages array.
-            const pages = [
-                ...oldData.pages
-            ];
-            // Find the item in all pages and remove the item to be removed (either item.id or just item)
-            pages.forEach((page)=>{
-                if (page.orderedItems) page.orderedItems = page.orderedItems.filter((i)=>(i.id || i) !== (item.id || item));
-                else if (page.items) page.items = page.items.filter((i)=>(i.id || i) !== (item?.id || item));
-            });
-            oldData.pages = pages;
-            return oldData;
-        });
-        if (shouldRefetch) setTimeout(()=>queryClient.refetchQueries([
-                "collection",
-                {
-                    collectionUrl: collectionUrl
-                }
-            ], {
-                active: true,
-                exact: true
-            }), typeof shouldRefetch === "number" ? shouldRefetch : 2000);
-    }, [
-        queryClient,
-        collectionUrl
-    ]);
-    // Live Updates
-    (0, $583VT$react.useEffect)(()=>{
-        if (liveUpdates && collectionUrl) // Create ws that listens to collectionUri changes
-        (0, $583VT$semappssemanticdataprovider.getOrCreateWsChannel)(dataProvider.fetch, collectionUrl).then((webSocket)=>{
-            webSocket.addEventListener("message", (e)=>{
-                const data = JSON.parse(e.data);
-                if (data && data.type === "Add") addItem(data.object, true);
-                else if (data && data.type === "Remove") removeItem(data.object, true);
-            });
-            webSocket.addEventListener("error", (e)=>{
-                setHasLiveUpdates({
-                    status: "error",
-                    error: e
-                });
-            // TODO: Retry after a while
-            });
-            webSocket.addEventListener("close", (e)=>{
-                if (!hasLiveUpdates.error) setHasLiveUpdates({
-                    ...hasLiveUpdates,
-                    status: "closed"
-                });
-            });
-            setHasLiveUpdates({
-                status: "connected"
-            });
-        }).catch(()=>{}); // If it fails, we won't receive live updates. But that's okay.
-    }, [
-        collectionUrl,
-        liveUpdates,
-        dataProvider
-    ]);
+    const { url: url, items: items, awaitWebSocketConnection: awaitWebSocketConnection, ...rest } = (0, $5ca5f7e9fc1c3544$export$2e2bcd8739ae039)("inbox", options);
+    const awaitActivity = (0, $5e70f9d0635e25dd$export$2e2bcd8739ae039)(awaitWebSocketConnection, items);
     return {
+        url: url,
         items: items,
-        totalItems: totalItems,
-        error: allErrors.length > 0 && allErrors,
-        refetch: refetch,
-        fetchNextPage: fetchNextPage,
-        addItem: addItem,
-        removeItem: removeItem,
-        hasNextPage: hasNextPage,
-        isLoading: isLoadingPage || isLoadingItems,
-        isFetching: isFetchingPage || isFetchingItems,
-        isFetchingNextPage: isFetchingNextPage,
-        url: collectionUrl,
-        hasLiveUpdates: hasLiveUpdates
+        awaitWebSocketConnection: awaitWebSocketConnection,
+        awaitActivity: awaitActivity,
+        owner: identity?.id,
+        ...rest
     };
 };
-var $5ca5f7e9fc1c3544$export$2e2bcd8739ae039 = $5ca5f7e9fc1c3544$var$useCollection;
-
-
-
-
-
-const $97664763db3c0a46$var$useInbox = ()=>{
-    const { data: identity } = (0, $583VT$reactadmin.useGetIdentity)();
-    const inboxUrl = (0, $583VT$react.useMemo)(()=>{
-        if (identity?.webIdData) return identity?.webIdData?.inbox;
-    }, [
-        identity
-    ]);
-    const sparqlEndpoint = (0, $583VT$react.useMemo)(()=>{
-        if (identity?.webIdData) return identity?.webIdData?.endpoints?.["void:sparqlEndpoint"] || `${identity?.id}/sparql`;
-    }, [
-        identity
-    ]);
-    const fetch = (0, $583VT$react.useCallback)(async ({ filters: filters })=>{
-        if (!sparqlEndpoint || !inboxUrl) return;
-        const token = localStorage.getItem("token");
-        const blankNodesQuery = (0, $583VT$semappssemanticdataprovider.buildBlankNodesQuery)([
-            "as:object"
-        ]);
-        let filtersWhereQuery = "";
-        if (filters) Object.keys(filters).forEach((predicate)=>{
-            if (filters[predicate]) {
-                const object = filters[predicate].startsWith("http") ? `<${filters[predicate]}>` : filters[predicate];
-                filtersWhereQuery += `?s1 ${predicate} ${object} .`;
-            }
-        });
-        const query = `
-        PREFIX as: <https://www.w3.org/ns/activitystreams#>
-        CONSTRUCT {
-          ?s1 ?p1 ?o1 .
-          ${blankNodesQuery.construct}
-        }
-        WHERE {
-          <${inboxUrl}> as:items ?s1 .
-          ?s1 ?p1 ?o1 .
-          FILTER( (isIRI(?s1)) ) .
-          ${filtersWhereQuery}
-          ${blankNodesQuery.where}
-        }
-      `;
-        const { json: json } = await (0, $583VT$reactadmin.fetchUtils).fetchJson(sparqlEndpoint, {
-            method: "POST",
-            body: query,
-            headers: new Headers({
-                Accept: "application/ld+json",
-                Authorization: token ? `Bearer ${token}` : undefined
-            })
-        });
-        if (json["@graph"]) return json["@graph"];
-        return null;
-    }, [
-        sparqlEndpoint,
-        inboxUrl
-    ]);
-    return {
-        fetch: fetch,
-        url: inboxUrl,
-        owner: identity?.id
-    };
-};
-var $97664763db3c0a46$export$2e2bcd8739ae039 = $97664763db3c0a46$var$useInbox;
+var $486f741c94cd8f74$export$2e2bcd8739ae039 = $486f741c94cd8f74$var$useInbox;
 
 
 
 
-const $30fd77858150739b$var$useNodeinfo = (host, rel = "http://nodeinfo.diaspora.software/ns/schema/2.1")=>{
+const $59fc2d2cba62bd8e$var$useNodeinfo = (host, rel = "http://nodeinfo.diaspora.software/ns/schema/2.1")=>{
     const [schema, setSchema] = (0, $583VT$react.useState)();
     (0, $583VT$react.useEffect)(()=>{
         (async ()=>{
-            const protocol = host.includes(":") ? "http" : "https"; // If the host has a port, we are likely on HTTP
-            const nodeinfoUrl = `${protocol}://${host}/.well-known/nodeinfo`;
-            try {
-                const { json: links } = await (0, $583VT$reactadmin.fetchUtils).fetchJson(nodeinfoUrl);
-                // Accept any version of the nodeinfo protocol
-                const link = links?.links?.find((l)=>l.rel === rel);
-                const { json: json } = await (0, $583VT$reactadmin.fetchUtils).fetchJson(link.href);
-                setSchema(json);
-            } catch (e) {
-            // Do nothing if nodeinfo can't be fetched
+            if (host && rel) {
+                const protocol = host.includes(":") ? "http" : "https"; // If the host has a port, we are likely on HTTP
+                const nodeinfoUrl = `${protocol}://${host}/.well-known/nodeinfo`;
+                try {
+                    const { json: links } = await (0, $583VT$reactadmin.fetchUtils).fetchJson(nodeinfoUrl);
+                    // Accept any version of the nodeinfo protocol
+                    const link = links?.links?.find((l)=>l.rel === rel);
+                    if (link) {
+                        const { json: json } = await (0, $583VT$reactadmin.fetchUtils).fetchJson(link.href);
+                        setSchema(json);
+                    }
+                } catch (e) {
+                // Do nothing if nodeinfo can't be fetched
+                }
             }
         })();
     }, [
@@ -1107,7 +975,7 @@ const $30fd77858150739b$var$useNodeinfo = (host, rel = "http://nodeinfo.diaspora
     ]);
     return schema;
 };
-var $30fd77858150739b$export$2e2bcd8739ae039 = $30fd77858150739b$var$useNodeinfo;
+var $59fc2d2cba62bd8e$export$2e2bcd8739ae039 = $59fc2d2cba62bd8e$var$useNodeinfo;