@streamplace/components 0.7.2 → 0.7.7

package/dist/livestream-store/chat.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.reduceChat = exports.reduceChatIncremental = exports.useCreateChatMessage = exports.useSetReplyToMessage = exports.useReplyToMessage = void 0;
+exports.reduceChat = exports.useReportChatMessage = exports.useSubmitReport = exports.reduceChatIncremental = exports.useCreateChatMessage = exports.useAddPendingHide = exports.usePendingHides = exports.useSetReplyToMessage = exports.useReplyToMessage = void 0;
 const api_1 = require("@atproto/api");
 const react_1 = require("react");
 const streamplace_store_1 = require("../streamplace-store");
@@ -15,6 +15,23 @@ const useSetReplyToMessage = () => {
     }, [store]);
 };
 exports.useSetReplyToMessage = useSetReplyToMessage;
+const usePendingHides = () => (0, livestream_store_1.useLivestreamStore)((state) => state.pendingHides);
+exports.usePendingHides = usePendingHides;
+const useAddPendingHide = () => {
+    const store = (0, livestream_store_1.getStoreFromContext)();
+    return (0, react_1.useCallback)((messageUri) => {
+        const state = store.getState();
+        if (!state.pendingHides.includes(messageUri)) {
+            const newPendingHides = [...state.pendingHides, messageUri];
+            const newState = (0, exports.reduceChat)(state, [], [], [messageUri]);
+            store.setState({
+                ...newState,
+                pendingHides: newPendingHides,
+            });
+        }
+    }, [store]);
+};
+exports.useAddPendingHide = useAddPendingHide;
 const useCreateChatMessage = () => {
     const pdsAgent = (0, xrpc_1.usePDSAgent)();
     const store = (0, livestream_store_1.getStoreFromContext)();
@@ -63,7 +80,7 @@ const useCreateChatMessage = () => {
             indexedAt: new Date().toISOString(),
             chatProfile: chatProfile || undefined,
         };
-        state = (0, exports.reduceChat)(state, [localChat], []);
+        state = (0, exports.reduceChat)(state, [localChat], [], []);
         store.setState(state);
         await pdsAgent.com.atproto.repo.createRecord({
             repo: userDID,
@@ -79,7 +96,9 @@ const buildSortedChatList = (chatIndex, existingChatList, newMessages, removedKe
         const bTime = parseInt(b.split("-")[0], 10);
         return bTime - aTime;
     });
-    return sortedKeys.map((key) => chatIndex[key]);
+    return sortedKeys
+        .map((key) => chatIndex[key])
+        .filter((msg) => !removedKeys.has(msg.uri));
 };
 const profileIsDifferent = (newProfile, oldProfile) => {
     if (!oldProfile) {
@@ -99,14 +118,25 @@ const profileIsDifferent = (newProfile, oldProfile) => {
     const { red: oldRed, green: oldGreen, blue: oldBlue } = oldProfile.color;
     return newRed !== oldRed || newGreen !== oldGreen || newBlue !== oldBlue;
 };
-const reduceChatIncremental = (state, newMessages, blocks) => {
-    if (newMessages.length === 0 && blocks.length === 0) {
+const reduceChatIncremental = (state, newMessages, blocks, hideUris = []) => {
+    if (newMessages.length === 0 &&
+        blocks.length === 0 &&
+        hideUris.length === 0) {
         return state;
     }
     const newChatIndex = { ...state.chatIndex };
     const newAuthors = { ...state.authors };
     let hasChanges = false;
     const removedKeys = new Set();
+    console.log("newMessages", newMessages);
+    for (const msg of newMessages) {
+        if (msg.deleted) {
+            hasChanges = true;
+            console.log("deleted", msg.uri);
+            removedKeys.add(msg.uri);
+        }
+    }
+    newMessages = newMessages.filter((msg) => msg.deleted !== true);
     // handle blocks
     if (blocks.length > 0) {
         const blockedDIDs = new Set(blocks.map((block) => block.record.subject));
@@ -118,13 +148,26 @@ const reduceChatIncremental = (state, newMessages, blocks) => {
             }
         }
     }
+    if (hideUris.length > 0) {
+        for (const [key, message] of Object.entries(newChatIndex)) {
+            if (hideUris.includes(message.uri)) {
+                delete newChatIndex[key];
+                removedKeys.add(key);
+                hasChanges = true;
+            }
+        }
+    }
     const messagesToAdd = [];
     for (const message of newMessages) {
+        // don't worry about messages that will be hidden
+        if (state.pendingHides.includes(message.uri)) {
+            continue;
+        }
         const date = new Date(message.record.createdAt);
         const key = `${date.getTime()}-${message.uri}`;
         // only change the ref if the profile is different to avoid re-renders elsewhere
-        if (profileIsDifferent(message.chatProfile, newAuthors[message.author.handle])) {
-            newAuthors[message.author.handle] = message.chatProfile;
+        if (profileIsDifferent(message.chatProfile, newAuthors[message.author.did])) {
+            newAuthors[message.author.did] = message.chatProfile;
         }
         // skip messages we already have
         if (newChatIndex[key] && newChatIndex[key].uri === message.uri) {
@@ -156,17 +199,20 @@ const reduceChatIncremental = (state, newMessages, blocks) => {
                 const parentMsgKey = Object.keys(newChatIndex).find((k) => newChatIndex[k].uri === parentUri);
                 if (parentMsgKey) {
                     const parentMsg = newChatIndex[parentMsgKey];
-                    processedMessage = {
-                        ...message,
-                        replyTo: {
-                            cid: parentMsg.cid,
-                            uri: parentMsg.uri,
-                            author: parentMsg.author,
-                            record: parentMsg.record,
-                            chatProfile: parentMsg.chatProfile,
-                            indexedAt: parentMsg.indexedAt,
-                        },
-                    };
+                    // Don't allow replies to system messages
+                    if (parentMsg.author.did !== "did:sys:system") {
+                        processedMessage = {
+                            ...message,
+                            replyTo: {
+                                cid: parentMsg.cid,
+                                uri: parentMsg.uri,
+                                author: parentMsg.author,
+                                record: parentMsg.record,
+                                chatProfile: parentMsg.chatProfile,
+                                indexedAt: parentMsg.indexedAt,
+                            },
+                        };
+                    }
                 }
             }
         }
@@ -183,11 +229,58 @@ const reduceChatIncremental = (state, newMessages, blocks) => {
     }
     // Build the new sorted chat list efficiently
     const newChatList = buildSortedChatList(newChatIndex, state.chat, messagesToAdd, removedKeys);
+    // Clean up pendingHides - remove URIs that we've now processed
+    let newPendingHides = state.pendingHides;
+    if (hideUris.length > 0) {
+        newPendingHides = state.pendingHides.filter((uri) => !hideUris.includes(uri));
+    }
     return {
         ...state,
+        authors: newAuthors,
         chatIndex: newChatIndex,
         chat: newChatList,
+        pendingHides: newPendingHides,
     };
 };
 exports.reduceChatIncremental = reduceChatIncremental;
+const useSubmitReport = () => {
+    const pdsAgent = (0, xrpc_1.usePDSAgent)();
+    const userDID = (0, streamplace_store_1.useDID)();
+    return (0, react_1.useCallback)(async (subject, reasonType, reason, 
+    // no clue about this
+    moderationSvcDid = "did:web:stream.place") => {
+        if (!pdsAgent || !userDID) {
+            throw new Error("No PDS agent or user DID found");
+        }
+        try {
+            const response = await pdsAgent.com.atproto.moderation.createReport({
+                reasonType,
+                reason,
+                subject: subject,
+            }, {
+                headers: {
+                // "atproto-proxy": `${userDID}#atproto_labeler`,
+                },
+            });
+            return response;
+        }
+        catch (error) {
+            console.error("Failed to submit report:", error);
+            throw error;
+        }
+    }, [pdsAgent, userDID]);
+};
+exports.useSubmitReport = useSubmitReport;
+const useReportChatMessage = () => {
+    const submitReport = (0, exports.useSubmitReport)();
+    return (0, react_1.useCallback)(async (message, reasonType, reason) => {
+        const reportSubject = {
+            $type: "com.atproto.repo.strongRef",
+            uri: message.uri,
+            cid: message.cid,
+        };
+        return await submitReport(reportSubject, reasonType, reason);
+    }, [submitReport]);
+};
+exports.useReportChatMessage = useReportChatMessage;
 exports.reduceChat = exports.reduceChatIncremental;

package/dist/livestream-store/livestream-store.js

@@ -14,12 +14,15 @@ const makeLivestreamStore = () => {
         chat: [],
         livestream: null,
         viewers: null,
+        pendingHides: [],
         segment: null,
         renditions: [],
         replyToMessage: null,
         streamKey: null,
         setStreamKey: (sk) => set({ streamKey: sk }),
         authors: {},
+        recentSegments: [],
+        problems: [],
     }));
 };
 exports.makeLivestreamStore = makeLivestreamStore;

package/dist/livestream-store/problems.js

@@ -0,0 +1,76 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.findProblems = void 0;
+const VARIANCE_THRESHOLD = 0.5;
+const DURATION_THRESHOLD = 5000000000; // 5s in ns
+const detectVariableSegmentLength = (segments) => {
+    if (segments.length < 3) {
+        // Need at least 3 segments to detect variability
+        return { variable: false, duration: false };
+    }
+    const durations = segments
+        .map((segment) => segment.duration)
+        .filter((duration) => duration !== undefined && duration > 0);
+    if (durations.length < 3) {
+        return { variable: false, duration: false };
+    }
+    // Calculate mean
+    const mean = durations.reduce((sum, duration) => sum + duration, 0) /
+        durations.length;
+    // Calculate standard deviation
+    const variance = durations.reduce((sum, duration) => {
+        const diff = duration - mean;
+        return sum + diff * diff;
+    }, 0) / durations.length;
+    const stdDev = Math.sqrt(variance);
+    // Calculate coefficient of variation (CV)
+    const cv = stdDev / mean;
+    // CV > 0.5 indicates high variability
+    // This threshold can be adjusted based on testing
+    return {
+        variable: cv > VARIANCE_THRESHOLD,
+        duration: mean > DURATION_THRESHOLD,
+    };
+};
+const findProblems = (segments) => {
+    const problems = [];
+    let hasBFrames = false;
+    for (const segment of segments) {
+        const video = segment.video?.[0];
+        if (!video) {
+            // i mean yes this is a problem but it can't happen yet
+            continue;
+        }
+        if (video.bframes === true) {
+            hasBFrames = true;
+            break;
+        }
+    }
+    if (hasBFrames) {
+        problems.push({
+            code: "bframes",
+            message: "Your stream contains B-Frames, which are not supported in Streamplace. Your stream will stutter.",
+            severity: "error",
+            link: "https://stream.place/docs/guides/start-streaming/obs/#obs-configuration",
+        });
+    }
+    const { variable, duration } = detectVariableSegmentLength(segments);
+    if (variable) {
+        problems.push({
+            code: "variable_segment_length",
+            message: "Your stream contains variable segment lengths, which may cause playback issues.",
+            severity: "warning",
+            link: "https://stream.place/docs/guides/start-streaming/obs/#obs-configuration",
+        });
+    }
+    if (duration) {
+        problems.push({
+            code: "long_segments",
+            message: "Your stream contains long segments (>5s). This will work fine, but increases the delay of the livestream.",
+            severity: "warning",
+            link: "https://stream.place/docs/guides/start-streaming/obs/#obs-configuration",
+        });
+    }
+    return problems;
+};
+exports.findProblems = findProblems;

package/dist/livestream-store/websocket-consumer.js

@@ -3,13 +3,27 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.handleWebSocketMessages = void 0;
 const api_1 = require("@atproto/api");
 const streamplace_1 = require("streamplace");
+const system_messages_1 = require("../lib/system-messages");
 const chat_1 = require("./chat");
+const problems_1 = require("./problems");
+const MAX_RECENT_SEGMENTS = 10;
 const handleWebSocketMessages = (state, messages) => {
     for (const message of messages) {
         if (streamplace_1.PlaceStreamLivestream.isLivestreamView(message)) {
+            const newLivestream = message;
+            const oldLivestream = state.livestream;
+            // check if this is actually new
+            if (!oldLivestream || oldLivestream.uri !== newLivestream.uri) {
+                const streamTitle = newLivestream.record.title || "something cool!";
+                const systemMessage = system_messages_1.SystemMessages.streamStart(streamTitle);
+                // set proper times
+                systemMessage.indexedAt = newLivestream.indexedAt;
+                systemMessage.record.createdAt = newLivestream.record.createdAt;
+                state = (0, chat_1.reduceChat)(state, [systemMessage], []);
+            }
             state = {
                 ...state,
-                livestream: message,
+                livestream: newLivestream,
             };
         }
         else if (streamplace_1.PlaceStreamLivestream.isViewerCount(message)) {
@@ -28,18 +42,26 @@ const handleWebSocketMessages = (state, messages) => {
                 indexedAt: message.indexedAt,
                 chatProfile: message.chatProfile,
                 replyTo: message.replyTo,
+                deleted: message.deleted,
             };
-            state = (0, chat_1.reduceChat)(state, [hydrated], []);
+            state = (0, chat_1.reduceChat)(state, [hydrated], [], []);
         }
         else if (streamplace_1.PlaceStreamSegment.isRecord(message)) {
+            const newRecentSegments = [...state.recentSegments];
+            newRecentSegments.unshift(message);
+            if (newRecentSegments.length > MAX_RECENT_SEGMENTS) {
+                newRecentSegments.pop();
+            }
             state = {
                 ...state,
                 segment: message,
+                recentSegments: newRecentSegments,
+                problems: (0, problems_1.findProblems)(newRecentSegments),
             };
         }
         else if (streamplace_1.PlaceStreamDefs.isBlockView(message)) {
             const block = message;
-            state = (0, chat_1.reduceChat)(state, [], [block]);
+            state = (0, chat_1.reduceChat)(state, [], [block], []);
         }
         else if (streamplace_1.PlaceStreamDefs.isRenditions(message)) {
             state = {
@@ -53,7 +75,20 @@ const handleWebSocketMessages = (state, messages) => {
                 profile: message,
             };
         }
+        else if (streamplace_1.PlaceStreamChatGate.isRecord(message)) {
+            const hideRecord = message;
+            const hiddenMessageUri = hideRecord.hiddenMessage;
+            const newPendingHides = [...state.pendingHides];
+            if (!newPendingHides.includes(hiddenMessageUri)) {
+                newPendingHides.push(hiddenMessageUri);
+            }
+            state = {
+                ...state,
+                pendingHides: newPendingHides,
+            };
+            state = (0, chat_1.reduceChat)(state, [], [], [hiddenMessageUri]);
+        }
     }
-    return (0, chat_1.reduceChat)(state, [], []);
+    return (0, chat_1.reduceChat)(state, [], [], []);
 };
 exports.handleWebSocketMessages = handleWebSocketMessages;

package/dist/player-store/player-store.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.intoPlayerProtocol = exports.usePlayerProtocol = exports.makePlayerStore = void 0;
+exports.useOffline = exports.intoPlayerProtocol = exports.usePlayerProtocol = exports.makePlayerStore = void 0;
 exports.usePlayerContext = usePlayerContext;
 exports.getPlayerStoreById = getPlayerStoreById;
 exports.getFirstPlayerID = getFirstPlayerID;
@@ -8,6 +8,7 @@ exports.getPlayerStoreFromContext = getPlayerStoreFromContext;
 exports.usePlayerStore = usePlayerStore;
 const react_1 = require("react");
 const zustand_1 = require("zustand");
+const livestream_store_1 = require("../livestream-store");
 const context_1 = require("./context");
 const player_state_1 = require("./player-state");
 const makePlayerStore = (id) => {
@@ -41,12 +42,13 @@ const makePlayerStore = (id) => {
         setStatus: (status) => set(() => ({ status })),
         playTime: 0,
         setPlayTime: (playTime) => set(() => ({ playTime })),
-        offline: false,
-        setOffline: (offline) => set(() => ({ offline })),
         videoRef: undefined,
         setVideoRef: (videoRef) => set(() => ({ videoRef })),
         pipMode: false,
         setPipMode: (pipMode) => set(() => ({ pipMode })),
+        // Picture-in-Picture action function (set by player component)
+        pipAction: undefined,
+        setPipAction: (action) => set(() => ({ pipAction: action })),
         // Player element width/height setters for global sync
         playerWidth: undefined,
         setPlayerWidth: (playerWidth) => set(() => ({ playerWidth })),
@@ -65,6 +67,8 @@ const makePlayerStore = (id) => {
         setTelemetry: (telemetry) => set(() => ({ telemetry })),
         ingestLive: false,
         setIngestLive: (ingestLive) => set(() => ({ ingestLive })),
+        reportingURL: null,
+        setReportingURL: (reportingURL) => set(() => ({ reportingURL })),
         playerEvent: async (url, time, eventType, meta) => set((x) => {
             const data = {
                 time: time,
@@ -76,7 +80,8 @@ const makePlayerStore = (id) => {
             };
             try {
                 // fetch url from sp provider
-                fetch(`${url}/api/player-event`, {
+                const reportingURL = x.reportingURL ?? `${url}/api/player-event`;
+                fetch(reportingURL, {
                     method: "POST",
                     body: JSON.stringify(data),
                 });
@@ -106,6 +111,10 @@ const makePlayerStore = (id) => {
         setShowDebugInfo: (showDebugInfo) => set(() => ({ showDebugInfo })),
         modMessage: null,
         setModMessage: (modMessage) => set(() => ({ modMessage })),
+        reportModalOpen: false,
+        setReportModalOpen: (reportModalOpen) => set(() => ({ reportModalOpen })),
+        reportSubject: null,
+        setReportSubject: (subject) => set(() => ({ reportSubject: subject })),
     }));
 };
 exports.makePlayerStore = makePlayerStore;
@@ -168,3 +177,23 @@ const intoPlayerProtocol = (protocol) => {
     }
 };
 exports.intoPlayerProtocol = intoPlayerProtocol;
+// returns true if the livestream has been offline for more than 10 seconds and we're not playing
+const useOffline = () => {
+    const status = usePlayerStore((x) => x.status);
+    const segment = (0, livestream_store_1.useLivestreamStore)((x) => x.segment);
+    const [now, setNow] = (0, react_1.useState)(Date.now());
+    (0, react_1.useEffect)(() => {
+        const interval = setInterval(() => {
+            setNow(Date.now());
+        }, 500);
+        return () => clearInterval(interval);
+    }, []);
+    if (status === player_state_1.PlayerStatus.PLAYING) {
+        return false;
+    }
+    if (!segment?.startTime) {
+        return false;
+    }
+    return now - Date.parse(segment.startTime) > 10000;
+};
+exports.useOffline = useOffline;

package/dist/streamplace-store/block.js

@@ -1,26 +1,65 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useCreateBlockRecord = useCreateBlockRecord;
+exports.useCreateHideChatRecord = useCreateHideChatRecord;
+const react_1 = require("react");
 const xrpc_1 = require("./xrpc");
 function useCreateBlockRecord() {
     let agent = (0, xrpc_1.usePDSAgent)();
-    return async (subjectDID) => {
+    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
+    const createBlock = async (subjectDID) => {
         if (!agent) {
             throw new Error("No PDS agent found");
         }
         if (!agent.did) {
             throw new Error("No user DID found, assuming not logged in");
         }
-        const record = {
-            $type: "app.bsky.graph.block",
-            subject: subjectDID,
-            createdAt: new Date().toISOString(),
-        };
-        return await agent.com.atproto.repo.createRecord({
-            repo: agent.did,
-            collection: "app.bsky.graph.block",
-            record,
-        });
-        return record;
+        setIsLoading(true);
+        try {
+            const record = {
+                $type: "app.bsky.graph.block",
+                subject: subjectDID,
+                createdAt: new Date().toISOString(),
+            };
+            const result = await agent.com.atproto.repo.createRecord({
+                repo: agent.did,
+                collection: "app.bsky.graph.block",
+                record,
+            });
+            return result;
+        }
+        finally {
+            setIsLoading(false);
+        }
+    };
+    return { createBlock, isLoading };
+}
+function useCreateHideChatRecord() {
+    let agent = (0, xrpc_1.usePDSAgent)();
+    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
+    const createHideChat = async (chatMessageUri) => {
+        if (!agent) {
+            throw new Error("No PDS agent found");
+        }
+        if (!agent.did) {
+            throw new Error("No user DID found, assuming not logged in");
+        }
+        setIsLoading(true);
+        try {
+            const record = {
+                $type: "place.stream.chat.gate",
+                hiddenMessage: chatMessageUri,
+            };
+            const result = await agent.com.atproto.repo.createRecord({
+                repo: agent.did,
+                collection: "place.stream.chat.gate",
+                record,
+            });
+            return result;
+        }
+        finally {
+            setIsLoading(false);
+        }
     };
+    return { createHideChat, isLoading };
 }

package/dist/streamplace-store/stream.js

@@ -5,29 +5,48 @@ exports.useUpdateStreamRecord = useUpdateStreamRecord;
 const api_1 = require("@atproto/api");
 const streamplace_store_1 = require("./streamplace-store");
 const xrpc_1 = require("./xrpc");
-const uploadThumbnail = async (pdsAgent, customThumbnail) => {
-    if (customThumbnail) {
-        let tries = 0;
-        try {
-            let thumbnail = await pdsAgent.uploadBlob(customThumbnail);
-            while (thumbnail.data.blob.size === 0 &&
-                customThumbnail.size !== 0 &&
-                tries < 3) {
-                console.warn("Reuploading blob as blob sizes don't match! Blob size recieved is", thumbnail.data.blob.size, "and sent blob size is", customThumbnail.size);
-                thumbnail = await pdsAgent.uploadBlob(customThumbnail);
-            }
-            if (tries === 3) {
-                throw new Error("Could not successfully upload blob (tried thrice)");
+const react_1 = require("react");
+const useUploadThumbnail = () => {
+    const abortRef = (0, react_1.useRef)(null);
+    (0, react_1.useEffect)(() => {
+        return () => {
+            // On unmount, abort any ongoing upload
+            abortRef.current?.abort();
+        };
+    }, []);
+    const uploadThumbnail = async (pdsAgent, customThumbnail) => {
+        if (!customThumbnail)
+            return undefined;
+        abortRef.current = new AbortController();
+        const { signal } = abortRef.current;
+        const maxTries = 3;
+        let lastError = null;
+        for (let tries = 0; tries < maxTries; tries++) {
+            try {
+                const thumbnail = await pdsAgent.uploadBlob(customThumbnail, {
+                    signal,
+                });
+                if (thumbnail.success &&
+                    thumbnail.data.blob.size === customThumbnail.size) {
+                    console.log("Successfully uploaded thumbnail");
+                    return thumbnail.data.blob;
+                }
+                else {
+                    console.warn(`Blob size mismatch (attempt ${tries + 1}): received ${thumbnail.data.blob.size}, expected ${customThumbnail.size}`);
+                }
             }
-            if (thumbnail.success) {
-                console.log("Successfully uploaded thumbnail");
-                return thumbnail.data.blob;
+            catch (e) {
+                if (signal.aborted) {
+                    console.warn("Upload aborted");
+                    return undefined;
+                }
+                lastError = e;
+                console.warn(`Error uploading thumbnail (attempt ${tries + 1}): ${e}`);
             }
         }
-        catch (e) {
-            throw new Error("Error uploading thumbnail: " + e);
-        }
-    }
+        throw new Error(`Could not successfully upload blob after ${maxTries} attempts. Last error: ${lastError}`);
+    };
+    return uploadThumbnail;
 };
 async function createNewPost(agent, record) {
     try {
@@ -39,7 +58,7 @@ async function createNewPost(agent, record) {
         throw error;
     }
 }
-function buildGoLivePost(text, url, profile, params, thumbnail) {
+async function buildGoLivePost(text, url, profile, params, thumbnail, agent) {
     const now = new Date();
     const linkUrl = `${url.protocol}//${url.host}/${profile.handle}?${params.toString()}`;
     const prefix = `🔴 LIVE `;
@@ -47,7 +66,7 @@ function buildGoLivePost(text, url, profile, params, thumbnail) {
     const suffix = ` ${text}`;
     const content = prefix + textUrl + suffix;
     const rt = new api_1.RichText({ text: content });
-    rt.detectFacetsWithoutResolution();
+    await rt.detectFacets(agent);
     const record = {
         $type: "app.bsky.feed.post",
         text: content,
@@ -72,6 +91,7 @@ function buildGoLivePost(text, url, profile, params, thumbnail) {
 function useCreateStreamRecord() {
     let agent = (0, xrpc_1.usePDSAgent)();
     let url = (0, streamplace_store_1.useUrl)();
+    const uploadThumbnail = useUploadThumbnail();
     return async (title, customThumbnail, submitPost = true) => {
         if (!agent) {
             throw new Error("No PDS agent found");
@@ -130,7 +150,7 @@ function useCreateStreamRecord() {
                 did: did,
                 time: new Date().toISOString(),
             });
-            let post = buildGoLivePost(title, u, profile.data, params, thumbnail);
+            let post = await buildGoLivePost(title, u, profile.data, params, thumbnail, agent);
             newPost = await createNewPost(agent, post);
             if (!newPost.uri || !newPost.cid) {
                 throw new Error("Cannot read properties of undefined (reading 'uri' or 'cid')");
@@ -154,6 +174,7 @@ function useCreateStreamRecord() {
 function useUpdateStreamRecord() {
     let agent = (0, xrpc_1.usePDSAgent)();
     let url = (0, streamplace_store_1.useUrl)();
+    const uploadThumbnail = useUploadThumbnail();
     return async (title, livestream, customThumbnail) => {
         if (!agent) {
             throw new Error("No PDS agent found");