Make PhotoPanel bound

mobile/src/ui/PhotoPanel.js

@@ -1,104 +0,0 @@
-import React, { Component } from "react"
-import {
-  StyleSheet,
-  Text,
-  View,
-  Image,
-  TouchableOpacity,
-  Dimensions,
-} from "react-native"
-import { Icon } from "."
-import ImagePicker from "react-native-image-picker"
-import autobind from "autobind-decorator"
-
-const getScreenPortraitDimensions = () => {
-  const { width, height } = Dimensions.get("window")
-
-  return {
-    screenWidth: Math.min(width, height),
-    screenHeight: Math.max(width, height),
-  }
-}
-
-export class PhotoPanel extends Component {
-  @autobind
-  handlePhotoPress() {
-    ImagePicker.showImagePicker(
-      {
-        title: "Select Photo",
-        storageOptions: {
-          skipBackup: true,
-          path: "photos",
-        },
-      },
-      (response) => {
-        console.log("Response = ", response)
-
-        if (response.didCancel) {
-          console.log("User cancelled image picker")
-        } else if (response.error) {
-          console.log("ImagePicker Error: ", response.error)
-        } else if (response.customButton) {
-          console.log("User tapped custom button: ", response.customButton)
-        } else {
-          // You can also display the image using data:
-          // let source = { uri: 'data:image/jpeg;base64,' + response.data };
-          console.log(response)
-        }
-      }
-    )
-  }
-
-  render() {
-    const { screenWidth, screenHeight } = getScreenPortraitDimensions()
-    const photoWidth = screenHeight / 4
-    const photoHeight = screenWidth / 4
-    const numRows = 2
-    const numCols = 2
-    const rowPadding = 10
-
-    return (
-      <View
-        style={{
-          flexDirection: "column",
-          justifyContent: "space-between",
-        }}>
-        <Text
-          style={{
-            fontSize: 14,
-            marginBottom: 4,
-          }}>
-          Pictures:
-        </Text>
-        {Array.from(new Array(numRows), (x, i) => (
-          <View
-            key={"r" + i.toString()}
-            style={{
-              flexDirection: "row",
-              justifyContent: "space-between",
-              width: "100%",
-              height: photoHeight + rowPadding,
-              paddingTop: rowPadding / 2,
-              paddingBottom: rowPadding / 2,
-            }}>
-            {Array.from(new Array(numCols), (y, j) => (
-              <TouchableOpacity
-                key={"r" + i.toString() + "c" + j.toString()}
-                style={{
-                  width: photoWidth,
-                  height: photoHeight,
-                  borderWidth: 2,
-                  borderColor: "gray",
-                  borderRadius: 4,
-                  justifyContent: "center",
-                }}
-                onPress={this.handlePhotoPress}>
-                <Icon name="add" size={24} style={{ alignSelf: "center" }} />
-              </TouchableOpacity>
-            ))}
-          </View>
-        ))}
-      </View>
-    )
-  }
-}