Add a custom button to JSQMessage cell

Question

I have to build a UI same as below

The UI i have successfully developed is

The UI i have developed is using all existing controls and classes, i have not customized any cell for this UI.

Now i am stuck to add a DIMOND button with count appearing at the most left side (for received messages).

Is there anyway i can add this button and label programmatically without customizing the complete cell.

 override func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {

        let message = messageList[indexPath.item]
            let cell = super.collectionView(collectionView, cellForItemAt: indexPath) as! JSQMessagesCollectionViewCell
            cell.textView?.textColor = UIColor.black
            if message.senderId != strMemberID {
                // configure avatar
                cell.avatarImageView.isHidden = false
                cell.avatarImageView.layer.cornerRadius = CGFloat(avatarImageDiameter/2)
                cell.avatarImageView.clipsToBounds = true

                let profilePictureURL = "\(quickChatUserProfilePictureBaseUrl)/\(message.senderId!)_m.jpg"

                cell.avatarImageView.sd_setImage(with: URL(string: profilePictureURL), placeholderImage: UIImage(named: kIndividualChatICon))
            } else {
                // add gesture only for group chat and on sender chat bubbles
            }
            if (message.messageType == MessageType.TextMessage.rawValue) {
                 cell.textView.attributedText = getAttributedMessageText(message: message)
            } else if (message.messageType == MessageType.NotificationMessage.rawValue) {
                cell.avatarImageView.isHidden = true
            }
           cell.textView?.linkTextAttributes = [NSForegroundColorAttributeName : QuickchatTheme.getHyperLinksColorForChatBubbles()]
            return cell
    }