Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added custom buttons option to MessageBox #184

Open
wants to merge 3 commits into
base: master
Choose a base branch
from

Conversation

MaxNoetzold
Copy link

@MaxNoetzold MaxNoetzold commented Feb 6, 2023

Basically, I did two things in this fork:

  1. I made the positions of the MessageBox buttons (reply, delete, forward) dynamic using css. This now allows any number of buttons to be displayed without irregular spacing between them. There is now a wrapper (rce-mbox-btn-list) for all buttons. The buttons themselves are also wrapped again (rce-mbox-btn-container), so they are displayed next to each other in one line.
  2. I added the option to add ReactNodes as customButtons array to the MessageBox. These will then be displayed behind the other buttons set. No additional style is applied to them, as I wanted to have a customizable solution. But we can also think about solving it in a different way.
.rce-mbox-btn-list-right {
  left: -12px;
  transform: translateX(-100%);
}
.rce-mbox-btn-list {
  position: absolute;
  top: 50%;
}

.rce-mbox-btn-container {
  display: inline-block;
  width: 30px;
  height: 30px;
  margin-left: 3px;
  margin-right: 3px;
}

Example of a very basic additional button (added sometimes in MessageListExample.tsx:

if (token() > 7) {
  newMsg.customButtons = [
    <div
      onClick={() => {
        console.log('custom button click')
      }}
    >
      <MdInfo />
    </div>,
  ]
}

infobutton

@MaxNoetzold
Copy link
Author

Is it possiblet to get this merged? I would resolve the conflicts in that case. @emregudur
i state again that this feature is an optin feature and doesnt change any functionality of existing code

@emregudur
Copy link
Contributor

@MaxNoetzold I will make custom buttons for MessageBox asap

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants