message: Refactors UI for settings screen.
diff: @@ -6,26 +6,20 @@ import { Image, NativeModules, TouchableWithoutFeedback } from "react-native"
  export default class MyProfile extends React.Component {
  render() {
  return (
  - <Box px={2} py={1} mx={2} my={3}>
  + <>
  + <Box px={2} py={2} mx={2} mb={2} mt={2}>
  <Flex alignItems="center">
  <Serif size="5">Settings</Serif>
  </Flex>
  - <Separator m={2} />
  + </Box>
  + <Separator />
  + <Box px={2} py={1} mx={2} mt={2}>
  <Join separator={<Spacer mb={2} />}>
  - <TouchableWithoutFeedback>
  - <Flex flexDirection="row" justifyContent="space-between" alignItems="center">
  - <Serif size="3t">Send Feedback</Serif>
  - <Image source={require("../../../../images/horizontal_chevron.png")} />
  - </Flex>
  - </TouchableWithoutFeedback>
  - <TouchableWithoutFeedback
  + <Row title="Send Feedback" />
  + <Row
  + title="Personal Data Request"
  onPress={() => SwitchBoard.presentNavigationViewController(this, "privacy-request")}
  - >
  - <Flex flexDirection="row" justifyContent="space-between" alignItems="center">
  - <Serif size="3t">Personal Data Request</Serif>
  - <Image source={require("../../../../images/horizontal_chevron.png")} />
  - </Flex>
  - </TouchableWithoutFeedback>
  + />
  <Button
  variant="primaryBlack"
  block
  @@ -37,19 +31,16 @@ export default class MyProfile extends React.Component {
  </Button>
  </Join>
  </Box>
  + </>
  )
  }
  }
  -// <>
  -// <Serif>TODO: Implement this according to designs. See: MX-141.</Serif>
  -// <TouchableWithoutFeedback onPress={() => SwitchBoard.presentNavigationViewController(this, "privacy-request")}>
  -// <Serif>Take me to the new privacy view controller</Serif>
  -// </TouchableWithoutFeedback>
  -// <Button
  -// variant="primaryBlack"
  -// onPress={() => NativeModules.ARNotificationsManager.postNotificationName("ARUserRequestedLogout", {})}
  -// >
  -// Logout
  -// </Button>
  -// </>
  +const Row: React.FC<{ title: string; onPress?: () => void }> = ({ title, onPress }) => (
  + <TouchableWithoutFeedback onPress={onPress}>
  + <Flex flexDirection="row" justifyContent="space-between" alignItems="center">
  + <Serif size="3t">{title}</Serif>
  + <Image source={require("../../../../images/horizontal_chevron.png")} />
  + </Flex>
  + </TouchableWithoutFeedback>
  +)
  