add real-time infrastructure (#137)

* setup infra for pusher service

* setup client sdk for pusher service

* fix: ping parse failure

* fix: send pong back to client

avoid disconnections every 2.5 minutes

* increase replicas

* feat: show presence and compose indicator

js/src/features/compose/compose-overlay.tsx

@@ -17,7 +17,7 @@ import { createImageThumbnail } from "@/lib/image-thumbnail";
 import { MAX_ATTACHMENT_SIZE_BYTES, MAX_ATTACHMENTS } from "@/lib/constants";
 import type { PendingAttachment } from "@/features/compose/attachment-strip";
 
-type ComposeStep = "idle" | "picking" | "recording" | "reviewing" | "typing" | "configuring" | "submitting";
+export type ComposeStep = "idle" | "picking" | "recording" | "reviewing" | "typing" | "configuring" | "submitting";
 
 type RecordingSource = "media" | "screen";
 
@@ -26,6 +26,7 @@ interface ComposeOverlayProps {
   // Optional target path for reply mode. If not provided, compose creates a new stream.
   targetPath?: ParticlePath;
   onActiveChange?: (active: boolean) => void;
+  onStepChange?: (step: ComposeStep) => void;
   onParticleCreated?: (particleId: string) => void;
   /** When true, composing is blocked (e.g. stream is closed). */
   disabled?: boolean;
@@ -42,6 +43,7 @@ export function ComposeOverlay({
   networkId,
   targetPath,
   onActiveChange,
+  onStepChange,
   onParticleCreated,
   disabled,
 }: ComposeOverlayProps) {
@@ -77,7 +79,8 @@ export function ComposeOverlay({
   // Notify parent when active state changes
   useEffect(() => {
     onActiveChange?.(step !== "idle");
-  }, [step, onActiveChange]);
+    onStepChange?.(step);
+  }, [step, onActiveChange, onStepChange]);
 
   const revokeAttachmentThumbnails = useCallback((items: PendingAttachment[]) => {
     for (const a of items) {