import React, { Component } from "react";
import _ from "lodash";
import { TouchableOpacity, View } from "react-native";
import { Text } from "./Text";
import { connect } from "react-redux";
import moment from "moment";
import { COLOUR_GREEN, TEXT_DARK, TEXT_LIGHT, getMainBrandingColourFromState, getLightBrandingColourFromState } from "../colours";
import { Services } from "../config";
import { ProfilePic } from "./ProfilePic";
import { InlineButton } from "./InlineButton";
import { Spinner } from "./Spinner";
import { followerActions } from "../apis";
import { addFollower } from "../actions";
class UserListing extends Component {
  constructor(props) {
    super(props);
    this.state = {
      pending: false
    };
  }
  onPress() {
    const {
      hidden
    } = this.props.me;
    if (hidden && _.includes(hidden, "people")) return;
    if (this.props.onPress) {
      this.props.onPress();
      return;
    }
    const user = {
      ...this.props.user
    };
    if (_.isUndefined(user.key)) {
      user.key = user.userId;
    }
    if (_.isUndefined(user.id)) {
      user.id = user.userId;
    }
    Services.navigation.navigate("profile", {
      user
    });
  }
  onFollowUser() {
    const userToSave = {
      profilePic: this.props.user.profilePic,
      displayName: this.props.user.displayName,
      id: this.props.user.id
    };
    this.setState({
      pending: true
    });
    followerActions.addFollower(userToSave, this.props.myId).then(() => {
      this.props.addFollower(userToSave);
    }).catch(() => {
      this.setState({
        pending: false
      });
    });
  }
  getTimeText(input) {
    const gug = moment.unix(input);
    if (gug.isBefore(moment().local().startOf("d"))) {
      return gug.format("D MMM");
    }
    return gug.format("h:mma");
  }
  getProfilePic() {
    if (this.props.user.profilePic == null) return null;
    let profilePic = this.props.user.profilePic;
    if (!_.isUndefined(this.props.user.profilePicThumb) && !_.isEmpty(this.props.user.profilePicThumb)) {
      profilePic = this.props.user.profilePicThumb;
    } else if (this.props.user.profilePic.indexOf(".amazonaws.com/1400/") > -1) {
      profilePic = profilePic.replace("/1400/", "/300/");
    }
    return profilePic;
  }
  getLastMessage(chat) {
    if (typeof chat.lastMessage === "string") {
      return chat.lastMessage;
    }
    // TODO recognise user name of last message
    return chat.lastMessage.text;
  }
  renderFollowButton() {
    if (this.props.user.privateChat) {
      return /*#__PURE__*/React.createElement(View, {
        style: {
          justifyContent: "flex-start"
        }
      }, /*#__PURE__*/React.createElement(Text, {
        style: [styles.chatTimeStamp, this.props.user.unread > 0 && {
          color: TEXT_DARK,
          fontFamily: "sf-bold"
        }]
      }, this.getTimeText(this.props.user.Changed)), /*#__PURE__*/React.createElement(View, {
        style: [{
          flexDirection: "row-reverse",
          marginTop: 2
        }, this.props.user.unread === 0 && {
          opacity: 0
        }]
      }, /*#__PURE__*/React.createElement(View, {
        style: styles.counter
      }, /*#__PURE__*/React.createElement(Text, {
        style: styles.counterText
      }, this.props.user.unread))));
    }
    if (!this.props.showFriendsButton) {
      return null;
    }

    // self
    if (this.props.myId === this.props.user.id) {
      return null;
    }

    // already following
    if (this.props.isFollowing) {
      return /*#__PURE__*/React.createElement(InlineButton, {
        color: this.props.colourBrandingLight,
        style: styles.friendsButton,
        textStyle: {
          color: this.props.colourBrandingMain
        },
        disabled: true
      }, "Friends");
    }

    // in process of following
    if (this.state.pending) {
      return /*#__PURE__*/React.createElement(InlineButton, {
        style: [styles.friendsButton, {
          borderColor: this.props.colourBrandingMain,
          borderWidth: 1
        }],
        disabled: true,
        noText: true
      }, /*#__PURE__*/React.createElement(Spinner, {
        size: "small",
        color: this.props.colourBrandingMain
      }));
    }

    // not following yet
    return /*#__PURE__*/React.createElement(InlineButton, {
      onPress: this.onFollowUser.bind(this),
      color: "#fff",
      style: [styles.friendsButton, {
        borderColor: this.props.colourBrandingMain,
        borderWidth: 1
      }],
      textStyle: {
        color: this.props.colourBrandingMain
      }
    }, "Add friend");
  }
  renderStatusText() {
    if (!this.props.statusText) {
      return null;
    }
    return /*#__PURE__*/React.createElement(Text, {
      style: styles.statusText
    }, this.props.statusText);
  }
  render() {
    return /*#__PURE__*/React.createElement(View, {
      style: this.props.containerStyle
    }, /*#__PURE__*/React.createElement(TouchableOpacity, {
      activeOpacity: 0.9,
      onPress: this.onPress.bind(this),
      disabled: this.props.onPressDisabled
    }, /*#__PURE__*/React.createElement(View, {
      style: [styles.listItem, this.props.listItemStyle]
    }, this.renderStatusText(), /*#__PURE__*/React.createElement(ProfilePic, {
      ProfilePic: this.getProfilePic(),
      Diameter: 42
    }), /*#__PURE__*/React.createElement(View, {
      style: [styles.fill, styles.flexRowReverse, styles.alignCenter]
    }, this.props.rightContent, this.renderFollowButton(), /*#__PURE__*/React.createElement(View, {
      style: styles.fill
    }, /*#__PURE__*/React.createElement(View, {
      style: styles.listItemTextContainer
    }, /*#__PURE__*/React.createElement(Text, {
      style: styles.contactName,
      numberOfLines: 1
    }, this.props.user.displayName), this.props.user.privateChat && /*#__PURE__*/React.createElement(Text, {
      style: styles.chatLastMessage,
      numberOfLines: 1
    }, this.getLastMessage(this.props.user)), this.props.subText))))));
  }
}
const styles = {
  listItem: {
    paddingVertical: 8,
    paddingHorizontal: 16,
    justifyContent: "flex-start",
    flexDirection: "row",
    position: "relative"
  },
  listItemTextContainer: {
    flex: 1,
    flexDirection: "column",
    justifyContent: "space-around",
    paddingLeft: 16
  },
  contactName: {
    fontSize: 15,
    fontFamily: "sf-semibold",
    backgroundColor: "rgba(255,255,255,0)",
    color: TEXT_DARK
  },
  statusText: {
    position: "absolute",
    top: 0,
    left: 82,
    fontFamily: "sf-semibold",
    fontSize: 12,
    color: TEXT_LIGHT
  },
  fill: {
    flex: 1
  },
  alignCenter: {
    alignItems: "center"
  },
  flexRowReverse: {
    flexDirection: "row-reverse"
  },
  friendsButton: {
    width: 100
  },
  counter: {
    borderRadius: 10,
    height: 20,
    justifyContent: "center",
    minWidth: 20,
    paddingHorizontal: 4,
    backgroundColor: COLOUR_GREEN
  },
  counterText: {
    color: "#fff",
    fontSize: 12,
    fontFamily: "sf-semibold",
    textAlign: "center"
  },
  chatTimeStamp: {
    fontSize: 10,
    fontFamily: "sf-semibold",
    color: TEXT_LIGHT
  },
  chatLastMessage: {
    fontSize: 13,
    fontFamily: "sf-medium",
    color: TEXT_LIGHT,
    marginRight: 5
  }
};
const mapStateToProps = state => {
  return {
    me: state.user,
    colourBrandingMain: getMainBrandingColourFromState(state),
    colourBrandingLight: getLightBrandingColourFromState(state)
  };
};
export default connect(mapStateToProps, {
  addFollower
})(UserListing);
//# sourceMappingURL=UserListing.js.map