140 lines
3.6 KiB
JavaScript
140 lines
3.6 KiB
JavaScript
import React, { PureComponent } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { defineMessages, injectIntl } from 'react-intl';
|
|
import BBBMenu from '/imports/ui/components/common/menu/component';
|
|
import Trigger from '/imports/ui/components/common/control-header/right/component';
|
|
import Service from './service';
|
|
import { uniqueId } from '/imports/utils/string-utils';
|
|
|
|
const DEBOUNCE_TIMEOUT = 15000;
|
|
const NOTES_CONFIG = Meteor.settings.public.notes;
|
|
const NOTES_IS_PINNABLE = NOTES_CONFIG.pinnable;
|
|
|
|
const intlMessages = defineMessages({
|
|
convertAndUploadLabel: {
|
|
id: 'app.notes.notesDropdown.covertAndUpload',
|
|
description: 'Export shared notes as a PDF and upload to the main room',
|
|
},
|
|
pinNotes: {
|
|
id: 'app.notes.notesDropdown.pinNotes',
|
|
description: 'Label for pin shared notes button',
|
|
},
|
|
options: {
|
|
id: 'app.notes.notesDropdown.notesOptions',
|
|
description: 'Label for shared notes options',
|
|
},
|
|
});
|
|
|
|
const propTypes = {
|
|
intl: PropTypes.shape({
|
|
formatMessage: PropTypes.func.isRequired,
|
|
}).isRequired,
|
|
amIPresenter: PropTypes.bool.isRequired,
|
|
isRTL: PropTypes.bool.isRequired,
|
|
};
|
|
|
|
class NotesDropdown extends PureComponent {
|
|
constructor(props) {
|
|
super(props);
|
|
|
|
this.state = {
|
|
converterButtonDisabled: false,
|
|
};
|
|
}
|
|
|
|
setConverterButtonDisabled(value) {
|
|
return this.setState({ converterButtonDisabled: value });
|
|
}
|
|
|
|
getAvailableActions() {
|
|
const {
|
|
intl,
|
|
amIPresenter,
|
|
presentations,
|
|
stopExternalVideoShare,
|
|
} = this.props;
|
|
|
|
const { converterButtonDisabled } = this.state;
|
|
|
|
const uploadIcon = 'upload';
|
|
const pinIcon = 'presentation';
|
|
|
|
this.menuItems = [];
|
|
|
|
if (amIPresenter) {
|
|
this.menuItems.push(
|
|
{
|
|
key: uniqueId('notes-option-'),
|
|
icon: uploadIcon,
|
|
dataTest: 'moveNotesToWhiteboard',
|
|
label: intl.formatMessage(intlMessages.convertAndUploadLabel),
|
|
disabled: converterButtonDisabled,
|
|
onClick: () => {
|
|
this.setConverterButtonDisabled(true);
|
|
setTimeout(() => this.setConverterButtonDisabled(false), DEBOUNCE_TIMEOUT);
|
|
return Service.convertAndUpload(presentations);
|
|
},
|
|
},
|
|
);
|
|
}
|
|
|
|
if (amIPresenter && NOTES_IS_PINNABLE) {
|
|
this.menuItems.push(
|
|
{
|
|
key: uniqueId('notes-option-'),
|
|
icon: pinIcon,
|
|
dataTest: 'pinNotes',
|
|
label: intl.formatMessage(intlMessages.pinNotes),
|
|
onClick: () => {
|
|
Service.pinSharedNotes(stopExternalVideoShare);
|
|
},
|
|
},
|
|
);
|
|
}
|
|
|
|
return this.menuItems;
|
|
}
|
|
|
|
render() {
|
|
const {
|
|
intl,
|
|
isRTL,
|
|
} = this.props;
|
|
|
|
const actions = this.getAvailableActions();
|
|
|
|
if (actions.length === 0) return null;
|
|
|
|
return (
|
|
<>
|
|
<BBBMenu
|
|
trigger={
|
|
<Trigger
|
|
data-test="notesOptionsMenu"
|
|
icon="more"
|
|
label={intl.formatMessage(intlMessages.options)}
|
|
aria-label={intl.formatMessage(intlMessages.options)}
|
|
onClick={() => null}
|
|
/>
|
|
}
|
|
opts={{
|
|
id: 'notes-options-dropdown',
|
|
keepMounted: true,
|
|
transitionDuration: 0,
|
|
elevation: 3,
|
|
getcontentanchorel: null,
|
|
fullwidth: 'true',
|
|
anchorOrigin: { vertical: 'bottom', horizontal: isRTL ? 'right' : 'left' },
|
|
transformOrigin: { vertical: 'top', horizontal: isRTL ? 'right' : 'left' },
|
|
}}
|
|
actions={actions}
|
|
/>
|
|
</>
|
|
);
|
|
}
|
|
}
|
|
|
|
NotesDropdown.propTypes = propTypes;
|
|
|
|
export default injectIntl(NotesDropdown);
|