feat: initial conversational flow (#37)

* chore: only set visibility for container particles

* create reusable controls indicator for reply or new

* compress the size of top bar

* refactor: restructure state, routing, and more

* introduce stream compose flow

* feat: compose new stream full flow

* implement stream player

* fix: prevent redirect for signed object urls

* fix: implement stream playback cleaner structure

* refactor: layout file name

* feat: show stream name in breadcrumbs

* chore: tweak padding

* chore: adjust position of audio bars

* feat: show latest particle preview in stream list

* fix: remove console log

* refactor: reorder classes

* fix: avoid passing in updated_at to firestore particle

* refactor: extract properties for container particles to flat fields in firestore

* make the stream previews look alive

* feat: show audio bars during audio clip playback

* feat: order streams by last child creation

* feat: playback where I left off

* chore: remove unused store

* fix: recording mode not using shared state

* chore: clean unused variable

* remove unused imports

* fix: improve controls indicator immersion

* feat: show playback progress in bar & auto-play text

* feat: auto-exit stream on playback completion

* fix: jittery media playback progress

* fix: navigate during state change is invalid with react router

* fix: buggy exit progress when changing clips

* feat: add app icon

* update package.json info

* feat: only show streams visible to me

* feat: show seen indicator on particles

* fix: prevent unnecessary effects

* fix: play new particle after playback is ended

* use contols indicator for exit timer

js/src/hooks/use-create-particle.ts

@@ -1,24 +1,53 @@
 import { useMutation } from "@tanstack/react-query";
-import { createParticle } from "@/lib/firestore-particles";
+import { createParticle, updateStreamLastChildAt } from "@/lib/firestore-particles";
 import type { ParticleType, ParticlePropertiesMap } from "@/api/types";
+import { particlePath, ParticlePath, toFirestoreChildrenPath, toFirestoreDocPath } from "@/lib/particle-path";
 
 interface CreateParticleParams<T extends ParticleType = ParticleType> {
-  collectionPath: string;
+  // Path to which the new particle will be added as a child
+  path: ParticlePath;
   type: T;
   properties: ParticlePropertiesMap[T];
   createdByEmail: string;
-  visibleTo: string[];
 }
 
 export function useCreateParticle() {
   return useMutation({
-    mutationFn: (params: CreateParticleParams) =>
-      createParticle(
-        params.collectionPath,
+    mutationFn: async (params: CreateParticleParams) => {
+      const collectionPath = toFirestoreChildrenPath(params.path);
+      const result = await createParticle(
+        collectionPath,
         params.type,
         params.properties,
         params.createdByEmail,
+      );
+
+      const streamDocPath = toFirestoreDocPath(params.path);
+      await updateStreamLastChildAt(streamDocPath);
+      return result;
+    }
+  });
+}
+
+type CreateStreamParticleParams = {
+  networkId: string;
+  properties: ParticlePropertiesMap["stream"];
+  createdByEmail: string;
+  visibleTo?: string[];
+};
+
+export function useCreateStreamParticle() {
+  return useMutation({
+    mutationFn: async (params: CreateStreamParticleParams) => {
+      const path = particlePath(params.networkId, []);
+      const networkCollectionPath = toFirestoreChildrenPath(path);
+      return await createParticle(
+        networkCollectionPath,
+        "stream",
+        params.properties,
+        params.createdByEmail,
         params.visibleTo,
-      ),
+      );
+    }
   });
 }