stream-chat-react-native-core 3.10.2 → 4.0.0-beta.4

package/src/components/Thread/__tests__/__snapshots__/Thread.test.js.snap

@@ -31,1292 +31,1359 @@ exports[`Thread should match thread snapshot 1`] = `
           Object {},
         ]
       }
+      testID="message-flat-list-wrapper"
     >
-      <View
+      <RCTScrollView
+        ListEmptyComponent={[Function]}
         ListFooterComponent={null}
+        ListHeaderComponent={[Function]}
+        contentContainerStyle={
+          Array [
+            Object {
+              "flexGrow": 1,
+              "paddingBottom": 4,
+            },
+            Object {},
+          ]
+        }
+        data={
+          Array [
+            Object {
+              "__html": "<p>regular</p>",
+              "attachments": Array [],
+              "created_at": 2020-05-05T14:50:00.000Z,
+              "dateSeparator": undefined,
+              "groupStyles": Array [
+                "single",
+              ],
+              "html": "<p>regular</p>",
+              "id": "38ef6f7c-3090-5759-a37f-ab0053aadb96",
+              "parent_id": "b4612a73-fa2b-5787-bf71-1adc8f291a04",
+              "pinned_at": null,
+              "readBy": false,
+              "status": "received",
+              "text": "Message6",
+              "type": "regular",
+              "updated_at": 2020-05-05T14:50:00.000Z,
+              "user": Object {
+                "banned": false,
+                "created_at": "2020-04-27T13:39:49.331742Z",
+                "id": "arthur",
+                "image": "https://i.imgur.com/LuuGvh0.png",
+                "name": "Arthur",
+                "online": false,
+                "role": "user",
+                "updated_at": "2020-04-27T13:39:49.332087Z",
+              },
+            },
+            Object {
+              "__html": "<p>regular</p>",
+              "attachments": Array [],
+              "created_at": 2020-05-05T14:50:00.000Z,
+              "dateSeparator": undefined,
+              "groupStyles": Array [
+                "single",
+              ],
+              "html": "<p>regular</p>",
+              "id": "516efa25-5d29-5c9a-ad2d-4cc183e785bd",
+              "parent_id": "b4612a73-fa2b-5787-bf71-1adc8f291a04",
+              "pinned_at": null,
+              "readBy": false,
+              "status": "received",
+              "text": "Message5",
+              "type": "regular",
+              "updated_at": 2020-05-05T14:50:00.000Z,
+              "user": Object {
+                "banned": false,
+                "created_at": "2020-04-27T13:39:49.331742Z",
+                "id": "finn",
+                "image": "https://i.imgur.com/spueyAP.png",
+                "name": "Finn",
+                "online": false,
+                "role": "user",
+                "updated_at": "2020-04-27T13:39:49.332087Z",
+              },
+            },
+            Object {
+              "__html": "<p>regular</p>",
+              "attachments": Array [],
+              "created_at": 2020-05-05T14:50:00.000Z,
+              "dateSeparator": 2020-05-05T14:50:00.000Z,
+              "groupStyles": Array [
+                "single",
+              ],
+              "html": "<p>regular</p>",
+              "id": "82a83b16-b611-527c-b3ac-765ef6220490",
+              "parent_id": "b4612a73-fa2b-5787-bf71-1adc8f291a04",
+              "pinned_at": null,
+              "readBy": false,
+              "status": "received",
+              "text": "Message4",
+              "type": "regular",
+              "updated_at": 2020-05-05T14:50:00.000Z,
+              "user": Object {
+                "banned": false,
+                "created_at": "2020-04-27T13:39:49.331742Z",
+                "id": "arthur",
+                "image": "https://i.imgur.com/LuuGvh0.png",
+                "name": "Arthur",
+                "online": false,
+                "role": "user",
+                "updated_at": "2020-04-27T13:39:49.332087Z",
+              },
+            },
+          ]
+        }
+        disableVirtualization={false}
+        extraData={false}
+        getItem={[Function]}
+        getItemCount={[Function]}
+        horizontal={false}
+        initialNumToRender={10}
+        invertStickyHeaders={true}
+        inverted={true}
+        keyExtractor={[Function]}
+        keyboardShouldPersistTaps="handled"
+        maintainVisibleContentPosition={
+          Object {
+            "autoscrollToTopThreshold": 10,
+            "minIndexForVisible": 1,
+          }
+        }
+        maxToRenderPerBatch={10}
+        onContentSizeChange={[Function]}
+        onEndReachedThreshold={2}
+        onLayout={[Function]}
+        onMomentumScrollEnd={[Function]}
+        onScroll={[Function]}
+        onScrollBeginDrag={[Function]}
+        onScrollEndDrag={[Function]}
+        onTouchEnd={[Function]}
+        onViewableItemsChanged={[Function]}
+        removeClippedSubviews={false}
+        renderItem={[Function]}
+        scrollEnabled={false}
+        scrollEventThrottle={50}
+        stickyHeaderIndices={Array []}
+        style={
+          Array [
+            Object {
+              "transform": Array [
+                Object {
+                  "scaleY": -1,
+                },
+              ],
+            },
+            Array [
+              Object {
+                "flex": 1,
+                "width": "100%",
+              },
+              Object {},
+            ],
+          ]
+        }
+        testID="message-flat-list"
+        updateCellsBatchingPeriod={50}
+        viewabilityConfig={
+          Object {
+            "viewAreaCoveragePercentThreshold": 1,
+          }
+        }
+        viewabilityConfigCallbackPairs={
+          Array [
+            Object {
+              "onViewableItemsChanged": [Function],
+              "viewabilityConfig": Object {
+                "viewAreaCoveragePercentThreshold": 1,
+              },
+            },
+          ]
+        }
+        windowSize={21}
       >
         <View>
           <View
-            animatedStyle={
+            onLayout={[Function]}
+            style={
               Object {
-                "value": Object {},
+                "transform": Array [
+                  Object {
+                    "scaleY": -1,
+                  },
+                ],
               }
             }
-            collapsable={false}
-            forwardedRef={[Function]}
-            onGestureHandlerEvent={[Function]}
-            onGestureHandlerStateChange={[Function]}
-            testID="message-wrapper"
-          >
-            <View
-              animatedStyle={
+          />
+          <View
+            onLayout={[Function]}
+            style={
+              Array [
                 Object {
-                  "value": Object {
-                    "transform": Array [
-                      Object {
-                        "scale": 1,
-                      },
-                    ],
-                  },
-                }
-              }
-              collapsable={false}
-              forwardedRef={[Function]}
-              onGestureHandlerEvent={[Function]}
-              onGestureHandlerStateChange={[Function]}
-              style={
+                  "flexDirection": "column-reverse",
+                },
                 Object {
-                  "backgroundColor": undefined,
-                  "paddingHorizontal": 8,
                   "transform": Array [
                     Object {
-                      "scale": 1,
+                      "scaleY": -1,
                     },
                   ],
-                }
-              }
+                },
+              ]
+            }
+          >
+            <View
+              testID="message-list-item-0"
             >
-              <View
-                animatedStyle={
-                  Object {
-                    "value": Object {
-                      "opacity": 0,
-                    },
-                  }
-                }
-                collapsable={false}
-                style={
-                  Object {
-                    "backgroundColor": "#FBF4DD",
-                    "bottom": 0,
-                    "left": 0,
-                    "opacity": 0,
-                    "position": "absolute",
-                    "right": 0,
-                    "top": 0,
-                  }
-                }
-              />
               <View
                 style={
                   Array [
-                    Object {
-                      "alignItems": "flex-end",
-                      "flexDirection": "row",
-                    },
-                    Object {
-                      "justifyContent": "flex-start",
-                      "marginBottom": 8,
-                      "marginTop": 0,
-                    },
-                    Object {},
+                    undefined,
                   ]
                 }
-                testID="message-simple-wrapper"
+                testID="message-wrapper"
               >
                 <View
                   style={
                     Array [
                       Object {
-                        "marginRight": 8,
+                        "paddingHorizontal": 8,
+                      },
+                      Object {
+                        "backgroundColor": undefined,
                       },
-                      Object {},
                     ]
                   }
-                  testID="message-avatar"
-                >
-                  <View>
-                    <View
-                      style={
-                        Array [
-                          Object {
-                            "alignItems": "center",
-                            "justifyContent": "center",
-                            "overflow": "hidden",
-                          },
-                          Object {
-                            "borderRadius": 16,
-                            "height": 32,
-                            "width": 32,
-                          },
-                          Object {},
-                          undefined,
-                        ]
-                      }
-                    >
-                      <Image
-                        accessibilityLabel="avatar-image"
-                        onError={[Function]}
-                        source={
-                          Object {
-                            "uri": "https://i.imgur.com/SLx06PP.png",
-                          }
-                        }
-                        style={
-                          Array [
-                            Object {
-                              "borderRadius": 16,
-                              "height": 32,
-                              "width": 32,
-                            },
-                            Object {
-                              "borderRadius": 16,
-                              "height": 32,
-                              "width": 32,
-                            },
-                            undefined,
-                          ]
-                        }
-                        testID="avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-                <View
-                  accessible={true}
-                  focusable={true}
-                  onClick={[Function]}
-                  onResponderGrant={[Function]}
-                  onResponderMove={[Function]}
-                  onResponderRelease={[Function]}
-                  onResponderTerminate={[Function]}
-                  onResponderTerminationRequest={[Function]}
-                  onStartShouldSetResponder={[Function]}
-                  style={
-                    Object {
-                      "alignItems": "flex-start",
-                      "opacity": 1,
-                      "paddingTop": 2,
-                    }
-                  }
                 >
                   <View
-                    onLayout={[Function]}
-                    style={Object {}}
+                    style={
+                      Array [
+                        Object {},
+                      ]
+                    }
                   >
                     <View
                       style={
                         Array [
                           Object {
-                            "borderTopLeftRadius": 16,
-                            "borderTopRightRadius": 16,
-                            "borderWidth": 1,
-                            "overflow": "hidden",
+                            "alignItems": "flex-end",
+                            "flexDirection": "row",
                           },
                           Object {
-                            "backgroundColor": "transparent",
-                            "borderBottomLeftRadius": 0,
-                            "borderBottomRightRadius": 16,
-                            "borderColor": "#ECEBEB",
+                            "justifyContent": "flex-start",
+                            "marginBottom": 8,
+                            "marginTop": 0,
                           },
                           Object {},
-                          Object {},
                         ]
                       }
-                      testID="message-content-wrapper"
+                      testID="message-simple-wrapper"
                     >
                       <View
                         style={
                           Array [
                             Object {
-                              "maxWidth": 250,
-                              "paddingHorizontal": 16,
+                              "marginRight": 8,
                             },
                             Object {},
-                            undefined,
                           ]
                         }
-                        testID="message-text-container"
+                        testID="message-avatar"
                       >
-                        <View
-                          style={
-                            Array [
-                              Object {
-                                "alignSelf": "stretch",
-                              },
-                              undefined,
-                            ]
+                        <View>
+                          <View
+                            style={
+                              Array [
+                                Object {
+                                  "alignItems": "center",
+                                  "justifyContent": "center",
+                                  "overflow": "hidden",
+                                },
+                                Object {
+                                  "borderRadius": 16,
+                                  "height": 32,
+                                  "width": 32,
+                                },
+                                Object {},
+                                undefined,
+                              ]
+                            }
+                          >
+                            <Image
+                              accessibilityLabel="avatar-image"
+                              onError={[Function]}
+                              source={
+                                Object {
+                                  "uri": "https://i.imgur.com/LuuGvh0.png",
+                                }
+                              }
+                              style={
+                                Array [
+                                  Object {
+                                    "borderRadius": 16,
+                                    "height": 32,
+                                    "width": 32,
+                                  },
+                                  Object {
+                                    "borderRadius": 16,
+                                    "height": 32,
+                                    "width": 32,
+                                  },
+                                  undefined,
+                                ]
+                              }
+                              testID="avatar-image"
+                            />
+                          </View>
+                        </View>
+                      </View>
+                      <View
+                        accessible={true}
+                        focusable={true}
+                        onClick={[Function]}
+                        onResponderGrant={[Function]}
+                        onResponderMove={[Function]}
+                        onResponderRelease={[Function]}
+                        onResponderTerminate={[Function]}
+                        onResponderTerminationRequest={[Function]}
+                        onStartShouldSetResponder={[Function]}
+                        style={
+                          Object {
+                            "alignItems": "flex-start",
+                            "opacity": 1,
+                            "paddingTop": 2,
                           }
+                        }
+                        testID="message-content"
+                      >
+                        <View
+                          onLayout={[Function]}
+                          style={Object {}}
                         >
-                          <Text
+                          <View
                             style={
-                              Object {
-                                "alignItems": "flex-start",
-                                "flexDirection": "row",
-                                "flexWrap": "wrap",
-                                "justifyContent": "flex-start",
-                                "marginBottom": 8,
-                                "marginTop": 8,
-                              }
+                              Array [
+                                Object {
+                                  "borderTopLeftRadius": 16,
+                                  "borderTopRightRadius": 16,
+                                  "borderWidth": 1,
+                                  "overflow": "hidden",
+                                },
+                                Object {
+                                  "backgroundColor": "#FFFFFF",
+                                  "borderBottomLeftRadius": 0,
+                                  "borderBottomRightRadius": 16,
+                                  "borderColor": "#ECEBEB",
+                                },
+                                Object {},
+                                Object {},
+                              ]
                             }
+                            testID="message-content-wrapper"
                           >
-                            <Text
+                            <View
                               style={
-                                Object {
-                                  "color": "#000000",
-                                }
+                                Array [
+                                  Object {
+                                    "maxWidth": 250,
+                                    "paddingHorizontal": 16,
+                                  },
+                                  Object {},
+                                  undefined,
+                                ]
                               }
+                              testID="message-text-container"
                             >
-                              Message6
-                            </Text>
+                              <View
+                                style={
+                                  Array [
+                                    Object {
+                                      "alignSelf": "stretch",
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              >
+                                <Text
+                                  style={
+                                    Object {
+                                      "alignItems": "flex-start",
+                                      "flexDirection": "row",
+                                      "flexWrap": "wrap",
+                                      "justifyContent": "flex-start",
+                                      "marginBottom": 8,
+                                      "marginTop": 8,
+                                    }
+                                  }
+                                >
+                                  <Text
+                                    style={
+                                      Object {
+                                        "color": "#000000",
+                                      }
+                                    }
+                                  >
+                                    Message6
+                                  </Text>
+                                </Text>
+                              </View>
+                            </View>
+                          </View>
+                        </View>
+                        <View
+                          style={
+                            Object {
+                              "flexDirection": "row",
+                              "marginTop": 4,
+                            }
+                          }
+                          testID="message-status-time"
+                        >
+                          <Text
+                            style={
+                              Array [
+                                Object {
+                                  "color": "#7A7A7A",
+                                  "textAlign": "left",
+                                },
+                                Object {
+                                  "fontSize": 12,
+                                },
+                              ]
+                            }
+                          >
+                            2:50 PM
                           </Text>
                         </View>
                       </View>
                     </View>
                   </View>
-                  <View
-                    style={
-                      Object {
-                        "flexDirection": "row",
-                        "marginTop": 4,
-                      }
-                    }
-                    testID="message-status-time"
-                  >
-                    <Text
-                      style={
-                        Array [
-                          Object {
-                            "color": "#7A7A7A",
-                            "textAlign": "left",
-                          },
-                          Object {
-                            "fontSize": 12,
-                          },
-                        ]
-                      }
-                    >
-                      2:50 PM
-                    </Text>
-                  </View>
                 </View>
               </View>
             </View>
           </View>
-        </View>
-        <View>
           <View
-            animatedStyle={
-              Object {
-                "value": Object {},
-              }
-            }
-            collapsable={false}
-            forwardedRef={[Function]}
-            onGestureHandlerEvent={[Function]}
-            onGestureHandlerStateChange={[Function]}
-            testID="message-wrapper"
-          >
-            <View
-              animatedStyle={
+            onLayout={[Function]}
+            style={
+              Array [
                 Object {
-                  "value": Object {
-                    "transform": Array [
-                      Object {
-                        "scale": 1,
-                      },
-                    ],
-                  },
-                }
-              }
-              collapsable={false}
-              forwardedRef={[Function]}
-              onGestureHandlerEvent={[Function]}
-              onGestureHandlerStateChange={[Function]}
-              style={
+                  "flexDirection": "column-reverse",
+                },
                 Object {
-                  "backgroundColor": undefined,
-                  "paddingHorizontal": 8,
                   "transform": Array [
                     Object {
-                      "scale": 1,
+                      "scaleY": -1,
                     },
                   ],
-                }
-              }
+                },
+              ]
+            }
+          >
+            <View
+              testID="message-list-item-1"
             >
-              <View
-                animatedStyle={
-                  Object {
-                    "value": Object {
-                      "opacity": 0,
-                    },
-                  }
-                }
-                collapsable={false}
-                style={
-                  Object {
-                    "backgroundColor": "#FBF4DD",
-                    "bottom": 0,
-                    "left": 0,
-                    "opacity": 0,
-                    "position": "absolute",
-                    "right": 0,
-                    "top": 0,
-                  }
-                }
-              />
               <View
                 style={
                   Array [
-                    Object {
-                      "alignItems": "flex-end",
-                      "flexDirection": "row",
-                    },
-                    Object {
-                      "justifyContent": "flex-start",
-                      "marginBottom": 8,
-                      "marginTop": 0,
-                    },
-                    Object {},
+                    undefined,
                   ]
                 }
-                testID="message-simple-wrapper"
+                testID="message-wrapper"
               >
                 <View
                   style={
                     Array [
                       Object {
-                        "marginRight": 8,
+                        "paddingHorizontal": 8,
+                      },
+                      Object {
+                        "backgroundColor": undefined,
                       },
-                      Object {},
                     ]
                   }
-                  testID="message-avatar"
                 >
-                  <View>
+                  <View
+                    style={
+                      Array [
+                        Object {},
+                      ]
+                    }
+                  >
                     <View
                       style={
                         Array [
                           Object {
-                            "alignItems": "center",
-                            "justifyContent": "center",
-                            "overflow": "hidden",
+                            "alignItems": "flex-end",
+                            "flexDirection": "row",
                           },
                           Object {
-                            "borderRadius": 16,
-                            "height": 32,
-                            "width": 32,
+                            "justifyContent": "flex-start",
+                            "marginBottom": 8,
+                            "marginTop": 0,
                           },
                           Object {},
-                          undefined,
                         ]
                       }
+                      testID="message-simple-wrapper"
                     >
-                      <Image
-                        accessibilityLabel="avatar-image"
-                        onError={[Function]}
-                        source={
-                          Object {
-                            "uri": "https://i.imgur.com/T68W8nR_d.webp?maxwidth=728&fidelity=grand",
-                          }
-                        }
+                      <View
                         style={
                           Array [
                             Object {
-                              "borderRadius": 16,
-                              "height": 32,
-                              "width": 32,
-                            },
-                            Object {
-                              "borderRadius": 16,
-                              "height": 32,
-                              "width": 32,
+                              "marginRight": 8,
                             },
-                            undefined,
+                            Object {},
                           ]
                         }
-                        testID="avatar-image"
-                      />
-                    </View>
-                  </View>
-                </View>
-                <View
-                  accessible={true}
-                  focusable={true}
-                  onClick={[Function]}
-                  onResponderGrant={[Function]}
-                  onResponderMove={[Function]}
-                  onResponderRelease={[Function]}
-                  onResponderTerminate={[Function]}
-                  onResponderTerminationRequest={[Function]}
-                  onStartShouldSetResponder={[Function]}
-                  style={
-                    Object {
-                      "alignItems": "flex-start",
-                      "opacity": 1,
-                      "paddingTop": 2,
-                    }
-                  }
-                >
-                  <View
-                    onLayout={[Function]}
-                    style={Object {}}
-                  >
-                    <View
-                      style={
-                        Array [
-                          Object {
-                            "borderTopLeftRadius": 16,
-                            "borderTopRightRadius": 16,
-                            "borderWidth": 1,
-                            "overflow": "hidden",
-                          },
-                          Object {
-                            "backgroundColor": "transparent",
-                            "borderBottomLeftRadius": 0,
-                            "borderBottomRightRadius": 16,
-                            "borderColor": "#ECEBEB",
-                          },
-                          Object {},
-                          Object {},
-                        ]
-                      }
-                      testID="message-content-wrapper"
-                    >
+                        testID="message-avatar"
+                      >
+                        <View>
+                          <View
+                            style={
+                              Array [
+                                Object {
+                                  "alignItems": "center",
+                                  "justifyContent": "center",
+                                  "overflow": "hidden",
+                                },
+                                Object {
+                                  "borderRadius": 16,
+                                  "height": 32,
+                                  "width": 32,
+                                },
+                                Object {},
+                                undefined,
+                              ]
+                            }
+                          >
+                            <Image
+                              accessibilityLabel="avatar-image"
+                              onError={[Function]}
+                              source={
+                                Object {
+                                  "uri": "https://i.imgur.com/spueyAP.png",
+                                }
+                              }
+                              style={
+                                Array [
+                                  Object {
+                                    "borderRadius": 16,
+                                    "height": 32,
+                                    "width": 32,
+                                  },
+                                  Object {
+                                    "borderRadius": 16,
+                                    "height": 32,
+                                    "width": 32,
+                                  },
+                                  undefined,
+                                ]
+                              }
+                              testID="avatar-image"
+                            />
+                          </View>
+                        </View>
+                      </View>
                       <View
+                        accessible={true}
+                        focusable={true}
+                        onClick={[Function]}
+                        onResponderGrant={[Function]}
+                        onResponderMove={[Function]}
+                        onResponderRelease={[Function]}
+                        onResponderTerminate={[Function]}
+                        onResponderTerminationRequest={[Function]}
+                        onStartShouldSetResponder={[Function]}
                         style={
-                          Array [
-                            Object {
-                              "maxWidth": 250,
-                              "paddingHorizontal": 16,
-                            },
-                            Object {},
-                            undefined,
-                          ]
+                          Object {
+                            "alignItems": "flex-start",
+                            "opacity": 1,
+                            "paddingTop": 2,
+                          }
                         }
-                        testID="message-text-container"
+                        testID="message-content"
                       >
                         <View
-                          style={
-                            Array [
-                              Object {
-                                "alignSelf": "stretch",
-                              },
-                              undefined,
-                            ]
-                          }
+                          onLayout={[Function]}
+                          style={Object {}}
                         >
-                          <Text
+                          <View
                             style={
-                              Object {
-                                "alignItems": "flex-start",
-                                "flexDirection": "row",
-                                "flexWrap": "wrap",
-                                "justifyContent": "flex-start",
-                                "marginBottom": 8,
-                                "marginTop": 8,
-                              }
+                              Array [
+                                Object {
+                                  "borderTopLeftRadius": 16,
+                                  "borderTopRightRadius": 16,
+                                  "borderWidth": 1,
+                                  "overflow": "hidden",
+                                },
+                                Object {
+                                  "backgroundColor": "#FFFFFF",
+                                  "borderBottomLeftRadius": 0,
+                                  "borderBottomRightRadius": 16,
+                                  "borderColor": "#ECEBEB",
+                                },
+                                Object {},
+                                Object {},
+                              ]
                             }
+                            testID="message-content-wrapper"
                           >
-                            <Text
+                            <View
                               style={
-                                Object {
-                                  "color": "#000000",
-                                }
+                                Array [
+                                  Object {
+                                    "maxWidth": 250,
+                                    "paddingHorizontal": 16,
+                                  },
+                                  Object {},
+                                  undefined,
+                                ]
                               }
+                              testID="message-text-container"
                             >
-                              Message5
-                            </Text>
+                              <View
+                                style={
+                                  Array [
+                                    Object {
+                                      "alignSelf": "stretch",
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              >
+                                <Text
+                                  style={
+                                    Object {
+                                      "alignItems": "flex-start",
+                                      "flexDirection": "row",
+                                      "flexWrap": "wrap",
+                                      "justifyContent": "flex-start",
+                                      "marginBottom": 8,
+                                      "marginTop": 8,
+                                    }
+                                  }
+                                >
+                                  <Text
+                                    style={
+                                      Object {
+                                        "color": "#000000",
+                                      }
+                                    }
+                                  >
+                                    Message5
+                                  </Text>
+                                </Text>
+                              </View>
+                            </View>
+                          </View>
+                        </View>
+                        <View
+                          style={
+                            Object {
+                              "flexDirection": "row",
+                              "marginTop": 4,
+                            }
+                          }
+                          testID="message-status-time"
+                        >
+                          <Text
+                            style={
+                              Array [
+                                Object {
+                                  "color": "#7A7A7A",
+                                  "textAlign": "left",
+                                },
+                                Object {
+                                  "fontSize": 12,
+                                },
+                              ]
+                            }
+                          >
+                            2:50 PM
                           </Text>
                         </View>
                       </View>
                     </View>
                   </View>
-                  <View
-                    style={
-                      Object {
-                        "flexDirection": "row",
-                        "marginTop": 4,
-                      }
-                    }
-                    testID="message-status-time"
-                  >
-                    <Text
-                      style={
-                        Array [
-                          Object {
-                            "color": "#7A7A7A",
-                            "textAlign": "left",
-                          },
-                          Object {
-                            "fontSize": 12,
-                          },
-                        ]
-                      }
-                    >
-                      2:50 PM
-                    </Text>
-                  </View>
                 </View>
               </View>
             </View>
           </View>
-        </View>
-        <View>
           <View
-            animatedStyle={
-              Object {
-                "value": Object {},
-              }
-            }
-            collapsable={false}
-            forwardedRef={[Function]}
-            onGestureHandlerEvent={[Function]}
-            onGestureHandlerStateChange={[Function]}
-            testID="message-wrapper"
-          >
-            <View
-              animatedStyle={
+            onLayout={[Function]}
+            style={
+              Array [
                 Object {
-                  "value": Object {
-                    "transform": Array [
-                      Object {
-                        "scale": 1,
-                      },
-                    ],
-                  },
-                }
-              }
-              collapsable={false}
-              forwardedRef={[Function]}
-              onGestureHandlerEvent={[Function]}
-              onGestureHandlerStateChange={[Function]}
-              style={
+                  "flexDirection": "column-reverse",
+                },
                 Object {
-                  "backgroundColor": undefined,
-                  "paddingHorizontal": 8,
                   "transform": Array [
                     Object {
-                      "scale": 1,
+                      "scaleY": -1,
                     },
                   ],
-                }
-              }
+                },
+              ]
+            }
+          >
+            <View
+              testID="message-list-item-2"
             >
-              <View
-                animatedStyle={
-                  Object {
-                    "value": Object {
-                      "opacity": 0,
-                    },
-                  }
-                }
-                collapsable={false}
-                style={
-                  Object {
-                    "backgroundColor": "#FBF4DD",
-                    "bottom": 0,
-                    "left": 0,
-                    "opacity": 0,
-                    "position": "absolute",
-                    "right": 0,
-                    "top": 0,
-                  }
-                }
-              />
               <View
                 style={
                   Array [
-                    Object {
-                      "alignItems": "flex-end",
-                      "flexDirection": "row",
-                    },
-                    Object {
-                      "justifyContent": "flex-start",
-                      "marginBottom": 8,
-                      "marginTop": 0,
-                    },
-                    Object {},
+                    undefined,
                   ]
                 }
-                testID="message-simple-wrapper"
+                testID="message-wrapper"
               >
                 <View
                   style={
                     Array [
                       Object {
-                        "marginRight": 8,
+                        "paddingHorizontal": 8,
+                      },
+                      Object {
+                        "backgroundColor": undefined,
                       },
-                      Object {},
                     ]
                   }
-                  testID="message-avatar"
                 >
-                  <View>
+                  <View
+                    style={
+                      Array [
+                        Object {},
+                      ]
+                    }
+                  >
                     <View
                       style={
                         Array [
                           Object {
-                            "alignItems": "center",
-                            "justifyContent": "center",
-                            "overflow": "hidden",
+                            "alignItems": "flex-end",
+                            "flexDirection": "row",
                           },
                           Object {
-                            "borderRadius": 16,
-                            "height": 32,
-                            "width": 32,
+                            "justifyContent": "flex-start",
+                            "marginBottom": 8,
+                            "marginTop": 0,
                           },
                           Object {},
-                          undefined,
                         ]
                       }
+                      testID="message-simple-wrapper"
                     >
-                      <Image
-                        accessibilityLabel="avatar-image"
-                        onError={[Function]}
-                        source={
-                          Object {
-                            "uri": "https://i.imgur.com/SLx06PP.png",
-                          }
-                        }
+                      <View
                         style={
                           Array [
                             Object {
-                              "borderRadius": 16,
-                              "height": 32,
-                              "width": 32,
-                            },
-                            Object {
-                              "borderRadius": 16,
-                              "height": 32,
-                              "width": 32,
+                              "marginRight": 8,
                             },
-                            undefined,
+                            Object {},
                           ]
                         }
-                        testID="avatar-image"
-                      />
+                        testID="message-avatar"
+                      >
+                        <View>
+                          <View
+                            style={
+                              Array [
+                                Object {
+                                  "alignItems": "center",
+                                  "justifyContent": "center",
+                                  "overflow": "hidden",
+                                },
+                                Object {
+                                  "borderRadius": 16,
+                                  "height": 32,
+                                  "width": 32,
+                                },
+                                Object {},
+                                undefined,
+                              ]
+                            }
+                          >
+                            <Image
+                              accessibilityLabel="avatar-image"
+                              onError={[Function]}
+                              source={
+                                Object {
+                                  "uri": "https://i.imgur.com/LuuGvh0.png",
+                                }
+                              }
+                              style={
+                                Array [
+                                  Object {
+                                    "borderRadius": 16,
+                                    "height": 32,
+                                    "width": 32,
+                                  },
+                                  Object {
+                                    "borderRadius": 16,
+                                    "height": 32,
+                                    "width": 32,
+                                  },
+                                  undefined,
+                                ]
+                              }
+                              testID="avatar-image"
+                            />
+                          </View>
+                        </View>
+                      </View>
+                      <View
+                        accessible={true}
+                        focusable={true}
+                        onClick={[Function]}
+                        onResponderGrant={[Function]}
+                        onResponderMove={[Function]}
+                        onResponderRelease={[Function]}
+                        onResponderTerminate={[Function]}
+                        onResponderTerminationRequest={[Function]}
+                        onStartShouldSetResponder={[Function]}
+                        style={
+                          Object {
+                            "alignItems": "flex-start",
+                            "opacity": 1,
+                            "paddingTop": 2,
+                          }
+                        }
+                        testID="message-content"
+                      >
+                        <View
+                          onLayout={[Function]}
+                          style={Object {}}
+                        >
+                          <View
+                            style={
+                              Array [
+                                Object {
+                                  "borderTopLeftRadius": 16,
+                                  "borderTopRightRadius": 16,
+                                  "borderWidth": 1,
+                                  "overflow": "hidden",
+                                },
+                                Object {
+                                  "backgroundColor": "#FFFFFF",
+                                  "borderBottomLeftRadius": 0,
+                                  "borderBottomRightRadius": 16,
+                                  "borderColor": "#ECEBEB",
+                                },
+                                Object {},
+                                Object {},
+                              ]
+                            }
+                            testID="message-content-wrapper"
+                          >
+                            <View
+                              style={
+                                Array [
+                                  Object {
+                                    "maxWidth": 250,
+                                    "paddingHorizontal": 16,
+                                  },
+                                  Object {},
+                                  undefined,
+                                ]
+                              }
+                              testID="message-text-container"
+                            >
+                              <View
+                                style={
+                                  Array [
+                                    Object {
+                                      "alignSelf": "stretch",
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                              >
+                                <Text
+                                  style={
+                                    Object {
+                                      "alignItems": "flex-start",
+                                      "flexDirection": "row",
+                                      "flexWrap": "wrap",
+                                      "justifyContent": "flex-start",
+                                      "marginBottom": 8,
+                                      "marginTop": 8,
+                                    }
+                                  }
+                                >
+                                  <Text
+                                    style={
+                                      Object {
+                                        "color": "#000000",
+                                      }
+                                    }
+                                  >
+                                    Message4
+                                  </Text>
+                                </Text>
+                              </View>
+                            </View>
+                          </View>
+                        </View>
+                        <View
+                          style={
+                            Object {
+                              "flexDirection": "row",
+                              "marginTop": 4,
+                            }
+                          }
+                          testID="message-status-time"
+                        >
+                          <Text
+                            style={
+                              Array [
+                                Object {
+                                  "color": "#7A7A7A",
+                                  "textAlign": "left",
+                                },
+                                Object {
+                                  "fontSize": 12,
+                                },
+                              ]
+                            }
+                          >
+                            2:50 PM
+                          </Text>
+                        </View>
+                      </View>
                     </View>
                   </View>
                 </View>
+              </View>
+            </View>
+            <View
+              style={
+                Array [
+                  Object {
+                    "alignItems": "center",
+                    "alignSelf": "center",
+                    "borderRadius": 8,
+                    "height": 16,
+                    "justifyContent": "center",
+                    "marginVertical": 4,
+                    "paddingHorizontal": 8,
+                  },
+                  Object {
+                    "backgroundColor": "#000000CC",
+                  },
+                  Object {},
+                ]
+              }
+              testID="date-separator"
+            >
+              <Text
+                style={
+                  Array [
+                    Object {
+                      "fontSize": 12,
+                      "textAlign": "center",
+                      "textAlignVertical": "center",
+                    },
+                    Object {
+                      "color": "#FFFFFF",
+                    },
+                    Object {},
+                  ]
+                }
+              >
+                May 5, 2020
+              </Text>
+            </View>
+          </View>
+          <View
+            onLayout={[Function]}
+            style={
+              Object {
+                "transform": Array [
+                  Object {
+                    "scaleY": -1,
+                  },
+                ],
+              }
+            }
+          >
+            <View
+              style={
+                Object {
+                  "marginVertical": 8,
+                }
+              }
+              testID="thread-footer-component"
+            >
+              <View
+                style={
+                  Object {
+                    "paddingHorizontal": 8,
+                  }
+                }
+              >
                 <View
-                  accessible={true}
-                  focusable={true}
-                  onClick={[Function]}
-                  onResponderGrant={[Function]}
-                  onResponderMove={[Function]}
-                  onResponderRelease={[Function]}
-                  onResponderTerminate={[Function]}
-                  onResponderTerminationRequest={[Function]}
-                  onStartShouldSetResponder={[Function]}
                   style={
-                    Object {
-                      "alignItems": "flex-start",
-                      "opacity": 1,
-                      "paddingTop": 2,
-                    }
+                    Array [
+                      undefined,
+                    ]
                   }
+                  testID="message-wrapper"
                 >
                   <View
-                    onLayout={[Function]}
-                    style={Object {}}
+                    style={
+                      Array [
+                        undefined,
+                        Object {
+                          "backgroundColor": undefined,
+                        },
+                      ]
+                    }
                   >
                     <View
                       style={
                         Array [
-                          Object {
-                            "borderTopLeftRadius": 16,
-                            "borderTopRightRadius": 16,
-                            "borderWidth": 1,
-                            "overflow": "hidden",
-                          },
-                          Object {
-                            "backgroundColor": "transparent",
-                            "borderBottomLeftRadius": 0,
-                            "borderBottomRightRadius": 16,
-                            "borderColor": "#ECEBEB",
-                          },
-                          Object {},
                           Object {},
                         ]
                       }
-                      testID="message-content-wrapper"
                     >
                       <View
                         style={
                           Array [
                             Object {
-                              "maxWidth": 250,
-                              "paddingHorizontal": 16,
+                              "alignItems": "flex-end",
+                              "flexDirection": "row",
+                            },
+                            Object {
+                              "justifyContent": "flex-start",
+                              "marginBottom": 30,
+                              "marginTop": 0,
                             },
                             Object {},
-                            undefined,
                           ]
                         }
-                        testID="message-text-container"
+                        testID="message-simple-wrapper"
                       >
                         <View
                           style={
                             Array [
                               Object {
-                                "alignSelf": "stretch",
+                                "marginRight": 8,
                               },
-                              undefined,
+                              Object {},
                             ]
                           }
+                          testID="message-avatar"
                         >
-                          <Text
+                          <View>
+                            <View
+                              style={
+                                Array [
+                                  Object {
+                                    "alignItems": "center",
+                                    "justifyContent": "center",
+                                    "overflow": "hidden",
+                                  },
+                                  Object {
+                                    "borderRadius": 16,
+                                    "height": 32,
+                                    "width": 32,
+                                  },
+                                  Object {},
+                                  undefined,
+                                ]
+                              }
+                            >
+                              <Image
+                                accessibilityLabel="avatar-image"
+                                onError={[Function]}
+                                source={
+                                  Object {
+                                    "uri": "https://i.imgur.com/spueyAP.png",
+                                  }
+                                }
+                                style={
+                                  Array [
+                                    Object {
+                                      "borderRadius": 16,
+                                      "height": 32,
+                                      "width": 32,
+                                    },
+                                    Object {
+                                      "borderRadius": 16,
+                                      "height": 32,
+                                      "width": 32,
+                                    },
+                                    undefined,
+                                  ]
+                                }
+                                testID="avatar-image"
+                              />
+                            </View>
+                          </View>
+                        </View>
+                        <View
+                          accessible={true}
+                          focusable={true}
+                          onClick={[Function]}
+                          onResponderGrant={[Function]}
+                          onResponderMove={[Function]}
+                          onResponderRelease={[Function]}
+                          onResponderTerminate={[Function]}
+                          onResponderTerminationRequest={[Function]}
+                          onStartShouldSetResponder={[Function]}
+                          style={
+                            Object {
+                              "alignItems": "flex-start",
+                              "opacity": 1,
+                              "paddingTop": 2,
+                            }
+                          }
+                          testID="message-content"
+                        >
+                          <View
+                            onLayout={[Function]}
+                            style={Object {}}
+                          >
+                            <View
+                              style={
+                                Array [
+                                  Object {
+                                    "borderTopLeftRadius": 16,
+                                    "borderTopRightRadius": 16,
+                                    "borderWidth": 1,
+                                    "overflow": "hidden",
+                                  },
+                                  Object {
+                                    "backgroundColor": "#FFFFFF",
+                                    "borderBottomLeftRadius": 0,
+                                    "borderBottomRightRadius": 16,
+                                    "borderColor": "#ECEBEB",
+                                  },
+                                  Object {},
+                                  Object {},
+                                ]
+                              }
+                              testID="message-content-wrapper"
+                            >
+                              <View
+                                style={
+                                  Array [
+                                    Object {
+                                      "maxWidth": 250,
+                                      "paddingHorizontal": 16,
+                                    },
+                                    Object {},
+                                    undefined,
+                                  ]
+                                }
+                                testID="message-text-container"
+                              >
+                                <View
+                                  style={
+                                    Array [
+                                      Object {
+                                        "alignSelf": "stretch",
+                                      },
+                                      undefined,
+                                    ]
+                                  }
+                                >
+                                  <Text
+                                    style={
+                                      Object {
+                                        "alignItems": "flex-start",
+                                        "flexDirection": "row",
+                                        "flexWrap": "wrap",
+                                        "justifyContent": "flex-start",
+                                        "marginBottom": 8,
+                                        "marginTop": 8,
+                                      }
+                                    }
+                                  >
+                                    <Text
+                                      style={
+                                        Object {
+                                          "color": "#000000",
+                                        }
+                                      }
+                                    >
+                                      Message3
+                                    </Text>
+                                  </Text>
+                                </View>
+                              </View>
+                            </View>
+                          </View>
+                          <View
                             style={
                               Object {
-                                "alignItems": "flex-start",
                                 "flexDirection": "row",
-                                "flexWrap": "wrap",
-                                "justifyContent": "flex-start",
-                                "marginBottom": 8,
-                                "marginTop": 8,
+                                "marginTop": 4,
                               }
                             }
+                            testID="message-status-time"
                           >
                             <Text
                               style={
-                                Object {
-                                  "color": "#000000",
-                                }
+                                Array [
+                                  Object {
+                                    "color": "#7A7A7A",
+                                    "textAlign": "left",
+                                  },
+                                  Object {
+                                    "fontSize": 12,
+                                  },
+                                ]
                               }
                             >
-                              Message4
+                              2:50 PM
                             </Text>
-                          </Text>
+                          </View>
                         </View>
                       </View>
                     </View>
                   </View>
-                  <View
-                    style={
-                      Object {
-                        "flexDirection": "row",
-                        "marginTop": 4,
-                      }
-                    }
-                    testID="message-status-time"
-                  >
-                    <Text
-                      style={
-                        Array [
-                          Object {
-                            "color": "#7A7A7A",
-                            "textAlign": "left",
-                          },
-                          Object {
-                            "fontSize": 12,
-                          },
-                        ]
-                      }
-                    >
-                      2:50 PM
-                    </Text>
-                  </View>
                 </View>
               </View>
-            </View>
-          </View>
-          <View
-            style={
-              Array [
-                Object {
-                  "alignItems": "center",
-                  "alignSelf": "center",
-                  "borderRadius": 8,
-                  "height": 16,
-                  "justifyContent": "center",
-                  "marginVertical": 4,
-                  "paddingHorizontal": 8,
-                },
-                Object {
-                  "backgroundColor": "#00000099",
-                },
-                Object {},
-              ]
-            }
-            testID="date-separator"
-          >
-            <Text
-              style={
-                Array [
-                  Object {
-                    "fontSize": 12,
-                    "textAlign": "center",
-                    "textAlignVertical": "center",
-                  },
-                  Object {
-                    "color": "#FFFFFF",
-                  },
-                  Object {},
-                ]
-              }
-            >
-              May 5, 2020
-            </Text>
-          </View>
-        </View>
-      </View>
-      <View
-        style={
-          Object {
-            "position": "absolute",
-            "top": 0,
-          }
-        }
-      />
-      <View
-        style={
-          Array [
-            Object {
-              "alignItems": "center",
-              "left": 0,
-              "paddingVertical": 4,
-              "position": "absolute",
-              "right": 0,
-              "top": 0,
-            },
-            Object {
-              "backgroundColor": "#7A7A7AE6",
-            },
-            Object {},
-          ]
-        }
-        testID="error-notification"
-      >
-        <Text
-          style={
-            Array [
-              Object {
-                "color": "#FFFFFF",
-                "fontSize": 14,
-              },
-              Object {},
-            ]
-          }
-        >
-          Reconnecting...
-        </Text>
-      </View>
-    </View>
-    <View
-      onLayout={[Function]}
-      style={
-        Array [
-          Object {
-            "borderTopWidth": 1,
-            "padding": 10,
-          },
-          Object {
-            "backgroundColor": "#FFFFFF",
-            "borderColor": "#00000014",
-          },
-          Object {},
-        ]
-      }
-    >
-      <View
-        style={
-          Array [
-            Object {
-              "alignItems": "flex-end",
-              "flexDirection": "row",
-            },
-            Object {},
-          ]
-        }
-      >
-        <View
-          style={
-            Array [
-              Object {
-                "flexDirection": "row",
-                "paddingBottom": 10,
-                "paddingRight": 10,
-              },
-              Object {},
-            ]
-          }
-        >
-          <View
-            style={
-              Array [
-                Object {
-                  "paddingRight": 10,
-                },
-                Object {},
-              ]
-            }
-          >
-            <RNGestureHandlerButton
-              collapsable={false}
-              hitSlop={
-                Object {
-                  "bottom": 15,
-                  "left": 15,
-                  "right": 5,
-                  "top": 15,
-                }
-              }
-              onGestureEvent={[Function]}
-              onGestureHandlerEvent={[Function]}
-              onGestureHandlerStateChange={[Function]}
-              onHandlerStateChange={[Function]}
-              rippleColor={0}
-              testID="attach-button"
-            >
               <View
-                accessible={true}
-                hitSlop={
-                  Object {
-                    "bottom": 15,
-                    "left": 15,
-                    "right": 5,
-                    "top": 15,
-                  }
-                }
                 style={
-                  Object {
-                    "opacity": 1,
-                  }
+                  Array [
+                    Object {
+                      "alignItems": "center",
+                      "height": 24,
+                      "justifyContent": "center",
+                      "marginTop": 8,
+                    },
+                    Object {},
+                  ]
                 }
               >
                 <RNSVGSvgView
-                  align="xMidYMid"
                   bbHeight={24}
-                  bbWidth={24}
+                  bbWidth={750}
                   focusable={false}
                   height={24}
-                  meetOrSlice={0}
-                  minX={0}
-                  minY={0}
-                  pathFill="#7A7A7A"
                   style={
                     Array [
                       Object {
                         "backgroundColor": "transparent",
                         "borderWidth": 0,
                       },
+                      Object {
+                        "position": "absolute",
+                      },
                       Object {
                         "flex": 0,
                         "height": 24,
-                        "width": 24,
+                        "width": 750,
                       },
                     ]
                   }
-                  vbHeight={24}
-                  vbWidth={24}
-                  width={24}
+                  width={750}
                 >
                   <RNSVGGroup>
-                    <RNSVGPath
-                      clipRule={0}
-                      d="M13.468 2.888a5.07 5.07 0 012.983.635 5.07 5.07 0 012.041 2.265c.45 1.01.546 2.254-.144 3.449l-4.5 7.794a3.232 3.232 0 01-1.427 1.294c-.757.342-1.696.367-2.671-.196-.975-.563-1.422-1.389-1.506-2.215a3.233 3.233 0 01.408-1.883l4-6.928a1 1 0 011.732 1l-4 6.928c-.087.15-.176.425-.15.682.02.196.105.447.516.684.41.237.671.185.85.105.236-.107.43-.32.516-.47l4.5-7.795c.31-.538.29-1.093.049-1.636a3.072 3.072 0 00-1.214-1.346 3.072 3.072 0 00-1.773-.378c-.591.062-1.082.322-1.392.86l-5 8.66c-.654 1.133-.286 3.3 1.964 4.598 2.25 1.3 4.31.535 4.964-.598l3.5-6.062a1 1 0 111.732 1l-3.5 6.062c-1.345 2.33-4.75 3.031-7.696 1.33-2.946-1.7-4.042-5-2.696-7.33l5-8.66c.69-1.195 1.815-1.733 2.914-1.85z"
-                      fill={4286216826}
-                      fillRule={0}
+                    <RNSVGRect
+                      fill={
+                        Array [
+                          1,
+                          "gradient",
+                        ]
+                      }
+                      height={24}
                       propList={
                         Array [
                           "fill",
-                          "fillRule",
                         ]
                       }
+                      width={750}
+                      x={0}
+                      y={0}
                     />
+                    <RNSVGDefs>
+                      <RNSVGLinearGradient
+                        gradient={
+                          Array [
+                            0,
+                            -197380,
+                            1,
+                            -526345,
+                          ]
+                        }
+                        gradientTransform={null}
+                        gradientUnits={1}
+                        name="gradient"
+                        x1={0}
+                        x2={0}
+                        y1={0}
+                        y2={24}
+                      />
+                    </RNSVGDefs>
                   </RNSVGGroup>
                 </RNSVGSvgView>
-              </View>
-            </RNGestureHandlerButton>
-          </View>
-          <View
-            style={Object {}}
-          >
-            <RNGestureHandlerButton
-              collapsable={false}
-              hitSlop={
-                Object {
-                  "bottom": 15,
-                  "left": 5,
-                  "right": 15,
-                  "top": 15,
-                }
-              }
-              onGestureEvent={[Function]}
-              onGestureHandlerEvent={[Function]}
-              onGestureHandlerStateChange={[Function]}
-              onHandlerStateChange={[Function]}
-              rippleColor={0}
-              testID="commands-button"
-            >
-              <View
-                accessible={true}
-                hitSlop={
-                  Object {
-                    "bottom": 15,
-                    "left": 5,
-                    "right": 15,
-                    "top": 15,
-                  }
-                }
-                style={
-                  Object {
-                    "opacity": 1,
-                  }
-                }
-              >
-                <RNSVGSvgView
-                  align="xMidYMid"
-                  bbHeight={24}
-                  bbWidth={24}
-                  focusable={false}
-                  height={24}
-                  meetOrSlice={0}
-                  minX={0}
-                  minY={0}
-                  pathFill="#7A7A7A"
+                <Text
                   style={
                     Array [
                       Object {
-                        "backgroundColor": "transparent",
-                        "borderWidth": 0,
+                        "fontSize": 12,
+                        "textAlign": "center",
                       },
                       Object {
-                        "flex": 0,
-                        "height": 24,
-                        "width": 24,
+                        "color": "#7A7A7A",
                       },
+                      Object {},
                     ]
                   }
-                  vbHeight={24}
-                  vbWidth={24}
-                  width={24}
                 >
-                  <RNSVGGroup>
-                    <RNSVGPath
-                      clipRule={0}
-                      d="M11.636 4H16l-2.91 5.818H16L10.546 20l1.09-7.273H8L11.636 4z"
-                      fill={4286216826}
-                      fillRule={0}
-                      propList={
-                        Array [
-                          "fill",
-                          "fillRule",
-                        ]
-                      }
-                    />
-                  </RNSVGGroup>
-                </RNSVGSvgView>
+                   Replies
+                </Text>
               </View>
-            </RNGestureHandlerButton>
-          </View>
-        </View>
-        <View
-          style={
-            Array [
-              Object {
-                "borderRadius": 20,
-                "borderWidth": 1,
-                "flex": 1,
-              },
-              Object {
-                "borderColor": "#ECEBEB",
-                "paddingVertical": 12,
-              },
-              Object {},
-            ]
-          }
-        >
-          <View
-            style={
-              Array [
-                Object {
-                  "alignItems": "center",
-                  "flexDirection": "row",
-                },
-                Object {
-                  "paddingLeft": 16,
-                  "paddingRight": 16,
-                },
-                Object {},
-              ]
-            }
-          >
-            <TextInput
-              allowFontScaling={true}
-              autoFocus={true}
-              editable={true}
-              maxLength={5000}
-              multiline={true}
-              onBlur={[Function]}
-              onChangeText={[Function]}
-              onContentSizeChange={[Function]}
-              onSelectionChange={[Function]}
-              placeholder="Send a message"
-              placeholderTextColor="#7A7A7A"
-              rejectResponderTermination={true}
-              style={
-                Array [
-                  Object {
-                    "flex": 1,
-                    "fontSize": 14,
-                    "includeFontPadding": false,
-                    "padding": 0,
-                    "paddingTop": 0,
-                    "textAlignVertical": "center",
-                  },
-                  Object {
-                    "color": "#000000",
-                    "maxHeight": 85,
-                  },
-                  Object {},
-                ]
-              }
-              testID="auto-complete-text-input"
-              underlineColorAndroid="transparent"
-              value=""
-            />
-          </View>
-        </View>
-        <View
-          style={
-            Array [
-              Object {
-                "paddingBottom": 10,
-                "paddingLeft": 10,
-              },
-              Object {},
-            ]
-          }
-        >
-          <RNGestureHandlerButton
-            collapsable={false}
-            onGestureEvent={[Function]}
-            onGestureHandlerEvent={[Function]}
-            onGestureHandlerStateChange={[Function]}
-            onHandlerStateChange={[Function]}
-            rippleColor={0}
-            testID="send-button"
-          >
-            <View
-              accessible={true}
-              style={
-                Object {
-                  "opacity": 1,
-                }
-              }
-            >
-              <RNSVGSvgView
-                align="xMidYMid"
-                bbHeight={24}
-                bbWidth={24}
-                focusable={false}
-                height={24}
-                meetOrSlice={0}
-                minX={0}
-                minY={0}
-                pathFill="#DBDBDB"
-                style={
-                  Array [
-                    Object {
-                      "backgroundColor": "transparent",
-                      "borderWidth": 0,
-                    },
-                    Object {
-                      "flex": 0,
-                      "height": 24,
-                      "width": 24,
-                    },
-                  ]
-                }
-                vbHeight={24}
-                vbWidth={24}
-                width={24}
-              >
-                <RNSVGGroup>
-                  <RNSVGPath
-                    clipRule={0}
-                    d="M22 12c0-5.52-4.48-10-10-10S2 6.48 2 12s4.48 10 10 10 10-4.48 10-10zM8 11h4V8l4 4-4 4v-3H8v-2z"
-                    fill={4292598747}
-                    fillRule={0}
-                    propList={
-                      Array [
-                        "fill",
-                        "fillRule",
-                      ]
-                    }
-                  />
-                </RNSVGGroup>
-              </RNSVGSvgView>
             </View>
-          </RNGestureHandlerButton>
+          </View>
         </View>
-      </View>
+      </RCTScrollView>
       <View
+        style={
+          Object {
+            "position": "absolute",
+            "top": 0,
+          }
+        }
+      />
+    </View>
+    <View
+      style={
+        Array [
+          Object {
+            "alignItems": "center",
+            "borderTopWidth": 1,
+            "height": 50,
+            "justifyContent": "center",
+          },
+          Object {
+            "borderTopColor": "#00000014",
+            "height": 50,
+          },
+          Object {},
+        ]
+      }
+      testID="send-message-disallowed-indicator"
+    >
+      <Text
         style={
           Array [
             Object {
-              "flexDirection": "row",
-              "marginHorizontal": 2,
-              "marginTop": 8,
+              "fontSize": 17,
+              "fontWeight": "400",
+            },
+            Object {
+              "color": "#72767E",
             },
             Object {},
           ]
         }
       >
-        <View
-          accessible={true}
-          focusable={true}
-          onClick={[Function]}
-          onResponderGrant={[Function]}
-          onResponderMove={[Function]}
-          onResponderRelease={[Function]}
-          onResponderTerminate={[Function]}
-          onResponderTerminationRequest={[Function]}
-          onStartShouldSetResponder={[Function]}
-          style={
-            Object {
-              "opacity": 1,
-            }
-          }
-        >
-          <View
-            style={
-              Array [
-                Object {
-                  "flexDirection": "row",
-                },
-                Object {},
-              ]
-            }
-          >
-            <View
-              style={
-                Array [
-                  Object {
-                    "alignItems": "center",
-                    "borderRadius": 3,
-                    "borderWidth": 2,
-                    "height": 16,
-                    "justifyContent": "center",
-                    "width": 16,
-                  },
-                  Object {
-                    "borderColor": "#7A7A7A",
-                  },
-                ]
-              }
-            />
-            <Text
-              style={
-                Array [
-                  Object {
-                    "fontSize": 13,
-                    "marginLeft": 12,
-                  },
-                  Object {
-                    "color": "#7A7A7A",
-                  },
-                  Object {},
-                ]
-              }
-            >
-              Also send to channel
-            </Text>
-          </View>
-        </View>
-      </View>
+        You can't send messages in this channel
+      </Text>
     </View>
   </View>
 </View>