@streamplace/components 0.7.18 → 0.7.21

package/dist/streamplace-provider/poller.js

@@ -0,0 +1,49 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = Poller;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const streamplace_1 = require("streamplace");
+const streamplace_store_1 = require("../streamplace-store");
+const xrpc_1 = require("../streamplace-store/xrpc");
+function Poller({ children }) {
+    const url = (0, streamplace_store_1.useStreamplaceStore)((state) => state.url);
+    const setLiveUsers = (0, streamplace_store_1.useStreamplaceStore)((state) => state.setLiveUsers);
+    const did = (0, streamplace_store_1.useDID)();
+    const pdsAgent = (0, xrpc_1.usePDSAgent)();
+    const getChatProfile = (0, streamplace_store_1.useGetChatProfile)();
+    const getBskyProfile = (0, streamplace_store_1.useGetBskyProfile)();
+    const liveUserRefresh = (0, streamplace_store_1.useStreamplaceStore)((state) => state.liveUsersRefresh);
+    (0, react_1.useEffect)(() => {
+        if (pdsAgent && did) {
+            getChatProfile();
+            getBskyProfile();
+        }
+    }, [pdsAgent, did]);
+    (0, react_1.useEffect)(() => {
+        const agent = new streamplace_1.StreamplaceAgent(url);
+        const go = async () => {
+            setLiveUsers({
+                liveUsersLoading: true,
+            });
+            try {
+                const res = await agent.place.stream.live.getLiveUsers();
+                setLiveUsers({
+                    liveUsers: res.data.streams || [],
+                    liveUsersLoading: false,
+                    liveUsersError: null,
+                });
+            }
+            catch (e) {
+                setLiveUsers({
+                    liveUsersLoading: false,
+                    liveUsersError: e.message,
+                });
+            }
+        };
+        go();
+        const handle = setInterval(go, 3000);
+        return () => clearInterval(handle);
+    }, [url, liveUserRefresh]);
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
+}

package/dist/streamplace-store/block.js

@@ -0,0 +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)();
+    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");
+        }
+        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/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./stream"), exports);
+tslib_1.__exportStar(require("./streamplace-store"), exports);
+tslib_1.__exportStar(require("./user"), exports);

package/dist/streamplace-store/stream.js

@@ -0,0 +1,247 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCreateStreamRecord = useCreateStreamRecord;
+exports.useUpdateStreamRecord = useUpdateStreamRecord;
+const tslib_1 = require("tslib");
+const api_1 = require("@atproto/api");
+const streamplace_store_1 = require("./streamplace-store");
+const xrpc_1 = require("./xrpc");
+const package_json_1 = tslib_1.__importDefault(require("../../package.json"));
+const react_1 = require("react");
+const react_native_1 = require("react-native");
+const browser_1 = require("../lib/browser");
+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}`);
+                }
+            }
+            catch (e) {
+                if (signal.aborted) {
+                    console.warn("Upload aborted");
+                    return undefined;
+                }
+                lastError = e;
+                console.warn(`Error uploading thumbnail (attempt ${tries + 1}): ${e}`);
+            }
+        }
+        throw new Error(`Could not successfully upload blob after ${maxTries} attempts. Last error: ${lastError}`);
+    };
+    return uploadThumbnail;
+};
+async function createNewPost(agent, record) {
+    try {
+        const post = await agent.post(record);
+        return { uri: post.uri, cid: post.cid };
+    }
+    catch (error) {
+        console.error("Error creating new post:", error);
+        throw error;
+    }
+}
+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 `;
+    const textUrl = `${url.protocol}//${url.host}/${profile.handle}`;
+    const suffix = ` ${text}`;
+    const content = prefix + textUrl + suffix;
+    const rt = new api_1.RichText({ text: content });
+    await rt.detectFacets(agent);
+    const record = {
+        $type: "app.bsky.feed.post",
+        text: content,
+        "place.stream.livestream": {
+            url: linkUrl,
+            title: text,
+        },
+        facets: rt.facets,
+        createdAt: now.toISOString(),
+    };
+    record.embed = {
+        $type: "app.bsky.embed.external",
+        external: {
+            description: text,
+            thumb: thumbnail,
+            title: `@${profile.handle} is 🔴LIVE on ${url.host}!`,
+            uri: linkUrl,
+        },
+    };
+    return record;
+}
+function useCreateStreamRecord() {
+    let agent = (0, xrpc_1.usePDSAgent)();
+    let url = (0, streamplace_store_1.useUrl)();
+    const uploadThumbnail = useUploadThumbnail();
+    return async ({ title, customThumbnail, submitPost, customUrl, }) => {
+        if (!submitPost) {
+            submitPost = true;
+        }
+        if (!customUrl) {
+            customUrl = null;
+        }
+        if (!agent) {
+            throw new Error("No PDS agent found");
+        }
+        if (!agent.did) {
+            throw new Error("No user DID found, assuming not logged in");
+        }
+        // Use customUrl if provided, otherwise fall back to the store URL
+        const finalUrl = customUrl || url;
+        const u = new URL(finalUrl);
+        let thumbnail = undefined;
+        if (customThumbnail) {
+            try {
+                thumbnail = await uploadThumbnail(agent, customThumbnail);
+            }
+            catch (e) {
+                throw new Error(`Custom thumbnail upload failed ${e}`);
+            }
+        }
+        else {
+            // No custom thumbnail: fetch the server-side image and upload it
+            // try thrice lel
+            let tries = 0;
+            try {
+                for (; tries < 3; tries++) {
+                    try {
+                        console.log(`Fetching thumbnail from ${u.protocol}//${u.host}/api/playback/${agent.did}/stream.png`);
+                        const thumbnailRes = await fetch(`${u.protocol}//${u.host}/api/playback/${agent.did}/stream.png`);
+                        if (!thumbnailRes.ok) {
+                            throw new Error(`Failed to fetch thumbnail: ${thumbnailRes.status})`);
+                        }
+                        const thumbnailBlob = await thumbnailRes.blob();
+                        console.log(thumbnailBlob);
+                        thumbnail = await uploadThumbnail(agent, thumbnailBlob);
+                    }
+                    catch (e) {
+                        console.warn(`Failed to fetch thumbnail, retrying (${tries + 1}/3): ${e}`);
+                        // Wait 1 second before retrying
+                        await new Promise((resolve) => setTimeout(resolve, 2000));
+                        if (tries === 2) {
+                            throw new Error(`Failed to fetch thumbnail after 3 tries: ${e}`);
+                        }
+                    }
+                }
+            }
+            catch (e) {
+                throw new Error(`Thumbnail upload failed ${e}`);
+            }
+        }
+        let newPost = undefined;
+        const did = agent.did;
+        const profile = await agent.getProfile({ actor: did });
+        if (submitPost) {
+            if (!profile) {
+                throw new Error("No profile found for the user DID");
+            }
+            const params = new URLSearchParams({
+                did: did,
+                time: new Date().toISOString(),
+            });
+            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')");
+            }
+        }
+        let platform = react_native_1.Platform.OS;
+        let platVersion = react_native_1.Platform.Version
+            ? react_native_1.Platform.Version.toString()
+            : "";
+        // no Platform.Version on web, so use browser name instead
+        if (platform === "web" &&
+            typeof window !== "undefined" &&
+            window.navigator) {
+            platVersion = (0, browser_1.getBrowserName)(window.navigator.userAgent);
+        }
+        const record = {
+            title: title,
+            url: finalUrl,
+            createdAt: new Date().toISOString(),
+            // would match up with e.g. https://stream.place/iame.li
+            canonicalUrl: `${finalUrl}/${profile.data.handle}`,
+            // user agent style string
+            // e.g. `@streamplace/components/0.1.0 (ios, 32.0)`
+            agent: `@streamplace/components/${package_json_1.default.version} (${platform}, ${platVersion})`,
+            post: newPost,
+            thumb: thumbnail,
+        };
+        await agent.com.atproto.repo.createRecord({
+            repo: agent.did,
+            collection: "place.stream.livestream",
+            record,
+        });
+        return record;
+    };
+}
+function useUpdateStreamRecord(customUrl = null) {
+    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");
+        }
+        if (!agent.did) {
+            throw new Error("No user DID found, assuming not logged in");
+        }
+        if (!livestream) {
+            throw new Error("No latest record");
+        }
+        // Use customUrl if provided, otherwise fall back to the store URL
+        const finalUrl = customUrl || url;
+        let rkey = livestream.uri.split("/").pop();
+        let oldRecordValue = livestream.record;
+        if (!rkey) {
+            throw new Error("No rkey?");
+        }
+        let thumbnail = oldRecordValue.thumb;
+        // update thumbnail if a new one is provided
+        if (customThumbnail) {
+            try {
+                thumbnail = await uploadThumbnail(agent, customThumbnail);
+            }
+            catch (e) {
+                throw new Error(`Custom thumbnail upload failed ${e}`);
+            }
+        }
+        const record = {
+            title: title,
+            url: finalUrl,
+            createdAt: new Date().toISOString(),
+            post: oldRecordValue.post,
+            thumb: thumbnail,
+        };
+        await agent.com.atproto.repo.putRecord({
+            repo: agent.did,
+            collection: "place.stream.livestream",
+            rkey,
+            record,
+        });
+        return record;
+    };
+}

package/dist/streamplace-store/streamplace-store.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSetHandle = exports.useHandle = exports.useDID = exports.useUrl = exports.makeStreamplaceStore = void 0;
+exports.getStreamplaceStoreFromContext = getStreamplaceStoreFromContext;
+exports.useStreamplaceStore = useStreamplaceStore;
+const react_1 = require("react");
+const zustand_1 = require("zustand");
+const context_1 = require("../streamplace-provider/context");
+const makeStreamplaceStore = ({ url, }) => {
+    return (0, zustand_1.createStore)()((set) => ({
+        url,
+        liveUsers: null,
+        setLiveUsers: (opts) => {
+            set({
+                ...opts,
+            });
+        },
+        liveUsersRefresh: 0,
+        liveUsersLoading: true,
+        liveUsersError: null,
+        oauthSession: null,
+        handle: null,
+        chatProfile: null,
+    }));
+};
+exports.makeStreamplaceStore = makeStreamplaceStore;
+function getStreamplaceStoreFromContext() {
+    const context = (0, react_1.useContext)(context_1.StreamplaceContext);
+    if (!context) {
+        throw new Error("useStreamplaceStore must be used within a StreamplaceProvider");
+    }
+    return context.store;
+}
+function useStreamplaceStore(selector) {
+    return (0, zustand_1.useStore)(getStreamplaceStoreFromContext(), selector);
+}
+const useUrl = () => useStreamplaceStore((x) => x.url);
+exports.useUrl = useUrl;
+const useDID = () => useStreamplaceStore((x) => x.oauthSession?.did);
+exports.useDID = useDID;
+const useHandle = () => useStreamplaceStore((x) => x.handle);
+exports.useHandle = useHandle;
+const useSetHandle = () => {
+    const store = getStreamplaceStoreFromContext();
+    return (handle) => store.setState({ handle });
+};
+exports.useSetHandle = useSetHandle;

package/dist/streamplace-store/user.js

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useGetChatProfile = useGetChatProfile;
+exports.useGetBskyProfile = useGetBskyProfile;
+exports.useChatProfile = useChatProfile;
+const streamplace_1 = require("streamplace");
+const streamplace_store_1 = require("./streamplace-store");
+const xrpc_1 = require("./xrpc");
+function useGetChatProfile() {
+    const did = (0, streamplace_store_1.useDID)();
+    const pdsAgent = (0, xrpc_1.usePDSAgent)();
+    const store = (0, streamplace_store_1.getStreamplaceStoreFromContext)();
+    return async () => {
+        if (!did || !pdsAgent) {
+            throw new Error("No DID or PDS agent");
+        }
+        const res = await pdsAgent.com.atproto.repo.getRecord({
+            repo: did,
+            collection: "place.stream.chat.profile",
+            rkey: "self",
+        });
+        if (!res.success) {
+            throw new Error("Failed to get chat profile record");
+        }
+        if (streamplace_1.PlaceStreamChatProfile.isRecord(res.data.value)) {
+            store.setState({ chatProfile: res.data.value });
+        }
+        else {
+            console.log("not a record", res.data.value);
+        }
+    };
+}
+function useGetBskyProfile() {
+    const did = (0, streamplace_store_1.useDID)();
+    const pdsAgent = (0, xrpc_1.usePDSAgent)();
+    const store = (0, streamplace_store_1.getStreamplaceStoreFromContext)();
+    return async () => {
+        if (!did || !pdsAgent) {
+            throw new Error("No DID or PDS agent");
+        }
+        const res = await pdsAgent.app.bsky.actor.getProfile({
+            actor: did,
+        });
+        if (!res.success) {
+            throw new Error("Failed to get chat profile record");
+        }
+        store.setState({ handle: res.data.handle });
+    };
+}
+function useChatProfile() {
+    return (0, streamplace_store_1.useStreamplaceStore)((x) => x.chatProfile);
+}

package/dist/streamplace-store/xrpc.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePDSAgent = usePDSAgent;
+const react_1 = require("react");
+const streamplace_1 = require("streamplace");
+const _1 = require(".");
+function usePDSAgent() {
+    const oauthSession = (0, _1.useStreamplaceStore)((state) => state.oauthSession);
+    return (0, react_1.useMemo)(() => {
+        if (!oauthSession) {
+            return null;
+        }
+        return new streamplace_1.StreamplaceAgent(oauthSession);
+    }, [oauthSession]);
+}

package/dist/ui/index.js

@@ -0,0 +1,79 @@
+"use strict";
+/**
+ * @streamplace/components/ui - Streamplace ZeroCSS
+ *
+ * Clean export path for ZeroCSS styling utilities, design tokens, and atomic styles.
+ * ZeroCSS provides a zero-config, atomic styling system optimized for React Native.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.atomsNS = exports.theme = exports.useTheme = exports.usePlatformTypography = exports.lightTheme = exports.darkTheme = exports.createThemedStyles = exports.createThemeStyles = exports.createThemeIcons = exports.createThemeColors = exports.ThemeProvider = exports.responsiveValue = exports.platformStyle = exports.mergeStyles = exports.debounce = exports.typography = exports.spacing = exports.shadows = exports.colors = exports.breakpoints = exports.borderRadius = exports.w = exports.top = exports.text = exports.right = exports.r = exports.py = exports.px = exports.pt = exports.pr = exports.position = exports.pl = exports.pb = exports.p = exports.my = exports.mx = exports.mt = exports.mr = exports.ml = exports.mb = exports.m = exports.left = exports.layout = exports.h = exports.gap = exports.flex = exports.bottom = exports.borders = exports.bg = exports.atoms = void 0;
+exports.utils = exports.tokens = void 0;
+const tslib_1 = require("tslib");
+// Export the most commonly used ZeroCSS utilities
+var atoms_1 = require("../lib/theme/atoms");
+// Core atoms object
+Object.defineProperty(exports, "atoms", { enumerable: true, get: function () { return atoms_1.atoms; } });
+// Common shorthand utilities
+Object.defineProperty(exports, "bg", { enumerable: true, get: function () { return atoms_1.bg; } });
+// Border utilities
+Object.defineProperty(exports, "borders", { enumerable: true, get: function () { return atoms_1.borders; } });
+Object.defineProperty(exports, "bottom", { enumerable: true, get: function () { return atoms_1.bottom; } });
+// Flex utilities
+Object.defineProperty(exports, "flex", { enumerable: true, get: function () { return atoms_1.flex; } });
+// Gap utilities (React Native 0.71+)
+Object.defineProperty(exports, "gap", { enumerable: true, get: function () { return atoms_1.gap; } });
+Object.defineProperty(exports, "h", { enumerable: true, get: function () { return atoms_1.h; } });
+// Layout utilities
+Object.defineProperty(exports, "layout", { enumerable: true, get: function () { return atoms_1.layout; } });
+Object.defineProperty(exports, "left", { enumerable: true, get: function () { return atoms_1.left; } });
+Object.defineProperty(exports, "m", { enumerable: true, get: function () { return atoms_1.m; } });
+Object.defineProperty(exports, "mb", { enumerable: true, get: function () { return atoms_1.mb; } });
+Object.defineProperty(exports, "ml", { enumerable: true, get: function () { return atoms_1.ml; } });
+Object.defineProperty(exports, "mr", { enumerable: true, get: function () { return atoms_1.mr; } });
+Object.defineProperty(exports, "mt", { enumerable: true, get: function () { return atoms_1.mt; } });
+Object.defineProperty(exports, "mx", { enumerable: true, get: function () { return atoms_1.mx; } });
+Object.defineProperty(exports, "my", { enumerable: true, get: function () { return atoms_1.my; } });
+Object.defineProperty(exports, "p", { enumerable: true, get: function () { return atoms_1.p; } });
+Object.defineProperty(exports, "pb", { enumerable: true, get: function () { return atoms_1.pb; } });
+Object.defineProperty(exports, "pl", { enumerable: true, get: function () { return atoms_1.pl; } });
+// Position utilities
+Object.defineProperty(exports, "position", { enumerable: true, get: function () { return atoms_1.position; } });
+Object.defineProperty(exports, "pr", { enumerable: true, get: function () { return atoms_1.pr; } });
+Object.defineProperty(exports, "pt", { enumerable: true, get: function () { return atoms_1.pt; } });
+Object.defineProperty(exports, "px", { enumerable: true, get: function () { return atoms_1.px; } });
+Object.defineProperty(exports, "py", { enumerable: true, get: function () { return atoms_1.py; } });
+Object.defineProperty(exports, "r", { enumerable: true, get: function () { return atoms_1.r; } });
+Object.defineProperty(exports, "right", { enumerable: true, get: function () { return atoms_1.right; } });
+Object.defineProperty(exports, "text", { enumerable: true, get: function () { return atoms_1.text; } });
+Object.defineProperty(exports, "top", { enumerable: true, get: function () { return atoms_1.top; } });
+Object.defineProperty(exports, "w", { enumerable: true, get: function () { return atoms_1.w; } });
+// Export ZeroCSS design tokens
+var tokens_1 = require("../lib/theme/tokens");
+Object.defineProperty(exports, "borderRadius", { enumerable: true, get: function () { return tokens_1.borderRadius; } });
+Object.defineProperty(exports, "breakpoints", { enumerable: true, get: function () { return tokens_1.breakpoints; } });
+Object.defineProperty(exports, "colors", { enumerable: true, get: function () { return tokens_1.colors; } });
+Object.defineProperty(exports, "shadows", { enumerable: true, get: function () { return tokens_1.shadows; } });
+Object.defineProperty(exports, "spacing", { enumerable: true, get: function () { return tokens_1.spacing; } });
+Object.defineProperty(exports, "typography", { enumerable: true, get: function () { return tokens_1.typography; } });
+// Export ZeroCSS utility functions
+var utils_1 = require("../lib/utils");
+Object.defineProperty(exports, "debounce", { enumerable: true, get: function () { return utils_1.debounce; } });
+Object.defineProperty(exports, "mergeStyles", { enumerable: true, get: function () { return utils_1.mergeStyles; } });
+Object.defineProperty(exports, "platformStyle", { enumerable: true, get: function () { return utils_1.platformStyle; } });
+Object.defineProperty(exports, "responsiveValue", { enumerable: true, get: function () { return utils_1.responsiveValue; } });
+// Export ZeroCSS theme system
+var theme_1 = require("../lib/theme/theme");
+Object.defineProperty(exports, "ThemeProvider", { enumerable: true, get: function () { return theme_1.ThemeProvider; } });
+Object.defineProperty(exports, "createThemeColors", { enumerable: true, get: function () { return theme_1.createThemeColors; } });
+Object.defineProperty(exports, "createThemeIcons", { enumerable: true, get: function () { return theme_1.createThemeIcons; } });
+Object.defineProperty(exports, "createThemeStyles", { enumerable: true, get: function () { return theme_1.createThemeStyles; } });
+Object.defineProperty(exports, "createThemedStyles", { enumerable: true, get: function () { return theme_1.createThemedStyles; } });
+Object.defineProperty(exports, "darkTheme", { enumerable: true, get: function () { return theme_1.darkTheme; } });
+Object.defineProperty(exports, "lightTheme", { enumerable: true, get: function () { return theme_1.lightTheme; } });
+Object.defineProperty(exports, "usePlatformTypography", { enumerable: true, get: function () { return theme_1.usePlatformTypography; } });
+Object.defineProperty(exports, "useTheme", { enumerable: true, get: function () { return theme_1.useTheme; } });
+// Namespace exports for power users
+exports.theme = tslib_1.__importStar(require("../lib/theme"));
+exports.atomsNS = tslib_1.__importStar(require("../lib/theme/atoms"));
+exports.tokens = tslib_1.__importStar(require("../lib/theme/tokens"));
+exports.utils = tslib_1.__importStar(require("../lib/utils"));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamplace/components",
-  "version": "0.7.18",
+  "version": "0.7.21",
   "description": "Streamplace React (Native) Components",
   "main": "dist/index.js",
   "types": "src/index.tsx",
@@ -40,7 +40,7 @@
     "react-native-svg": "^15.0.0",
     "react-native-webrtc": "git+https://github.com/streamplace/react-native-webrtc.git#6b8472a771ac47f89217d327058a8a4124a6ae56",
     "react-use-websocket": "^4.13.0",
-    "streamplace": "0.7.2",
+    "streamplace": "0.7.21",
     "viem": "^2.21.44",
     "zustand": "^5.0.5"
   },
@@ -49,7 +49,8 @@
   },
   "scripts": {
     "build": "tsc",
-    "start": "tsc --watch --preserveWatchOutput"
+    "start": "tsc --watch --preserveWatchOutput",
+    "prepare": "tsc"
   },
-  "gitHead": "c0449c9e843e90abf365ff7f017a74560838d482"
+  "gitHead": "e930332a9465e0ffd9a78a01ea39b134cd78e49e"
 }

package/src/components/chat/chat-box.tsx

@@ -83,6 +83,9 @@ export function ChatBox({
   const authors = useMemo(() => {
     if (!chat) return null;
     return chat.reduce((acc, msg) => {
+      // our fake system user "did"
+      if (msg.author.did === "did:sys:system") return acc;
+      if (acc.has(msg.author.handle)) return acc;
       acc.set(msg.author.handle, msg.chatProfile);
       return acc;
     }, new Map<string, ChatMessageViewHydrated["chatProfile"]>());

package/src/components/chat/mod-view.tsx

@@ -10,6 +10,7 @@ import { usePDSAgent } from "../../streamplace-store/xrpc";
 
 import { Linking } from "react-native";
 import { ChatMessageViewHydrated } from "streamplace";
+import { useDeleteChatMessage } from "../../livestream-store";
 import { useStreamplaceStore } from "../../streamplace-store";
 import {
   atoms,
@@ -172,11 +173,16 @@ export const ModView = forwardRef<ModViewRef, ModViewProps>(() => {
               >
                 <Text color="primary">View user on {BSKY_FRONTEND_DOMAIN}</Text>
               </DropdownMenuItem>
-              <ReportButton
-                message={message}
-                setReportModalOpen={setReportModalOpen}
-                setReportSubject={setReportSubject}
-              />
+              {message.author.did === agent?.did && (
+                <DeleteButton message={message} />
+              )}
+              {message.author.did !== agent?.did && (
+                <ReportButton
+                  message={message}
+                  setReportModalOpen={setReportModalOpen}
+                  setReportSubject={setReportSubject}
+                />
+              )}
             </DropdownMenuGroup>
           </>
         )}
@@ -185,6 +191,34 @@ export const ModView = forwardRef<ModViewRef, ModViewProps>(() => {
   );
 });
 
+export function DeleteButton({
+  message,
+}: {
+  message: ChatMessageViewHydrated;
+}) {
+  const deleteChatMessage = useDeleteChatMessage();
+  const [confirming, setConfirming] = useState(false);
+  const { onOpenChange } = useRootContext();
+  return (
+    <DropdownMenuItem
+      onPress={() => {
+        if (!message) return;
+        if (!confirming) {
+          setConfirming(true);
+          return;
+        }
+        deleteChatMessage(message.uri).then(() => {
+          onOpenChange?.(false);
+        });
+      }}
+    >
+      <Text color="destructive">
+        {confirming ? "Are you sure?" : "Delete message"}
+      </Text>
+    </DropdownMenuItem>
+  );
+}
+
 export function ReportButton({
   message,
   setReportModalOpen,