Add useListStream hook

app/soapbox/actions/streaming.ts

@@ -193,9 +193,6 @@ const connectTimelineStream = (
 const connectHashtagStream   = (id: string, tag: string, accept: (status: APIEntity) => boolean) =>
   connectTimelineStream(`hashtag:${id}`, `hashtag&tag=${tag}`, null, accept);
 
-const connectListStream      = (id: string) =>
-  connectTimelineStream(`list:${id}`, `list&list=${id}`);
-
 const connectGroupStream     = (id: string) =>
   connectTimelineStream(`group:${id}`, `group&group=${id}`);
 
@@ -204,7 +201,6 @@ export {
   STREAMING_FOLLOW_RELATIONSHIPS_UPDATE,
   connectTimelineStream,
   connectHashtagStream,
-  connectListStream,
   connectGroupStream,
   type TimelineStreamOpts,
 };

app/soapbox/api/hooks/index.ts

@@ -49,5 +49,6 @@ export { useUserStream } from './streaming/useUserStream';
 export { useCommunityStream } from './streaming/useCommunityStream';
 export { usePublicStream } from './streaming/usePublicStream';
 export { useDirectStream } from './streaming/useDirectStream';
+export { useListStream } from './streaming/useListStream';
 export { useRemoteStream } from './streaming/useRemoteStream';
 export { useNostrStream } from './streaming/useNostrStream';

app/soapbox/api/hooks/streaming/useListStream.ts

@@ -0,0 +1,10 @@
+import { useTimelineStream } from './useTimelineStream';
+
+function useListStream(listId: string) {
+  return useTimelineStream(
+    `list:${listId}`,
+    `list&list=${listId}`,
+  );
+}
+
+export { useListStream };

app/soapbox/features/list-timeline/index.tsx

@@ -4,8 +4,8 @@ import { useParams } from 'react-router-dom';
 
 import { fetchList } from 'soapbox/actions/lists';
 import { openModal } from 'soapbox/actions/modals';
-import { connectListStream } from 'soapbox/actions/streaming';
 import { expandListTimeline } from 'soapbox/actions/timelines';
+import { useListStream } from 'soapbox/api/hooks';
 import MissingIndicator from 'soapbox/components/missing-indicator';
 import { Column, Button, Spinner } from 'soapbox/components/ui';
 import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
@@ -19,15 +19,11 @@ const ListTimeline: React.FC = () => {
   const list = useAppSelector((state) => state.lists.get(id));
   const next = useAppSelector(state => state.timelines.get(`list:${id}`)?.next);
 
+  useListStream(id);
+
   useEffect(() => {
     dispatch(fetchList(id));
     dispatch(expandListTimeline(id));
-
-    const disconnect = dispatch(connectListStream(id));
-
-    return () => {
-      disconnect();
-    };
   }, [id]);
 
   const handleLoadMore = (maxId: string) => {