feat(stream): add streaming endpoint and indicator

frontend/src/components/Topbar.tsx

@@ -16,6 +16,7 @@ type props = {
     setSidebarToggled: (toggled: boolean) => void;
     user: User | null;
     fetchUser: () => void;
+    isStreaming: boolean;
     className?: string;
 }
 
@@ -24,6 +25,7 @@ const Topbar = ({
                     setSidebarToggled,
                     user,
                     fetchUser,
+                    isStreaming,
                     className}: props) => {
 
     const navigate = useNavigate();
@@ -69,7 +71,17 @@ const Topbar = ({
                         referrerPolicy="no-referrer"
                     />
 
-                    <Dropdown label={user.name}>
+                    <Dropdown label={
+                        <span className="flex items-center gap-1.5">
+                            {user.name}
+                            {isStreaming && (
+                                <span className="relative flex h-2 w-2">
+                                    <span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-red-500 opacity-75" />
+                                    <span className="relative inline-flex rounded-full h-2 w-2 bg-red-500" />
+                                </span>
+                            )}
+                        </span>
+                    }>
                         <DropdownItem item="Profile"
                                       onClick={() => navigate("/profile")} />
                         <DropdownItem item="Logout"