Arjun PatelandGitHub
4b66d8e185
* 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
65 lines
2.0 KiB
TypeScript
65 lines
2.0 KiB
TypeScript
import { useParams } from "react-router-dom";
|
|
import { useLiveParticle } from "@/hooks/use-particle";
|
|
import { particlePath } from "@/lib/particle-path";
|
|
import { isContainerType } from "@/api/types";
|
|
import { StreamView } from "@/features/particles/stream-view";
|
|
import { FolderView } from "@/features/particles/folder-view";
|
|
import { ParticleListView } from "@/features/particles/particle-list-view";
|
|
|
|
/**
|
|
* Route-level component for /:networkId/*.
|
|
* Reads params from the router, resolves the particle, and renders
|
|
* the appropriate view based on particle type.
|
|
*/
|
|
export default function ParticleViewResolver() {
|
|
const { networkId, "*": rest } = useParams();
|
|
const segments = (rest ?? "").split("/").filter(Boolean);
|
|
const path = particlePath(networkId!, segments); // path of current container particle
|
|
|
|
const { particle, isLoading, error } = useLiveParticle(path);
|
|
|
|
if (isLoading) {
|
|
return (
|
|
<div className="flex h-full items-center justify-center">
|
|
<p className="text-muted-foreground text-sm">Loading...</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if (error) {
|
|
return (
|
|
<div className="flex h-full items-center justify-center">
|
|
<p className="text-destructive text-sm">Failed to load particle</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
if (!particle) {
|
|
return (
|
|
<div className="flex h-full items-center justify-center">
|
|
<p className="text-muted-foreground text-sm">
|
|
Particle: {segments.join(" / ")}
|
|
</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
switch (particle.type) {
|
|
case "stream":
|
|
return <StreamView streamParticle={particle} path={path} />;
|
|
case "folder":
|
|
return <FolderView folderParticle={particle} path={path} />;
|
|
default:
|
|
if (isContainerType(particle.type)) {
|
|
return <ParticleListView path={path} />;
|
|
}
|
|
return (
|
|
<div className="flex h-full items-center justify-center">
|
|
<p className="text-muted-foreground text-sm">
|
|
{particle.type} particle: {particle.id}
|
|
</p>
|
|
</div>
|
|
);
|
|
}
|
|
}
|