// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Storyshots Avatar Avatar by path 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=56",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Avatar by roomId 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://open.rocket.chat/avatar/room/devWBbYr7inwupPqK?format=png&size=56",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Avatar by text 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://open.rocket.chat/avatar/Avatar?format=png&size=56",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Avatar by url 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://user-images.githubusercontent.com/29778115/89444446-14738480-d728-11ea-9412-75fd978d95fb.jpg",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Channel 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://open.rocket.chat/avatar/@general?format=png&size=56",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Children 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://open.rocket.chat/avatar/Avatar?format=png&size=56",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
  <Text
    allowFontScaling={false}
    style={
      Array [
        Object {
          "color": "#cbced1",
          "fontSize": 24,
        },
        Array [
          Object {
            "height": 24,
            "textAlignVertical": "center",
            "width": 24,
          },
          Array [
            Object {
              "borderRadius": 10,
              "bottom": -2,
              "position": "absolute",
              "right": -2,
            },
            undefined,
          ],
        ],
        Object {
          "fontFamily": "custom",
          "fontStyle": "normal",
          "fontWeight": "normal",
        },
        Object {},
      ]
    }
    theme="light"
  >
    
  </Text>
</View>
`;

exports[`Storyshots Avatar Custom borderRadius 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 28,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 28,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://open.rocket.chat/avatar/Avatar?format=png&size=56",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Custom style 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      Object {
        "padding": 16,
      },
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://open.rocket.chat/avatar/Avatar?format=png&size=56",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Direct 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=56",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Emoji 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Array [
          Object {
            "height": 30,
            "width": 30,
          },
          Object {
            "borderRadius": 4,
            "height": 56,
            "width": 56,
          },
        ],
      ]
    }
  >
    <FastImageView
      resizeMode="contain"
      source={
        Object {
          "priority": "high",
          "uri": "https://open.rocket.chat/emoji-custom/troll.jpg",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Static 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://user-images.githubusercontent.com/29778115/89444446-14738480-d728-11ea-9412-75fd978d95fb.jpg",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Touchable 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <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 {
            "overflow": "hidden",
          },
          Object {
            "borderRadius": 4,
            "height": 56,
            "width": 56,
          },
        ]
      }
    >
      <FastImageView
        resizeMode="cover"
        source={
          Object {
            "headers": undefined,
            "priority": "high",
            "uri": "https://open.rocket.chat/avatar/Avatar?format=png&size=56",
          }
        }
        style={
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      />
    </View>
  </View>
</View>
`;

exports[`Storyshots Avatar With ETag 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://open.rocket.chat/avatar/djorkaeff.alexandre?format=png&size=56&etag=5ag8KffJcZj9m5rCv",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Without ETag 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://open.rocket.chat/avatar/djorkaeff.alexandre?format=png&size=56",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots Avatar Wrong server 1`] = `
<View
  style={
    Array [
      Object {
        "borderRadius": 4,
        "height": 56,
        "width": 56,
      },
      undefined,
    ]
  }
  testID="avatar"
>
  <View
    style={
      Array [
        Object {
          "overflow": "hidden",
        },
        Object {
          "borderRadius": 4,
          "height": 56,
          "width": 56,
        },
      ]
    }
  >
    <FastImageView
      resizeMode="cover"
      source={
        Object {
          "headers": undefined,
          "priority": "high",
          "uri": "https://google.com/avatar/Avatar?format=png&size=56",
        }
      }
      style={
        Object {
          "bottom": 0,
          "left": 0,
          "position": "absolute",
          "right": 0,
          "top": 0,
        }
      }
    />
  </View>
</View>
`;

exports[`Storyshots BackgroundContainer basic 1`] = `
<View
  style={
    Object {
      "flex": 1,
    }
  }
>
  <View
    accessibilityIgnoresInvertColors={true}
    style={
      Object {
        "height": "100%",
        "position": "absolute",
        "width": "100%",
      }
    }
  >
    <Image
      source={
        Object {
          "uri": "message_empty_light",
        }
      }
      style={
        Array [
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          },
          Object {
            "height": "100%",
            "width": "100%",
          },
          undefined,
        ]
      }
    />
  </View>
</View>
`;

exports[`Storyshots BackgroundContainer black theme - loading 1`] = `
<View
  style={
    Object {
      "flex": 1,
    }
  }
>
  <View
    accessibilityIgnoresInvertColors={true}
    style={
      Object {
        "height": "100%",
        "position": "absolute",
        "width": "100%",
      }
    }
  >
    <Image
      source={
        Object {
          "uri": "message_empty_black",
        }
      }
      style={
        Array [
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          },
          Object {
            "height": "100%",
            "width": "100%",
          },
          undefined,
        ]
      }
    />
  </View>
  <ActivityIndicator
    animating={true}
    color="#f9f9f9"
    hidesWhenStopped={true}
    size="small"
    style={
      Object {
        "backgroundColor": "transparent",
        "fontFamily": "System",
        "fontSize": 16,
        "fontWeight": "400",
        "left": 0,
        "paddingHorizontal": 24,
        "position": "absolute",
        "right": 0,
        "textAlign": "center",
        "top": 60,
      }
    }
  />
</View>
`;

exports[`Storyshots BackgroundContainer black theme - text 1`] = `
<View
  style={
    Object {
      "flex": 1,
    }
  }
>
  <View
    accessibilityIgnoresInvertColors={true}
    style={
      Object {
        "height": "100%",
        "position": "absolute",
        "width": "100%",
      }
    }
  >
    <Image
      source={
        Object {
          "uri": "message_empty_black",
        }
      }
      style={
        Array [
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          },
          Object {
            "height": "100%",
            "width": "100%",
          },
          undefined,
        ]
      }
    />
  </View>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "left": 0,
          "paddingHorizontal": 24,
          "position": "absolute",
          "right": 0,
          "textAlign": "center",
          "top": 60,
        },
        Object {
          "color": "#f9f9f9",
        },
      ]
    }
  >
    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
  </Text>
</View>
`;

exports[`Storyshots BackgroundContainer dark theme - loading 1`] = `
<View
  style={
    Object {
      "flex": 1,
    }
  }
>
  <View
    accessibilityIgnoresInvertColors={true}
    style={
      Object {
        "height": "100%",
        "position": "absolute",
        "width": "100%",
      }
    }
  >
    <Image
      source={
        Object {
          "uri": "message_empty_dark",
        }
      }
      style={
        Array [
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          },
          Object {
            "height": "100%",
            "width": "100%",
          },
          undefined,
        ]
      }
    />
  </View>
  <ActivityIndicator
    animating={true}
    color="#f9f9f9"
    hidesWhenStopped={true}
    size="small"
    style={
      Object {
        "backgroundColor": "transparent",
        "fontFamily": "System",
        "fontSize": 16,
        "fontWeight": "400",
        "left": 0,
        "paddingHorizontal": 24,
        "position": "absolute",
        "right": 0,
        "textAlign": "center",
        "top": 60,
      }
    }
  />
</View>
`;

exports[`Storyshots BackgroundContainer dark theme - text 1`] = `
<View
  style={
    Object {
      "flex": 1,
    }
  }
>
  <View
    accessibilityIgnoresInvertColors={true}
    style={
      Object {
        "height": "100%",
        "position": "absolute",
        "width": "100%",
      }
    }
  >
    <Image
      source={
        Object {
          "uri": "message_empty_dark",
        }
      }
      style={
        Array [
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          },
          Object {
            "height": "100%",
            "width": "100%",
          },
          undefined,
        ]
      }
    />
  </View>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "left": 0,
          "paddingHorizontal": 24,
          "position": "absolute",
          "right": 0,
          "textAlign": "center",
          "top": 60,
        },
        Object {
          "color": "#f9f9f9",
        },
      ]
    }
  >
    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
  </Text>
</View>
`;

exports[`Storyshots BackgroundContainer loading 1`] = `
<View
  style={
    Object {
      "flex": 1,
    }
  }
>
  <View
    accessibilityIgnoresInvertColors={true}
    style={
      Object {
        "height": "100%",
        "position": "absolute",
        "width": "100%",
      }
    }
  >
    <Image
      source={
        Object {
          "uri": "message_empty_light",
        }
      }
      style={
        Array [
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          },
          Object {
            "height": "100%",
            "width": "100%",
          },
          undefined,
        ]
      }
    />
  </View>
  <ActivityIndicator
    animating={true}
    color="#6C727A"
    hidesWhenStopped={true}
    size="small"
    style={
      Object {
        "backgroundColor": "transparent",
        "fontFamily": "System",
        "fontSize": 16,
        "fontWeight": "400",
        "left": 0,
        "paddingHorizontal": 24,
        "position": "absolute",
        "right": 0,
        "textAlign": "center",
        "top": 60,
      }
    }
  />
</View>
`;

exports[`Storyshots BackgroundContainer long text 1`] = `
<View
  style={
    Object {
      "flex": 1,
    }
  }
>
  <View
    accessibilityIgnoresInvertColors={true}
    style={
      Object {
        "height": "100%",
        "position": "absolute",
        "width": "100%",
      }
    }
  >
    <Image
      source={
        Object {
          "uri": "message_empty_light",
        }
      }
      style={
        Array [
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          },
          Object {
            "height": "100%",
            "width": "100%",
          },
          undefined,
        ]
      }
    />
  </View>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "left": 0,
          "paddingHorizontal": 24,
          "position": "absolute",
          "right": 0,
          "textAlign": "center",
          "top": 60,
        },
        Object {
          "color": "#6C727A",
        },
      ]
    }
  >
    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
  </Text>
</View>
`;

exports[`Storyshots BackgroundContainer text 1`] = `
<View
  style={
    Object {
      "flex": 1,
    }
  }
>
  <View
    accessibilityIgnoresInvertColors={true}
    style={
      Object {
        "height": "100%",
        "position": "absolute",
        "width": "100%",
      }
    }
  >
    <Image
      source={
        Object {
          "uri": "message_empty_light",
        }
      }
      style={
        Array [
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          },
          Object {
            "height": "100%",
            "width": "100%",
          },
          undefined,
        ]
      }
    />
  </View>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "left": 0,
          "paddingHorizontal": 24,
          "position": "absolute",
          "right": 0,
          "textAlign": "center",
          "top": 60,
        },
        Object {
          "color": "#6C727A",
        },
      ]
    }
  >
    Text here
  </Text>
</View>
`;

exports[`Storyshots CannedResponseItem Itens 1`] = `
Array [
  <View
    accessible={true}
    focusable={true}
    onClick={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#ffffff",
        "maxHeight": 141,
        "minHeight": 117,
        "opacity": 1,
        "padding": 16,
      }
    }
  >
    <View
      style={
        Object {
          "flexDirection": "row",
          "height": 36,
        }
      }
    >
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      >
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "flex": 1,
                "fontFamily": "System",
                "fontSize": 14,
                "fontWeight": "500",
                "paddingBottom": 0,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#0d0e12",
              },
            ]
          }
        >
          !
          !FAQ4
        </Text>
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "flex": 1,
                "fontFamily": "System",
                "fontSize": 12,
                "fontWeight": "400",
                "paddingBottom": 0,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#6C727A",
              },
            ]
          }
        >
          Private
        </Text>
      </View>
      <View
        accessible={true}
        focusable={true}
        onClick={[Function]}
        onResponderGrant={[Function]}
        onResponderMove={[Function]}
        onResponderRelease={[Function]}
        onResponderTerminate={[Function]}
        onResponderTerminationRequest={[Function]}
        onStartShouldSetResponder={[Function]}
        style={
          Object {
            "backgroundColor": "#f3f4f5",
            "borderRadius": 2,
            "height": 28,
            "justifyContent": "center",
            "marginBottom": 12,
            "marginLeft": 8,
            "opacity": 1,
            "paddingHorizontal": 14,
            "width": 56,
          }
        }
      >
        <Text
          accessibilityLabel="Use"
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "500",
                "textAlign": "center",
              },
              Object {
                "color": "#0d0e12",
              },
              Object {
                "fontSize": 12,
              },
              undefined,
            ]
          }
        >
          Use
        </Text>
      </View>
    </View>
    <Text
      ellipsizeMode="tail"
      numberOfLines={2}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 14,
            "fontWeight": "400",
            "marginTop": 8,
            "paddingBottom": 0,
            "paddingTop": 0,
            "textAlign": "left",
          },
          Object {
            "color": "#6C727A",
          },
        ]
      }
    >
      “
      ZCVXZVXCZVZXVZXCVZXCVXZCVZX
      ”
    </Text>
    <View
      style={
        Object {
          "flexDirection": "row",
          "overflow": "hidden",
        }
      }
    />
  </View>,
  <View
    accessible={true}
    focusable={true}
    onClick={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#ffffff",
        "maxHeight": 141,
        "minHeight": 117,
        "opacity": 1,
        "padding": 16,
      }
    }
  >
    <View
      style={
        Object {
          "flexDirection": "row",
          "height": 36,
        }
      }
    >
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      >
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "flex": 1,
                "fontFamily": "System",
                "fontSize": 14,
                "fontWeight": "500",
                "paddingBottom": 0,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#0d0e12",
              },
            ]
          }
        >
          !
          test4mobilePrivate
        </Text>
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "flex": 1,
                "fontFamily": "System",
                "fontSize": 12,
                "fontWeight": "400",
                "paddingBottom": 0,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#6C727A",
              },
            ]
          }
        >
          Private
        </Text>
      </View>
      <View
        accessible={true}
        focusable={true}
        onClick={[Function]}
        onResponderGrant={[Function]}
        onResponderMove={[Function]}
        onResponderRelease={[Function]}
        onResponderTerminate={[Function]}
        onResponderTerminationRequest={[Function]}
        onStartShouldSetResponder={[Function]}
        style={
          Object {
            "backgroundColor": "#f3f4f5",
            "borderRadius": 2,
            "height": 28,
            "justifyContent": "center",
            "marginBottom": 12,
            "marginLeft": 8,
            "opacity": 1,
            "paddingHorizontal": 14,
            "width": 56,
          }
        }
      >
        <Text
          accessibilityLabel="Use"
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "500",
                "textAlign": "center",
              },
              Object {
                "color": "#0d0e12",
              },
              Object {
                "fontSize": 12,
              },
              undefined,
            ]
          }
        >
          Use
        </Text>
      </View>
    </View>
    <Text
      ellipsizeMode="tail"
      numberOfLines={2}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 14,
            "fontWeight": "400",
            "marginTop": 8,
            "paddingBottom": 0,
            "paddingTop": 0,
            "textAlign": "left",
          },
          Object {
            "color": "#6C727A",
          },
        ]
      }
    >
      “
      test for mobile private
      ”
    </Text>
    <View
      style={
        Object {
          "flexDirection": "row",
          "overflow": "hidden",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "borderRadius": 4,
              "height": 16,
              "marginRight": 4,
              "marginTop": 8,
            },
            Object {
              "backgroundColor": "#E6E6E7",
            },
          ]
        }
      >
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 12,
                "fontWeight": "400",
                "paddingBottom": 0,
                "paddingHorizontal": 4,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#6C727A",
              },
            ]
          }
        >
          HQ
        </Text>
      </View>
      <View
        style={
          Array [
            Object {
              "borderRadius": 4,
              "height": 16,
              "marginRight": 4,
              "marginTop": 8,
            },
            Object {
              "backgroundColor": "#E6E6E7",
            },
          ]
        }
      >
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 12,
                "fontWeight": "400",
                "paddingBottom": 0,
                "paddingHorizontal": 4,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#6C727A",
              },
            ]
          }
        >
          Closed
        </Text>
      </View>
      <View
        style={
          Array [
            Object {
              "borderRadius": 4,
              "height": 16,
              "marginRight": 4,
              "marginTop": 8,
            },
            Object {
              "backgroundColor": "#E6E6E7",
            },
          ]
        }
      >
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 12,
                "fontWeight": "400",
                "paddingBottom": 0,
                "paddingHorizontal": 4,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#6C727A",
              },
            ]
          }
        >
          HQ
        </Text>
      </View>
      <View
        style={
          Array [
            Object {
              "borderRadius": 4,
              "height": 16,
              "marginRight": 4,
              "marginTop": 8,
            },
            Object {
              "backgroundColor": "#E6E6E7",
            },
          ]
        }
      >
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 12,
                "fontWeight": "400",
                "paddingBottom": 0,
                "paddingHorizontal": 4,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#6C727A",
              },
            ]
          }
        >
          Problem in Product Y
        </Text>
      </View>
      <View
        style={
          Array [
            Object {
              "borderRadius": 4,
              "height": 16,
              "marginRight": 4,
              "marginTop": 8,
            },
            Object {
              "backgroundColor": "#E6E6E7",
            },
          ]
        }
      >
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 12,
                "fontWeight": "400",
                "paddingBottom": 0,
                "paddingHorizontal": 4,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#6C727A",
              },
            ]
          }
        >
          HQ
        </Text>
      </View>
      <View
        style={
          Array [
            Object {
              "borderRadius": 4,
              "height": 16,
              "marginRight": 4,
              "marginTop": 8,
            },
            Object {
              "backgroundColor": "#E6E6E7",
            },
          ]
        }
      >
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 12,
                "fontWeight": "400",
                "paddingBottom": 0,
                "paddingHorizontal": 4,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#6C727A",
              },
            ]
          }
        >
          Closed
        </Text>
      </View>
      <View
        style={
          Array [
            Object {
              "borderRadius": 4,
              "height": 16,
              "marginRight": 4,
              "marginTop": 8,
            },
            Object {
              "backgroundColor": "#E6E6E7",
            },
          ]
        }
      >
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 12,
                "fontWeight": "400",
                "paddingBottom": 0,
                "paddingHorizontal": 4,
                "paddingTop": 0,
                "textAlign": "left",
              },
              Object {
                "color": "#6C727A",
              },
            ]
          }
        >
          Problem in Product Y
        </Text>
      </View>
    </View>
  </View>,
]
`;

exports[`Storyshots Header Buttons badge 1`] = `
<RNCSafeAreaView
  edges={
    Array [
      "top",
      "left",
      "right",
    ]
  }
  style={
    Object {
      "backgroundColor": "#EEEFF1",
    }
  }
>
  <View
    style={
      Array [
        Object {
          "elevation": 4,
          "flexDirection": "row",
          "height": 44,
          "justifyContent": "center",
        },
        Object {
          "backgroundColor": "#EEEFF1",
          "borderBottomColor": "#B2B2B2",
          "borderBottomWidth": 0.5,
          "elevation": 0,
        },
      ]
    }
  >
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "flexDirection": "row",
            "justifyContent": "center",
          },
          Object {
            "marginLeft": 5,
          },
        ]
      }
    >
      <View
        accessible={true}
        focusable={false}
        hitSlop={
          Object {
            "bottom": 5,
            "left": 5,
            "right": 5,
            "top": 5,
          }
        }
        onClick={[Function]}
        onResponderGrant={[Function]}
        onResponderMove={[Function]}
        onResponderRelease={[Function]}
        onResponderTerminate={[Function]}
        onResponderTerminationRequest={[Function]}
        onStartShouldSetResponder={[Function]}
        style={
          Object {
            "marginHorizontal": 6,
            "opacity": 1,
          }
        }
      >
        <Text
          allowFontScaling={false}
          style={
            Array [
              Object {
                "color": "#6C727A",
                "fontSize": 24,
              },
              undefined,
              Object {
                "fontFamily": "custom",
                "fontStyle": "normal",
                "fontWeight": "normal",
              },
              Object {},
            ]
          }
        >
          
        </Text>
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "borderRadius": 10.5,
                "justifyContent": "center",
              },
              Object {
                "backgroundColor": "#1d74f5",
                "minWidth": 16,
              },
              Object {
                "alignItems": "center",
                "borderRadius": 10,
                "justifyContent": "center",
                "padding": 2,
                "position": "absolute",
                "right": -3,
                "top": -3,
              },
            ]
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 13,
                  "fontWeight": "600",
                  "textAlign": "left",
                },
                Object {
                  "fontSize": 10,
                },
                Object {
                  "color": "#ffffff",
                },
              ]
            }
          >
            1
          </Text>
        </View>
      </View>
      <View
        accessible={true}
        focusable={false}
        hitSlop={
          Object {
            "bottom": 5,
            "left": 5,
            "right": 5,
            "top": 5,
          }
        }
        onClick={[Function]}
        onResponderGrant={[Function]}
        onResponderMove={[Function]}
        onResponderRelease={[Function]}
        onResponderTerminate={[Function]}
        onResponderTerminationRequest={[Function]}
        onStartShouldSetResponder={[Function]}
        style={
          Object {
            "marginHorizontal": 6,
            "opacity": 1,
          }
        }
      >
        <Text
          allowFontScaling={false}
          style={
            Array [
              Object {
                "color": "#6C727A",
                "fontSize": 24,
              },
              undefined,
              Object {
                "fontFamily": "custom",
                "fontStyle": "normal",
                "fontWeight": "normal",
              },
              Object {},
            ]
          }
        >
          
        </Text>
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "borderRadius": 10.5,
                "justifyContent": "center",
              },
              Object {
                "backgroundColor": "#F5455C",
                "minWidth": 16,
              },
              Object {
                "alignItems": "center",
                "borderRadius": 10,
                "justifyContent": "center",
                "padding": 2,
                "position": "absolute",
                "right": -3,
                "top": -3,
              },
            ]
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 13,
                  "fontWeight": "600",
                  "textAlign": "left",
                },
                Object {
                  "fontSize": 10,
                },
                Object {
                  "color": "#ffffff",
                },
              ]
            }
          >
            1
          </Text>
        </View>
      </View>
      <View
        accessible={true}
        focusable={false}
        hitSlop={
          Object {
            "bottom": 5,
            "left": 5,
            "right": 5,
            "top": 5,
          }
        }
        onClick={[Function]}
        onResponderGrant={[Function]}
        onResponderMove={[Function]}
        onResponderRelease={[Function]}
        onResponderTerminate={[Function]}
        onResponderTerminationRequest={[Function]}
        onStartShouldSetResponder={[Function]}
        style={
          Object {
            "marginHorizontal": 6,
            "opacity": 1,
          }
        }
      >
        <Text
          allowFontScaling={false}
          style={
            Array [
              Object {
                "color": "#6C727A",
                "fontSize": 24,
              },
              undefined,
              Object {
                "fontFamily": "custom",
                "fontStyle": "normal",
                "fontWeight": "normal",
              },
              Object {},
            ]
          }
        >
          
        </Text>
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "borderRadius": 10.5,
                "justifyContent": "center",
              },
              Object {
                "backgroundColor": "#F38C39",
                "minWidth": 16,
              },
              Object {
                "alignItems": "center",
                "borderRadius": 10,
                "justifyContent": "center",
                "padding": 2,
                "position": "absolute",
                "right": -3,
                "top": -3,
              },
            ]
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 13,
                  "fontWeight": "600",
                  "textAlign": "left",
                },
                Object {
                  "fontSize": 10,
                },
                Object {
                  "color": "#ffffff",
                },
              ]
            }
          >
            1
          </Text>
        </View>
      </View>
    </View>
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    />
  </View>
</RNCSafeAreaView>
`;

exports[`Storyshots Header Buttons common 1`] = `
Array [
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginLeft": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginLeft": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginLeft": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 17,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6C727A",
                },
              ]
            }
          >
            Cancel
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
]
`;

exports[`Storyshots Header Buttons icons 1`] = `
Array [
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginLeft": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginLeft": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
]
`;

exports[`Storyshots Header Buttons themes 1`] = `
Array [
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginLeft": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 17,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6C727A",
                },
              ]
            }
          >
            Threads
          </Text>
        </View>
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#6C727A",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "borderRadius": 10.5,
                  "justifyContent": "center",
                },
                Object {
                  "backgroundColor": "#1d74f5",
                  "minWidth": 16,
                },
                Object {
                  "alignItems": "center",
                  "borderRadius": 10,
                  "justifyContent": "center",
                  "padding": 2,
                  "position": "absolute",
                  "right": -3,
                  "top": -3,
                },
              ]
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 13,
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "fontSize": 10,
                  },
                  Object {
                    "color": "#ffffff",
                  },
                ]
              }
            >
              1
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#0b182c",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#0b182c",
            "borderBottomColor": "#2F3A4B",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginLeft": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#f9f9f9",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 17,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#f9f9f9",
                },
              ]
            }
          >
            Threads
          </Text>
        </View>
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#f9f9f9",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "borderRadius": 10.5,
                  "justifyContent": "center",
                },
                Object {
                  "backgroundColor": "#1d74f5",
                  "minWidth": 16,
                },
                Object {
                  "alignItems": "center",
                  "borderRadius": 10,
                  "justifyContent": "center",
                  "padding": 2,
                  "position": "absolute",
                  "right": -3,
                  "top": -3,
                },
              ]
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 13,
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "fontSize": 10,
                  },
                  Object {
                    "color": "#ffffff",
                  },
                ]
              }
            >
              1
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#0d0d0d",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#0d0d0d",
            "borderBottomColor": "#323232",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginLeft": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#f9f9f9",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 17,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#f9f9f9",
                },
              ]
            }
          >
            Threads
          </Text>
        </View>
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            allowFontScaling={false}
            style={
              Array [
                Object {
                  "color": "#f9f9f9",
                  "fontSize": 24,
                },
                undefined,
                Object {
                  "fontFamily": "custom",
                  "fontStyle": "normal",
                  "fontWeight": "normal",
                },
                Object {},
              ]
            }
          >
            
          </Text>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "borderRadius": 10.5,
                  "justifyContent": "center",
                },
                Object {
                  "backgroundColor": "#1d74f5",
                  "minWidth": 16,
                },
                Object {
                  "alignItems": "center",
                  "borderRadius": 10,
                  "justifyContent": "center",
                  "padding": 2,
                  "position": "absolute",
                  "right": -3,
                  "top": -3,
                },
              ]
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 13,
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "fontSize": 10,
                  },
                  Object {
                    "color": "#ffffff",
                  },
                ]
              }
            >
              1
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
]
`;

exports[`Storyshots Header Buttons title 1`] = `
Array [
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginLeft": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 17,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6C727A",
                },
              ]
            }
          >
            threads
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 17,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6C727A",
                },
              ]
            }
          >
            threads
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginLeft": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 17,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6C727A",
                },
              ]
            }
          >
            threads
          </Text>
        </View>
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 17,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6C727A",
                },
              ]
            }
          >
            search
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "flex": 1,
          }
        }
      />
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flexDirection": "row",
              "justifyContent": "center",
            },
            Object {
              "marginRight": 5,
            },
          ]
        }
      >
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 17,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6C727A",
                },
              ]
            }
          >
            threads
          </Text>
        </View>
        <View
          accessible={true}
          focusable={false}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "marginHorizontal": 6,
              "opacity": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 17,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6C727A",
                },
              ]
            }
          >
            search
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
]
`;

exports[`Storyshots List alert 1`] = `
<RCTScrollView
  contentContainerStyle={
    Object {
      "paddingVertical": 16,
    }
  }
  keyboardDismissMode="interactive"
  keyboardShouldPersistTaps="always"
  scrollIndicatorInsets={
    Object {
      "right": 1,
    }
  }
  theme="light"
>
  <View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Chats
            </Text>
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 20,
                  },
                  Array [
                    Object {
                      "paddingLeft": 4,
                    },
                    Object {
                      "color": "#f5455c",
                    },
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
            </Text>
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 20,
                  },
                  Array [
                    Object {
                      "paddingLeft": 4,
                    },
                    Object {
                      "color": "#f5455c",
                    },
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Chats
            </Text>
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 20,
                  },
                  Array [
                    Object {
                      "paddingLeft": 4,
                    },
                    Object {
                      "color": "#f5455c",
                    },
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "paddingLeft": 12,
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                },
                undefined,
              ]
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#9ca2a8",
                    "fontSize": 20,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
            </Text>
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 20,
                  },
                  Array [
                    Object {
                      "paddingLeft": 4,
                    },
                    Object {
                      "color": "#f5455c",
                    },
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "paddingLeft": 12,
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                },
                undefined,
              ]
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#9ca2a8",
                    "fontSize": 20,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots List header 1`] = `
<RCTScrollView
  contentContainerStyle={
    Object {
      "paddingVertical": 16,
    }
  }
  keyboardDismissMode="interactive"
  keyboardShouldPersistTaps="always"
  scrollIndicatorInsets={
    Object {
      "right": 1,
    }
  }
  theme="light"
>
  <View>
    <View
      style={
        Object {
          "paddingBottom": 12,
          "paddingHorizontal": 12,
        }
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#6d6d72",
            },
          ]
        }
      >
        Chats
      </Text>
    </View>
    <View
      style={
        Object {
          "paddingBottom": 12,
          "paddingHorizontal": 12,
        }
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#6d6d72",
            },
          ]
        }
      >
        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
      </Text>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots List icon 1`] = `
<RCTScrollView
  contentContainerStyle={
    Object {
      "paddingVertical": 16,
    }
  }
  keyboardDismissMode="interactive"
  keyboardShouldPersistTaps="always"
  scrollIndicatorInsets={
    Object {
      "right": 1,
    }
  }
  theme="light"
>
  <View>
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "justifyContent": "center",
          },
          undefined,
        ]
      }
    >
      <Text
        allowFontScaling={false}
        style={
          Array [
            Object {
              "color": "#9ca2a8",
              "fontSize": 20,
            },
            undefined,
            Object {
              "fontFamily": "custom",
              "fontStyle": "normal",
              "fontWeight": "normal",
            },
            Object {},
          ]
        }
      >
        
      </Text>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots List pressable 1`] = `
<RCTScrollView
  contentContainerStyle={
    Object {
      "paddingVertical": 16,
    }
  }
  keyboardDismissMode="interactive"
  keyboardShouldPersistTaps="always"
  scrollIndicatorInsets={
    Object {
      "right": 1,
    }
  }
  theme="light"
>
  <View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "flex": 1,
            "flexDirection": "row",
            "justifyContent": "center",
            "paddingHorizontal": 12,
          },
          undefined,
          Object {
            "height": 92,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "justifyContent": "center",
          }
        }
      >
        <View
          style={
            Object {
              "alignItems": "center",
              "flexDirection": "row",
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#0d0e12",
                },
              ]
            }
          >
            Press me
          </Text>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "flex": 1,
            "flexDirection": "row",
            "justifyContent": "center",
            "paddingHorizontal": 12,
          },
          Object {
            "opacity": 0.3,
          },
          Object {
            "height": 92,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "justifyContent": "center",
          }
        }
      >
        <View
          style={
            Object {
              "alignItems": "center",
              "flexDirection": "row",
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#0d0e12",
                },
              ]
            }
          >
            I'm disabled
          </Text>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots List separator 1`] = `
<RCTScrollView
  contentContainerStyle={
    Object {
      "paddingVertical": 16,
    }
  }
  keyboardDismissMode="interactive"
  keyboardShouldPersistTaps="always"
  scrollIndicatorInsets={
    Object {
      "right": 1,
    }
  }
  theme="light"
>
  <View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots List title and subtitle 1`] = `
<RCTScrollView
  contentContainerStyle={
    Object {
      "paddingVertical": 16,
    }
  }
  keyboardDismissMode="interactive"
  keyboardShouldPersistTaps="always"
  scrollIndicatorInsets={
    Object {
      "right": 1,
    }
  }
  theme="light"
>
  <View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Chats
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Chats
            </Text>
          </View>
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                },
              ]
            }
          >
            All
          </Text>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
        testID="test-id"
      >
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
            </Text>
          </View>
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                },
              ]
            }
          >
            Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
          </Text>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots List with FlatList 1`] = `
<RNCSafeAreaView
  edges={
    Array [
      "right",
      "left",
    ]
  }
  style={
    Array [
      Object {
        "flex": 1,
      },
      Object {
        "backgroundColor": "#efeff4",
      },
      undefined,
    ]
  }
>
  <RCTScrollView
    ItemSeparatorComponent={[Function]}
    ListFooterComponent={[Function]}
    ListHeaderComponent={[Function]}
    contentContainerStyle={
      Object {
        "paddingVertical": 32,
      }
    }
    data={
      Array [
        0,
        1,
        2,
        3,
        4,
        5,
        6,
        7,
        8,
        9,
        10,
        11,
        12,
        13,
        14,
        15,
        16,
        17,
        18,
        19,
        20,
        21,
        22,
        23,
        24,
        25,
        26,
        27,
        28,
        29,
      ]
    }
    disableVirtualization={false}
    getItem={[Function]}
    getItemCount={[Function]}
    horizontal={false}
    initialNumToRender={10}
    keyExtractor={[Function]}
    maxToRenderPerBatch={10}
    onContentSizeChange={[Function]}
    onEndReachedThreshold={2}
    onLayout={[Function]}
    onMomentumScrollEnd={[Function]}
    onScroll={[Function]}
    onScrollBeginDrag={[Function]}
    onScrollEndDrag={[Function]}
    removeClippedSubviews={false}
    renderItem={[Function]}
    scrollEventThrottle={50}
    stickyHeaderIndices={Array []}
    updateCellsBatchingPeriod={50}
    viewabilityConfigCallbackPairs={Array []}
    windowSize={21}
  >
    <View>
      <View
        onLayout={[Function]}
      >
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        onLayout={[Function]}
        style={null}
      >
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  0
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        onLayout={[Function]}
        style={null}
      >
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        onLayout={[Function]}
        style={null}
      >
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  2
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        onLayout={[Function]}
        style={null}
      >
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  3
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        onLayout={[Function]}
        style={null}
      >
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  4
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        onLayout={[Function]}
        style={null}
      >
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  5
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        onLayout={[Function]}
        style={null}
      >
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  6
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        onLayout={[Function]}
        style={null}
      >
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  7
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        onLayout={[Function]}
        style={null}
      >
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  8
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        onLayout={[Function]}
        style={null}
      >
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  9
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        style={
          Object {
            "height": 0,
          }
        }
      />
      <View
        onLayout={[Function]}
      >
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
    </View>
  </RCTScrollView>
</RNCSafeAreaView>
`;

exports[`Storyshots List with bigger font 1`] = `
<RNCSafeAreaView
  edges={
    Array [
      "right",
      "left",
    ]
  }
  style={
    Array [
      Object {
        "flex": 1,
      },
      Object {
        "backgroundColor": "#efeff4",
      },
      undefined,
    ]
  }
>
  <RCTScrollView
    contentContainerStyle={
      Object {
        "paddingVertical": 16,
      }
    }
    keyboardDismissMode="interactive"
    keyboardShouldPersistTaps="always"
    scrollIndicatorInsets={
      Object {
        "right": 1,
      }
    }
    theme="light"
  >
    <View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Object {
              "paddingBottom": 12,
              "paddingHorizontal": 12,
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              undefined,
              Object {
                "height": 69,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              Object {
                "opacity": 0.3,
              },
              Object {
                "height": 69,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "paddingHorizontal": 12,
              "paddingTop": 8,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Object {
              "paddingBottom": 12,
              "paddingHorizontal": 12,
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              undefined,
              Object {
                "height": 69,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              Object {
                "opacity": 0.3,
              },
              Object {
                "height": 69,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "paddingHorizontal": 12,
              "paddingTop": 8,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
      </View>
    </View>
  </RCTScrollView>
</RNCSafeAreaView>
`;

exports[`Storyshots List with black theme 1`] = `
<RNCSafeAreaView
  edges={
    Array [
      "right",
      "left",
    ]
  }
  style={
    Array [
      Object {
        "flex": 1,
      },
      Object {
        "backgroundColor": "#080808",
      },
      undefined,
    ]
  }
>
  <RCTScrollView
    contentContainerStyle={
      Object {
        "paddingVertical": 16,
      }
    }
    keyboardDismissMode="interactive"
    keyboardShouldPersistTaps="always"
    scrollIndicatorInsets={
      Object {
        "right": 1,
      }
    }
    theme="black"
  >
    <View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Object {
              "paddingBottom": 12,
              "paddingHorizontal": 12,
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#272728",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              undefined,
              Object {
                "height": 92,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#b2b8c6",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#f9f9f9",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#b2b8c6",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#b2b8c6",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#272728",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              Object {
                "opacity": 0.3,
              },
              Object {
                "height": 92,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#b2b8c6",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#f9f9f9",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#b2b8c6",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#b2b8c6",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#272728",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "paddingHorizontal": 12,
              "paddingTop": 8,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Object {
              "paddingBottom": 12,
              "paddingHorizontal": 12,
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#272728",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              undefined,
              Object {
                "height": 92,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#b2b8c6",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#f9f9f9",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#b2b8c6",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#b2b8c6",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#272728",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              Object {
                "opacity": 0.3,
              },
              Object {
                "height": 92,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#b2b8c6",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#f9f9f9",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#b2b8c6",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#b2b8c6",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#272728",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "paddingHorizontal": 12,
              "paddingTop": 8,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
      </View>
    </View>
  </RCTScrollView>
</RNCSafeAreaView>
`;

exports[`Storyshots List with custom colors 1`] = `
<RCTScrollView
  contentContainerStyle={
    Object {
      "paddingVertical": 16,
    }
  }
  keyboardDismissMode="interactive"
  keyboardShouldPersistTaps="always"
  scrollIndicatorInsets={
    Object {
      "right": 1,
    }
  }
  theme="light"
>
  <View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "red",
                  },
                ]
              }
            >
              Chats
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "flex": 1,
            "flexDirection": "row",
            "justifyContent": "center",
            "paddingHorizontal": 12,
          },
          undefined,
          Object {
            "height": 92,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "justifyContent": "center",
          }
        }
      >
        <View
          style={
            Object {
              "alignItems": "center",
              "flexDirection": "row",
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "white",
                },
              ]
            }
          >
            Press me!
          </Text>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots List with dark theme 1`] = `
<RNCSafeAreaView
  edges={
    Array [
      "right",
      "left",
    ]
  }
  style={
    Array [
      Object {
        "flex": 1,
      },
      Object {
        "backgroundColor": "#07101e",
      },
      undefined,
    ]
  }
>
  <RCTScrollView
    contentContainerStyle={
      Object {
        "paddingVertical": 16,
      }
    }
    keyboardDismissMode="interactive"
    keyboardShouldPersistTaps="always"
    scrollIndicatorInsets={
      Object {
        "right": 1,
      }
    }
    theme="dark"
  >
    <View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Object {
              "paddingBottom": 12,
              "paddingHorizontal": 12,
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6D6D72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#2b2b2d",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              undefined,
              Object {
                "height": 92,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9297a2",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#f9f9f9",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9297a2",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9297a2",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#2b2b2d",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              Object {
                "opacity": 0.3,
              },
              Object {
                "height": 92,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9297a2",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#f9f9f9",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9297a2",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9297a2",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#2b2b2d",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "paddingHorizontal": 12,
              "paddingTop": 8,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6D6D72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Object {
              "paddingBottom": 12,
              "paddingHorizontal": 12,
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6D6D72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#2b2b2d",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              undefined,
              Object {
                "height": 92,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9297a2",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#f9f9f9",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9297a2",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9297a2",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#2b2b2d",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              Object {
                "opacity": 0.3,
              },
              Object {
                "height": 92,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9297a2",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#f9f9f9",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9297a2",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9297a2",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#2b2b2d",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "paddingHorizontal": 12,
              "paddingTop": 8,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6D6D72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
      </View>
    </View>
  </RCTScrollView>
</RNCSafeAreaView>
`;

exports[`Storyshots List with icon 1`] = `
<RCTScrollView
  contentContainerStyle={
    Object {
      "paddingVertical": 16,
    }
  }
  keyboardDismissMode="interactive"
  keyboardShouldPersistTaps="always"
  scrollIndicatorInsets={
    Object {
      "right": 1,
    }
  }
  theme="light"
>
  <View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "paddingRight": 12,
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                },
                undefined,
              ]
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#9ca2a8",
                    "fontSize": 20,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Icon Left
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Icon Right
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "paddingLeft": 12,
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                },
                undefined,
              ]
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#9ca2a8",
                    "fontSize": 20,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "paddingRight": 12,
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                },
                undefined,
              ]
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#9ca2a8",
                    "fontSize": 20,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
            </Text>
          </View>
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                },
              ]
            }
          >
            Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
          </Text>
        </View>
        <View
          style={
            Object {
              "paddingLeft": 12,
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                },
                undefined,
              ]
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#9ca2a8",
                    "fontSize": 20,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "backgroundColor": "#ffffff",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "alignItems": "center",
              "flex": 1,
              "flexDirection": "row",
              "justifyContent": "center",
              "paddingHorizontal": 12,
            },
            undefined,
            Object {
              "height": 92,
            },
          ]
        }
      >
        <View
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Show Action Indicator
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "paddingLeft": 12,
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                },
                Object {},
              ]
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#9ca2a8",
                    "fontSize": 20,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots List with section and info 1`] = `
<RNCSafeAreaView
  edges={
    Array [
      "right",
      "left",
    ]
  }
  style={
    Array [
      Object {
        "flex": 1,
      },
      Object {
        "backgroundColor": "#efeff4",
      },
      undefined,
    ]
  }
>
  <RCTScrollView
    contentContainerStyle={
      Object {
        "paddingVertical": 16,
      }
    }
    keyboardDismissMode="interactive"
    keyboardShouldPersistTaps="always"
    scrollIndicatorInsets={
      Object {
        "right": 1,
      }
    }
    theme="light"
  >
    <View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Section Item
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Section Item
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Section Item
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Section Item
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
      </View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Object {
              "paddingBottom": 12,
              "paddingHorizontal": 12,
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Section Item
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Section Item
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "paddingHorizontal": 12,
              "paddingTop": 8,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Object {
              "paddingBottom": 12,
              "paddingHorizontal": 12,
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
          </Text>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Section Item
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "backgroundColor": "#ffffff",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "center",
                  "paddingHorizontal": 12,
                },
                undefined,
                Object {
                  "height": 92,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "justifyContent": "center",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flexShrink": 1,
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Section Item
                </Text>
              </View>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "paddingHorizontal": 12,
              "paddingTop": 8,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
          </Text>
        </View>
      </View>
    </View>
  </RCTScrollView>
</RNCSafeAreaView>
`;

exports[`Storyshots List with small font 1`] = `
<RNCSafeAreaView
  edges={
    Array [
      "right",
      "left",
    ]
  }
  style={
    Array [
      Object {
        "flex": 1,
      },
      Object {
        "backgroundColor": "#efeff4",
      },
      undefined,
    ]
  }
>
  <RCTScrollView
    contentContainerStyle={
      Object {
        "paddingVertical": 16,
      }
    }
    keyboardDismissMode="interactive"
    keyboardShouldPersistTaps="always"
    scrollIndicatorInsets={
      Object {
        "right": 1,
      }
    }
    theme="light"
  >
    <View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Object {
              "paddingBottom": 12,
              "paddingHorizontal": 12,
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              undefined,
              Object {
                "height": 36.800000000000004,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              Object {
                "opacity": 0.3,
              },
              Object {
                "height": 36.800000000000004,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "paddingHorizontal": 12,
              "paddingTop": 8,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "marginVertical": 16,
          }
        }
      >
        <View
          style={
            Object {
              "paddingBottom": 12,
              "paddingHorizontal": 12,
            }
          }
        >
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              undefined,
              Object {
                "height": 36.800000000000004,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Array [
              Object {
                "alignItems": "center",
                "flex": 1,
                "flexDirection": "row",
                "justifyContent": "center",
                "paddingHorizontal": 12,
              },
              Object {
                "opacity": 0.3,
              },
              Object {
                "height": 36.800000000000004,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "paddingRight": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flex": 1,
                "justifyContent": "center",
              }
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <Text
                numberOfLines={1}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "flexShrink": 1,
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                  ]
                }
              >
                Chats
              </Text>
            </View>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              All
            </Text>
          </View>
          <View
            style={
              Object {
                "paddingLeft": 12,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "alignItems": "center",
                    "justifyContent": "center",
                  },
                  undefined,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          style={
            Array [
              Object {
                "height": 0.5,
              },
              undefined,
              Object {
                "backgroundColor": "#cbcbcc",
              },
            ]
          }
        />
        <View
          style={
            Object {
              "paddingHorizontal": 12,
              "paddingTop": 8,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 14,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#6d6d72",
                },
              ]
            }
          >
            Chats
          </Text>
        </View>
      </View>
    </View>
  </RCTScrollView>
</RNCSafeAreaView>
`;

exports[`Storyshots LoadMore basic 1`] = `
Array [
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "500",
          "textAlign": "left",
        },
        Object {
          "color": "#0d0e12",
        },
      ]
    }
  >
    Load More
  </Text>,
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "500",
          "textAlign": "left",
        },
        Object {
          "color": "#0d0e12",
        },
      ]
    }
  >
    Load More
  </Text>,
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "500",
          "textAlign": "left",
        },
        Object {
          "color": "#0d0e12",
        },
      ]
    }
  >
    Load Older
  </Text>,
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "500",
          "textAlign": "left",
        },
        Object {
          "color": "#0d0e12",
        },
      ]
    }
  >
    Load Newer
  </Text>,
]
`;

exports[`Storyshots LoadMore black theme 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#000000",
    }
  }
>
  <View>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "500",
            "textAlign": "left",
          },
          Object {
            "color": "#f9f9f9",
          },
        ]
      }
    >
      Load Older
    </Text>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#f9f9f9",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#b2b8c6",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Hey!"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Hey!
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Older message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Older message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "500",
            "textAlign": "left",
          },
          Object {
            "color": "#f9f9f9",
          },
        ]
      }
    >
      Load Newer
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "500",
            "textAlign": "left",
          },
          Object {
            "color": "#f9f9f9",
          },
        ]
      }
    >
      Load More
    </Text>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#f9f9f9",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#b2b8c6",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the third message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the third message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the second message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the second message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#f9f9f9",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#b2b8c6",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the first message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the first message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots LoadMore dark theme 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#030b1b",
    }
  }
>
  <View>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "500",
            "textAlign": "left",
          },
          Object {
            "color": "#f9f9f9",
          },
        ]
      }
    >
      Load Older
    </Text>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#f9f9f9",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9297a2",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Hey!"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Hey!
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Older message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Older message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "500",
            "textAlign": "left",
          },
          Object {
            "color": "#f9f9f9",
          },
        ]
      }
    >
      Load Newer
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "500",
            "textAlign": "left",
          },
          Object {
            "color": "#f9f9f9",
          },
        ]
      }
    >
      Load More
    </Text>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#f9f9f9",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9297a2",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the third message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the third message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the second message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the second message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#f9f9f9",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9297a2",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#cbced1",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the first message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the first message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots LoadMore light theme 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "500",
            "textAlign": "left",
          },
          Object {
            "color": "#0d0e12",
          },
        ]
      }
    >
      Load Older
    </Text>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Hey!"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Hey!
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Older message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Older message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "500",
            "textAlign": "left",
          },
          Object {
            "color": "#0d0e12",
          },
        ]
      }
    >
      Load Newer
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "500",
            "textAlign": "left",
          },
          Object {
            "color": "#0d0e12",
          },
        ]
      }
    >
      Load More
    </Text>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the third message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the third message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the second message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the second message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the first message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the first message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Markdown Block quote 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <View
    style={
      Object {
        "alignItems": "flex-start",
        "flexDirection": "row",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "height": "100%",
            "marginRight": 5,
            "width": 2,
          },
          Object {
            "backgroundColor": "#e1e5e8",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        <Text
          accessibilityLabel="This is block quote"
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Array [
                Object {},
                undefined,
                Object {
                  "alignItems": "flex-start",
                  "flexDirection": "row",
                  "flexWrap": "wrap",
                  "justifyContent": "flex-start",
                  "marginBottom": 0,
                  "marginTop": 0,
                },
              ],
            ]
          }
        >
          This is block quote
        </Text>
      </Text>
    </View>
  </View>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="this is a normal line"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      this is a normal line
    </Text>
  </Text>
</View>
`;

exports[`Storyshots Markdown Code 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="This is "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      This is 
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "#f1f2f4",
            "borderColor": "#f1f2f4",
            "borderRadius": 4,
            "borderWidth": 1,
            "color": "#2f343d",
            "fontFamily": "Courier New",
            "fontSize": 16,
            "fontWeight": "400",
            "paddingLeft": 2,
            "paddingTop": 2,
            "textAlign": "left",
          },
        ]
      }
    >
      inline code
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Inline "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      Inline 
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "#f1f2f4",
            "borderColor": "#f1f2f4",
            "borderRadius": 4,
            "borderWidth": 1,
            "color": "#2f343d",
            "fontFamily": "Courier New",
            "fontSize": 16,
            "fontWeight": "400",
            "paddingLeft": 2,
            "paddingTop": 2,
            "textAlign": "left",
          },
        ]
      }
    >
      code
    </Text>
    <Text
      accessibilityLabel=" has "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
       has 
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "#f1f2f4",
            "borderColor": "#f1f2f4",
            "borderRadius": 4,
            "borderWidth": 1,
            "color": "#2f343d",
            "fontFamily": "Courier New",
            "fontSize": 16,
            "fontWeight": "400",
            "paddingLeft": 2,
            "paddingTop": 2,
            "textAlign": "left",
          },
        ]
      }
    >
      back-ticks around
    </Text>
    <Text
      accessibilityLabel=" it."
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
       it.
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "#f1f2f4",
          "borderColor": "#f1f2f4",
          "borderRadius": 4,
          "borderWidth": 1,
          "color": "#2f343d",
          "fontFamily": "Courier New",
          "fontSize": 16,
          "fontWeight": "400",
          "padding": 4,
          "textAlign": "left",
        },
      ]
    }
  >
    Code block

  </Text>
</View>
`;

exports[`Storyshots Markdown Edited 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="This is edited"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      This is edited
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 14,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Object {
            "color": "#9ca2a8",
          },
        ]
      }
    >
       (
      edited
      )
    </Text>
  </Text>
</View>
`;

exports[`Storyshots Markdown Emoji 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Unicode: 😃😇👍"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      Unicode: 😃😇👍
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Shortnames: "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      Shortnames: 
    </Text>
    <Text
      style={
        Array [
          Object {
            "color": "#2f343d",
          },
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Object {},
        ]
      }
    >
      😂
    </Text>
    <Text
      style={
        Array [
          Object {
            "color": "#2f343d",
          },
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Object {},
        ]
      }
    >
      👍
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Custom emojis: "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      Custom emojis: 
    </Text>
    <View
      style={
        Array [
          Object {
            "overflow": "hidden",
          },
          Array [
            Object {
              "height": 20,
              "width": 20,
            },
            Object {},
          ],
        ]
      }
    >
      <FastImageView
        resizeMode="contain"
        source={
          Object {
            "priority": "high",
            "uri": "https://open.rocket.chat/emoji-custom/react_rocket.png",
          }
        }
        style={
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      />
    </View>
    <Text
      accessibilityLabel=" "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
       
    </Text>
    <View
      style={
        Array [
          Object {
            "overflow": "hidden",
          },
          Array [
            Object {
              "height": 20,
              "width": 20,
            },
            Object {},
          ],
        ]
      }
    >
      <FastImageView
        resizeMode="contain"
        source={
          Object {
            "priority": "high",
            "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
          }
        }
        style={
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      />
    </View>
    <Text
      accessibilityLabel=" "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
       
    </Text>
    <View
      style={
        Array [
          Object {
            "overflow": "hidden",
          },
          Array [
            Object {
              "height": 20,
              "width": 20,
            },
            Object {},
          ],
        ]
      }
    >
      <FastImageView
        resizeMode="contain"
        source={
          Object {
            "priority": "high",
            "uri": "https://open.rocket.chat/emoji-custom/marioparty.gif",
          }
        }
        style={
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      />
    </View>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="😃 "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 30,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      😃 
    </Text>
    <Text
      style={
        Array [
          Object {
            "color": "#2f343d",
          },
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 30,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Object {},
        ]
      }
    >
      👍
    </Text>
    <Text
      accessibilityLabel=" "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 30,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
       
    </Text>
    <View
      style={
        Array [
          Object {
            "overflow": "hidden",
          },
          Array [
            Object {
              "height": 30,
              "width": 30,
            },
            Object {},
          ],
        ]
      }
    >
      <FastImageView
        resizeMode="contain"
        source={
          Object {
            "priority": "high",
            "uri": "https://open.rocket.chat/emoji-custom/marioparty.gif",
          }
        }
        style={
          Object {
            "bottom": 0,
            "left": 0,
            "position": "absolute",
            "right": 0,
            "top": 0,
          }
        }
      />
    </View>
  </Text>
</View>
`;

exports[`Storyshots Markdown Hashtag 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      onPress={[Function]}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "600",
            "textAlign": "left",
          },
          Object {
            "color": "#F3BE08",
          },
        ]
      }
    >
      #test-channel
    </Text>
    <Text
      accessibilityLabel=" "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
       
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Object {
            "color": "#2f343d",
          },
        ]
      }
    >
      #unknown
    </Text>
  </Text>
</View>
`;

exports[`Storyshots Markdown Headers 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Header 1"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 24,
              "fontWeight": "700",
              "textAlign": "left",
            },
          ],
        ]
      }
    >
      Header 1
    </Text>
  </Text>
  <Text
    style={
      Array [
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Header 2"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 22,
              "fontWeight": "700",
              "textAlign": "left",
            },
          ],
        ]
      }
    >
      Header 2
    </Text>
  </Text>
  <Text
    style={
      Array [
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Header 3"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 20,
              "fontWeight": "600",
              "textAlign": "left",
            },
          ],
        ]
      }
    >
      Header 3
    </Text>
  </Text>
  <Text
    style={
      Array [
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Header 4"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 18,
              "fontWeight": "600",
              "textAlign": "left",
            },
          ],
        ]
      }
    >
      Header 4
    </Text>
  </Text>
  <Text
    style={
      Array [
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Header 5"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "500",
              "textAlign": "left",
            },
          ],
        ]
      }
    >
      Header 5
    </Text>
  </Text>
  <Text
    style={
      Array [
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Header 6"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 14,
              "fontWeight": "500",
              "textAlign": "left",
            },
          ],
        ]
      }
    >
      Header 6
    </Text>
  </Text>
</View>
`;

exports[`Storyshots Markdown Image 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Image
      source={
        Object {
          "uri": "https://play.google.com/intl/en_us/badges/images/badge_new.png",
        }
      }
      style={
        Object {
          "height": 300,
          "resizeMode": "contain",
          "width": 300,
        }
      }
    />
  </Text>
</View>
`;

exports[`Storyshots Markdown Links 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      onLongPress={[Function]}
      onPress={[Function]}
      style={
        Object {
          "backgroundColor": "transparent",
          "color": "#1d74f5",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        }
      }
    >
      <Text
        accessibilityLabel="Markdown link"
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Array [
              Object {},
              Object {
                "alignItems": "flex-start",
                "flexDirection": "row",
                "flexWrap": "wrap",
                "justifyContent": "flex-start",
                "marginBottom": 0,
                "marginTop": 0,
              },
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
            ],
          ]
        }
      >
        Markdown link
      </Text>
    </Text>
    <Text
      accessibilityLabel=": "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      : 
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "#f1f2f4",
            "borderColor": "#f1f2f4",
            "borderRadius": 4,
            "borderWidth": 1,
            "color": "#2f343d",
            "fontFamily": "Courier New",
            "fontSize": 16,
            "fontWeight": "400",
            "paddingLeft": 2,
            "paddingTop": 2,
            "textAlign": "left",
          },
        ]
      }
    >
      [description](url)
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      onLongPress={[Function]}
      onPress={[Function]}
      style={
        Object {
          "backgroundColor": "transparent",
          "color": "#1d74f5",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        }
      }
    >
      <Text
        accessibilityLabel="Formatted Link"
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Array [
              Object {},
              Object {
                "alignItems": "flex-start",
                "flexDirection": "row",
                "flexWrap": "wrap",
                "justifyContent": "flex-start",
                "marginBottom": 0,
                "marginTop": 0,
              },
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
            ],
          ]
        }
      >
        Formatted Link
      </Text>
    </Text>
    <Text
      accessibilityLabel=": "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      : 
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "#f1f2f4",
            "borderColor": "#f1f2f4",
            "borderRadius": 4,
            "borderWidth": 1,
            "color": "#2f343d",
            "fontFamily": "Courier New",
            "fontSize": 16,
            "fontWeight": "400",
            "paddingLeft": 2,
            "paddingTop": 2,
            "textAlign": "left",
          },
        ]
      }
    >
      &lt;url|description&gt;
    </Text>
  </Text>
</View>
`;

exports[`Storyshots Markdown Lists 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <View
    style={
      Object {
        "alignItems": "flex-start",
        "flexDirection": "row",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "width": 15,
          },
          Object {
            "alignItems": "flex-end",
            "marginRight": 5,
          },
        ]
      }
    >
      <Text
        style={
          Object {
            "color": "#2f343d",
          }
        }
      >
        •
      </Text>
    </View>
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        <Text
          accessibilityLabel="Open Source"
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Array [
                Object {},
                undefined,
                undefined,
                Object {
                  "alignItems": "flex-start",
                  "flexDirection": "row",
                  "flexWrap": "wrap",
                  "justifyContent": "flex-start",
                  "marginBottom": 0,
                  "marginTop": 0,
                },
              ],
            ]
          }
        >
          Open Source
        </Text>
      </Text>
    </View>
  </View>
  <View
    style={
      Object {
        "alignItems": "flex-start",
        "flexDirection": "row",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "width": 15,
          },
          Object {
            "alignItems": "flex-end",
            "marginRight": 5,
          },
        ]
      }
    >
      <Text
        style={
          Object {
            "color": "#2f343d",
          }
        }
      >
        •
      </Text>
    </View>
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        <Text
          accessibilityLabel="Rocket.Chat"
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Array [
                Object {},
                undefined,
                undefined,
                Object {
                  "alignItems": "flex-start",
                  "flexDirection": "row",
                  "flexWrap": "wrap",
                  "justifyContent": "flex-start",
                  "marginBottom": 0,
                  "marginTop": 0,
                },
              ],
            ]
          }
        >
          Rocket.Chat
        </Text>
      </Text>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "flexDirection": "row",
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "width": 15,
              },
              Object {
                "alignItems": "flex-end",
                "marginRight": 5,
              },
            ]
          }
        >
          <Text
            style={
              Object {
                "color": "#2f343d",
              }
            }
          >
            ◦
          </Text>
        </View>
        <View
          style={
            Object {
              "flex": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                undefined,
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
            <Text
              accessibilityLabel="nodejs"
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Array [
                    Object {},
                    undefined,
                    undefined,
                    undefined,
                    undefined,
                    Object {
                      "alignItems": "flex-start",
                      "flexDirection": "row",
                      "flexWrap": "wrap",
                      "justifyContent": "flex-start",
                      "marginBottom": 0,
                      "marginTop": 0,
                    },
                  ],
                ]
              }
            >
              nodejs
            </Text>
          </Text>
        </View>
      </View>
      <View
        style={
          Object {
            "alignItems": "flex-start",
            "flexDirection": "row",
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "width": 15,
              },
              Object {
                "alignItems": "flex-end",
                "marginRight": 5,
              },
            ]
          }
        >
          <Text
            style={
              Object {
                "color": "#2f343d",
              }
            }
          >
            ◦
          </Text>
        </View>
        <View
          style={
            Object {
              "flex": 1,
            }
          }
        >
          <Text
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                undefined,
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
            <Text
              accessibilityLabel="ReactNative"
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Array [
                    Object {},
                    undefined,
                    undefined,
                    undefined,
                    undefined,
                    Object {
                      "alignItems": "flex-start",
                      "flexDirection": "row",
                      "flexWrap": "wrap",
                      "justifyContent": "flex-start",
                      "marginBottom": 0,
                      "marginTop": 0,
                    },
                  ],
                ]
              }
            >
              ReactNative
            </Text>
          </Text>
        </View>
      </View>
    </View>
  </View>
  <View
    style={
      Object {
        "alignItems": "flex-start",
        "flexDirection": "row",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "width": 16,
          },
          Object {
            "alignItems": "flex-end",
            "marginRight": 5,
          },
        ]
      }
    >
      <Text
        style={
          Object {
            "color": "#2f343d",
          }
        }
      >
        1.
      </Text>
    </View>
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        <Text
          accessibilityLabel="Open Source"
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Array [
                Object {},
                undefined,
                undefined,
                Object {
                  "alignItems": "flex-start",
                  "flexDirection": "row",
                  "flexWrap": "wrap",
                  "justifyContent": "flex-start",
                  "marginBottom": 0,
                  "marginTop": 0,
                },
              ],
            ]
          }
        >
          Open Source
        </Text>
      </Text>
    </View>
  </View>
  <View
    style={
      Object {
        "alignItems": "flex-start",
        "flexDirection": "row",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "width": 16,
          },
          Object {
            "alignItems": "flex-end",
            "marginRight": 5,
          },
        ]
      }
    >
      <Text
        style={
          Object {
            "color": "#2f343d",
          }
        }
      >
        2.
      </Text>
    </View>
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        <Text
          accessibilityLabel="Rocket.Chat"
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Array [
                Object {},
                undefined,
                undefined,
                Object {
                  "alignItems": "flex-start",
                  "flexDirection": "row",
                  "flexWrap": "wrap",
                  "justifyContent": "flex-start",
                  "marginBottom": 0,
                  "marginTop": 0,
                },
              ],
            ]
          }
        >
          Rocket.Chat
        </Text>
      </Text>
    </View>
  </View>
</View>
`;

exports[`Storyshots Markdown Mentions 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <View>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#2f343d",
          },
        ]
      }
    >
      <Text
        onPress={[Function]}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F5455C",
            },
          ]
        }
      >
        rocket.cat
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Array [
              Object {},
              Object {
                "alignItems": "flex-start",
                "flexDirection": "row",
                "flexWrap": "wrap",
                "justifyContent": "flex-start",
                "marginBottom": 0,
                "marginTop": 0,
              },
            ],
          ]
        }
      >
         
      </Text>
      <Text
        onPress={[Function]}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F3BE08",
            },
          ]
        }
      >
        name1
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Array [
              Object {},
              Object {
                "alignItems": "flex-start",
                "flexDirection": "row",
                "flexWrap": "wrap",
                "justifyContent": "flex-start",
                "marginBottom": 0,
                "marginTop": 0,
              },
            ],
          ]
        }
      >
         
      </Text>
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F38C39",
            },
          ]
        }
      >
        all
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Array [
              Object {},
              Object {
                "alignItems": "flex-start",
                "flexDirection": "row",
                "flexWrap": "wrap",
                "justifyContent": "flex-start",
                "marginBottom": 0,
                "marginTop": 0,
              },
            ],
          ]
        }
      >
         
      </Text>
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F38C39",
            },
          ]
        }
      >
        here
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Array [
              Object {},
              Object {
                "alignItems": "flex-start",
                "flexDirection": "row",
                "flexWrap": "wrap",
                "justifyContent": "flex-start",
                "marginBottom": 0,
                "marginTop": 0,
              },
            ],
          ]
        }
      >
         
      </Text>
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        @unknown
      </Text>
    </Text>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#2f343d",
          },
        ]
      }
    >
      <Text
        onPress={[Function]}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F5455C",
            },
          ]
        }
      >
        Rocket Cat
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Array [
              Object {},
              Object {
                "alignItems": "flex-start",
                "flexDirection": "row",
                "flexWrap": "wrap",
                "justifyContent": "flex-start",
                "marginBottom": 0,
                "marginTop": 0,
              },
            ],
          ]
        }
      >
         
      </Text>
      <Text
        onPress={[Function]}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F3BE08",
            },
          ]
        }
      >
        Name
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Array [
              Object {},
              Object {
                "alignItems": "flex-start",
                "flexDirection": "row",
                "flexWrap": "wrap",
                "justifyContent": "flex-start",
                "marginBottom": 0,
                "marginTop": 0,
              },
            ],
          ]
        }
      >
         
      </Text>
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F38C39",
            },
          ]
        }
      >
        all
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Array [
              Object {},
              Object {
                "alignItems": "flex-start",
                "flexDirection": "row",
                "flexWrap": "wrap",
                "justifyContent": "flex-start",
                "marginBottom": 0,
                "marginTop": 0,
              },
            ],
          ]
        }
      >
         
      </Text>
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F38C39",
            },
          ]
        }
      >
        here
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Array [
              Object {},
              Object {
                "alignItems": "flex-start",
                "flexDirection": "row",
                "flexWrap": "wrap",
                "justifyContent": "flex-start",
                "marginBottom": 0,
                "marginTop": 0,
              },
            ],
          ]
        }
      >
         
      </Text>
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        @unknown
      </Text>
    </Text>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Markdown Preview 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
    numberOfLines={1}
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  </Text>
  <Text
    accessibilityLabel="a b c d e"
    numberOfLines={1}
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    a b c d e
  </Text>
  <Text
    accessibilityLabel="a b c"
    numberOfLines={1}
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    a b c
  </Text>
  <Text
    accessibilityLabel="@rocket.cat @name1 @all @here @unknown #general #unknown"
    numberOfLines={1}
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    @rocket.cat @name1 @all @here @unknown #general #unknown
  </Text>
  <Text
    accessibilityLabel="Testing: 😃 👍 :marioparty:"
    numberOfLines={1}
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    Testing: 😃 👍 :marioparty:
  </Text>
  <Text
    accessibilityLabel="Fallback from new md to old"
    numberOfLines={1}
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    Fallback from new md to old
  </Text>
</View>
`;

exports[`Storyshots Markdown Table 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <View
    accessible={true}
    focusable={true}
    onClick={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "opacity": 1,
      }
    }
  >
    <RCTScrollView
      contentContainerStyle={
        Object {
          "width": 200,
        }
      }
      scrollEnabled={false}
      showsVerticalScrollIndicator={false}
      style={
        Array [
          Object {
            "borderBottomWidth": 1,
            "borderRightWidth": 1,
          },
          Object {
            "borderColor": "#e1e5e8",
            "maxHeight": 300,
            "maxWidth": 200,
          },
        ]
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "borderLeftWidth": 1,
                "borderTopWidth": 1,
              },
              Object {
                "borderColor": "#e1e5e8",
              },
            ]
          }
        >
          <View
            style={
              Array [
                Object {
                  "flexDirection": "row",
                },
                Object {
                  "borderColor": "#e1e5e8",
                },
                Object {
                  "borderBottomWidth": 1,
                },
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "justifyContent": "flex-start",
                    "paddingHorizontal": 13,
                    "paddingVertical": 6,
                  },
                  Object {
                    "borderColor": "#e1e5e8",
                  },
                  Object {
                    "borderRightWidth": 1,
                  },
                  Object {
                    "width": 100,
                  },
                ]
              }
            >
              <Text
                style={
                  Array [
                    null,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="First Header"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "borderLeftWidth": 1,
                          "borderTopWidth": 1,
                        },
                        undefined,
                        undefined,
                      ],
                    ]
                  }
                >
                  First Header
                </Text>
              </Text>
            </View>
            <View
              style={
                Array [
                  Object {
                    "justifyContent": "flex-start",
                    "paddingHorizontal": 13,
                    "paddingVertical": 6,
                  },
                  Object {
                    "borderColor": "#e1e5e8",
                  },
                  Object {
                    "width": 100,
                  },
                ]
              }
            >
              <Text
                style={
                  Array [
                    null,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="Second Header"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "borderLeftWidth": 1,
                          "borderTopWidth": 1,
                        },
                        undefined,
                        undefined,
                      ],
                    ]
                  }
                >
                  Second Header
                </Text>
              </Text>
            </View>
          </View>
          <View
            style={
              Array [
                Object {
                  "flexDirection": "row",
                },
                Object {
                  "borderColor": "#e1e5e8",
                },
                Object {
                  "borderBottomWidth": 1,
                },
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "justifyContent": "flex-start",
                    "paddingHorizontal": 13,
                    "paddingVertical": 6,
                  },
                  Object {
                    "borderColor": "#e1e5e8",
                  },
                  Object {
                    "borderRightWidth": 1,
                  },
                  Object {
                    "width": 100,
                  },
                ]
              }
            >
              <Text
                style={
                  Array [
                    null,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="Content from cell 1"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "borderLeftWidth": 1,
                          "borderTopWidth": 1,
                        },
                        undefined,
                        undefined,
                      ],
                    ]
                  }
                >
                  Content from cell 1
                </Text>
              </Text>
            </View>
            <View
              style={
                Array [
                  Object {
                    "justifyContent": "flex-start",
                    "paddingHorizontal": 13,
                    "paddingVertical": 6,
                  },
                  Object {
                    "borderColor": "#e1e5e8",
                  },
                  Object {
                    "width": 100,
                  },
                ]
              }
            >
              <Text
                style={
                  Array [
                    null,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="Content from cell 2"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "borderLeftWidth": 1,
                          "borderTopWidth": 1,
                        },
                        undefined,
                        undefined,
                      ],
                    ]
                  }
                >
                  Content from cell 2
                </Text>
              </Text>
            </View>
          </View>
          <View
            style={
              Array [
                Object {
                  "flexDirection": "row",
                },
                Object {
                  "borderColor": "#e1e5e8",
                },
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "justifyContent": "flex-start",
                    "paddingHorizontal": 13,
                    "paddingVertical": 6,
                  },
                  Object {
                    "borderColor": "#e1e5e8",
                  },
                  Object {
                    "borderRightWidth": 1,
                  },
                  Object {
                    "width": 100,
                  },
                ]
              }
            >
              <Text
                style={
                  Array [
                    null,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="Content in the first column"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "borderLeftWidth": 1,
                          "borderTopWidth": 1,
                        },
                        undefined,
                        undefined,
                      ],
                    ]
                  }
                >
                  Content in the first column
                </Text>
              </Text>
            </View>
            <View
              style={
                Array [
                  Object {
                    "justifyContent": "flex-start",
                    "paddingHorizontal": 13,
                    "paddingVertical": 6,
                  },
                  Object {
                    "borderColor": "#e1e5e8",
                  },
                  Object {
                    "width": 100,
                  },
                ]
              }
            >
              <Text
                style={
                  Array [
                    null,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="Content in the second column"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "borderLeftWidth": 1,
                          "borderTopWidth": 1,
                        },
                        undefined,
                        undefined,
                      ],
                    ]
                  }
                >
                  Content in the second column
                </Text>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </RCTScrollView>
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontStyle": "italic",
            "fontWeight": "400",
            "textAlign": "left",
          },
          Object {
            "color": "#9ca2a8",
          },
        ]
      }
    >
      Click to see full table
    </Text>
  </View>
</View>
`;

exports[`Storyshots Markdown Text 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="This is Rocket.Chat"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      This is Rocket.Chat
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="a"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      a
    </Text>
    <Text>
      

    </Text>
    <Text
      accessibilityLabel="b"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      b
    </Text>
    <Text>
      

    </Text>
    <Text
      accessibilityLabel="c"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      c
    </Text>
    <Text>
      

    </Text>
    <Text>
      

    </Text>
    <Text
      accessibilityLabel="d"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      d
    </Text>
    <Text>
      

    </Text>
    <Text>
      

    </Text>
    <Text>
      

    </Text>
    <Text
      accessibilityLabel="e"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      e
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="a       b                                                                             c"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      a       b                                                                             c
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        undefined,
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      accessibilityLabel="Strong emphasis, aka bold, with "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
      Strong emphasis, aka bold, with 
    </Text>
    <Text
      accessibilityLabel="asterisks"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
            Object {
              "fontWeight": "bold",
            },
          ],
        ]
      }
    >
      asterisks
    </Text>
    <Text
      accessibilityLabel=" or "
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
          ],
        ]
      }
    >
       or 
    </Text>
    <Text
      accessibilityLabel="underscores"
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 16,
            "fontWeight": "400",
            "textAlign": "left",
          },
          Array [
            Object {},
            Object {
              "alignItems": "flex-start",
              "flexDirection": "row",
              "flexWrap": "wrap",
              "justifyContent": "flex-start",
              "marginBottom": 0,
              "marginTop": 0,
            },
            Object {
              "fontStyle": "italic",
            },
          ],
        ]
      }
    >
      underscores
    </Text>
  </Text>
</View>
`;

exports[`Storyshots Message Archived 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This message is inside an archived room"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This message is inside an archived room
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Basic 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Block Quote 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Array [
                        Object {
                          "height": "100%",
                          "marginRight": 5,
                          "width": 2,
                        },
                        Object {
                          "backgroundColor": "#e1e5e8",
                        },
                      ]
                    }
                  />
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Testing block quote"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              undefined,
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Testing block quote
                      </Text>
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Array [
                        Object {
                          "height": "100%",
                          "marginRight": 5,
                          "width": 2,
                        },
                        Object {
                          "backgroundColor": "#e1e5e8",
                        },
                      ]
                    }
                  />
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Testing block quote"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              undefined,
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Testing block quote
                      </Text>
                    </Text>
                  </View>
                </View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Testing block quote"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Testing block quote
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Broadcast 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Broadcasted message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Broadcasted message
                  </Text>
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginTop": 8,
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "backgroundColor": "#1d74f5",
                      "borderRadius": 2,
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "opacity": 1,
                      "paddingHorizontal": 12,
                      "paddingVertical": 8,
                    }
                  }
                  testID="message-broadcast-reply"
                >
                  <Text
                    allowFontScaling={false}
                    style={
                      Array [
                        Object {
                          "color": "#ffffff",
                          "fontSize": 20,
                        },
                        Object {
                          "marginRight": 8,
                        },
                        Object {
                          "fontFamily": "custom",
                          "fontStyle": "normal",
                          "fontWeight": "normal",
                        },
                        Object {},
                      ]
                    }
                  >
                    
                  </Text>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 12,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    Reply
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Colored attachments 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View />
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "rgba(255, 0, 0, 0.2)",
                    "borderColor": "red",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  />
                  <View
                    style={
                      Object {
                        "flex": 1,
                        "flexDirection": "row",
                        "flexWrap": "wrap",
                      }
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "50%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 1
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 1"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 1
                        </Text>
                      </Text>
                    </View>
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "50%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 2
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 2"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 2
                        </Text>
                      </Text>
                    </View>
                  </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": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "rgba(0, 128, 0, 0.2)",
                    "borderColor": "green",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginTop": 4,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  />
                  <View
                    style={
                      Object {
                        "flex": 1,
                        "flexDirection": "row",
                        "flexWrap": "wrap",
                      }
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "50%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 1
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 1"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 1
                        </Text>
                      </Text>
                    </View>
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "50%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 2
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 2"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 2
                        </Text>
                      </Text>
                    </View>
                  </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": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "rgba(0, 0, 255, 0.2)",
                    "borderColor": "blue",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginTop": 4,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  />
                  <View
                    style={
                      Object {
                        "flex": 1,
                        "flexDirection": "row",
                        "flexWrap": "wrap",
                      }
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "50%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 1
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 1"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 1
                        </Text>
                      </Text>
                    </View>
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "50%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 2
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 2"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 2
                        </Text>
                      </Text>
                    </View>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Custom fields 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message
                  </Text>
                </Text>
              </View>
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  >
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "flex": 1,
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "500",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      rocket.cat
                    </Text>
                  </View>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="Custom fields"
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      Custom fields
                    </Text>
                  </Text>
                  <View
                    style={
                      Object {
                        "flex": 1,
                        "flexDirection": "row",
                        "flexWrap": "wrap",
                      }
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "100%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 1
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 1"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 1
                        </Text>
                      </Text>
                    </View>
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "100%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 2
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 2"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 2
                        </Text>
                      </Text>
                    </View>
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "100%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 3
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 3"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 3
                        </Text>
                      </Text>
                    </View>
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "100%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 4
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 4"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 4
                        </Text>
                      </Text>
                    </View>
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "100%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 5
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 5"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 5
                        </Text>
                      </Text>
                    </View>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Custom style 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              Array [
                undefined,
                Object {
                  "backgroundColor": "#ddd",
                },
              ],
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Date and Unread separators 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    rocket.cat
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Fourth message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Fourth message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
          "marginBottom": 4,
          "marginHorizontal": 14,
          "marginTop": 16,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 14,
              "fontWeight": "500",
              "textAlign": "left",
            },
            Object {
              "color": "#f5455c",
            },
          ]
        }
      >
        unread
      </Text>
      <View
        style={
          Array [
            Object {
              "flex": 1,
              "height": 1,
            },
            Object {
              "backgroundColor": "#f5455c",
            },
            Object {
              "marginHorizontal": 14,
            },
          ]
        }
      />
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 14,
              "fontWeight": "500",
              "textAlign": "left",
            },
            Object {
              "color": "#f5455c",
            },
          ]
        }
      >
        November 10, 2017
      </Text>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Third message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Third message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
          "marginBottom": 4,
          "marginHorizontal": 14,
          "marginTop": 16,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 14,
              "fontWeight": "500",
              "textAlign": "left",
            },
            Object {
              "color": "#f5455c",
            },
            Object {
              "marginRight": 14,
            },
          ]
        }
      >
        unread
      </Text>
      <View
        style={
          Array [
            Object {
              "flex": 1,
              "height": 1,
            },
            Object {
              "backgroundColor": "#f5455c",
            },
          ]
        }
      />
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Second message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Second message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    rocket.cat
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Second message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Second message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
          "marginBottom": 4,
          "marginHorizontal": 14,
          "marginTop": 16,
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "flex": 1,
              "height": 1,
            },
            Object {
              "backgroundColor": "#e1e5e8",
            },
          ]
        }
      />
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 14,
              "fontWeight": "500",
              "textAlign": "left",
            },
            Object {
              "color": "#9ca2a8",
            },
            Object {
              "marginLeft": 14,
            },
          ]
        }
      >
        November 10, 2017
      </Text>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="First message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    First message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Discussion 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "marginBottom": 6,
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                Started a discussion:
              </Text>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                This is a discussion
              </Text>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginTop": 8,
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "backgroundColor": "#1d74f5",
                      "borderRadius": 2,
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "opacity": 1,
                      "paddingHorizontal": 12,
                      "paddingVertical": 8,
                    }
                  }
                >
                  <Text
                    allowFontScaling={false}
                    style={
                      Array [
                        Object {
                          "color": "#ffffff",
                          "fontSize": 16,
                        },
                        Object {
                          "marginRight": 8,
                        },
                        Object {
                          "fontFamily": "custom",
                          "fontStyle": "normal",
                          "fontWeight": "normal",
                        },
                        Object {},
                      ]
                    }
                  >
                    
                  </Text>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 12,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    No messages yet
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                />
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "marginBottom": 6,
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                Started a discussion:
              </Text>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                This is a discussion
              </Text>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginTop": 8,
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "backgroundColor": "#1d74f5",
                      "borderRadius": 2,
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "opacity": 1,
                      "paddingHorizontal": 12,
                      "paddingVertical": 8,
                    }
                  }
                >
                  <Text
                    allowFontScaling={false}
                    style={
                      Array [
                        Object {
                          "color": "#ffffff",
                          "fontSize": 16,
                        },
                        Object {
                          "marginRight": 8,
                        },
                        Object {
                          "fontFamily": "custom",
                          "fontStyle": "normal",
                          "fontWeight": "normal",
                        },
                        Object {},
                      ]
                    }
                  >
                    
                  </Text>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 12,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    1 message
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  November 10, 2017
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "marginBottom": 6,
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                Started a discussion:
              </Text>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
              </Text>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginTop": 8,
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "backgroundColor": "#1d74f5",
                      "borderRadius": 2,
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "opacity": 1,
                      "paddingHorizontal": 12,
                      "paddingVertical": 8,
                    }
                  }
                >
                  <Text
                    allowFontScaling={false}
                    style={
                      Array [
                        Object {
                          "color": "#ffffff",
                          "fontSize": 16,
                        },
                        Object {
                          "marginRight": 8,
                        },
                        Object {
                          "fontFamily": "custom",
                          "fontStyle": "normal",
                          "fontWeight": "normal",
                        },
                        Object {},
                      ]
                    }
                  >
                    
                  </Text>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 12,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    10 messages
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  November 10, 2017
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "marginBottom": 6,
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                Started a discussion:
              </Text>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                This is a discussion
              </Text>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginTop": 8,
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "backgroundColor": "#1d74f5",
                      "borderRadius": 2,
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "opacity": 1,
                      "paddingHorizontal": 12,
                      "paddingVertical": 8,
                    }
                  }
                >
                  <Text
                    allowFontScaling={false}
                    style={
                      Array [
                        Object {
                          "color": "#ffffff",
                          "fontSize": 16,
                        },
                        Object {
                          "marginRight": 8,
                        },
                        Object {
                          "fontFamily": "custom",
                          "fontStyle": "normal",
                          "fontWeight": "normal",
                        },
                        Object {},
                      ]
                    }
                  >
                    
                  </Text>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 12,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    +999 messages
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  November 10, 2017
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Edited 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Editing 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message being edited"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message being edited
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Emojis 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="👊🤙👏"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 30,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    👊🤙👏
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="👏"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 30,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    👏
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <View
                    style={
                      Array [
                        Object {
                          "overflow": "hidden",
                        },
                        Array [
                          Object {
                            "height": 30,
                            "width": 30,
                          },
                          Object {},
                        ],
                      ]
                    }
                  >
                    <FastImageView
                      resizeMode="contain"
                      source={
                        Object {
                          "priority": "high",
                          "uri": "https://open.rocket.chat/emoji-custom/react_rocket.png",
                        }
                      }
                      style={
                        Object {
                          "bottom": 0,
                          "left": 0,
                          "position": "absolute",
                          "right": 0,
                          "top": 0,
                        }
                      }
                    />
                  </View>
                  <Text
                    accessibilityLabel=" "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 30,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "overflow": "hidden",
                        },
                        Array [
                          Object {
                            "height": 30,
                            "width": 30,
                          },
                          Object {},
                        ],
                      ]
                    }
                  >
                    <FastImageView
                      resizeMode="contain"
                      source={
                        Object {
                          "priority": "high",
                          "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
                        }
                      }
                      style={
                        Object {
                          "bottom": 0,
                          "left": 0,
                          "position": "absolute",
                          "right": 0,
                          "top": 0,
                        }
                      }
                    />
                  </View>
                  <Text
                    accessibilityLabel=" "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 30,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "overflow": "hidden",
                        },
                        Array [
                          Object {
                            "height": 30,
                            "width": 30,
                          },
                          Object {},
                        ],
                      ]
                    }
                  >
                    <FastImageView
                      resizeMode="contain"
                      source={
                        Object {
                          "priority": "high",
                          "uri": "https://open.rocket.chat/emoji-custom/marioparty.gif",
                        }
                      }
                      style={
                        Object {
                          "bottom": 0,
                          "left": 0,
                          "position": "absolute",
                          "right": 0,
                          "top": 0,
                        }
                      }
                    />
                  </View>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <View
                    style={
                      Array [
                        Object {
                          "overflow": "hidden",
                        },
                        Array [
                          Object {
                            "height": 30,
                            "width": 30,
                          },
                          Object {},
                        ],
                      ]
                    }
                  >
                    <FastImageView
                      resizeMode="contain"
                      source={
                        Object {
                          "priority": "high",
                          "uri": "https://open.rocket.chat/emoji-custom/react_rocket.png",
                        }
                      }
                      style={
                        Object {
                          "bottom": 0,
                          "left": 0,
                          "position": "absolute",
                          "right": 0,
                          "top": 0,
                        }
                      }
                    />
                  </View>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="🤙"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 30,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    🤙
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "overflow": "hidden",
                        },
                        Array [
                          Object {
                            "height": 30,
                            "width": 30,
                          },
                          Object {},
                        ],
                      ]
                    }
                  >
                    <FastImageView
                      resizeMode="contain"
                      source={
                        Object {
                          "priority": "high",
                          "uri": "https://open.rocket.chat/emoji-custom/react_rocket.png",
                        }
                      }
                      style={
                        Object {
                          "bottom": 0,
                          "left": 0,
                          "position": "absolute",
                          "right": 0,
                          "top": 0,
                        }
                      }
                    />
                  </View>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="🤙"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    🤙
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "overflow": "hidden",
                        },
                        Array [
                          Object {
                            "height": 20,
                            "width": 20,
                          },
                          Object {},
                        ],
                      ]
                    }
                  >
                    <FastImageView
                      resizeMode="contain"
                      source={
                        Object {
                          "priority": "high",
                          "uri": "https://open.rocket.chat/emoji-custom/react_rocket.png",
                        }
                      }
                      style={
                        Object {
                          "bottom": 0,
                          "left": 0,
                          "position": "absolute",
                          "right": 0,
                          "top": 0,
                        }
                      }
                    />
                  </View>
                  <Text
                    accessibilityLabel="🤙🤙"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    🤙🤙
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Encrypted 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <View
                  style={
                    Object {
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Message"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Message
                      </Text>
                    </Text>
                  </View>
                  <View
                    accessible={true}
                    focusable={false}
                    hitSlop={
                      Object {
                        "bottom": 4,
                        "left": 4,
                        "right": 4,
                        "top": 4,
                      }
                    }
                    onClick={[Function]}
                    onResponderGrant={[Function]}
                    onResponderMove={[Function]}
                    onResponderRelease={[Function]}
                    onResponderTerminate={[Function]}
                    onResponderTerminationRequest={[Function]}
                    onStartShouldSetResponder={[Function]}
                    style={
                      Object {
                        "justifyContent": "center",
                        "opacity": 1,
                      }
                    }
                  >
                    <Text
                      allowFontScaling={false}
                      style={
                        Array [
                          Object {
                            "color": "#9ca2a8",
                            "fontSize": 16,
                          },
                          undefined,
                          Object {
                            "fontFamily": "custom",
                            "fontStyle": "normal",
                            "fontWeight": "normal",
                          },
                          Object {},
                        ]
                      }
                    >
                      
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <View
                  style={
                    Object {
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Message Encrypted without Header"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Message Encrypted without Header
                      </Text>
                    </Text>
                  </View>
                  <View
                    accessible={true}
                    focusable={false}
                    hitSlop={
                      Object {
                        "bottom": 4,
                        "left": 4,
                        "right": 4,
                        "top": 4,
                      }
                    }
                    onClick={[Function]}
                    onResponderGrant={[Function]}
                    onResponderMove={[Function]}
                    onResponderRelease={[Function]}
                    onResponderTerminate={[Function]}
                    onResponderTerminationRequest={[Function]}
                    onStartShouldSetResponder={[Function]}
                    style={
                      Object {
                        "justifyContent": "center",
                        "opacity": 1,
                      }
                    }
                  >
                    <Text
                      allowFontScaling={false}
                      style={
                        Array [
                          Object {
                            "color": "#9ca2a8",
                            "fontSize": 16,
                          },
                          undefined,
                          Object {
                            "fontFamily": "custom",
                            "fontStyle": "normal",
                            "fontWeight": "normal",
                          },
                          Object {},
                        ]
                      }
                    >
                      
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <View
                  style={
                    Object {
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Message Encrypted with Reactions"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Message Encrypted with Reactions
                      </Text>
                    </Text>
                  </View>
                  <View
                    accessible={true}
                    focusable={false}
                    hitSlop={
                      Object {
                        "bottom": 4,
                        "left": 4,
                        "right": 4,
                        "top": 4,
                      }
                    }
                    onClick={[Function]}
                    onResponderGrant={[Function]}
                    onResponderMove={[Function]}
                    onResponderRelease={[Function]}
                    onResponderTerminate={[Function]}
                    onResponderTerminationRequest={[Function]}
                    onStartShouldSetResponder={[Function]}
                    style={
                      Object {
                        "justifyContent": "center",
                        "opacity": 1,
                      }
                    }
                  >
                    <Text
                      allowFontScaling={false}
                      style={
                        Array [
                          Object {
                            "color": "#9ca2a8",
                            "fontSize": 16,
                          },
                          undefined,
                          Object {
                            "fontFamily": "custom",
                            "fontStyle": "normal",
                            "fontWeight": "normal",
                          },
                          Object {},
                        ]
                      }
                    >
                      
                    </Text>
                  </View>
                </View>
              </View>
              <View
                style={
                  Object {
                    "flexDirection": "row",
                    "flexWrap": "wrap",
                    "marginTop": 8,
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:joy:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#ffffff",
                          "fontSize": 13,
                          "marginLeft": 7,
                        }
                      }
                    >
                      😂
                    </Text>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:marioparty:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "overflow": "hidden",
                          },
                          Object {
                            "height": 19,
                            "marginLeft": 7,
                            "width": 19,
                          },
                        ]
                      }
                    >
                      <FastImageView
                        resizeMode="contain"
                        source={
                          Object {
                            "priority": "high",
                            "uri": "https://open.rocket.chat/emoji-custom/marioparty.gif",
                          }
                        }
                        style={
                          Object {
                            "bottom": 0,
                            "left": 0,
                            "position": "absolute",
                            "right": 0,
                            "top": 0,
                          }
                        }
                      />
                    </View>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:thinking:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#ffffff",
                          "fontSize": 13,
                          "marginLeft": 7,
                        }
                      }
                    >
                      🤔
                    </Text>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#ffffff",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-add-reaction"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#e1e5e8",
                        },
                      ]
                    }
                  >
                    <Text
                      allowFontScaling={false}
                      style={
                        Array [
                          Object {
                            "color": "#1d74f5",
                            "fontSize": 21,
                          },
                          undefined,
                          Object {
                            "fontFamily": "custom",
                            "fontStyle": "normal",
                            "fontWeight": "normal",
                          },
                          Object {},
                        ]
                      }
                    >
                      
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 12,
                "marginTop": 6,
              }
            }
            testID="message-thread-replied-on-Thread with emoji :) :joy:"
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 20,
                  },
                  Object {
                    "marginLeft": 16,
                    "marginRight": 10,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              accessibilityLabel="Thread with emoji🙂 😂"
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flex": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#1d74f5",
                  },
                ]
              }
            >
              Thread with emoji🙂 😂
            </Text>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                  "marginLeft": 4,
                  "marginRight": 4,
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="Thread reply encrypted"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  Thread reply encrypted
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View
                style={
                  Object {
                    "opacity": 0.3,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Temp message encrypted"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Temp message encrypted
                      </Text>
                    </Text>
                  </View>
                  <View
                    accessible={true}
                    focusable={false}
                    hitSlop={
                      Object {
                        "bottom": 4,
                        "left": 4,
                        "right": 4,
                        "top": 4,
                      }
                    }
                    onClick={[Function]}
                    onResponderGrant={[Function]}
                    onResponderMove={[Function]}
                    onResponderRelease={[Function]}
                    onResponderTerminate={[Function]}
                    onResponderTerminationRequest={[Function]}
                    onStartShouldSetResponder={[Function]}
                    style={
                      Object {
                        "justifyContent": "center",
                        "opacity": 1,
                      }
                    }
                  >
                    <Text
                      allowFontScaling={false}
                      style={
                        Array [
                          Object {
                            "color": "#9ca2a8",
                            "fontSize": 16,
                          },
                          undefined,
                          Object {
                            "fontFamily": "custom",
                            "fontStyle": "normal",
                            "fontWeight": "normal",
                          },
                          Object {},
                        ]
                      }
                    >
                      
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <View
                  style={
                    Object {
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Message Edited encrypted"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Message Edited encrypted
                      </Text>
                    </Text>
                  </View>
                  <View
                    accessible={true}
                    focusable={false}
                    hitSlop={
                      Object {
                        "bottom": 4,
                        "left": 4,
                        "right": 4,
                        "top": 4,
                      }
                    }
                    onClick={[Function]}
                    onResponderGrant={[Function]}
                    onResponderMove={[Function]}
                    onResponderRelease={[Function]}
                    onResponderTerminate={[Function]}
                    onResponderTerminationRequest={[Function]}
                    onStartShouldSetResponder={[Function]}
                    style={
                      Object {
                        "justifyContent": "center",
                        "opacity": 1,
                      }
                    }
                  >
                    <Text
                      allowFontScaling={false}
                      style={
                        Array [
                          Object {
                            "color": "#9ca2a8",
                            "fontSize": 16,
                          },
                          undefined,
                          Object {
                            "fontFamily": "custom",
                            "fontStyle": "normal",
                            "fontWeight": "normal",
                          },
                          Object {},
                        ]
                      }
                    >
                      
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View>
      <View
        style={
          Array [
            Object {
              "flexDirection": "column",
              "paddingHorizontal": 14,
              "paddingVertical": 4,
              "width": "100%",
            },
            undefined,
          ]
        }
      >
        <View
          style={
            Object {
              "flexDirection": "row",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
                Object {
                  "marginTop": 4,
                },
              ]
            }
            testID="avatar"
          >
            <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 {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 36,
                      "width": 36,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
          </View>
          <View
            style={
              Array [
                Object {
                  "flex": 1,
                  "marginLeft": 46,
                },
                Object {
                  "marginLeft": 10,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "space-between",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "flexShrink": 1,
                    "opacity": 1,
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "500",
                        "lineHeight": 22,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  diego.mello
                </Text>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 12,
                      "fontWeight": "400",
                      "marginLeft": 8,
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                10:00 AM
              </Text>
              <View
                accessible={true}
                focusable={true}
                hitSlop={
                  Object {
                    "bottom": 4,
                    "left": 4,
                    "right": 4,
                    "top": 4,
                  }
                }
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                    "paddingLeft": 10,
                    "paddingVertical": 5,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#f5455c",
                        "fontSize": 18,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
            <View>
              <View
                style={
                  Object {
                    "flexDirection": "row",
                  }
                }
              >
                <View
                  style={
                    Object {
                      "flex": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="This message has error and is encrypted"
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      This message has error and is encrypted
                    </Text>
                  </Text>
                </View>
                <View
                  accessible={true}
                  focusable={false}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "justifyContent": "center",
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    allowFontScaling={false}
                    style={
                      Array [
                        Object {
                          "color": "#9ca2a8",
                          "fontSize": 16,
                        },
                        undefined,
                        Object {
                          "fontFamily": "custom",
                          "fontStyle": "normal",
                          "fontWeight": "normal",
                        },
                        Object {},
                      ]
                    }
                  >
                    
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <View
                  style={
                    Object {
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Read Receipt encrypted with Header"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Read Receipt encrypted with Header
                      </Text>
                    </Text>
                  </View>
                  <View
                    accessible={true}
                    focusable={false}
                    hitSlop={
                      Object {
                        "bottom": 4,
                        "left": 4,
                        "right": 4,
                        "top": 4,
                      }
                    }
                    onClick={[Function]}
                    onResponderGrant={[Function]}
                    onResponderMove={[Function]}
                    onResponderRelease={[Function]}
                    onResponderTerminate={[Function]}
                    onResponderTerminationRequest={[Function]}
                    onStartShouldSetResponder={[Function]}
                    style={
                      Object {
                        "justifyContent": "center",
                        "opacity": 1,
                      }
                    }
                  >
                    <Text
                      allowFontScaling={false}
                      style={
                        Array [
                          Object {
                            "color": "#9ca2a8",
                            "fontSize": 16,
                          },
                          undefined,
                          Object {
                            "fontFamily": "custom",
                            "fontStyle": "normal",
                            "fontWeight": "normal",
                          },
                          Object {},
                        ]
                      }
                    >
                      
                    </Text>
                  </View>
                </View>
              </View>
            </View>
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 15,
                  },
                  Object {
                    "lineHeight": 20,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <View
                  style={
                    Object {
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Read Receipt encrypted without Header"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Read Receipt encrypted without Header
                      </Text>
                    </Text>
                  </View>
                  <View
                    accessible={true}
                    focusable={false}
                    hitSlop={
                      Object {
                        "bottom": 4,
                        "left": 4,
                        "right": 4,
                        "top": 4,
                      }
                    }
                    onClick={[Function]}
                    onResponderGrant={[Function]}
                    onResponderMove={[Function]}
                    onResponderRelease={[Function]}
                    onResponderTerminate={[Function]}
                    onResponderTerminationRequest={[Function]}
                    onStartShouldSetResponder={[Function]}
                    style={
                      Object {
                        "justifyContent": "center",
                        "opacity": 1,
                      }
                    }
                  >
                    <Text
                      allowFontScaling={false}
                      style={
                        Array [
                          Object {
                            "color": "#9ca2a8",
                            "fontSize": 16,
                          },
                          undefined,
                          Object {
                            "fontFamily": "custom",
                            "fontStyle": "normal",
                            "fontWeight": "normal",
                          },
                          Object {},
                        ]
                      }
                    >
                      
                    </Text>
                  </View>
                </View>
              </View>
            </View>
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 15,
                  },
                  Object {
                    "lineHeight": 20,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Error 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View>
      <View
        style={
          Array [
            Object {
              "flexDirection": "column",
              "paddingHorizontal": 14,
              "paddingVertical": 4,
              "width": "100%",
            },
            undefined,
          ]
        }
      >
        <View
          style={
            Object {
              "flexDirection": "row",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
                Object {
                  "marginTop": 4,
                },
              ]
            }
            testID="avatar"
          >
            <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 {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 36,
                      "width": 36,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
          </View>
          <View
            style={
              Array [
                Object {
                  "flex": 1,
                  "marginLeft": 46,
                },
                Object {
                  "marginLeft": 10,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "space-between",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "flexShrink": 1,
                    "opacity": 1,
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "500",
                        "lineHeight": 22,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  diego.mello
                </Text>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 12,
                      "fontWeight": "400",
                      "marginLeft": 8,
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                10:00 AM
              </Text>
              <View
                accessible={true}
                focusable={true}
                hitSlop={
                  Object {
                    "bottom": 4,
                    "left": 4,
                    "right": 4,
                    "top": 4,
                  }
                }
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                    "paddingLeft": 10,
                    "paddingVertical": 5,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#f5455c",
                        "fontSize": 18,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
            <View>
              <Text
                numberOfLines={0}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    undefined,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="This message has error"
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "alignItems": "flex-start",
                          "flexDirection": "row",
                          "flexWrap": "wrap",
                          "justifyContent": "flex-start",
                          "marginBottom": 0,
                          "marginTop": 0,
                        },
                      ],
                    ]
                  }
                >
                  This message has error
                </Text>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View>
      <View
        style={
          Array [
            Object {
              "flexDirection": "column",
              "paddingHorizontal": 14,
              "paddingVertical": 4,
              "width": "100%",
            },
            undefined,
          ]
        }
      >
        <View
          style={
            Object {
              "flexDirection": "row",
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "flex": 1,
                  "marginLeft": 46,
                },
                false,
              ]
            }
          >
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                  "justifyContent": "space-between",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "flexShrink": 1,
                    "opacity": 1,
                  }
                }
              >
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "500",
                        "lineHeight": 22,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  diego.mello
                </Text>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 12,
                      "fontWeight": "400",
                      "marginLeft": 8,
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                10:00 AM
              </Text>
              <View
                accessible={true}
                focusable={true}
                hitSlop={
                  Object {
                    "bottom": 4,
                    "left": 4,
                    "right": 4,
                    "top": 4,
                  }
                }
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                    "paddingLeft": 10,
                    "paddingVertical": 5,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#f5455c",
                        "fontSize": 18,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
            <View>
              <Text
                numberOfLines={0}
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    undefined,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="This message has error too"
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "alignItems": "flex-start",
                          "flexDirection": "row",
                          "flexWrap": "wrap",
                          "justifyContent": "flex-start",
                          "marginBottom": 0,
                          "marginTop": 0,
                        },
                      ],
                    ]
                  }
                >
                  This message has error too
                </Text>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Full name 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    Diego Mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Grouped messages 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="..."
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    ...
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Different user"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Different user
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the third message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the third message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the second message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the second message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="This is the first message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    This is the first message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Ignored 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontStyle": "italic",
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  Message ignored. Tap to display it.
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Lists 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Array [
                        Object {
                          "width": 15,
                        },
                        Object {
                          "alignItems": "flex-end",
                          "marginRight": 5,
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#2f343d",
                        }
                      }
                    >
                      •
                    </Text>
                  </View>
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Dogs"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              undefined,
                              undefined,
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Dogs
                      </Text>
                    </Text>
                    <View
                      style={
                        Object {
                          "alignItems": "flex-start",
                          "flexDirection": "row",
                        }
                      }
                    >
                      <View
                        style={
                          Array [
                            Object {
                              "width": 15,
                            },
                            Object {
                              "alignItems": "flex-end",
                              "marginRight": 5,
                            },
                          ]
                        }
                      >
                        <Text
                          style={
                            Object {
                              "color": "#2f343d",
                            }
                          }
                        >
                          ◦
                        </Text>
                      </View>
                      <View
                        style={
                          Object {
                            "flex": 1,
                          }
                        }
                      >
                        <Text
                          numberOfLines={0}
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              undefined,
                              Object {
                                "color": "#2f343d",
                              },
                            ]
                          }
                        >
                          <Text
                            accessibilityLabel="cats"
                            numberOfLines={0}
                            style={
                              Array [
                                Object {
                                  "backgroundColor": "transparent",
                                  "fontFamily": "System",
                                  "fontSize": 16,
                                  "fontWeight": "400",
                                  "textAlign": "left",
                                },
                                Array [
                                  Object {},
                                  undefined,
                                  undefined,
                                  undefined,
                                  undefined,
                                  Object {
                                    "alignItems": "flex-start",
                                    "flexDirection": "row",
                                    "flexWrap": "wrap",
                                    "justifyContent": "flex-start",
                                    "marginBottom": 0,
                                    "marginTop": 0,
                                  },
                                ],
                              ]
                            }
                          >
                            cats
                          </Text>
                        </Text>
                      </View>
                    </View>
                    <View
                      style={
                        Object {
                          "alignItems": "flex-start",
                          "flexDirection": "row",
                        }
                      }
                    >
                      <View
                        style={
                          Array [
                            Object {
                              "width": 15,
                            },
                            Object {
                              "alignItems": "flex-end",
                              "marginRight": 5,
                            },
                          ]
                        }
                      >
                        <Text
                          style={
                            Object {
                              "color": "#2f343d",
                            }
                          }
                        >
                          ◦
                        </Text>
                      </View>
                      <View
                        style={
                          Object {
                            "flex": 1,
                          }
                        }
                      >
                        <Text
                          numberOfLines={0}
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              undefined,
                              Object {
                                "color": "#2f343d",
                              },
                            ]
                          }
                        >
                          <Text
                            accessibilityLabel="cats"
                            numberOfLines={0}
                            style={
                              Array [
                                Object {
                                  "backgroundColor": "transparent",
                                  "fontFamily": "System",
                                  "fontSize": 16,
                                  "fontWeight": "400",
                                  "textAlign": "left",
                                },
                                Array [
                                  Object {},
                                  undefined,
                                  undefined,
                                  undefined,
                                  undefined,
                                  Object {
                                    "alignItems": "flex-start",
                                    "flexDirection": "row",
                                    "flexWrap": "wrap",
                                    "justifyContent": "flex-start",
                                    "marginBottom": 0,
                                    "marginTop": 0,
                                  },
                                ],
                              ]
                            }
                          >
                            cats
                          </Text>
                        </Text>
                      </View>
                    </View>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Array [
                        Object {
                          "width": 16,
                        },
                        Object {
                          "alignItems": "flex-end",
                          "marginRight": 5,
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#2f343d",
                        }
                      }
                    >
                      1.
                    </Text>
                  </View>
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Dogs"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              undefined,
                              undefined,
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Dogs
                      </Text>
                    </Text>
                  </View>
                </View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Array [
                        Object {
                          "width": 16,
                        },
                        Object {
                          "alignItems": "flex-end",
                          "marginRight": 5,
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#2f343d",
                        }
                      }
                    >
                      2.
                    </Text>
                  </View>
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Cats"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              undefined,
                              undefined,
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Cats
                      </Text>
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Array [
                        Object {
                          "width": 16,
                        },
                        Object {
                          "alignItems": "flex-end",
                          "marginRight": 5,
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#2f343d",
                        }
                      }
                    >
                      1.
                    </Text>
                  </View>
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Dogs"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              undefined,
                              undefined,
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Dogs
                      </Text>
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flexDirection": "row",
                    }
                  }
                >
                  <View
                    style={
                      Array [
                        Object {
                          "width": 16,
                        },
                        Object {
                          "alignItems": "flex-end",
                          "marginRight": 5,
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#2f343d",
                        }
                      }
                    >
                      2.
                    </Text>
                  </View>
                  <View
                    style={
                      Object {
                        "flex": 1,
                      }
                    }
                  >
                    <Text
                      numberOfLines={0}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      <Text
                        accessibilityLabel="Cats"
                        numberOfLines={0}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            Array [
                              Object {},
                              undefined,
                              undefined,
                              Object {
                                "alignItems": "flex-start",
                                "flexDirection": "row",
                                "flexWrap": "wrap",
                                "justifyContent": "flex-start",
                                "marginBottom": 0,
                                "marginTop": 0,
                              },
                            ],
                          ]
                        }
                      >
                        Cats
                      </Text>
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Mentions 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    onPress={[Function]}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#F3BE08",
                        },
                      ]
                    }
                  >
                    rocket.cat
                  </Text>
                  <Text
                    accessibilityLabel=" "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     
                  </Text>
                  <Text
                    onPress={[Function]}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#F5455C",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                  <Text
                    accessibilityLabel=" "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     
                  </Text>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#F38C39",
                        },
                      ]
                    }
                  >
                    all
                  </Text>
                  <Text
                    accessibilityLabel=" "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     
                  </Text>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#F38C39",
                        },
                      ]
                    }
                  >
                    here
                  </Text>
                  <Text
                    accessibilityLabel=" "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     
                  </Text>
                  <Text
                    onPress={[Function]}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#F3BE08",
                        },
                      ]
                    }
                  >
                    #general
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    onPress={[Function]}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#F3BE08",
                        },
                      ]
                    }
                  >
                    rocket.cat
                  </Text>
                  <Text
                    accessibilityLabel=" Lorem ipsum dolor "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     Lorem ipsum dolor 
                  </Text>
                  <Text
                    onPress={[Function]}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#F5455C",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                  <Text
                    accessibilityLabel=" sit amet, "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     sit amet, 
                  </Text>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#F38C39",
                        },
                      ]
                    }
                  >
                    all
                  </Text>
                  <Text
                    accessibilityLabel=" consectetur adipiscing "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     consectetur adipiscing 
                  </Text>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#F38C39",
                        },
                      ]
                    }
                  >
                    here
                  </Text>
                  <Text
                    accessibilityLabel=" elit, sed do eiusmod tempor "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     elit, sed do eiusmod tempor 
                  </Text>
                  <Text
                    onPress={[Function]}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#F3BE08",
                        },
                      ]
                    }
                  >
                    #general
                  </Text>
                  <Text
                    accessibilityLabel=" incididunt ut labore et dolore magna aliqua."
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                     incididunt ut labore et dolore magna aliqua.
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Message with read receipt 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="I'm fine!"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    I'm fine!
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="I'm fine!"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    I'm fine!
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="I'm fine!"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    I'm fine!
                  </Text>
                </Text>
              </View>
            </View>
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 15,
                  },
                  Object {
                    "lineHeight": 20,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="I'm fine!"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    I'm fine!
                  </Text>
                </Text>
              </View>
            </View>
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 15,
                  },
                  Object {
                    "lineHeight": 20,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Message with reply 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="I'm fine!"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    I'm fine!
                  </Text>
                </Text>
              </View>
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  >
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "flex": 1,
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "500",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      I'm a very long long title and I'll break
                    </Text>
                  </View>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="How are you?"
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      How are you?
                    </Text>
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="I'm fine!"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    I'm fine!
                  </Text>
                </Text>
              </View>
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  >
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "flex": 1,
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "500",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      rocket.cat
                    </Text>
                  </View>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="How are you? "
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      How are you? 
                    </Text>
                    <View
                      style={
                        Array [
                          Object {
                            "overflow": "hidden",
                          },
                          Array [
                            Object {
                              "height": 20,
                              "width": 20,
                            },
                            Object {},
                          ],
                        ]
                      }
                    >
                      <FastImageView
                        resizeMode="contain"
                        source={
                          Object {
                            "priority": "high",
                            "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
                          }
                        }
                        style={
                          Object {
                            "bottom": 0,
                            "left": 0,
                            "position": "absolute",
                            "right": 0,
                            "top": 0,
                          }
                        }
                      />
                    </View>
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Message with thread 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="How are you?"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    How are you?
                  </Text>
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginTop": 8,
                  }
                }
              >
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "borderRadius": 2,
                        "flexDirection": "row",
                        "justifyContent": "center",
                        "paddingHorizontal": 12,
                        "paddingVertical": 8,
                      },
                      Object {
                        "backgroundColor": "#1d74f5",
                      },
                    ]
                  }
                  testID="message-thread-button-How are you?"
                >
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 12,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    Reply
                  </Text>
                </View>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      },
                      Object {
                        "flex": 1,
                        "marginLeft": 12,
                      },
                    ]
                  }
                >
                  <View
                    style={
                      Object {
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  >
                    <View
                      style={
                        Object {
                          "alignItems": "center",
                          "flexDirection": "row",
                          "marginRight": 8,
                        }
                      }
                    >
                      <Text
                        allowFontScaling={false}
                        style={
                          Array [
                            Object {
                              "color": "#9ca2a8",
                              "fontSize": 24,
                            },
                            undefined,
                            Object {
                              "fontFamily": "custom",
                              "fontStyle": "normal",
                              "fontWeight": "normal",
                            },
                            Object {},
                          ]
                        }
                      >
                        
                      </Text>
                      <Text
                        numberOfLines={1}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 10,
                              "fontWeight": "600",
                              "marginLeft": 2,
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#9ca2a8",
                            },
                          ]
                        }
                      >
                        1
                      </Text>
                    </View>
                    <View
                      style={
                        Object {
                          "alignItems": "center",
                          "flexDirection": "row",
                          "marginRight": 8,
                        }
                      }
                    >
                      <Text
                        allowFontScaling={false}
                        style={
                          Array [
                            Object {
                              "color": "#9ca2a8",
                              "fontSize": 24,
                            },
                            undefined,
                            Object {
                              "fontFamily": "custom",
                              "fontStyle": "normal",
                              "fontWeight": "normal",
                            },
                            Object {},
                          ]
                        }
                      >
                        
                      </Text>
                      <Text
                        numberOfLines={1}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 10,
                              "fontWeight": "600",
                              "marginLeft": 2,
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#9ca2a8",
                            },
                          ]
                        }
                      >
                        0
                      </Text>
                    </View>
                  </View>
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flexDirection": "row",
                      }
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "borderRadius": 4,
                            "height": 8,
                            "marginRight": 8,
                            "width": 8,
                          },
                          Object {
                            "backgroundColor": "#1d74f5",
                          },
                        ]
                      }
                    />
                    <View
                      accessible={true}
                      focusable={true}
                      onClick={[Function]}
                      onResponderGrant={[Function]}
                      onResponderMove={[Function]}
                      onResponderRelease={[Function]}
                      onResponderTerminate={[Function]}
                      onResponderTerminationRequest={[Function]}
                      onStartShouldSetResponder={[Function]}
                      style={
                        Object {
                          "opacity": 1,
                        }
                      }
                    >
                      <Text
                        allowFontScaling={false}
                        style={
                          Array [
                            Object {
                              "color": "#6C727A",
                              "fontSize": 24,
                            },
                            undefined,
                            Object {
                              "fontFamily": "custom",
                              "fontStyle": "normal",
                              "fontWeight": "normal",
                            },
                            Object {},
                          ]
                        }
                      >
                        
                      </Text>
                    </View>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 12,
                "marginTop": 6,
              }
            }
            testID="message-thread-replied-on-How are you?"
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 20,
                  },
                  Object {
                    "marginLeft": 16,
                    "marginRight": 10,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              accessibilityLabel="How are you?"
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flex": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#1d74f5",
                  },
                ]
              }
            >
              How are you?
            </Text>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                  "marginLeft": 4,
                  "marginRight": 4,
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="I'm fine!"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  I'm fine!
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 12,
                "marginTop": 6,
              }
            }
            testID="message-thread-replied-on-Thread with emoji :) :joy:"
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 20,
                  },
                  Object {
                    "marginLeft": 16,
                    "marginRight": 10,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              accessibilityLabel="Thread with emoji🙂 😂"
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flex": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#1d74f5",
                  },
                ]
              }
            >
              Thread with emoji🙂 😂
            </Text>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                  "marginLeft": 4,
                  "marginRight": 4,
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="I'm fine!"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  I'm fine!
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 12,
                "marginTop": 6,
              }
            }
            testID="message-thread-replied-on-Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 20,
                  },
                  Object {
                    "marginLeft": 16,
                    "marginRight": 10,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flex": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#1d74f5",
                  },
                ]
              }
            >
              Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
            </Text>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                  "marginLeft": 4,
                  "marginRight": 4,
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="I'm fine!"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  I'm fine!
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 12,
                "marginTop": 6,
              }
            }
            testID="message-thread-replied-on-How are you?"
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 20,
                  },
                  Object {
                    "marginLeft": 16,
                    "marginRight": 10,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              accessibilityLabel="How are you?"
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flex": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#1d74f5",
                  },
                ]
              }
            >
              How are you?
            </Text>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                  "marginLeft": 4,
                  "marginRight": 4,
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 12,
                "marginTop": 6,
              }
            }
            testID="message-thread-replied-on-Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 20,
                  },
                  Object {
                    "marginLeft": 16,
                    "marginRight": 10,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flex": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#1d74f5",
                  },
                ]
              }
            >
              Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
            </Text>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                  "marginLeft": 4,
                  "marginRight": 4,
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 12,
                "marginTop": 6,
              }
            }
            testID="message-thread-replied-on-Thread with attachment"
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 20,
                  },
                  Object {
                    "marginLeft": 16,
                    "marginRight": 10,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              accessibilityLabel="Thread with attachment"
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flex": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#1d74f5",
                  },
                ]
              }
            >
              Thread with attachment
            </Text>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                  "marginLeft": 4,
                  "marginRight": 4,
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  Sent an attachment
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Reactions 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Reactions"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Reactions
                  </Text>
                </Text>
              </View>
              <View
                style={
                  Object {
                    "flexDirection": "row",
                    "flexWrap": "wrap",
                    "marginTop": 8,
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:joy:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#ffffff",
                          "fontSize": 13,
                          "marginLeft": 7,
                        }
                      }
                    >
                      😂
                    </Text>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#ffffff",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:marioparty:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#e1e5e8",
                        },
                      ]
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "overflow": "hidden",
                          },
                          Object {
                            "height": 19,
                            "marginLeft": 7,
                            "width": 19,
                          },
                        ]
                      }
                    >
                      <FastImageView
                        resizeMode="contain"
                        source={
                          Object {
                            "priority": "high",
                            "uri": "https://open.rocket.chat/emoji-custom/marioparty.gif",
                          }
                        }
                        style={
                          Object {
                            "bottom": 0,
                            "left": 0,
                            "position": "absolute",
                            "right": 0,
                            "top": 0,
                          }
                        }
                      />
                    </View>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      99
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#ffffff",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:thinking:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#e1e5e8",
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#ffffff",
                          "fontSize": 13,
                          "marginLeft": 7,
                        }
                      }
                    >
                      🤔
                    </Text>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      999
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#ffffff",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:thinking:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#e1e5e8",
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#ffffff",
                          "fontSize": 13,
                          "marginLeft": 7,
                        }
                      }
                    >
                      🤔
                    </Text>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      9999
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#ffffff",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-add-reaction"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#e1e5e8",
                        },
                      ]
                    }
                  >
                    <Text
                      allowFontScaling={false}
                      style={
                        Array [
                          Object {
                            "color": "#1d74f5",
                            "fontSize": 21,
                          },
                          undefined,
                          Object {
                            "fontFamily": "custom",
                            "fontStyle": "normal",
                            "fontWeight": "normal",
                          },
                          Object {},
                        ]
                      }
                    >
                      
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Multiple Reactions"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Multiple Reactions
                  </Text>
                </Text>
              </View>
              <View
                style={
                  Object {
                    "flexDirection": "row",
                    "flexWrap": "wrap",
                    "marginTop": 8,
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:marioparty:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "overflow": "hidden",
                          },
                          Object {
                            "height": 19,
                            "marginLeft": 7,
                            "width": 19,
                          },
                        ]
                      }
                    >
                      <FastImageView
                        resizeMode="contain"
                        source={
                          Object {
                            "priority": "high",
                            "uri": "https://open.rocket.chat/emoji-custom/marioparty.gif",
                          }
                        }
                        style={
                          Object {
                            "bottom": 0,
                            "left": 0,
                            "position": "absolute",
                            "right": 0,
                            "top": 0,
                          }
                        }
                      />
                    </View>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:react_rocket:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "overflow": "hidden",
                          },
                          Object {
                            "height": 19,
                            "marginLeft": 7,
                            "width": 19,
                          },
                        ]
                      }
                    >
                      <FastImageView
                        resizeMode="contain"
                        source={
                          Object {
                            "priority": "high",
                            "uri": "https://open.rocket.chat/emoji-custom/react_rocket.png",
                          }
                        }
                        style={
                          Object {
                            "bottom": 0,
                            "left": 0,
                            "position": "absolute",
                            "right": 0,
                            "top": 0,
                          }
                        }
                      />
                    </View>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:nyan_rocket:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "overflow": "hidden",
                          },
                          Object {
                            "height": 19,
                            "marginLeft": 7,
                            "width": 19,
                          },
                        ]
                      }
                    >
                      <FastImageView
                        resizeMode="contain"
                        source={
                          Object {
                            "priority": "high",
                            "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
                          }
                        }
                        style={
                          Object {
                            "bottom": 0,
                            "left": 0,
                            "position": "absolute",
                            "right": 0,
                            "top": 0,
                          }
                        }
                      />
                    </View>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:heart:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#ffffff",
                          "fontSize": 13,
                          "marginLeft": 7,
                        }
                      }
                    >
                      ❤️
                    </Text>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:dog:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#ffffff",
                          "fontSize": 13,
                          "marginLeft": 7,
                        }
                      }
                    >
                      🐶
                    </Text>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:grinning:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#ffffff",
                          "fontSize": 13,
                          "marginLeft": 7,
                        }
                      }
                    >
                      😀
                    </Text>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:grimacing:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#ffffff",
                          "fontSize": 13,
                          "marginLeft": 7,
                        }
                      }
                    >
                      😬
                    </Text>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#f1f2f4",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-reaction-:grin:"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#1d74f5",
                        },
                      ]
                    }
                  >
                    <Text
                      style={
                        Object {
                          "color": "#ffffff",
                          "fontSize": 13,
                          "marginLeft": 7,
                        }
                      }
                    >
                      😁
                    </Text>
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "600",
                            "marginLeft": 3,
                            "marginRight": 8.5,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 4,
                      "left": 4,
                      "right": 4,
                      "top": 4,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "backgroundColor": "#ffffff",
                      "borderRadius": 2,
                      "marginBottom": 8,
                      "marginRight": 8,
                      "opacity": 1,
                    }
                  }
                  testID="message-add-reaction"
                >
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 2,
                          "borderWidth": 1,
                          "flexDirection": "row",
                          "height": 28,
                          "justifyContent": "center",
                          "minWidth": 46.3,
                        },
                        Object {
                          "borderColor": "#e1e5e8",
                        },
                      ]
                    }
                  >
                    <Text
                      allowFontScaling={false}
                      style={
                        Array [
                          Object {
                            "color": "#1d74f5",
                            "fontSize": 21,
                          },
                          undefined,
                          Object {
                            "fontFamily": "custom",
                            "fontStyle": "normal",
                            "fontWeight": "normal",
                          },
                          Object {},
                        ]
                      }
                    >
                      
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Sequential thread messages following thread button 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="How are you?"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    How are you?
                  </Text>
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginTop": 8,
                  }
                }
              >
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "borderRadius": 2,
                        "flexDirection": "row",
                        "justifyContent": "center",
                        "paddingHorizontal": 12,
                        "paddingVertical": 8,
                      },
                      Object {
                        "backgroundColor": "#1d74f5",
                      },
                    ]
                  }
                  testID="message-thread-button-How are you?"
                >
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 12,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    Reply
                  </Text>
                </View>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      },
                      Object {
                        "flex": 1,
                        "marginLeft": 12,
                      },
                    ]
                  }
                >
                  <View
                    style={
                      Object {
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  >
                    <View
                      style={
                        Object {
                          "alignItems": "center",
                          "flexDirection": "row",
                          "marginRight": 8,
                        }
                      }
                    >
                      <Text
                        allowFontScaling={false}
                        style={
                          Array [
                            Object {
                              "color": "#9ca2a8",
                              "fontSize": 24,
                            },
                            undefined,
                            Object {
                              "fontFamily": "custom",
                              "fontStyle": "normal",
                              "fontWeight": "normal",
                            },
                            Object {},
                          ]
                        }
                      >
                        
                      </Text>
                      <Text
                        numberOfLines={1}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 10,
                              "fontWeight": "600",
                              "marginLeft": 2,
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#9ca2a8",
                            },
                          ]
                        }
                      >
                        1
                      </Text>
                    </View>
                    <View
                      style={
                        Object {
                          "alignItems": "center",
                          "flexDirection": "row",
                          "marginRight": 8,
                        }
                      }
                    >
                      <Text
                        allowFontScaling={false}
                        style={
                          Array [
                            Object {
                              "color": "#9ca2a8",
                              "fontSize": 24,
                            },
                            undefined,
                            Object {
                              "fontFamily": "custom",
                              "fontStyle": "normal",
                              "fontWeight": "normal",
                            },
                            Object {},
                          ]
                        }
                      >
                        
                      </Text>
                      <Text
                        numberOfLines={1}
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 10,
                              "fontWeight": "600",
                              "marginLeft": 2,
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#9ca2a8",
                            },
                          ]
                        }
                      >
                        0
                      </Text>
                    </View>
                  </View>
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flexDirection": "row",
                      }
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "borderRadius": 4,
                            "height": 8,
                            "marginRight": 8,
                            "width": 8,
                          },
                          Object {
                            "backgroundColor": "#1d74f5",
                          },
                        ]
                      }
                    />
                    <View
                      accessible={true}
                      focusable={true}
                      onClick={[Function]}
                      onResponderGrant={[Function]}
                      onResponderMove={[Function]}
                      onResponderRelease={[Function]}
                      onResponderTerminate={[Function]}
                      onResponderTerminationRequest={[Function]}
                      onStartShouldSetResponder={[Function]}
                      style={
                        Object {
                          "opacity": 1,
                        }
                      }
                    >
                      <Text
                        allowFontScaling={false}
                        style={
                          Array [
                            Object {
                              "color": "#6C727A",
                              "fontSize": 24,
                            },
                            undefined,
                            Object {
                              "fontFamily": "custom",
                              "fontStyle": "normal",
                              "fontWeight": "normal",
                            },
                            Object {},
                          ]
                        }
                      >
                        
                      </Text>
                    </View>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="I'm fine!"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  I'm fine!
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  Sent an attachment
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Sequential thread messages following thread reply 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 12,
                "marginTop": 6,
              }
            }
            testID="message-thread-replied-on-How are you?"
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#1d74f5",
                    "fontSize": 20,
                  },
                  Object {
                    "marginLeft": 16,
                    "marginRight": 10,
                  },
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              accessibilityLabel="How are you?"
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flex": 1,
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#1d74f5",
                  },
                ]
              }
            >
              How are you?
            </Text>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "justifyContent": "center",
                  "marginLeft": 4,
                  "marginRight": 4,
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#9ca2a8",
                      "fontSize": 20,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="I'm fine!"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  I'm fine!
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="Cool!"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  Cool!
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  Sent an attachment
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Show a button as attachment 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View />
              <Text
                style={
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  }
                }
              >
                Test Button
              </Text>
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "backgroundColor": "#1d74f5",
                    "borderRadius": 2,
                    "height": 48,
                    "justifyContent": "center",
                    "marginBottom": 12,
                    "opacity": 1,
                    "paddingHorizontal": 14,
                  }
                }
              >
                <Text
                  accessibilityLabel="Text button"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "500",
                        "textAlign": "center",
                      },
                      Object {
                        "color": "#ffffff",
                      },
                      undefined,
                      undefined,
                    ]
                  }
                >
                  Text button
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Static avatar 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://pbs.twimg.com/profile_images/1016397063649660929/14EIApTi_400x400.jpg",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message System messages 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text>
                <Text
                  disabled={false}
                  onPress={[Function]}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "500",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  diego.mello
                </Text>
                 
                <Text
                  accessibilityLabel="Message removed"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontStyle": "italic",
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  Message removed
                </Text>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text>
                <Text
                  disabled={false}
                  onPress={[Function]}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "500",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  diego.mello
                </Text>
                 
                <Text
                  accessibilityLabel="has joined the channel"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontStyle": "italic",
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  has joined the channel
                </Text>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text>
                <Text
                  disabled={false}
                  onPress={[Function]}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "500",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  diego.mello
                </Text>
                 
                <Text
                  accessibilityLabel="Message pinned"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontStyle": "italic",
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  Message pinned
                </Text>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text>
                <Text
                  disabled={false}
                  onPress={[Function]}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "500",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  diego.mello
                </Text>
                 
                <Text
                  accessibilityLabel="has left the channel"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontStyle": "italic",
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  has left the channel
                </Text>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="User rocket.cat removed by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                User rocket.cat removed by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="User rocket.cat added by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                User rocket.cat added by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="User rocket.cat muted by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                User rocket.cat muted by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="User rocket.cat unmuted by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                User rocket.cat unmuted by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="rocket.cat was set admin by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                rocket.cat was set admin by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="rocket.cat is no longer admin by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                rocket.cat is no longer admin by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="Room name changed to: New name by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                Room name changed to: New name by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="Room description changed to: new description by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                Room description changed to: new description by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="Room announcement changed to: new announcement by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                Room announcement changed to: new announcement by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="Room topic changed to: new topic by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                Room topic changed to: new topic by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="Room type changed to: public by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                Room type changed to: public by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="This room's encryption has been disabled by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                This room's encryption has been disabled by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 2,
                    "height": 20,
                    "width": 20,
                  },
                  Object {
                    "marginLeft": 16,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 2,
                        "height": 20,
                        "width": 20,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=20",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <Text
                accessibilityLabel="This room's encryption has been enabled by diego.mello"
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontStyle": "italic",
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    Object {
                      "color": "#9ca2a8",
                    },
                  ]
                }
              >
                This room's encryption has been enabled by diego.mello
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Temp 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View
                style={
                  Object {
                    "opacity": 0.3,
                  }
                }
              >
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Temp message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Temp message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Thumbnail from server 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="this is a thumbnail"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    this is a thumbnail
                  </Text>
                </Text>
              </View>
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  >
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "flex": 1,
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "500",
                            "marginBottom": 3,
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      Title
                    </Text>
                  </View>
                  <View
                    style={
                      Array [
                        Object {
                          "overflow": "hidden",
                        },
                        Object {
                          "borderTopLeftRadius": 4,
                          "borderTopRightRadius": 4,
                          "flex": 1,
                          "height": 200,
                          "marginBottom": 1,
                          "width": null,
                        },
                      ]
                    }
                  >
                    <FastImageView
                      resizeMode="cover"
                      source={
                        Object {
                          "uri": "https://images-na.ssl-images-amazon.com/images/I/71jKxPAMFbL._AC_SL1500_.jpg",
                        }
                      }
                      style={
                        Object {
                          "bottom": 0,
                          "left": 0,
                          "position": "absolute",
                          "right": 0,
                          "top": 0,
                        }
                      }
                    />
                  </View>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="Image text"
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      Image text
                    </Text>
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Time format 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10 November 2017
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Testing"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Testing
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Two short custom fields with markdown 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message
                  </Text>
                </Text>
              </View>
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  >
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "flex": 1,
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "500",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      rocket.cat
                    </Text>
                  </View>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="Custom fields"
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      Custom fields
                    </Text>
                  </Text>
                  <View
                    style={
                      Object {
                        "flex": 1,
                        "flexDirection": "row",
                        "flexWrap": "wrap",
                      }
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "50%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 1
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 1"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 1
                        </Text>
                      </Text>
                    </View>
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "50%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 2
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          onLongPress={[Function]}
                          onPress={[Function]}
                          style={
                            Object {
                              "backgroundColor": "transparent",
                              "color": "#1d74f5",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            }
                          }
                        >
                          <Text
                            accessibilityLabel="Value 2"
                            style={
                              Array [
                                Object {
                                  "backgroundColor": "transparent",
                                  "fontFamily": "System",
                                  "fontSize": 16,
                                  "fontWeight": "400",
                                  "textAlign": "left",
                                },
                                Array [
                                  Object {},
                                  Object {
                                    "alignItems": "flex-start",
                                    "flexDirection": "row",
                                    "flexWrap": "wrap",
                                    "justifyContent": "flex-start",
                                    "marginBottom": 0,
                                    "marginTop": 0,
                                  },
                                  Object {
                                    "backgroundColor": "transparent",
                                    "fontFamily": "System",
                                    "fontSize": 16,
                                    "fontWeight": "400",
                                    "textAlign": "left",
                                  },
                                ],
                              ]
                            }
                          >
                            Value 2
                          </Text>
                        </Text>
                      </Text>
                    </View>
                  </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": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginTop": 4,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  >
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "flex": 1,
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "500",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#2f343d",
                          },
                        ]
                      }
                    >
                      rocket.cat
                    </Text>
                  </View>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="Custom fields 2"
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      Custom fields 2
                    </Text>
                  </Text>
                  <View
                    style={
                      Object {
                        "flex": 1,
                        "flexDirection": "row",
                        "flexWrap": "wrap",
                      }
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "50%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 1
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 1"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                              ],
                            ]
                          }
                        >
                          Value 1
                        </Text>
                      </Text>
                    </View>
                    <View
                      style={
                        Array [
                          Object {
                            "flexDirection": "column",
                            "padding": 10,
                          },
                          Object {
                            "width": "50%",
                          },
                        ]
                      }
                    >
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 14,
                              "fontWeight": "600",
                              "textAlign": "left",
                            },
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        Field 2
                      </Text>
                      <Text
                        style={
                          Array [
                            Object {
                              "backgroundColor": "transparent",
                              "fontFamily": "System",
                              "fontSize": 16,
                              "fontWeight": "400",
                              "textAlign": "left",
                            },
                            undefined,
                            Object {
                              "color": "#2f343d",
                            },
                          ]
                        }
                      >
                        <Text
                          accessibilityLabel="Value 2"
                          style={
                            Array [
                              Object {
                                "backgroundColor": "transparent",
                                "fontFamily": "System",
                                "fontSize": 16,
                                "fontWeight": "400",
                                "textAlign": "left",
                              },
                              Array [
                                Object {},
                                Object {
                                  "alignItems": "flex-start",
                                  "flexDirection": "row",
                                  "flexWrap": "wrap",
                                  "justifyContent": "flex-start",
                                  "marginBottom": 0,
                                  "marginTop": 0,
                                },
                                Object {
                                  "fontWeight": "bold",
                                },
                              ],
                            ]
                          }
                        >
                          Value 2
                        </Text>
                      </Text>
                    </View>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message URL 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View />
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "column",
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Array [
                      Object {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderTopLeftRadius": 4,
                        "borderTopRightRadius": 4,
                        "height": 150,
                        "width": "100%",
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "uri": "https://rocket.chat/images/blog/post.jpg",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flex": 1,
                      "flexDirection": "column",
                      "justifyContent": "flex-start",
                      "padding": 15,
                    }
                  }
                >
                  <Text
                    numberOfLines={2}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#1d74f5",
                        },
                      ]
                    }
                  >
                    Rocket.Chat - Free, Open Source, Enterprise Team Chat
                  </Text>
                  <Text
                    numberOfLines={2}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                      ]
                    }
                  >
                    Rocket.Chat is the leading open source team chat software solution. Free, unlimited and completely customizable with on-premises and SaaS cloud hosting.
                  </Text>
                </View>
              </View>
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "column",
                    "marginTop": 4,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flex": 1,
                      "flexDirection": "column",
                      "justifyContent": "flex-start",
                      "padding": 15,
                    }
                  }
                >
                  <Text
                    numberOfLines={2}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#1d74f5",
                        },
                      ]
                    }
                  >
                    Google
                  </Text>
                  <Text
                    numberOfLines={2}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                      ]
                    }
                  >
                    Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for.
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message "
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message 
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "overflow": "hidden",
                        },
                        Array [
                          Object {
                            "height": 20,
                            "width": 20,
                          },
                          Object {},
                        ],
                      ]
                    }
                  >
                    <FastImageView
                      resizeMode="contain"
                      source={
                        Object {
                          "priority": "high",
                          "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
                        }
                      }
                      style={
                        Object {
                          "bottom": 0,
                          "left": 0,
                          "position": "absolute",
                          "right": 0,
                          "top": 0,
                        }
                      }
                    />
                  </View>
                </Text>
              </View>
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "column",
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flex": 1,
                      "flexDirection": "column",
                      "justifyContent": "flex-start",
                      "padding": 15,
                    }
                  }
                >
                  <Text
                    numberOfLines={2}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#1d74f5",
                        },
                      ]
                    }
                  >
                    Google
                  </Text>
                  <Text
                    numberOfLines={2}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                      ]
                    }
                  >
                    Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for.
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View />
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "column",
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "alignItems": "flex-start",
                      "flex": 1,
                      "flexDirection": "column",
                      "justifyContent": "flex-start",
                      "padding": 15,
                    }
                  }
                >
                  <Text
                    numberOfLines={2}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#1d74f5",
                        },
                      ]
                    }
                  >
                    Google
                  </Text>
                  <Text
                    numberOfLines={2}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                      ]
                    }
                  >
                    Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for.
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message With alias 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    Diego Mello
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#9ca2a8",
                          },
                        ]
                      }
                    >
                       @
                      diego.mello
                    </Text>
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    Diego Mello
                    <Text
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 14,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#9ca2a8",
                          },
                        ]
                      }
                    >
                       @
                      Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
                    </Text>
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message With audio 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View />
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "borderRadius": 4,
                      "borderWidth": 1,
                      "flex": 1,
                      "flexDirection": "row",
                      "height": 56,
                      "marginBottom": 6,
                    },
                    Object {
                      "backgroundColor": "#f3f4f5",
                      "borderColor": "#e1e5e8",
                    },
                  ]
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 12,
                      "left": 12,
                      "right": 12,
                      "top": 12,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "backgroundColor": "transparent",
                      "marginHorizontal": 10,
                      "opacity": 1,
                    }
                  }
                >
                  <ActivityIndicator
                    animating={true}
                    color="#9ca2a8"
                    hidesWhenStopped={true}
                    size="small"
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "backgroundColor": "transparent",
                          "marginHorizontal": 10,
                        },
                        Object {
                          "marginHorizontal": 8,
                        },
                      ]
                    }
                  />
                </View>
                <RNCSlider
                  animateTransitions={true}
                  animationConfig={
                    Object {
                      "delay": 0,
                      "duration": 250,
                      "easing": [Function],
                    }
                  }
                  disabled={false}
                  enabled={true}
                  inverted={false}
                  maximumTrackTintColor="#9ca2a8"
                  maximumValue={0}
                  minimumTrackTintColor="#1d74f5"
                  minimumValue={0}
                  onChange={[Function]}
                  onRNCSliderSlidingComplete={null}
                  onRNCSliderSlidingStart={null}
                  onRNCSliderValueChange={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  step={0}
                  style={
                    Array [
                      Object {
                        "height": 40,
                      },
                      Object {
                        "flex": 1,
                      },
                    ]
                  }
                  thumbImage={
                    Object {
                      "scale": 2,
                      "uri": "audio_thumb",
                    }
                  }
                  thumbTintColor={false}
                  value={0}
                />
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "marginHorizontal": 12,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  00:00
                </Text>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    undefined,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="This is a description "
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "alignItems": "flex-start",
                          "flexDirection": "row",
                          "flexWrap": "wrap",
                          "justifyContent": "flex-start",
                          "marginBottom": 0,
                          "marginTop": 0,
                        },
                      ],
                    ]
                  }
                >
                  This is a description 
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "overflow": "hidden",
                      },
                      Array [
                        Object {
                          "height": 20,
                          "width": 20,
                        },
                        Object {},
                      ],
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="contain"
                    source={
                      Object {
                        "priority": "high",
                        "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="First message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    First message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View />
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "borderRadius": 4,
                      "borderWidth": 1,
                      "flex": 1,
                      "flexDirection": "row",
                      "height": 56,
                      "marginBottom": 6,
                    },
                    Object {
                      "backgroundColor": "#f3f4f5",
                      "borderColor": "#e1e5e8",
                    },
                  ]
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 12,
                      "left": 12,
                      "right": 12,
                      "top": 12,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "backgroundColor": "transparent",
                      "marginHorizontal": 10,
                      "opacity": 1,
                    }
                  }
                >
                  <ActivityIndicator
                    animating={true}
                    color="#9ca2a8"
                    hidesWhenStopped={true}
                    size="small"
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "backgroundColor": "transparent",
                          "marginHorizontal": 10,
                        },
                        Object {
                          "marginHorizontal": 8,
                        },
                      ]
                    }
                  />
                </View>
                <RNCSlider
                  animateTransitions={true}
                  animationConfig={
                    Object {
                      "delay": 0,
                      "duration": 250,
                      "easing": [Function],
                    }
                  }
                  disabled={false}
                  enabled={true}
                  inverted={false}
                  maximumTrackTintColor="#9ca2a8"
                  maximumValue={0}
                  minimumTrackTintColor="#1d74f5"
                  minimumValue={0}
                  onChange={[Function]}
                  onRNCSliderSlidingComplete={null}
                  onRNCSliderSlidingStart={null}
                  onRNCSliderValueChange={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  step={0}
                  style={
                    Array [
                      Object {
                        "height": 40,
                      },
                      Object {
                        "flex": 1,
                      },
                    ]
                  }
                  thumbImage={
                    Object {
                      "scale": 2,
                      "uri": "audio_thumb",
                    }
                  }
                  thumbTintColor={false}
                  value={0}
                />
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "marginHorizontal": 12,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  00:00
                </Text>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    undefined,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="This is a description"
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "alignItems": "flex-start",
                          "flexDirection": "row",
                          "flexWrap": "wrap",
                          "justifyContent": "flex-start",
                          "marginBottom": 0,
                          "marginTop": 0,
                        },
                      ],
                    ]
                  }
                >
                  This is a description
                </Text>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View />
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "borderRadius": 4,
                      "borderWidth": 1,
                      "flex": 1,
                      "flexDirection": "row",
                      "height": 56,
                      "marginBottom": 6,
                    },
                    Object {
                      "backgroundColor": "#f3f4f5",
                      "borderColor": "#e1e5e8",
                    },
                  ]
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 12,
                      "left": 12,
                      "right": 12,
                      "top": 12,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "backgroundColor": "transparent",
                      "marginHorizontal": 10,
                      "opacity": 1,
                    }
                  }
                >
                  <ActivityIndicator
                    animating={true}
                    color="#9ca2a8"
                    hidesWhenStopped={true}
                    size="small"
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "backgroundColor": "transparent",
                          "marginHorizontal": 10,
                        },
                        Object {
                          "marginHorizontal": 8,
                        },
                      ]
                    }
                  />
                </View>
                <RNCSlider
                  animateTransitions={true}
                  animationConfig={
                    Object {
                      "delay": 0,
                      "duration": 250,
                      "easing": [Function],
                    }
                  }
                  disabled={false}
                  enabled={true}
                  inverted={false}
                  maximumTrackTintColor="#9ca2a8"
                  maximumValue={0}
                  minimumTrackTintColor="#1d74f5"
                  minimumValue={0}
                  onChange={[Function]}
                  onRNCSliderSlidingComplete={null}
                  onRNCSliderSlidingStart={null}
                  onRNCSliderValueChange={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  step={0}
                  style={
                    Array [
                      Object {
                        "height": 40,
                      },
                      Object {
                        "flex": 1,
                      },
                    ]
                  }
                  thumbImage={
                    Object {
                      "scale": 2,
                      "uri": "audio_thumb",
                    }
                  }
                  thumbTintColor={false}
                  value={0}
                />
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "marginHorizontal": 12,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  00:00
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View />
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "borderRadius": 4,
                      "borderWidth": 1,
                      "flex": 1,
                      "flexDirection": "row",
                      "height": 56,
                      "marginBottom": 6,
                    },
                    Object {
                      "backgroundColor": "#f3f4f5",
                      "borderColor": "#e1e5e8",
                    },
                  ]
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  hitSlop={
                    Object {
                      "bottom": 12,
                      "left": 12,
                      "right": 12,
                      "top": 12,
                    }
                  }
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "backgroundColor": "transparent",
                      "marginHorizontal": 10,
                      "opacity": 1,
                    }
                  }
                >
                  <ActivityIndicator
                    animating={true}
                    color="#9ca2a8"
                    hidesWhenStopped={true}
                    size="small"
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "backgroundColor": "transparent",
                          "marginHorizontal": 10,
                        },
                        Object {
                          "marginHorizontal": 8,
                        },
                      ]
                    }
                  />
                </View>
                <RNCSlider
                  animateTransitions={true}
                  animationConfig={
                    Object {
                      "delay": 0,
                      "duration": 250,
                      "easing": [Function],
                    }
                  }
                  disabled={false}
                  enabled={true}
                  inverted={false}
                  maximumTrackTintColor="#9ca2a8"
                  maximumValue={0}
                  minimumTrackTintColor="#1d74f5"
                  minimumValue={0}
                  onChange={[Function]}
                  onRNCSliderSlidingComplete={null}
                  onRNCSliderSlidingStart={null}
                  onRNCSliderValueChange={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  step={0}
                  style={
                    Array [
                      Object {
                        "height": 40,
                      },
                      Object {
                        "flex": 1,
                      },
                    ]
                  }
                  thumbImage={
                    Object {
                      "scale": 2,
                      "uri": "audio_thumb",
                    }
                  }
                  thumbTintColor={false}
                  value={0}
                />
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "marginHorizontal": 12,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  00:00
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message With file 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View />
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginBottom": 4,
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  />
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="File.pdf"
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      File.pdf
                    </Text>
                  </Text>
                </View>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    undefined,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="This is a description "
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "alignItems": "flex-start",
                          "flexDirection": "row",
                          "flexWrap": "wrap",
                          "justifyContent": "flex-start",
                          "marginBottom": 0,
                          "marginTop": 0,
                        },
                      ],
                    ]
                  }
                >
                  This is a description 
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "overflow": "hidden",
                      },
                      Array [
                        Object {
                          "height": 20,
                          "width": 20,
                        },
                        Object {},
                      ],
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="contain"
                    source={
                      Object {
                        "priority": "high",
                        "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View />
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "alignSelf": "flex-start",
                    "backgroundColor": "#f3f4f5",
                    "borderColor": "#e1e5e8",
                    "borderRadius": 4,
                    "borderWidth": 1,
                    "flex": 1,
                    "flexDirection": "row",
                    "marginBottom": 4,
                    "marginTop": 6,
                    "opacity": 1,
                  }
                }
              >
                <View
                  style={
                    Object {
                      "borderRadius": 4,
                      "flex": 1,
                      "flexDirection": "column",
                      "padding": 15,
                    }
                  }
                >
                  <View
                    style={
                      Object {
                        "alignItems": "center",
                        "flex": 1,
                        "flexDirection": "row",
                      }
                    }
                  />
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="File.pdf"
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      File.pdf
                    </Text>
                  </Text>
                </View>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    undefined,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="This is a description "
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "alignItems": "flex-start",
                          "flexDirection": "row",
                          "flexWrap": "wrap",
                          "justifyContent": "flex-start",
                          "marginBottom": 0,
                          "marginTop": 0,
                        },
                      ],
                    ]
                  }
                >
                  This is a description 
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "overflow": "hidden",
                      },
                      Array [
                        Object {
                          "height": 20,
                          "width": 20,
                        },
                        Object {},
                      ],
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="contain"
                    source={
                      Object {
                        "priority": "high",
                        "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message With image 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View />
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "borderRadius": 4,
                    "flexDirection": "column",
                    "opacity": 1,
                  }
                }
              >
                <View>
                  <View
                    style={
                      Array [
                        Object {
                          "borderRadius": 4,
                          "borderWidth": 1,
                          "minHeight": 200,
                          "overflow": "hidden",
                          "width": "100%",
                        },
                        Object {
                          "borderColor": "#e1e5e8",
                        },
                      ]
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "overflow": "hidden",
                          },
                          Array [
                            Object {
                              "bottom": 0,
                              "left": 0,
                              "position": "absolute",
                              "right": 0,
                              "top": 0,
                            },
                            undefined,
                          ],
                        ]
                      }
                    >
                      <FastImageView
                        onFastImageError={[Function]}
                        onFastImageLoad={[Function]}
                        onFastImageLoadEnd={[Function]}
                        onFastImageLoadStart={[Function]}
                        onFastImageProgress={[Function]}
                        resizeMode="cover"
                        source={
                          Object {
                            "uri": "https://open.rocket.chat/dummypath?rc_uid=y8bd77ptZswPj3EW8&rc_token=79q6lH40W4ZRGLOshDiDiVlQaCc4f_lU9HNdHLAzuHz",
                          }
                        }
                        style={
                          Object {
                            "bottom": 0,
                            "left": 0,
                            "position": "absolute",
                            "right": 0,
                            "top": 0,
                          }
                        }
                      />
                    </View>
                  </View>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="This is a description"
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      This is a description
                    </Text>
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View />
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "borderRadius": 4,
                    "flexDirection": "column",
                    "opacity": 1,
                  }
                }
              >
                <View>
                  <View
                    style={
                      Array [
                        Object {
                          "borderRadius": 4,
                          "borderWidth": 1,
                          "minHeight": 200,
                          "overflow": "hidden",
                          "width": "100%",
                        },
                        Object {
                          "borderColor": "#e1e5e8",
                        },
                      ]
                    }
                  >
                    <View
                      style={
                        Array [
                          Object {
                            "overflow": "hidden",
                          },
                          Array [
                            Object {
                              "bottom": 0,
                              "left": 0,
                              "position": "absolute",
                              "right": 0,
                              "top": 0,
                            },
                            undefined,
                          ],
                        ]
                      }
                    >
                      <FastImageView
                        onFastImageError={[Function]}
                        onFastImageLoad={[Function]}
                        onFastImageLoadEnd={[Function]}
                        onFastImageLoadStart={[Function]}
                        onFastImageProgress={[Function]}
                        resizeMode="cover"
                        source={
                          Object {
                            "uri": "https://open.rocket.chat/dummypath?rc_uid=y8bd77ptZswPj3EW8&rc_token=79q6lH40W4ZRGLOshDiDiVlQaCc4f_lU9HNdHLAzuHz",
                          }
                        }
                        style={
                          Object {
                            "bottom": 0,
                            "left": 0,
                            "position": "absolute",
                            "right": 0,
                            "top": 0,
                          }
                        }
                      />
                    </View>
                  </View>
                  <Text
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#2f343d",
                        },
                      ]
                    }
                  >
                    <Text
                      accessibilityLabel="This is a description "
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 16,
                            "fontWeight": "400",
                            "textAlign": "left",
                          },
                          Array [
                            Object {},
                            Object {
                              "alignItems": "flex-start",
                              "flexDirection": "row",
                              "flexWrap": "wrap",
                              "justifyContent": "flex-start",
                              "marginBottom": 0,
                              "marginTop": 0,
                            },
                          ],
                        ]
                      }
                    >
                      This is a description 
                    </Text>
                    <View
                      style={
                        Array [
                          Object {
                            "overflow": "hidden",
                          },
                          Array [
                            Object {
                              "height": 20,
                              "width": 20,
                            },
                            Object {},
                          ],
                        ]
                      }
                    >
                      <FastImageView
                        resizeMode="contain"
                        source={
                          Object {
                            "priority": "high",
                            "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
                          }
                        }
                        style={
                          Object {
                            "bottom": 0,
                            "left": 0,
                            "position": "absolute",
                            "right": 0,
                            "top": 0,
                          }
                        }
                      />
                    </View>
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message With video 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View />
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "backgroundColor": "#1f2329",
                    "borderRadius": 4,
                    "flex": 1,
                    "height": 150,
                    "justifyContent": "center",
                    "marginBottom": 6,
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#ffffff",
                        "fontSize": 54,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
              <Text
                style={
                  Array [
                    Object {
                      "backgroundColor": "transparent",
                      "fontFamily": "System",
                      "fontSize": 16,
                      "fontWeight": "400",
                      "textAlign": "left",
                    },
                    undefined,
                    Object {
                      "color": "#2f343d",
                    },
                  ]
                }
              >
                <Text
                  accessibilityLabel="This is a description "
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Array [
                        Object {},
                        Object {
                          "alignItems": "flex-start",
                          "flexDirection": "row",
                          "flexWrap": "wrap",
                          "justifyContent": "flex-start",
                          "marginBottom": 0,
                          "marginTop": 0,
                        },
                      ],
                    ]
                  }
                >
                  This is a description 
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "overflow": "hidden",
                      },
                      Array [
                        Object {
                          "height": 20,
                          "width": 20,
                        },
                        Object {},
                      ],
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="contain"
                    source={
                      Object {
                        "priority": "high",
                        "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </Text>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginTop": 4,
                  },
                ]
              }
              testID="avatar"
            >
              <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 {
                        "overflow": "hidden",
                      },
                      Object {
                        "borderRadius": 4,
                        "height": 36,
                        "width": 36,
                      },
                    ]
                  }
                >
                  <FastImageView
                    resizeMode="cover"
                    source={
                      Object {
                        "headers": undefined,
                        "priority": "high",
                        "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=36",
                      }
                    }
                    style={
                      Object {
                        "bottom": 0,
                        "left": 0,
                        "position": "absolute",
                        "right": 0,
                        "top": 0,
                      }
                    }
                  />
                </View>
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  Object {
                    "marginLeft": 10,
                  },
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flex": 1,
                    "flexDirection": "row",
                    "justifyContent": "space-between",
                  }
                }
              >
                <View
                  accessible={true}
                  focusable={true}
                  onClick={[Function]}
                  onResponderGrant={[Function]}
                  onResponderMove={[Function]}
                  onResponderRelease={[Function]}
                  onResponderTerminate={[Function]}
                  onResponderTerminationRequest={[Function]}
                  onStartShouldSetResponder={[Function]}
                  style={
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "flexShrink": 1,
                      "opacity": 1,
                    }
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "500",
                          "lineHeight": 22,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                      ]
                    }
                  >
                    diego.mello
                  </Text>
                </View>
                <Text
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 12,
                        "fontWeight": "400",
                        "marginLeft": 8,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  10:00 AM
                </Text>
              </View>
              <View />
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "alignItems": "center",
                    "backgroundColor": "#1f2329",
                    "borderRadius": 4,
                    "flex": 1,
                    "height": 150,
                    "justifyContent": "center",
                    "marginBottom": 6,
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#ffffff",
                        "fontSize": 54,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Message Without header 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": null,
          "opacity": 1,
        }
      }
    >
      <View>
        <View
          style={
            Array [
              Object {
                "flexDirection": "column",
                "paddingHorizontal": 14,
                "paddingVertical": 4,
                "width": "100%",
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "flex": 1,
                    "marginLeft": 46,
                  },
                  false,
                ]
              }
            >
              <View>
                <Text
                  numberOfLines={0}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                >
                  <Text
                    accessibilityLabel="Message"
                    numberOfLines={0}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 16,
                          "fontWeight": "400",
                          "textAlign": "left",
                        },
                        Array [
                          Object {},
                          Object {
                            "alignItems": "flex-start",
                            "flexDirection": "row",
                            "flexWrap": "wrap",
                            "justifyContent": "flex-start",
                            "marginBottom": 0,
                            "marginTop": 0,
                          },
                        ],
                      ]
                    }
                  >
                    Message
                  </Text>
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots NewMarkdown Block quote 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <View
    style={
      Object {
        "alignItems": "flex-start",
        "flexDirection": "row",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "height": "100%",
            "marginRight": 5,
            "width": 2,
          },
          Object {
            "backgroundColor": "#e1e5e8",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        <Text
          style={
            Object {
              "flexShrink": 1,
            }
          }
        >
          <Text
            accessibilityLabel="Rocket.Chat to the moon"
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
            Rocket.Chat to the moon
          </Text>
        </Text>
      </Text>
    </View>
  </View>
  <View
    style={
      Object {
        "alignItems": "flex-start",
        "flexDirection": "row",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "height": "100%",
            "marginRight": 5,
            "width": 2,
          },
          Object {
            "backgroundColor": "#e1e5e8",
          },
        ]
      }
    />
    <View
      style={
        Object {
          "flex": 1,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        <Text
          style={
            Object {
              "flexShrink": 1,
            }
          }
        >
          <Text
            accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
            Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
          </Text>
        </Text>
      </Text>
    </View>
  </View>
</View>
`;

exports[`Storyshots NewMarkdown Code 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "borderRadius": 4,
              "borderWidth": 1,
              "fontFamily": "Courier New",
              "fontSize": 16,
              "fontWeight": "400",
              "paddingLeft": 2,
              "paddingTop": 2,
              "textAlign": "left",
            },
            Object {
              "backgroundColor": "#f1f2f4",
              "borderColor": "#e1e5e8",
              "color": "#2f343d",
            },
          ]
        }
      >
        <Text>
          inline code
        </Text>
      </Text>
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "borderRadius": 4,
          "borderWidth": 1,
          "fontFamily": "Courier New",
          "fontSize": 16,
          "fontWeight": "400",
          "padding": 4,
          "textAlign": "left",
        },
        Object {
          "backgroundColor": "#f1f2f4",
          "borderColor": "#e1e5e8",
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text>
      Multi 
Line 
Code
    </Text>
  </Text>
</View>
`;

exports[`Storyshots NewMarkdown Emoji 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <View
    style={
      Object {
        "flexDirection": "row",
      }
    }
  >
    <Text
      style={
        Array [
          Object {
            "color": "#2f343d",
          },
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 30,
            "fontWeight": "400",
            "textAlign": "left",
          },
        ]
      }
    >
      💚
    </Text>
    <Text
      style={
        Array [
          Object {
            "color": "#2f343d",
          },
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 30,
            "fontWeight": "400",
            "textAlign": "left",
          },
        ]
      }
    >
      😂
    </Text>
    <Text
      style={
        Array [
          Object {
            "color": "#2f343d",
          },
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 30,
            "fontWeight": "400",
            "textAlign": "left",
          },
        ]
      }
    >
      😁
    </Text>
  </View>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "color": "#2f343d",
            },
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
          ]
        }
      >
        🚀
      </Text>
      <Text
        style={
          Array [
            Object {
              "color": "#2f343d",
            },
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
          ]
        }
      >
        🤦
      </Text>
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Array [
              Object {
                "height": 20,
                "width": 20,
              },
            ],
          ]
        }
      >
        <FastImageView
          resizeMode="contain"
          source={
            Object {
              "priority": "high",
              "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png",
            }
          }
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Array [
              Object {
                "height": 20,
                "width": 20,
              },
            ],
          ]
        }
      >
        <FastImageView
          resizeMode="contain"
          source={
            Object {
              "priority": "high",
              "uri": "https://open.rocket.chat/emoji-custom/marioparty.gif",
            }
          }
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
    </Text>
  </Text>
</View>
`;

exports[`Storyshots NewMarkdown Hashtag 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        onPress={[Function]}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F3BE08",
            },
          ]
        }
      >
        #text_channel
      </Text>
      <Text
        accessibilityLabel=" and "
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
         and 
      </Text>
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        #not_a_channel
      </Text>
    </Text>
  </Text>
</View>
`;

exports[`Storyshots NewMarkdown Headers 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 24,
          "fontWeight": "700",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    # Header 1
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 22,
          "fontWeight": "700",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    ## Header 2
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 20,
          "fontWeight": "600",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    ### Header 3
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 18,
          "fontWeight": "600",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    #### Header 4
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "500",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    ##### Header 5
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 14,
          "fontWeight": "500",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    ###### Header 6
  </Text>
</View>
`;

exports[`Storyshots NewMarkdown Links 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        onLongPress={[Function]}
        onPress={[Function]}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#1d74f5",
            },
          ]
        }
      >
        https://rocket.chat
      </Text>
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        onLongPress={[Function]}
        onPress={[Function]}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#1d74f5",
            },
          ]
        }
      >
        Markdown link
      </Text>
    </Text>
  </Text>
</View>
`;

exports[`Storyshots NewMarkdown Lists 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        - 
      </Text>
      <Text
        style={
          Object {
            "flexShrink": 1,
          }
        }
      >
        <Text
          accessibilityLabel="Plain text "
          style={
            Array [
              Object {
                "flexShrink": 1,
                "fontSize": 16,
              },
              Object {
                "color": "#2f343d",
              },
            ]
          }
        >
          Plain text 
        </Text>
        <Text
          style={
            Array [
              Object {
                "color": "#2f343d",
              },
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
            ]
          }
        >
          💡
        </Text>
        <Text
          style={
            Object {
              "fontStyle": "italic",
            }
          }
        >
          <Text
            accessibilityLabel=" italic "
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
             italic 
          </Text>
        </Text>
        <Text
          style={
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontWeight": "700",
              "textAlign": "left",
            }
          }
        >
          <Text
            accessibilityLabel=" bold "
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
             bold 
          </Text>
        </Text>
        <Text
          style={
            Object {
              "textDecorationLine": "line-through",
            }
          }
        >
          <Text
            accessibilityLabel=" strike "
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
             strike 
          </Text>
        </Text>
        <Text
          onPress={[Function]}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#F3BE08",
              },
            ]
          }
        >
          #general
        </Text>
        <Text
          onLongPress={[Function]}
          onPress={[Function]}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#1d74f5",
              },
            ]
          }
        >
           link 
        </Text>
        <Text
          onPress={[Function]}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#F3BE08",
              },
            ]
          }
        >
          rocket.cat
        </Text>
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "borderRadius": 4,
                "borderWidth": 1,
                "fontFamily": "Courier New",
                "fontSize": 16,
                "fontWeight": "400",
                "paddingLeft": 2,
                "paddingTop": 2,
                "textAlign": "left",
              },
              Object {
                "backgroundColor": "#f1f2f4",
                "borderColor": "#e1e5e8",
                "color": "#2f343d",
              },
            ]
          }
        >
          <Text>
             inline code
          </Text>
        </Text>
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        - 
      </Text>
      <Text
        style={
          Object {
            "flexShrink": 1,
          }
        }
      >
        <Text
          accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
          style={
            Array [
              Object {
                "flexShrink": 1,
                "fontSize": 16,
              },
              Object {
                "color": "#2f343d",
              },
            ]
          }
        >
          Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
        </Text>
      </Text>
    </View>
  </View>
  <View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        1
        . 
      </Text>
      <Text
        style={
          Object {
            "flexShrink": 1,
          }
        }
      >
        <Text
          accessibilityLabel="Plain text "
          style={
            Array [
              Object {
                "flexShrink": 1,
                "fontSize": 16,
              },
              Object {
                "color": "#2f343d",
              },
            ]
          }
        >
          Plain text 
        </Text>
        <Text
          style={
            Array [
              Object {
                "color": "#2f343d",
              },
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
            ]
          }
        >
          💡
        </Text>
        <Text
          style={
            Object {
              "fontStyle": "italic",
            }
          }
        >
          <Text
            accessibilityLabel=" italic "
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
             italic 
          </Text>
        </Text>
        <Text
          style={
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontWeight": "700",
              "textAlign": "left",
            }
          }
        >
          <Text
            accessibilityLabel=" bold "
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
             bold 
          </Text>
        </Text>
        <Text
          style={
            Object {
              "textDecorationLine": "line-through",
            }
          }
        >
          <Text
            accessibilityLabel=" strike "
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
             strike 
          </Text>
        </Text>
        <Text
          onPress={[Function]}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#F3BE08",
              },
            ]
          }
        >
          #general
        </Text>
        <Text
          onLongPress={[Function]}
          onPress={[Function]}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#1d74f5",
              },
            ]
          }
        >
           link 
        </Text>
        <Text
          onPress={[Function]}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#F3BE08",
              },
            ]
          }
        >
          rocket.cat
        </Text>
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "borderRadius": 4,
                "borderWidth": 1,
                "fontFamily": "Courier New",
                "fontSize": 16,
                "fontWeight": "400",
                "paddingLeft": 2,
                "paddingTop": 2,
                "textAlign": "left",
              },
              Object {
                "backgroundColor": "#f1f2f4",
                "borderColor": "#e1e5e8",
                "color": "#2f343d",
              },
            ]
          }
        >
          <Text>
             inline code
          </Text>
        </Text>
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        2
        . 
      </Text>
      <Text
        style={
          Object {
            "flexShrink": 1,
          }
        }
      >
        <Text
          accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
          style={
            Array [
              Object {
                "flexShrink": 1,
                "fontSize": 16,
              },
              Object {
                "color": "#2f343d",
              },
            ]
          }
        >
          Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
        </Text>
      </Text>
    </View>
  </View>
  <View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        - [x] 
      </Text>
      <Text
        style={
          Object {
            "flexShrink": 1,
          }
        }
      >
        <Text
          accessibilityLabel="Plain text "
          style={
            Array [
              Object {
                "flexShrink": 1,
                "fontSize": 16,
              },
              Object {
                "color": "#2f343d",
              },
            ]
          }
        >
          Plain text 
        </Text>
        <Text
          style={
            Array [
              Object {
                "color": "#2f343d",
              },
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
            ]
          }
        >
          💡
        </Text>
        <Text
          style={
            Object {
              "fontStyle": "italic",
            }
          }
        >
          <Text
            accessibilityLabel=" italic "
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
             italic 
          </Text>
        </Text>
        <Text
          style={
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontWeight": "700",
              "textAlign": "left",
            }
          }
        >
          <Text
            accessibilityLabel=" bold "
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
             bold 
          </Text>
        </Text>
        <Text
          style={
            Object {
              "textDecorationLine": "line-through",
            }
          }
        >
          <Text
            accessibilityLabel=" strike "
            style={
              Array [
                Object {
                  "flexShrink": 1,
                  "fontSize": 16,
                },
                Object {
                  "color": "#2f343d",
                },
              ]
            }
          >
             strike 
          </Text>
        </Text>
        <Text
          onPress={[Function]}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#F3BE08",
              },
            ]
          }
        >
          #general
        </Text>
        <Text
          onLongPress={[Function]}
          onPress={[Function]}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#1d74f5",
              },
            ]
          }
        >
           link 
        </Text>
        <Text
          onPress={[Function]}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#F3BE08",
              },
            ]
          }
        >
          rocket.cat
        </Text>
        <Text
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "borderRadius": 4,
                "borderWidth": 1,
                "fontFamily": "Courier New",
                "fontSize": 16,
                "fontWeight": "400",
                "paddingLeft": 2,
                "paddingTop": 2,
                "textAlign": "left",
              },
              Object {
                "backgroundColor": "#f1f2f4",
                "borderColor": "#e1e5e8",
                "color": "#2f343d",
              },
            ]
          }
        >
          <Text>
             inline code
          </Text>
        </Text>
      </Text>
    </View>
    <View
      style={
        Object {
          "flexDirection": "row",
        }
      }
    >
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "400",
              "textAlign": "left",
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        - [ ] 
      </Text>
      <Text
        style={
          Object {
            "flexShrink": 1,
          }
        }
      >
        <Text
          accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
          style={
            Array [
              Object {
                "flexShrink": 1,
                "fontSize": 16,
              },
              Object {
                "color": "#2f343d",
              },
            ]
          }
        >
          Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
        </Text>
      </Text>
    </View>
  </View>
</View>
`;

exports[`Storyshots NewMarkdown Mentions 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        onPress={[Function]}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F3BE08",
            },
          ]
        }
      >
        rocket.cat
      </Text>
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        onPress={[Function]}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F3BE08",
            },
          ]
        }
      >
        name
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
         
      </Text>
      <Text
        onPress={[Function]}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F5455C",
            },
          ]
        }
      >
        rocket.cat
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
         
      </Text>
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F38C39",
            },
          ]
        }
      >
        here
      </Text>
      <Text
        accessibilityLabel=" "
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
         
      </Text>
      <Text
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 16,
              "fontWeight": "600",
              "textAlign": "left",
            },
            Object {
              "color": "#F38C39",
            },
          ]
        }
      >
        all
      </Text>
    </Text>
  </Text>
</View>
`;

exports[`Storyshots NewMarkdown Text 1`] = `
<View
  style={
    Object {
      "backgroundColor": "#ffffff",
      "marginHorizontal": 15,
      "marginVertical": 50,
    }
  }
>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        accessibilityLabel="This is Rocket.Chat"
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        This is Rocket.Chat
      </Text>
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
      </Text>
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        accessibilityLabel="a"
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        a
      </Text>
      <Text
        accessibilityLabel="b"
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        b
      </Text>
      <Text
        accessibilityLabel="c"
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        c
      </Text>
      <Text
        accessibilityLabel=""
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        
      </Text>
      <Text
        accessibilityLabel="d"
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        d
      </Text>
      <Text
        accessibilityLabel=""
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        
      </Text>
      <Text
        accessibilityLabel=""
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        
      </Text>
      <Text
        accessibilityLabel="e"
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        e
      </Text>
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        accessibilityLabel="a       b                                                                             c"
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        a       b                                                                             c
      </Text>
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        accessibilityLabel="This is Rocket.Chat"
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        This is Rocket.Chat
      </Text>
    </Text>
  </Text>
  <Text
    style={
      Array [
        Object {
          "backgroundColor": "transparent",
          "fontFamily": "System",
          "fontSize": 16,
          "fontWeight": "400",
          "textAlign": "left",
        },
        Object {
          "color": "#2f343d",
        },
      ]
    }
  >
    <Text
      style={
        Object {
          "flexShrink": 1,
        }
      }
    >
      <Text
        accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
        style={
          Array [
            Object {
              "flexShrink": 1,
              "fontSize": 16,
            },
            Object {
              "color": "#2f343d",
            },
          ]
        }
      >
        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
      </Text>
    </Text>
  </Text>
</View>
`;

exports[`Storyshots Room Item Alerts 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  unread
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#6C727A",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  unread
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#6C727A",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      +999
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  user mentions
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#F5455C",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  group mentions
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#F38C39",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  thread unread
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#1d74f5",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  thread unread user
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#F5455C",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  thread unread group
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#F38C39",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  user mentions priority 1
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#F5455C",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  group mentions priority 2
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#F38C39",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  thread unread priority 3
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#1d74f5",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Room Item Basic 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Room Item Condensed Room Item 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  Object {
                    "height": 120,
                  },
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 24,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              Object {
                "height": 120,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                Object {
                  "height": 120,
                },
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 36,
                      "width": 36,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  Object {
                    "paddingVertical": 20,
                  },
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#1d74f5",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  Object {
                    "height": 120,
                  },
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 24,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              Object {
                "height": 120,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                Object {
                  "height": 120,
                },
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 36,
                      "width": 36,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  Object {
                    "paddingVertical": 20,
                  },
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  unread
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#6C727A",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      +999
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  Object {
                    "height": 120,
                  },
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 24,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              Object {
                "height": 120,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                Object {
                  "height": 120,
                },
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 36,
                    "width": 36,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 36,
                      "width": 36,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/@rocket.cat?format=png&size=36",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  Object {
                    "paddingVertical": 20,
                  },
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": undefined,
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        Object {
                          "marginRight": 8,
                        },
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "alignSelf": "center",
                        "borderRadius": 4,
                        "marginHorizontal": 4,
                      },
                      Object {
                        "backgroundColor": "#e1e5e8",
                      },
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "paddingHorizontal": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#6d6d72",
                        },
                      ]
                    }
                  >
                    Auto-join
                  </Text>
                </View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Room Item Condensed Room Item without Avatar 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  Object {
                    "height": 120,
                  },
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 24,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              Object {
                "height": 120,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                Object {
                  "height": 120,
                },
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  Object {
                    "paddingVertical": 20,
                  },
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          Object {
                            "color": "#1d74f5",
                          },
                        ],
                      ]
                    }
                  >
                    10:00
                  </Text>
                  <View
                    style={
                      Array [
                        Object {
                          "alignItems": "center",
                          "borderRadius": 10.5,
                          "height": 21,
                          "justifyContent": "center",
                          "marginLeft": 10,
                          "paddingHorizontal": 5,
                          "paddingVertical": 3,
                        },
                        Object {
                          "backgroundColor": "#1d74f5",
                          "minWidth": 21,
                        },
                        undefined,
                      ]
                    }
                  >
                    <Text
                      numberOfLines={1}
                      style={
                        Array [
                          Object {
                            "backgroundColor": "transparent",
                            "fontFamily": "System",
                            "fontSize": 13,
                            "fontWeight": "600",
                            "textAlign": "left",
                          },
                          undefined,
                          Object {
                            "color": "#ffffff",
                          },
                        ]
                      }
                    >
                      1
                    </Text>
                  </View>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  Object {
                    "height": 120,
                  },
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 24,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              Object {
                "height": 120,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                Object {
                  "height": 120,
                },
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  Object {
                    "paddingVertical": 20,
                  },
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": undefined,
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        Object {
                          "marginRight": 8,
                        },
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  Object {
                    "height": 120,
                  },
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 24,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              Object {
                "height": 120,
              },
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 120,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 24,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                Object {
                  "height": 120,
                },
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  Object {
                    "paddingVertical": 20,
                  },
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "alignSelf": "center",
                        "borderRadius": 4,
                        "marginHorizontal": 4,
                      },
                      Object {
                        "backgroundColor": "#e1e5e8",
                      },
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "paddingHorizontal": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#6d6d72",
                        },
                      ]
                    }
                  >
                    Auto-join
                  </Text>
                </View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Room Item Expanded Room Item without Avatar 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Object {
                  "height": 150,
                  "justifyContent": "center",
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#cbced1",
                      "fontSize": 24,
                    },
                    Array [
                      Object {
                        "height": 24,
                        "textAlignVertical": "center",
                        "width": 24,
                      },
                      Array [
                        Array [
                          Object {
                            "marginRight": 4,
                          },
                          Object {
                            "color": "#0d0e12",
                          },
                          Object {
                            "marginRight": 12,
                          },
                        ],
                        Object {
                          "color": "#cbced1",
                        },
                      ],
                    ],
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#1d74f5",
                        },
                      ],
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "borderRadius": 10.5,
                        "height": 21,
                        "justifyContent": "center",
                        "marginLeft": 10,
                        "paddingHorizontal": 5,
                        "paddingVertical": 3,
                      },
                      Object {
                        "backgroundColor": "#1d74f5",
                        "minWidth": 21,
                      },
                      undefined,
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    1
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Object {
                  "height": 150,
                  "justifyContent": "center",
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#2de0a5",
                      "fontSize": 24,
                    },
                    Array [
                      Object {
                        "height": 24,
                        "textAlignVertical": "center",
                        "width": 24,
                      },
                      Array [
                        Array [
                          Object {
                            "marginRight": 4,
                          },
                          Object {
                            "color": "#0d0e12",
                          },
                          Object {
                            "marginRight": 12,
                          },
                        ],
                        Object {
                          "color": "#2de0a5",
                        },
                      ],
                    ],
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#1d74f5",
                        },
                      ],
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "borderRadius": 10.5,
                        "height": 21,
                        "justifyContent": "center",
                        "marginLeft": 10,
                        "paddingHorizontal": 5,
                        "paddingVertical": 3,
                      },
                      Object {
                        "backgroundColor": "#1d74f5",
                        "minWidth": 21,
                      },
                      undefined,
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    1
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Object {
                  "height": 150,
                  "justifyContent": "center",
                }
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#2de0a5",
                      "fontSize": 24,
                    },
                    Array [
                      Object {
                        "height": 24,
                        "textAlignVertical": "center",
                        "width": 24,
                      },
                      Array [
                        Array [
                          Object {
                            "marginRight": 4,
                          },
                          Object {
                            "color": "#0d0e12",
                          },
                          Object {
                            "marginRight": 12,
                          },
                        ],
                        Object {
                          "color": "#2de0a5",
                        },
                      ],
                    ],
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#1d74f5",
                        },
                      ],
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Room Item Last Message 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 16,
                      },
                      Array [
                        Object {
                          "height": 16,
                          "textAlignVertical": "center",
                          "width": 16,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            undefined,
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      undefined,
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="No Message"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  No Message
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 16,
                      },
                      Array [
                        Object {
                          "height": 16,
                          "textAlignVertical": "center",
                          "width": 16,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            undefined,
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      undefined,
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="2"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  2
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 16,
                      },
                      Array [
                        Object {
                          "height": 16,
                          "textAlignVertical": "center",
                          "width": 16,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            undefined,
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      undefined,
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="You: 1"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  You: 1
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 16,
                      },
                      Array [
                        Object {
                          "height": 16,
                          "textAlignVertical": "center",
                          "width": 16,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            undefined,
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      undefined,
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 16,
                      },
                      Array [
                        Object {
                          "height": 16,
                          "textAlignVertical": "center",
                          "width": 16,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            undefined,
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#1d74f5",
                        },
                      ],
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "borderRadius": 10.5,
                        "height": 21,
                        "justifyContent": "center",
                        "marginLeft": 10,
                        "paddingHorizontal": 5,
                        "paddingVertical": 3,
                      },
                      Object {
                        "backgroundColor": "#6C727A",
                        "minWidth": 21,
                      },
                      undefined,
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    1
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 16,
                      },
                      Array [
                        Object {
                          "height": 16,
                          "textAlignVertical": "center",
                          "width": 16,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            undefined,
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#1d74f5",
                        },
                      ],
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "borderRadius": 10.5,
                        "height": 21,
                        "justifyContent": "center",
                        "marginLeft": 10,
                        "paddingHorizontal": 5,
                        "paddingVertical": 3,
                      },
                      Object {
                        "backgroundColor": "#6C727A",
                        "minWidth": 21,
                      },
                      undefined,
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    +999
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 16,
                      },
                      Array [
                        Object {
                          "height": 16,
                          "textAlignVertical": "center",
                          "width": 16,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            undefined,
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontWeight": "600",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#1d74f5",
                        },
                      ],
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "borderRadius": 10.5,
                        "height": 21,
                        "justifyContent": "center",
                        "marginLeft": 10,
                        "paddingHorizontal": 5,
                        "paddingVertical": 3,
                      },
                      Object {
                        "backgroundColor": "#1d74f5",
                        "minWidth": 21,
                      },
                      undefined,
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "textAlign": "left",
                        },
                        undefined,
                        Object {
                          "color": "#ffffff",
                        },
                      ]
                    }
                  >
                    1
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Room Item Tag 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "alignSelf": "center",
                        "borderRadius": 4,
                        "marginHorizontal": 4,
                      },
                      Object {
                        "backgroundColor": "#e1e5e8",
                      },
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "paddingHorizontal": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#6d6d72",
                        },
                      ]
                    }
                  >
                    Auto-join
                  </Text>
                </View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 16,
                      },
                      Array [
                        Object {
                          "height": 16,
                          "textAlignVertical": "center",
                          "width": 16,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            undefined,
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "alignSelf": "center",
                        "borderRadius": 4,
                        "marginHorizontal": 4,
                      },
                      Object {
                        "backgroundColor": "#e1e5e8",
                      },
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "paddingHorizontal": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#6d6d72",
                        },
                      ]
                    }
                    testID="auto-join-tag"
                  >
                    Auto-join
                  </Text>
                </View>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      undefined,
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="No Message"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  No Message
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "alignSelf": "center",
                        "borderRadius": 4,
                        "marginHorizontal": 4,
                      },
                      Object {
                        "backgroundColor": "#e1e5e8",
                      },
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "paddingHorizontal": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#6d6d72",
                        },
                      ]
                    }
                  >
                    Auto-join
                  </Text>
                </View>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "justifyContent": "center",
                    "width": "100%",
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 16,
                      },
                      Array [
                        Object {
                          "height": 16,
                          "textAlignVertical": "center",
                          "width": 16,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            undefined,
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
                <View
                  style={
                    Array [
                      Object {
                        "alignItems": "center",
                        "alignSelf": "center",
                        "borderRadius": 4,
                        "marginHorizontal": 4,
                      },
                      Object {
                        "backgroundColor": "#e1e5e8",
                      },
                    ]
                  }
                >
                  <Text
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "600",
                          "paddingHorizontal": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#6d6d72",
                        },
                      ]
                    }
                    testID="auto-join-tag"
                  >
                    Auto-join
                  </Text>
                </View>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 13,
                        "fontWeight": "400",
                        "marginLeft": 4,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                      undefined,
                    ]
                  }
                >
                  10:00
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "flex-start",
                    "flex": 1,
                    "flexDirection": "row",
                  }
                }
              >
                <Text
                  accessibilityLabel="No Message"
                  numberOfLines={2}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 16,
                        "fontWeight": "400",
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#2f343d",
                      },
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 14,
                        "fontWeight": "400",
                        "lineHeight": 17,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                  testID="room-item-last-message"
                >
                  No Message
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Room Item Touch 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Room Item Type 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/@rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": undefined,
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        Object {
                          "marginRight": 8,
                        },
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/@rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": undefined,
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        Object {
                          "marginRight": 8,
                        },
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/@rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": undefined,
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        Object {
                          "marginRight": 8,
                        },
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/@rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": undefined,
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        Object {
                          "marginRight": 8,
                        },
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": undefined,
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        Object {
                          "marginRight": 8,
                        },
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/@rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": undefined,
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        Object {
                          "marginRight": 8,
                        },
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Room Item User 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  diego.mello
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots Room Item User status 1`] = `
<RCTScrollView
  style={
    Object {
      "backgroundColor": "#ffffff",
    }
  }
>
  <View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#2de0a5",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#2de0a5",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#ffd21f",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#ffd21f",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#f5455c",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#f5455c",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ea2a8",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#9ea2a8",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={Object {}}
    >
      <View
        style={Object {}}
      >
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              undefined,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#1d74f5",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "right": 670,
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": -80,
                  },
                ],
                "width": 750,
              }
            }
          >
            <View
              style={
                Array [
                  Object {
                    "height": 150,
                    "justifyContent": "center",
                    "position": "absolute",
                    "right": 0,
                    "top": 0,
                  },
                  null,
                ]
              }
            >
              <Text
                allowFontScaling={false}
                style={
                  Array [
                    Object {
                      "color": "#ffffff",
                      "fontSize": 28,
                    },
                    undefined,
                    Object {
                      "fontFamily": "custom",
                      "fontStyle": "normal",
                      "fontWeight": "normal",
                    },
                    Object {},
                  ]
                }
              >
                
              </Text>
            </View>
          </View>
        </View>
        <View
          pointerEvents="box-none"
          style={
            Array [
              Object {
                "flexDirection": "row",
                "height": 150,
                "left": 0,
                "position": "absolute",
                "right": 0,
              },
              null,
            ]
          }
        >
          <View
            style={
              Object {
                "backgroundColor": "#54585e",
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
          <View
            style={
              Object {
                "height": 150,
                "justifyContent": "center",
                "position": "absolute",
                "top": 0,
                "transform": Array [
                  Object {
                    "translateX": 750,
                  },
                ],
                "width": 750,
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffffff",
                    "fontSize": 28,
                  },
                  undefined,
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
          </View>
        </View>
        <View
          style={
            Object {
              "transform": Array [
                Object {
                  "translateX": 0,
                },
              ],
            }
          }
        >
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                  "height": 150,
                  "paddingLeft": 14,
                },
                false,
              ]
            }
          >
            <View
              style={
                Array [
                  Object {
                    "borderRadius": 4,
                    "height": 48,
                    "width": 48,
                  },
                  Object {
                    "marginRight": 10,
                  },
                ]
              }
              testID="avatar"
            >
              <View
                style={
                  Array [
                    Object {
                      "overflow": "hidden",
                    },
                    Object {
                      "borderRadius": 4,
                      "height": 48,
                      "width": 48,
                    },
                  ]
                }
              >
                <FastImageView
                  resizeMode="cover"
                  source={
                    Object {
                      "headers": undefined,
                      "priority": "high",
                      "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=48",
                    }
                  }
                  style={
                    Object {
                      "bottom": 0,
                      "left": 0,
                      "position": "absolute",
                      "right": 0,
                      "top": 0,
                    }
                  }
                />
              </View>
            </View>
            <View
              style={
                Array [
                  Object {
                    "borderBottomWidth": 0.5,
                    "flex": 1,
                    "paddingRight": 14,
                    "paddingVertical": 10,
                  },
                  Object {
                    "borderColor": "#cbcbcc",
                  },
                  false,
                ]
              }
            >
              <View
                style={
                  Array [
                    Object {
                      "alignItems": "center",
                      "flexDirection": "row",
                      "justifyContent": "center",
                      "width": "100%",
                    },
                    Object {
                      "flex": 1,
                    },
                  ]
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#cbced1",
                        "fontSize": 22,
                      },
                      Array [
                        Object {
                          "height": 22,
                          "textAlignVertical": "center",
                          "width": 22,
                        },
                        Array [
                          Array [
                            Object {
                              "marginRight": 4,
                            },
                            Object {
                              "color": "#0d0e12",
                            },
                            Object {
                              "marginRight": 8,
                            },
                          ],
                          Object {
                            "color": "#cbced1",
                          },
                        ],
                      ],
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  ellipsizeMode="tail"
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "flex": 1,
                        "fontFamily": "System",
                        "fontSize": 17,
                        "fontWeight": "500",
                        "lineHeight": 20,
                        "textAlign": "left",
                      },
                      undefined,
                      Object {
                        "color": "#0d0e12",
                      },
                    ]
                  }
                >
                  rocket.cat
                </Text>
                <View
                  style={
                    Object {
                      "alignItems": "flex-end",
                    }
                  }
                >
                  <Text
                    ellipsizeMode="tail"
                    numberOfLines={1}
                    style={
                      Array [
                        Object {
                          "backgroundColor": "transparent",
                          "fontFamily": "System",
                          "fontSize": 13,
                          "fontWeight": "400",
                          "marginLeft": 4,
                          "textAlign": "left",
                        },
                        Object {
                          "color": "#9ca2a8",
                        },
                        undefined,
                      ]
                    }
                  >
                    10:00
                  </Text>
                </View>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
  </View>
</RCTScrollView>
`;

exports[`Storyshots RoomHeader icons 1`] = `
Array [
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="private channel"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="private channel"
            >
              private channel
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="public channel"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="public channel"
            >
              public channel
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="discussion"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              accessibilityLabel="discussion"
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="discussion"
            >
              discussion
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="omnichannel"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="omnichannel"
            >
              omnichannel
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="private team"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="private team"
            >
              private team
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="public team"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="public team"
            >
              public team
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="group dm"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="group dm"
            >
              group dm
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="online dm"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#2de0a5",
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "height": 16,
                      "textAlignVertical": "center",
                      "width": 16,
                    },
                    Array [
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        undefined,
                      ],
                      Object {
                        "color": "#2de0a5",
                      },
                    ],
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="online dm"
            >
              online dm
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="away dm"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#ffd21f",
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "height": 16,
                      "textAlignVertical": "center",
                      "width": 16,
                    },
                    Array [
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        undefined,
                      ],
                      Object {
                        "color": "#ffd21f",
                      },
                    ],
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="away dm"
            >
              away dm
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="busy dm"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#f5455c",
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "height": 16,
                      "textAlignVertical": "center",
                      "width": 16,
                    },
                    Array [
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        undefined,
                      ],
                      Object {
                        "color": "#f5455c",
                      },
                    ],
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="busy dm"
            >
              busy dm
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="loading dm"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#9ea2a8",
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "height": 16,
                      "textAlignVertical": "center",
                      "width": 16,
                    },
                    Array [
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        undefined,
                      ],
                      Object {
                        "color": "#9ea2a8",
                      },
                    ],
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="loading dm"
            >
              loading dm
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="offline dm"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": "#cbced1",
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "height": 16,
                      "textAlignVertical": "center",
                      "width": 16,
                    },
                    Array [
                      Array [
                        Object {
                          "marginRight": 4,
                        },
                        Object {
                          "color": "#0d0e12",
                        },
                        undefined,
                      ],
                      Object {
                        "color": "#cbced1",
                      },
                    ],
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="offline dm"
            >
              offline dm
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
]
`;

exports[`Storyshots RoomHeader landscape 1`] = `
Array [
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 12.8,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
          <Text
            accessibilityLabel="subtitle"
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#2f343d",
                },
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                  "fontSize": 9.600000000000001,
                },
              ]
            }
          >
            subtitle
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 12.8,
                  },
                ]
              }
              testID="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
            >
              Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
            </Text>
          </View>
          <Text
            accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#2f343d",
                },
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                  "fontSize": 9.600000000000001,
                },
              ]
            }
          >
            Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
]
`;

exports[`Storyshots RoomHeader themes 1`] = `
Array [
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
          <Text
            accessibilityLabel="subtitle"
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#2f343d",
                },
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                  "fontSize": 12,
                },
              ]
            }
          >
            subtitle
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#0b182c",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#0b182c",
            "borderBottomColor": "#2F3A4B",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#f9f9f9",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#f9f9f9",
                    "fontSize": 16,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
          <Text
            accessibilityLabel="subtitle"
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#cbced1",
                },
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9297a2",
                  "fontSize": 12,
                },
              ]
            }
          >
            subtitle
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#0d0d0d",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#0d0d0d",
            "borderBottomColor": "#323232",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#f9f9f9",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#f9f9f9",
                    "fontSize": 16,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
          <Text
            accessibilityLabel="subtitle"
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#cbced1",
                },
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#b2b8c6",
                  "fontSize": 12,
                },
              ]
            }
          >
            subtitle
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
]
`;

exports[`Storyshots RoomHeader thread 1`] = `
Array [
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="title"
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              parent title
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="markdown
preview
#3
4
5"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="markdown preview #3 4 5"
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="markdown
preview
#3
4
5"
            >
              markdown preview #3 4 5
            </Text>
          </View>
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
]
`;

exports[`Storyshots RoomHeader title and subtitle 1`] = `
Array [
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="title"
            >
              title
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
            >
              Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
            </Text>
          </View>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
          <Text
            accessibilityLabel="subtitle"
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#2f343d",
                },
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                  "fontSize": 12,
                },
              ]
            }
          >
            subtitle
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
          <Text
            accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#2f343d",
                },
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                  "fontSize": 12,
                },
              ]
            }
          >
            Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
              testID="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
            >
              Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
            </Text>
          </View>
          <Text
            accessibilityLabel="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries"
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontSize": 16,
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#2f343d",
                },
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                  "fontSize": 12,
                },
              ]
            }
          >
            Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
]
`;

exports[`Storyshots RoomHeader typing 1`] = `
Array [
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                  "fontSize": 12,
                },
              ]
            }
          >
            <Text
              style={
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontWeight": "600",
                  "textAlign": "left",
                }
              }
            >
              user 1
               
            </Text>
            is typing
            ...
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                  "fontSize": 12,
                },
              ]
            }
          >
            <Text
              style={
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontWeight": "600",
                  "textAlign": "left",
                }
              }
            >
              user 1 and user 2
               
            </Text>
            are typing
            ...
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
  <RNCSafeAreaView
    edges={
      Array [
        "top",
        "left",
        "right",
      ]
    }
    style={
      Object {
        "backgroundColor": "#EEEFF1",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "elevation": 4,
            "flexDirection": "row",
            "height": 44,
            "justifyContent": "center",
          },
          Object {
            "backgroundColor": "#EEEFF1",
            "borderBottomColor": "#B2B2B2",
            "borderBottomWidth": 0.5,
            "elevation": 0,
          },
        ]
      }
    >
      <View
        style={
          Object {
            "flex": 1,
            "paddingHorizontal": 12,
          }
        }
      >
        <View
          accessibilityLabel="title"
          accessible={true}
          focusable={true}
          hitSlop={
            Object {
              "bottom": 5,
              "left": 5,
              "right": 5,
              "top": 5,
            }
          }
          onClick={[Function]}
          onResponderGrant={[Function]}
          onResponderMove={[Function]}
          onResponderRelease={[Function]}
          onResponderTerminate={[Function]}
          onResponderTerminationRequest={[Function]}
          onStartShouldSetResponder={[Function]}
          style={
            Object {
              "flex": 1,
              "justifyContent": "center",
              "opacity": 1,
            }
          }
          testID="room-header"
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
              }
            }
          >
            <Text
              allowFontScaling={false}
              style={
                Array [
                  Object {
                    "color": undefined,
                    "fontSize": 16,
                  },
                  Array [
                    Object {
                      "marginRight": 4,
                    },
                    Object {
                      "color": "#0d0e12",
                    },
                    undefined,
                  ],
                  Object {
                    "fontFamily": "custom",
                    "fontStyle": "normal",
                    "fontWeight": "normal",
                  },
                  Object {},
                ]
              }
            >
              
            </Text>
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontWeight": "600",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0C0D0F",
                    "fontSize": 16,
                  },
                ]
              }
            >
              title
            </Text>
          </View>
          <Text
            numberOfLines={1}
            style={
              Array [
                Object {
                  "backgroundColor": "transparent",
                  "flexShrink": 1,
                  "fontFamily": "System",
                  "fontWeight": "400",
                  "textAlign": "left",
                },
                Object {
                  "color": "#9ca2a8",
                  "fontSize": 12,
                },
              ]
            }
          >
            <Text
              style={
                Object {
                  "backgroundColor": "transparent",
                  "fontFamily": "System",
                  "fontWeight": "600",
                  "textAlign": "left",
                }
              }
            >
              user 1, user 2, user 3, user 4, user 5
               
            </Text>
            are typing
            ...
          </Text>
        </View>
      </View>
    </View>
  </RNCSafeAreaView>,
]
`;

exports[`Storyshots ServerItem content 1`] = `
Array [
  <View
    accessible={true}
    collapsable={false}
    focusable={true}
    onBlur={[Function]}
    onClick={[Function]}
    onFocus={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#ffffff",
      }
    }
    testID="rooms-list-header-server-https://open.rocket.chat/"
  >
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Object {
              "borderRadius": 4,
              "height": 44,
              "margin": 12,
              "resizeMode": "contain",
              "width": 44,
            },
          ]
        }
      >
        <FastImageView
          defaultSource="test-file-stub"
          onFastImageError={[Function]}
          resizeMode="cover"
          source={
            Object {
              "priority": "high",
              "uri": "https://open.rocket.chat/images/logo/android-chrome-512x512.png",
            }
          }
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "flex": 1,
            "flexDirection": "column",
            "justifyContent": "center",
            "paddingRight": 18,
          }
        }
      >
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 18,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#0d0e12",
              },
            ]
          }
        >
          Rocket.Chat
        </Text>
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#9ca2a8",
              },
            ]
          }
        >
          https://open.rocket.chat/
        </Text>
      </View>
      <Text
        allowFontScaling={false}
        style={
          Array [
            Object {
              "color": "#1d74f5",
              "fontSize": 22,
            },
            Array [
              Object {
                "height": 22,
                "marginHorizontal": 15,
                "width": 22,
              },
              undefined,
            ],
            Object {
              "fontFamily": "custom",
              "fontStyle": "normal",
              "fontWeight": "normal",
            },
            Object {},
          ]
        }
      >
        
      </Text>
    </View>
  </View>,
  <View
    accessible={true}
    collapsable={false}
    focusable={true}
    onBlur={[Function]}
    onClick={[Function]}
    onFocus={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#ffffff",
      }
    }
    testID="rooms-list-header-server-https://superlongservername.tologintoasuperlongservername/"
  >
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Object {
              "borderRadius": 4,
              "height": 44,
              "margin": 12,
              "resizeMode": "contain",
              "width": 44,
            },
          ]
        }
      >
        <FastImageView
          defaultSource="test-file-stub"
          onFastImageError={[Function]}
          resizeMode="cover"
          source={
            Object {
              "priority": "high",
              "uri": "https://open.rocket.chat/images/logo/android-chrome-512x512.png",
            }
          }
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "flex": 1,
            "flexDirection": "column",
            "justifyContent": "center",
            "paddingRight": 18,
          }
        }
      >
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 18,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#0d0e12",
              },
            ]
          }
        >
          Super Long Server Name in Rocket.Chat
        </Text>
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#9ca2a8",
              },
            ]
          }
        >
          https://superlongservername.tologintoasuperlongservername/
        </Text>
      </View>
    </View>
  </View>,
  <View
    accessible={true}
    collapsable={false}
    focusable={true}
    onBlur={[Function]}
    onClick={[Function]}
    onFocus={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#ffffff",
      }
    }
    testID="rooms-list-header-server-https://stable.rocket.chat/"
  >
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Object {
              "borderRadius": 4,
              "height": 44,
              "margin": 12,
              "resizeMode": "contain",
              "width": 44,
            },
          ]
        }
      >
        <FastImageView
          resizeMode="cover"
          source={null}
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "flex": 1,
            "flexDirection": "column",
            "justifyContent": "center",
            "paddingRight": 18,
          }
        }
      >
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 18,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#0d0e12",
              },
            ]
          }
        >
          https://stable.rocket.chat/
        </Text>
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#9ca2a8",
              },
            ]
          }
        >
          https://stable.rocket.chat/
        </Text>
      </View>
    </View>
  </View>,
]
`;

exports[`Storyshots ServerItem themes 1`] = `
Array [
  <View
    accessible={true}
    collapsable={false}
    focusable={true}
    onBlur={[Function]}
    onClick={[Function]}
    onFocus={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#ffffff",
      }
    }
    testID="rooms-list-header-server-https://open.rocket.chat/"
  >
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Object {
              "borderRadius": 4,
              "height": 44,
              "margin": 12,
              "resizeMode": "contain",
              "width": 44,
            },
          ]
        }
      >
        <FastImageView
          defaultSource="test-file-stub"
          onFastImageError={[Function]}
          resizeMode="cover"
          source={
            Object {
              "priority": "high",
              "uri": "https://open.rocket.chat/images/logo/android-chrome-512x512.png",
            }
          }
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "flex": 1,
            "flexDirection": "column",
            "justifyContent": "center",
            "paddingRight": 18,
          }
        }
      >
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 18,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#0d0e12",
              },
            ]
          }
        >
          Rocket.Chat
        </Text>
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#9ca2a8",
              },
            ]
          }
        >
          https://open.rocket.chat/
        </Text>
      </View>
      <Text
        allowFontScaling={false}
        style={
          Array [
            Object {
              "color": "#1d74f5",
              "fontSize": 22,
            },
            Array [
              Object {
                "height": 22,
                "marginHorizontal": 15,
                "width": 22,
              },
              undefined,
            ],
            Object {
              "fontFamily": "custom",
              "fontStyle": "normal",
              "fontWeight": "normal",
            },
            Object {},
          ]
        }
      >
        
      </Text>
    </View>
  </View>,
  <View
    accessible={true}
    collapsable={false}
    focusable={true}
    onBlur={[Function]}
    onClick={[Function]}
    onFocus={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#030b1b",
      }
    }
    testID="rooms-list-header-server-https://open.rocket.chat/"
  >
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Object {
              "borderRadius": 4,
              "height": 44,
              "margin": 12,
              "resizeMode": "contain",
              "width": 44,
            },
          ]
        }
      >
        <FastImageView
          defaultSource="test-file-stub"
          onFastImageError={[Function]}
          resizeMode="cover"
          source={
            Object {
              "priority": "high",
              "uri": "https://open.rocket.chat/images/logo/android-chrome-512x512.png",
            }
          }
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "flex": 1,
            "flexDirection": "column",
            "justifyContent": "center",
            "paddingRight": 18,
          }
        }
      >
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 18,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#f9f9f9",
              },
            ]
          }
        >
          Rocket.Chat
        </Text>
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#9297a2",
              },
            ]
          }
        >
          https://open.rocket.chat/
        </Text>
      </View>
      <Text
        allowFontScaling={false}
        style={
          Array [
            Object {
              "color": "#1d74f5",
              "fontSize": 22,
            },
            Array [
              Object {
                "height": 22,
                "marginHorizontal": 15,
                "width": 22,
              },
              undefined,
            ],
            Object {
              "fontFamily": "custom",
              "fontStyle": "normal",
              "fontWeight": "normal",
            },
            Object {},
          ]
        }
      >
        
      </Text>
    </View>
  </View>,
  <View
    accessible={true}
    collapsable={false}
    focusable={true}
    onBlur={[Function]}
    onClick={[Function]}
    onFocus={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#000000",
      }
    }
    testID="rooms-list-header-server-https://open.rocket.chat/"
  >
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Object {
              "borderRadius": 4,
              "height": 44,
              "margin": 12,
              "resizeMode": "contain",
              "width": 44,
            },
          ]
        }
      >
        <FastImageView
          defaultSource="test-file-stub"
          onFastImageError={[Function]}
          resizeMode="cover"
          source={
            Object {
              "priority": "high",
              "uri": "https://open.rocket.chat/images/logo/android-chrome-512x512.png",
            }
          }
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "flex": 1,
            "flexDirection": "column",
            "justifyContent": "center",
            "paddingRight": 18,
          }
        }
      >
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 18,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#f9f9f9",
              },
            ]
          }
        >
          Rocket.Chat
        </Text>
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#b2b8c6",
              },
            ]
          }
        >
          https://open.rocket.chat/
        </Text>
      </View>
      <Text
        allowFontScaling={false}
        style={
          Array [
            Object {
              "color": "#1e9bfe",
              "fontSize": 22,
            },
            Array [
              Object {
                "height": 22,
                "marginHorizontal": 15,
                "width": 22,
              },
              undefined,
            ],
            Object {
              "fontFamily": "custom",
              "fontStyle": "normal",
              "fontWeight": "normal",
            },
            Object {},
          ]
        }
      >
        
      </Text>
    </View>
  </View>,
]
`;

exports[`Storyshots ServerItem touchable 1`] = `
Array [
  <View
    accessible={true}
    collapsable={false}
    focusable={true}
    onBlur={[Function]}
    onClick={[Function]}
    onFocus={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#ffffff",
      }
    }
    testID="rooms-list-header-server-https://open.rocket.chat/"
  >
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Object {
              "borderRadius": 4,
              "height": 44,
              "margin": 12,
              "resizeMode": "contain",
              "width": 44,
            },
          ]
        }
      >
        <FastImageView
          defaultSource="test-file-stub"
          onFastImageError={[Function]}
          resizeMode="cover"
          source={
            Object {
              "priority": "high",
              "uri": "https://open.rocket.chat/images/logo/android-chrome-512x512.png",
            }
          }
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "flex": 1,
            "flexDirection": "column",
            "justifyContent": "center",
            "paddingRight": 18,
          }
        }
      >
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 18,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#0d0e12",
              },
            ]
          }
        >
          Rocket.Chat
        </Text>
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#9ca2a8",
              },
            ]
          }
        >
          https://open.rocket.chat/
        </Text>
      </View>
    </View>
  </View>,
  <View
    accessible={true}
    collapsable={false}
    focusable={true}
    onBlur={[Function]}
    onClick={[Function]}
    onFocus={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#ffffff",
      }
    }
    testID="rooms-list-header-server-https://open.rocket.chat/"
  >
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Object {
              "borderRadius": 4,
              "height": 44,
              "margin": 12,
              "resizeMode": "contain",
              "width": 44,
            },
          ]
        }
      >
        <FastImageView
          defaultSource="test-file-stub"
          onFastImageError={[Function]}
          resizeMode="cover"
          source={
            Object {
              "priority": "high",
              "uri": "https://open.rocket.chat/images/logo/android-chrome-512x512.png",
            }
          }
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "flex": 1,
            "flexDirection": "column",
            "justifyContent": "center",
            "paddingRight": 18,
          }
        }
      >
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 18,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#0d0e12",
              },
            ]
          }
        >
          Rocket.Chat
        </Text>
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#9ca2a8",
              },
            ]
          }
        >
          https://open.rocket.chat/
        </Text>
      </View>
    </View>
  </View>,
  <View
    accessible={true}
    collapsable={false}
    focusable={true}
    onBlur={[Function]}
    onClick={[Function]}
    onFocus={[Function]}
    onResponderGrant={[Function]}
    onResponderMove={[Function]}
    onResponderRelease={[Function]}
    onResponderTerminate={[Function]}
    onResponderTerminationRequest={[Function]}
    onStartShouldSetResponder={[Function]}
    style={
      Object {
        "backgroundColor": "#ffffff",
      }
    }
    testID="rooms-list-header-server-https://open.rocket.chat/"
  >
    <View
      style={
        Object {
          "alignItems": "center",
          "flexDirection": "row",
        }
      }
    >
      <View
        style={
          Array [
            Object {
              "overflow": "hidden",
            },
            Object {
              "borderRadius": 4,
              "height": 44,
              "margin": 12,
              "resizeMode": "contain",
              "width": 44,
            },
          ]
        }
      >
        <FastImageView
          defaultSource="test-file-stub"
          onFastImageError={[Function]}
          resizeMode="cover"
          source={
            Object {
              "priority": "high",
              "uri": "https://open.rocket.chat/images/logo/android-chrome-512x512.png",
            }
          }
          style={
            Object {
              "bottom": 0,
              "left": 0,
              "position": "absolute",
              "right": 0,
              "top": 0,
            }
          }
        />
      </View>
      <View
        style={
          Object {
            "flex": 1,
            "flexDirection": "column",
            "justifyContent": "center",
            "paddingRight": 18,
          }
        }
      >
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 18,
                "fontWeight": "600",
                "textAlign": "left",
              },
              Object {
                "color": "#0d0e12",
              },
            ]
          }
        >
          Rocket.Chat
        </Text>
        <Text
          numberOfLines={1}
          style={
            Array [
              Object {
                "backgroundColor": "transparent",
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "textAlign": "left",
              },
              Object {
                "color": "#9ca2a8",
              },
            ]
          }
        >
          https://open.rocket.chat/
        </Text>
      </View>
    </View>
  </View>,
]
`;

exports[`Storyshots Text Input Short and Long Text 1`] = `
<View
  style={
    Object {
      "paddingHorizontal": 14,
    }
  }
>
  <View
    style={
      Array [
        Object {
          "marginBottom": 10,
        },
        undefined,
      ]
    }
  >
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 14,
            "fontWeight": "600",
            "marginBottom": 10,
            "textAlign": "left",
          },
          Object {
            "color": "#0d0e12",
          },
          undefined,
        ]
      }
    >
      Short Text
    </Text>
    <View
      style={
        Object {
          "position": "relative",
        }
      }
    >
      <TextInput
        accessibilityLabel="placeholder"
        allowFontScaling={true}
        autoCapitalize="none"
        autoCorrect={false}
        keyboardAppearance="light"
        placeholder="placeholder"
        placeholderTextColor="#9ca2a8"
        rejectResponderTermination={true}
        style={
          Array [
            Object {
              "color": "#0d0e12",
            },
            Array [
              Object {
                "backgroundColor": "transparent",
                "borderRadius": 2,
                "borderWidth": 0.5,
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "height": 48,
                "padding": 14,
                "textAlign": "left",
              },
              undefined,
              undefined,
              Object {
                "backgroundColor": "#ffffff",
                "borderColor": "#cbcbcc",
                "color": "#0d0e12",
              },
              undefined,
              undefined,
            ],
            Object {
              "textAlign": "auto",
            },
          ]
        }
        underlineColorAndroid="transparent"
        value="Rocket.Chat"
      />
    </View>
  </View>
  <View
    style={
      Array [
        Object {
          "marginBottom": 10,
        },
        undefined,
      ]
    }
  >
    <Text
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 14,
            "fontWeight": "600",
            "marginBottom": 10,
            "textAlign": "left",
          },
          Object {
            "color": "#0d0e12",
          },
          undefined,
        ]
      }
    >
      Long Text
    </Text>
    <View
      style={
        Object {
          "position": "relative",
        }
      }
    >
      <TextInput
        accessibilityLabel="placeholder"
        allowFontScaling={true}
        autoCapitalize="none"
        autoCorrect={false}
        keyboardAppearance="light"
        placeholder="placeholder"
        placeholderTextColor="#9ca2a8"
        rejectResponderTermination={true}
        style={
          Array [
            Object {
              "color": "#0d0e12",
            },
            Array [
              Object {
                "backgroundColor": "transparent",
                "borderRadius": 2,
                "borderWidth": 0.5,
                "fontFamily": "System",
                "fontSize": 16,
                "fontWeight": "400",
                "height": 48,
                "padding": 14,
                "textAlign": "left",
              },
              undefined,
              undefined,
              Object {
                "backgroundColor": "#ffffff",
                "borderColor": "#cbcbcc",
                "color": "#0d0e12",
              },
              undefined,
              undefined,
            ],
            Object {
              "textAlign": "auto",
            },
          ]
        }
        underlineColorAndroid="transparent"
        value="https://open.rocket.chat/images/logo/android-chrome-512x512.png"
      />
    </View>
  </View>
</View>
`;

exports[`Storyshots Thread Messages.Item badge 1`] = `
<RCTScrollView>
  <View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#ffffff",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Message content"
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Message content"
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Message content
            </Text>
            <View
              style={
                Array [
                  Object {
                    "alignSelf": "center",
                    "borderRadius": 4,
                    "height": 8,
                    "marginHorizontal": 8,
                    "width": 8,
                  },
                  Object {
                    "backgroundColor": "#F5455C",
                  },
                ]
              }
            />
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#6C727A",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#ffffff",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Message content"
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Message content"
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Message content
            </Text>
            <View
              style={
                Array [
                  Object {
                    "alignSelf": "center",
                    "borderRadius": 4,
                    "height": 8,
                    "marginHorizontal": 8,
                    "width": 8,
                  },
                  Object {
                    "backgroundColor": "#F38C39",
                  },
                ]
              }
            />
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#6C727A",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#ffffff",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Message content"
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Message content"
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Message content
            </Text>
            <View
              style={
                Array [
                  Object {
                    "alignSelf": "center",
                    "borderRadius": 4,
                    "height": 8,
                    "marginHorizontal": 8,
                    "width": 8,
                  },
                  Object {
                    "backgroundColor": "#1d74f5",
                  },
                ]
              }
            />
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#6C727A",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#ffffff",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
            </Text>
            <View
              style={
                Array [
                  Object {
                    "alignSelf": "center",
                    "borderRadius": 4,
                    "height": 8,
                    "marginHorizontal": 8,
                    "width": 8,
                  },
                  Object {
                    "backgroundColor": "#1d74f5",
                  },
                ]
              }
            />
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#6C727A",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots Thread Messages.Item content 1`] = `
<RCTScrollView>
  <View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#ffffff",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Message content"
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Message content"
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Message content
            </Text>
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#6C727A",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#ffffff",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
            </Text>
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#6C727A",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#ffffff",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Message content"
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Message content"
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Message content
            </Text>
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  +999
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  +999
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#6C727A",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#ffffff",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-"
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Attachment title"
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Attachment title
            </Text>
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#6C727A",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#ffffff",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Message content"
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              Rocket Cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Message content"
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Message content
            </Text>
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#6C727A",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots Thread Messages.Item themes 1`] = `
<RCTScrollView>
  <View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#ffffff",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Message content"
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#0d0e12",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9ca2a8",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Message content"
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#2f343d",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Message content
            </Text>
            <View
              style={
                Array [
                  Object {
                    "alignSelf": "center",
                    "borderRadius": 4,
                    "height": 8,
                    "marginHorizontal": 8,
                    "width": 8,
                  },
                  Object {
                    "backgroundColor": "#F5455C",
                  },
                ]
              }
            />
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9ca2a8",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9ca2a8",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#6C727A",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#030b1b",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Message content"
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#f9f9f9",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#9297a2",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Message content"
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#cbced1",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Message content
            </Text>
            <View
              style={
                Array [
                  Object {
                    "alignSelf": "center",
                    "borderRadius": 4,
                    "height": 8,
                    "marginHorizontal": 8,
                    "width": 8,
                  },
                  Object {
                    "backgroundColor": "#F5455C",
                  },
                ]
              }
            />
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9297a2",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9297a2",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#9297a2",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#9297a2",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#f9f9f9",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      accessible={true}
      focusable={true}
      onClick={[Function]}
      onResponderGrant={[Function]}
      onResponderMove={[Function]}
      onResponderRelease={[Function]}
      onResponderTerminate={[Function]}
      onResponderTerminationRequest={[Function]}
      onStartShouldSetResponder={[Function]}
      style={
        Object {
          "backgroundColor": "#000000",
          "opacity": 1,
        }
      }
      testID="thread-messages-view-Message content"
    >
      <View
        style={
          Object {
            "flexDirection": "row",
            "padding": 16,
          }
        }
      >
        <View
          style={
            Array [
              Object {
                "borderRadius": 4,
                "height": 36,
                "width": 36,
              },
              Object {
                "marginRight": 8,
              },
            ]
          }
          testID="avatar"
        >
          <View
            style={
              Array [
                Object {
                  "overflow": "hidden",
                },
                Object {
                  "borderRadius": 4,
                  "height": 36,
                  "width": 36,
                },
              ]
            }
          >
            <FastImageView
              resizeMode="cover"
              source={
                Object {
                  "headers": undefined,
                  "priority": "high",
                  "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=36",
                }
              }
              style={
                Object {
                  "bottom": 0,
                  "left": 0,
                  "position": "absolute",
                  "right": 0,
                  "top": 0,
                }
              }
            />
          </View>
        </View>
        <View
          style={
            Object {
              "flex": 1,
              "flexDirection": "column",
            }
          }
        >
          <View
            style={
              Object {
                "alignItems": "center",
                "flexDirection": "row",
                "marginBottom": 2,
              }
            }
          >
            <Text
              numberOfLines={1}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "flexShrink": 1,
                    "fontFamily": "System",
                    "fontSize": 18,
                    "fontWeight": "500",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#f9f9f9",
                  },
                ]
              }
            >
              rocket.cat
            </Text>
            <Text
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 14,
                    "fontWeight": "400",
                    "marginLeft": 4,
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#b2b8c6",
                  },
                ]
              }
            >
              November 10, 2020
            </Text>
          </View>
          <View
            style={
              Object {
                "flexDirection": "row",
              }
            }
          >
            <Text
              accessibilityLabel="Message content"
              numberOfLines={2}
              style={
                Array [
                  Object {
                    "backgroundColor": "transparent",
                    "fontFamily": "System",
                    "fontSize": 16,
                    "fontWeight": "400",
                    "textAlign": "left",
                  },
                  Object {
                    "color": "#cbced1",
                  },
                  Object {
                    "flex": 1,
                  },
                ]
              }
            >
              Message content
            </Text>
            <View
              style={
                Array [
                  Object {
                    "alignSelf": "center",
                    "borderRadius": 4,
                    "height": 8,
                    "marginHorizontal": 8,
                    "width": 8,
                  },
                  Object {
                    "backgroundColor": "#F5455C",
                  },
                ]
              }
            />
          </View>
          <View
            style={
              Array [
                Object {
                  "alignItems": "center",
                  "flex": 1,
                  "flexDirection": "row",
                },
                Object {
                  "marginTop": 8,
                },
              ]
            }
          >
            <View
              style={
                Object {
                  "flex": 1,
                  "flexDirection": "row",
                }
              }
            >
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#b2b8c6",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#b2b8c6",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
              <View
                style={
                  Object {
                    "alignItems": "center",
                    "flexDirection": "row",
                    "marginRight": 8,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#b2b8c6",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
                <Text
                  numberOfLines={1}
                  style={
                    Array [
                      Object {
                        "backgroundColor": "transparent",
                        "fontFamily": "System",
                        "fontSize": 10,
                        "fontWeight": "600",
                        "marginLeft": 2,
                        "textAlign": "left",
                      },
                      Object {
                        "color": "#b2b8c6",
                      },
                    ]
                  }
                >
                  1
                </Text>
              </View>
            </View>
            <View
              style={
                Object {
                  "alignItems": "center",
                  "flexDirection": "row",
                }
              }
            >
              <View
                accessible={true}
                focusable={true}
                onClick={[Function]}
                onResponderGrant={[Function]}
                onResponderMove={[Function]}
                onResponderRelease={[Function]}
                onResponderTerminate={[Function]}
                onResponderTerminationRequest={[Function]}
                onStartShouldSetResponder={[Function]}
                style={
                  Object {
                    "opacity": 1,
                  }
                }
              >
                <Text
                  allowFontScaling={false}
                  style={
                    Array [
                      Object {
                        "color": "#f9f9f9",
                        "fontSize": 24,
                      },
                      undefined,
                      Object {
                        "fontFamily": "custom",
                        "fontStyle": "normal",
                        "fontWeight": "normal",
                      },
                      Object {},
                    ]
                  }
                >
                  
                </Text>
              </View>
            </View>
          </View>
        </View>
      </View>
    </View>
    <View
      style={
        Array [
          Object {
            "height": 0.5,
          },
          undefined,
          Object {
            "backgroundColor": "#cbcbcc",
          },
        ]
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Action - Buttons 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Action - Select 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Context 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Fields 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Image 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Section + DatePicker 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Section + Markdown List 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Section + Multi Select 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Section + Overflow 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Section + Select 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Section + button 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Section + image 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitMessage Section 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitModal Modal - Actions 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitModal Modal - Contexts and Dividers 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitModal Modal - DatePicker with error 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitModal Modal - Form Input 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitModal Modal - Form TextArea 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitModal Modal - Images 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitModal Modal - Input with error 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitModal Modal - Multilne with error 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitModal Modal - Section Accessories 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots UiKitModal Modal - Section and Selects 1`] = `
<RCTScrollView
  keyboardShouldPersistTaps="always"
  style={
    Array [
      Object {
        "backgroundColor": "#fff",
        "flex": 1,
      },
      Object {
        "paddingHorizontal": 16,
      },
    ]
  }
>
  <View>
    <RCTSafeAreaView
      emulateUnlessSupported={true}
      style={
        Object {
          "backgroundColor": "#fff",
          "flex": 1,
        }
      }
    />
  </View>
</RCTScrollView>
`;

exports[`Storyshots Unread Badge all 1`] = `
<View
  style={
    Object {
      "alignItems": "center",
      "flex": 1,
      "flexDirection": "row",
      "justifyContent": "space-evenly",
    }
  }
>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "justifyContent": "center",
        },
        Object {
          "backgroundColor": "#6C727A",
          "minWidth": 16,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          Object {
            "fontSize": 10,
          },
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      9
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "justifyContent": "center",
        },
        Object {
          "backgroundColor": "#6C727A",
          "minWidth": 26,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          Object {
            "fontSize": 10,
          },
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      +99
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#6C727A",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      9
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#6C727A",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      +999
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#F5455C",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      9
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#F38C39",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      9
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#1d74f5",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      9
    </Text>
  </View>
</View>
`;

exports[`Storyshots Unread Badge different mention types 1`] = `
<View
  style={
    Object {
      "alignItems": "center",
      "flex": 1,
      "flexDirection": "row",
      "justifyContent": "space-evenly",
    }
  }
>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#6C727A",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      1
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#F5455C",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      1
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#F38C39",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      1
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#F5455C",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      1
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#1d74f5",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      1
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#F5455C",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      1
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#F38C39",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      1
    </Text>
  </View>
</View>
`;

exports[`Storyshots Unread Badge normal 1`] = `
<View
  style={
    Object {
      "alignItems": "center",
      "flex": 1,
      "flexDirection": "row",
      "justifyContent": "space-evenly",
    }
  }
>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#6C727A",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      9
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "height": 21,
          "justifyContent": "center",
          "marginLeft": 10,
          "paddingHorizontal": 5,
          "paddingVertical": 3,
        },
        Object {
          "backgroundColor": "#6C727A",
          "minWidth": 21,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          undefined,
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      +999
    </Text>
  </View>
</View>
`;

exports[`Storyshots Unread Badge small 1`] = `
<View
  style={
    Object {
      "alignItems": "center",
      "flex": 1,
      "flexDirection": "row",
      "justifyContent": "space-evenly",
    }
  }
>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "justifyContent": "center",
        },
        Object {
          "backgroundColor": "#6C727A",
          "minWidth": 16,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          Object {
            "fontSize": 10,
          },
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      9
    </Text>
  </View>
  <View
    style={
      Array [
        Object {
          "alignItems": "center",
          "borderRadius": 10.5,
          "justifyContent": "center",
        },
        Object {
          "backgroundColor": "#6C727A",
          "minWidth": 26,
        },
        undefined,
      ]
    }
  >
    <Text
      numberOfLines={1}
      style={
        Array [
          Object {
            "backgroundColor": "transparent",
            "fontFamily": "System",
            "fontSize": 13,
            "fontWeight": "600",
            "textAlign": "left",
          },
          Object {
            "fontSize": 10,
          },
          Object {
            "color": "#ffffff",
          },
        ]
      }
    >
      +99
    </Text>
  </View>
</View>
`;

exports[`Storyshots Unread Badge themes 1`] = `
Array [
  <View
    style={
      Object {
        "alignItems": "center",
        "flex": 1,
        "flexDirection": "row",
        "justifyContent": "space-evenly",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#6C727A",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#F5455C",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#F38C39",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#1d74f5",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
  </View>,
  <View
    style={
      Object {
        "alignItems": "center",
        "flex": 1,
        "flexDirection": "row",
        "justifyContent": "space-evenly",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#6C727A",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#F5455C",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#F38C39",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#1d74f5",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
  </View>,
  <View
    style={
      Object {
        "alignItems": "center",
        "flex": 1,
        "flexDirection": "row",
        "justifyContent": "space-evenly",
      }
    }
  >
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#6C727A",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#F5455C",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#F38C39",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
    <View
      style={
        Array [
          Object {
            "alignItems": "center",
            "borderRadius": 10.5,
            "height": 21,
            "justifyContent": "center",
            "marginLeft": 10,
            "paddingHorizontal": 5,
            "paddingVertical": 3,
          },
          Object {
            "backgroundColor": "#1d74f5",
            "minWidth": 21,
          },
          undefined,
        ]
      }
    >
      <Text
        numberOfLines={1}
        style={
          Array [
            Object {
              "backgroundColor": "transparent",
              "fontFamily": "System",
              "fontSize": 13,
              "fontWeight": "600",
              "textAlign": "left",
            },
            undefined,
            Object {
              "color": "#ffffff",
            },
          ]
        }
      >
        1
      </Text>
    </View>
  </View>,
]
`;