feat: jump to my newly created particle once created

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

@@ -17,6 +17,7 @@ interface ComposeOverlayProps {
   // Optional target path for reply mode. If not provided, compose creates a new stream.
   targetPath?: ParticlePath;
   onActiveChange?: (active: boolean) => void;
+  onParticleCreated?: (particleId: string) => void;
 }
 
 
@@ -30,6 +31,7 @@ export function ComposeOverlay({
   networkId,
   targetPath,
   onActiveChange,
+  onParticleCreated,
 }: ComposeOverlayProps) {
   const [step, setStep] = useState<ComposeStep>("idle");
   const [error, setError] = useState<string | null>(null);
@@ -113,8 +115,9 @@ export function ComposeOverlay({
     async (path: ParticlePath) => {
       if (!userEmail) return;
 
+      let particleId = '';
       if (textContent.trim()) {
-        await createParticle.mutateAsync({
+        particleId = await createParticle.mutateAsync({
           path,
           type: "text",
           properties: { content: textContent },
@@ -126,7 +129,7 @@ export function ComposeOverlay({
           reviewMimeType,
         );
 
-        await createParticle.mutateAsync({
+        particleId = await createParticle.mutateAsync({
           path,
           type: "media",
           properties: {
@@ -138,6 +141,8 @@ export function ComposeOverlay({
           createdByEmail: userEmail,
         });
       }
+
+      onParticleCreated?.(particleId);
     },
     [
       userEmail,
@@ -147,6 +152,7 @@ export function ComposeOverlay({
       reviewDurationMs,
       createParticle,
       uploadMedia,
+      onParticleCreated
     ],
   );
 

js/src/features/particles/stream-view.tsx

@@ -110,6 +110,7 @@ export function StreamView({ path, streamParticle }: StreamViewProps) {
     next,
     prev,
     goTo,
+    goToParticle,
     pause,
     resume,
   } = useStreamPlayback(streamParticle, path);
@@ -188,6 +189,11 @@ export function StreamView({ path, streamParticle }: StreamViewProps) {
     [prev, next],
   );
 
+  const onLocalParticleCreated = useCallback(
+    (particleId: string) => {
+      goToParticle(particleId);
+    }, [goToParticle]);
+
   if (children.length === 0) {
     return (
       <div className="flex h-full flex-col items-center justify-center gap-4 bg-black text-white">
@@ -264,6 +270,7 @@ export function StreamView({ path, streamParticle }: StreamViewProps) {
         networkId={networkId!}
         targetPath={path}
         onActiveChange={setComposeActive}
+        onParticleCreated={onLocalParticleCreated}
       />
 
       {/* Bottom overlay: stream info + reply */}