Follow Button Gist

gistfile1.txt

const FollowButton: React.FC<IProps> = (props) => {
    
    const contributorUUIDList = useMemo(() => props.conversation.contributors.map(e => e.uuid), [props.conversation]);
    if (!props.user.token) {
        return (<Button><Link to="/user/registration/">Follow</Link></Button>)
    }

    if (props.user.token && contributorUUIDList.indexOf(props.user.uuid) !== -1) {
        return <div></div>
    }

    const renderButton = (user, conversation) => {
        if (!user.token) return(<Link to="/user/login/"><Button>Follow</Button></Link>);
        if (user.followed_conversations.indexOf(conversation.uuid) !== -1) return(
            <ButtonTwo onClick={() => props.removeFollower(props.conversation)}>Unfollow</ButtonTwo>
        )
        return(<Button onClick={() => props.addFollower(props.conversation)}>Follow</Button>)
    }

    return(
        <>
            {renderButton(props.user, props.conversation)}
        </>
    )
}

export default FollowButton;