@streamplace/components 0.7.3 → 0.7.7

package/src/player-store/player-store.tsx

@@ -1,6 +1,8 @@
-import { useContext } from "react";
+import { ComAtprotoModerationCreateReport } from "@atproto/api";
+import { useContext, useEffect, useState } from "react";
 import { ChatMessageViewHydrated } from "streamplace";
 import { createStore, StoreApi, useStore } from "zustand";
+import { useLivestreamStore } from "../livestream-store";
 import { PlayerContext } from "./context";
 import {
   IngestMediaSource,
@@ -68,9 +70,6 @@ export const makePlayerStore = (id?: string): StoreApi<PlayerState> => {
     playTime: 0,
     setPlayTime: (playTime: number) => set(() => ({ playTime })),
 
-    offline: false,
-    setOffline: (offline: boolean) => set(() => ({ offline })),
-
     videoRef: undefined,
     setVideoRef: (
       videoRef:
@@ -114,6 +113,10 @@ export const makePlayerStore = (id?: string): StoreApi<PlayerState> => {
     ingestLive: false,
     setIngestLive: (ingestLive: boolean) => set(() => ({ ingestLive })),
 
+    reportingURL: null,
+    setReportingURL: (reportingURL: string | null) =>
+      set(() => ({ reportingURL })),
+
     playerEvent: async (
       url: string,
       time: string,
@@ -131,7 +134,8 @@ export const makePlayerStore = (id?: string): StoreApi<PlayerState> => {
         };
         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),
           });
@@ -168,6 +172,15 @@ export const makePlayerStore = (id?: string): StoreApi<PlayerState> => {
     modMessage: null,
     setModMessage: (modMessage: ChatMessageViewHydrated | null) =>
       set(() => ({ modMessage })),
+
+    reportModalOpen: false,
+    setReportModalOpen: (reportModalOpen: boolean) =>
+      set(() => ({ reportModalOpen })),
+
+    reportSubject: null,
+    setReportSubject: (
+      subject: ComAtprotoModerationCreateReport.InputSchema["subject"] | null,
+    ) => set(() => ({ reportSubject: subject })),
   }));
 };
 
@@ -242,3 +255,23 @@ export const intoPlayerProtocol = (protocol: string): PlayerProtocol => {
       return PlayerProtocol.WEBRTC;
   }
 };
+
+// returns true if the livestream has been offline for more than 10 seconds and we're not playing
+export const useOffline = () => {
+  const status = usePlayerStore((x) => x.status);
+  const segment = useLivestreamStore((x) => x.segment);
+  const [now, setNow] = useState(Date.now());
+  useEffect(() => {
+    const interval = setInterval(() => {
+      setNow(Date.now());
+    }, 500);
+    return () => clearInterval(interval);
+  }, []);
+  if (status === PlayerStatus.PLAYING) {
+    return false;
+  }
+  if (!segment?.startTime) {
+    return false;
+  }
+  return now - Date.parse(segment.startTime) > 10000;
+};

package/src/streamplace-store/block.tsx

@@ -1,10 +1,12 @@
 import { AppBskyGraphBlock } from "@atproto/api";
+import { useState } from "react";
 import { usePDSAgent } from "./xrpc";
 
 export function useCreateBlockRecord() {
   let agent = usePDSAgent();
+  const [isLoading, setIsLoading] = useState(false);
 
-  return async (subjectDID: string) => {
+  const createBlock = async (subjectDID: string) => {
     if (!agent) {
       throw new Error("No PDS agent found");
     }
@@ -13,17 +15,57 @@ export function useCreateBlockRecord() {
       throw new Error("No user DID found, assuming not logged in");
     }
 
-    const record: AppBskyGraphBlock.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: AppBskyGraphBlock.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 };
+}
+
+export function useCreateHideChatRecord() {
+  let agent = usePDSAgent();
+  const [isLoading, setIsLoading] = useState(false);
+
+  const createHideChat = async (chatMessageUri: string) => {
+    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/src/ui/index.ts

@@ -0,0 +1,86 @@
+/**
+ * @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.
+ */
+
+// Export the most commonly used ZeroCSS utilities
+export {
+  // Core atoms object
+  atoms,
+  // Common shorthand utilities
+  bg,
+  // Border utilities
+  borders,
+  bottom,
+  // Flex utilities
+  flex,
+  // Gap utilities (React Native 0.71+)
+  gap,
+  h,
+  // Layout utilities
+  layout,
+  left,
+  m,
+  mb,
+  ml,
+  mr,
+  mt,
+  mx,
+  my,
+  p,
+  pb,
+  pl,
+  // Position utilities
+  position,
+  pr,
+  pt,
+  px,
+  py,
+  r,
+  right,
+  text,
+  top,
+  w,
+} from "../lib/theme/atoms";
+
+// Export ZeroCSS design tokens
+export {
+  borderRadius,
+  breakpoints,
+  colors,
+  shadows,
+  spacing,
+  typography,
+} from "../lib/theme/tokens";
+
+// Export ZeroCSS utility functions
+export {
+  debounce,
+  mergeStyles,
+  platformStyle,
+  responsiveValue,
+} from "../lib/utils";
+
+// Export ZeroCSS theme system
+export {
+  ThemeProvider,
+  createThemeColors,
+  createThemeIcons,
+  createThemeStyles,
+  createThemedStyles,
+  darkTheme,
+  lightTheme,
+  usePlatformTypography,
+  useTheme,
+  type Theme,
+  type ThemeIcons,
+  type ThemeStyles,
+} from "../lib/theme/theme";
+
+// Namespace exports for power users
+export * as theme from "../lib/theme";
+export * as atomsNS from "../lib/theme/atoms";
+export * as tokens from "../lib/theme/tokens";
+export * as utils from "../lib/utils";