Contexts: component TypeScript fixes

app/soapbox/features/status/components/thread-status.tsx

@@ -11,11 +11,12 @@ interface IThreadStatus {
   focusedStatusId: string,
 }
 
+/** Status with reply-connector in threads. */
 const ThreadStatus: React.FC<IThreadStatus> = (props): JSX.Element => {
   const { id, focusedStatusId } = props;
 
-  const replyToId = useAppSelector(state => state.contexts.getIn(['inReplyTos', id]));
-  const replyCount = useAppSelector(state => state.contexts.getIn(['replies', id], ImmutableOrderedSet()).size);
+  const replyToId = useAppSelector(state => state.contexts.inReplyTos.get(id));
+  const replyCount = useAppSelector(state => state.contexts.replies.get(id, ImmutableOrderedSet()).size);
   const isLoaded = useAppSelector(state => Boolean(state.statuses.get(id)));
 
   const renderConnector = (): JSX.Element | null => {

app/soapbox/features/status/index.tsx

@@ -97,11 +97,11 @@ const makeMapStateToProps = () => {
   const getStatus = makeGetStatus();
 
   const getAncestorsIds = createSelector([
-    (_: RootState, statusId: string) => statusId,
-    (state: RootState) => state.contexts.get('inReplyTos'),
+    (_: RootState, statusId: string | undefined) => statusId,
+    (state: RootState) => state.contexts.inReplyTos,
   ], (statusId, inReplyTos) => {
-    let ancestorsIds = ImmutableOrderedSet();
-    let id = statusId;
+    let ancestorsIds = ImmutableOrderedSet<string>();
+    let id: string | undefined = statusId;
 
     while (id && !ancestorsIds.includes(id)) {
       ancestorsIds = ImmutableOrderedSet([id]).union(ancestorsIds);
@@ -113,13 +113,15 @@ const makeMapStateToProps = () => {
 
   const getDescendantsIds = createSelector([
     (_: RootState, statusId: string) => statusId,
-    (state: RootState) => state.contexts.get('replies'),
+    (state: RootState) => state.contexts.replies,
   ], (statusId, contextReplies) => {
     let descendantsIds = ImmutableOrderedSet();
     const ids = [statusId];
 
     while (ids.length > 0) {
-      const id      = ids.shift();
+      const id = ids.shift();
+      if (!id) break;
+
       const replies = contextReplies.get(id);
 
       if (descendantsIds.includes(id)) {
@@ -147,7 +149,7 @@ const makeMapStateToProps = () => {
 
     if (status) {
       const statusId = status.id;
-      ancestorsIds = getAncestorsIds(state, state.contexts.getIn(['inReplyTos', statusId]));
+      ancestorsIds = getAncestorsIds(state, state.contexts.inReplyTos.get(statusId));
       descendantsIds = getDescendantsIds(state, statusId);
       ancestorsIds = ancestorsIds.delete(statusId).subtract(descendantsIds);
       descendantsIds = descendantsIds.delete(statusId).subtract(ancestorsIds);