From 86ca76194dc1fdc77e99a29713c8ee1fb17d2539 Mon Sep 17 00:00:00 2001
From: Diego Mello <diegolmello@gmail.com>
Date: Thu, 10 Jun 2021 14:11:05 -0300
Subject: [PATCH] [FIX] RoomItem's long press crashing the app if prop is
 missing (#3199)

* Check onLongPress prop

* Add Touch stories
---
 .../__snapshots__/Storyshots.test.js.snap     | 398 ++++++++++++++++++
 app/presentation/RoomItem/index.js            |   4 +-
 storybook/stories/RoomItem.js                 |   3 +
 3 files changed, 404 insertions(+), 1 deletion(-)

diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap
index 52fa5d01d..3e3106d94 100644
--- a/__tests__/__snapshots__/Storyshots.test.js.snap
+++ b/__tests__/__snapshots__/Storyshots.test.js.snap
@@ -59100,6 +59100,404 @@ exports[`Storyshots Room Item Tag 1`] = `
 </RCTScrollView>
 `;
 
+exports[`Storyshots Room Item Touch 1`] = `
+<RCTScrollView
+  style={
+    Object {
+      "backgroundColor": "#ffffff",
+    }
+  }
+>
+  <View>
+    <View>
+      <View>
+        <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={
+                Object {
+                  "height": 150,
+                  "justifyContent": "center",
+                  "position": "absolute",
+                  "right": 0,
+                  "top": 0,
+                }
+              }
+            >
+              <Text
+                allowFontScaling={false}
+                style={
+                  Array [
+                    Object {
+                      "color": "white",
+                      "fontSize": 20,
+                    },
+                    undefined,
+                    Object {
+                      "fontFamily": "custom",
+                      "fontStyle": "normal",
+                      "fontWeight": "normal",
+                    },
+                    Object {},
+                  ]
+                }
+              >
+                
+              </Text>
+              <Text
+                style={
+                  Array [
+                    Object {
+                      "backgroundColor": "transparent",
+                      "fontFamily": "System",
+                      "fontSize": 15,
+                      "fontWeight": "600",
+                      "justifyContent": "center",
+                      "marginTop": 4,
+                      "textAlign": "left",
+                    },
+                    Object {
+                      "color": "#ffffff",
+                    },
+                  ]
+                }
+              >
+                Read
+              </Text>
+            </View>
+          </View>
+        </View>
+        <View
+          pointerEvents="box-none"
+          style={
+            Object {
+              "flexDirection": "row",
+              "height": 75,
+              "left": 0,
+              "position": "absolute",
+              "right": 0,
+            }
+          }
+        >
+          <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": 20,
+                  },
+                  undefined,
+                  Object {
+                    "fontFamily": "custom",
+                    "fontStyle": "normal",
+                    "fontWeight": "normal",
+                  },
+                  Object {},
+                ]
+              }
+            >
+              
+            </Text>
+            <Text
+              style={
+                Array [
+                  Object {
+                    "backgroundColor": "transparent",
+                    "fontFamily": "System",
+                    "fontSize": 15,
+                    "fontWeight": "600",
+                    "justifyContent": "center",
+                    "marginTop": 4,
+                    "textAlign": "left",
+                  },
+                  Object {
+                    "color": "#ffffff",
+                  },
+                ]
+              }
+            >
+              Favorite
+            </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": 20,
+                  },
+                  undefined,
+                  Object {
+                    "fontFamily": "custom",
+                    "fontStyle": "normal",
+                    "fontWeight": "normal",
+                  },
+                  Object {},
+                ]
+              }
+            >
+              
+            </Text>
+            <Text
+              style={
+                Array [
+                  Object {
+                    "backgroundColor": "transparent",
+                    "fontFamily": "System",
+                    "fontSize": 15,
+                    "fontWeight": "600",
+                    "justifyContent": "center",
+                    "marginTop": 4,
+                    "textAlign": "left",
+                  },
+                  Object {
+                    "color": "#ffffff",
+                  },
+                ]
+              }
+            >
+              Hide
+            </Text>
+          </View>
+        </View>
+        <View
+          style={
+            Object {
+              "transform": Array [
+                Object {
+                  "translateX": 0,
+                },
+              ],
+            }
+          }
+        >
+          <View
+            style={
+              Object {
+                "alignItems": "center",
+                "flexDirection": "row",
+                "height": 150,
+                "paddingLeft": 14,
+              }
+            }
+          >
+            <View
+              style={
+                Array [
+                  Object {
+                    "borderRadius": 4,
+                    "height": 48,
+                    "width": 48,
+                  },
+                  Object {
+                    "marginRight": 10,
+                  },
+                ]
+              }
+            >
+              <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",
+                  },
+                ]
+              }
+            >
+              <View
+                style={
+                  Array [
+                    Object {
+                      "alignItems": "center",
+                      "flexDirection": "row",
+                      "justifyContent": "center",
+                      "width": "100%",
+                    },
+                    Object {
+                      "flex": 1,
+                    },
+                  ]
+                }
+              >
+                <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>
+            </View>
+          </View>
+        </View>
+      </View>
+    </View>
+  </View>
+</RCTScrollView>
+`;
+
 exports[`Storyshots Room Item Type 1`] = `
 <RCTScrollView
   style={
diff --git a/app/presentation/RoomItem/index.js b/app/presentation/RoomItem/index.js
index d56194f8b..0b64437c6 100644
--- a/app/presentation/RoomItem/index.js
+++ b/app/presentation/RoomItem/index.js
@@ -117,7 +117,9 @@ class RoomItemContainer extends React.Component {
 
 	onLongPress = () => {
 		const { item, onLongPress } = this.props;
-		return onLongPress(item);
+		if (onLongPress) {
+			return onLongPress(item);
+		}
 	}
 
 	render() {
diff --git a/storybook/stories/RoomItem.js b/storybook/stories/RoomItem.js
index 025fbf7f5..c13eaa4d2 100644
--- a/storybook/stories/RoomItem.js
+++ b/storybook/stories/RoomItem.js
@@ -44,6 +44,9 @@ stories.add('Basic', () => (
 	<RoomItem />
 ));
 
+stories.add('Touch', () => (
+	<RoomItem onPress={() => alert('on press')} onLongPress={() => alert('on long press')} />
+));
 
 stories.add('User', () => (
 	<>