Add doodle feature back (#2652)

This commit is contained in:
Claire 2024-02-27 21:27:51 +01:00 committed by GitHub
parent a25c900a08
commit c19787f3f4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 44 additions and 9 deletions

View file

@ -7,10 +7,14 @@ import ImmutablePureComponent from 'react-immutable-pure-component';
import { connect } from 'react-redux';
import PhotoLibraryIcon from '@/material-icons/400-20px/photo_library.svg?react';
import { IconButton } from 'flavours/glitch/components/icon_button';
import BrushIcon from '@/material-icons/400-24px/brush.svg?react';
import UploadFileIcon from '@/material-icons/400-24px/upload_file.svg?react';
import { DropdownIconButton } from './dropdown_icon_button';
const messages = defineMessages({
upload: { id: 'upload_button.label', defaultMessage: 'Add images, a video or an audio file' },
doodle: { id: 'compose.attach.doodle', defaultMessage: 'Draw something' },
});
const makeMapStateToProps = () => {
@ -21,16 +25,12 @@ const makeMapStateToProps = () => {
return mapStateToProps;
};
const iconStyle = {
height: null,
lineHeight: '27px',
};
class UploadButton extends ImmutablePureComponent {
static propTypes = {
disabled: PropTypes.bool,
onSelectFile: PropTypes.func.isRequired,
onDoodleOpen: PropTypes.func.isRequired,
style: PropTypes.object,
resetFileKey: PropTypes.number,
acceptContentTypes: ImmutablePropTypes.listOf(PropTypes.string).isRequired,
@ -43,8 +43,12 @@ class UploadButton extends ImmutablePureComponent {
}
};
handleClick = () => {
this.fileElement.click();
handleSelect = (value) => {
if (value === 'upload') {
this.fileElement.click();
} else {
this.props.onDoodleOpen();
}
};
setRef = (c) => {
@ -56,9 +60,32 @@ class UploadButton extends ImmutablePureComponent {
const message = intl.formatMessage(messages.upload);
const options = [
{
icon: 'cloud-upload',
iconComponent: UploadFileIcon,
value: 'upload',
text: intl.formatMessage(messages.upload),
},
{
icon: 'paint-brush',
iconComponent: BrushIcon,
value: 'doodle',
text: intl.formatMessage(messages.doodle),
},
];
return (
<div className='compose-form__upload-button'>
<IconButton icon='paperclip' iconComponent={PhotoLibraryIcon} title={message} disabled={disabled} onClick={this.handleClick} className='compose-form__upload-button-icon' size={18} inverted style={iconStyle} />
<DropdownIconButton
icon='paperclip'
iconComponent={PhotoLibraryIcon}
title={message}
disabled={disabled}
onChange={this.handleSelect}
value='upload'
options={options}
/>
<label>
<span style={{ display: 'none' }}>{message}</span>
<input

View file

@ -1,6 +1,7 @@
import { connect } from 'react-redux';
import { uploadCompose } from '../../../actions/compose';
import { openModal } from '../../../actions/modal';
import UploadButton from '../components/upload_button';
const mapStateToProps = state => ({
@ -14,6 +15,12 @@ const mapDispatchToProps = dispatch => ({
dispatch(uploadCompose(files));
},
onDoodleOpen() {
dispatch(openModal({
modalType: 'DOODLE',
modalProps: { noEsc: true, noClose: true },
}));
},
});
export default connect(mapStateToProps, mapDispatchToProps)(UploadButton);

View file

@ -14,6 +14,7 @@
"column_subheading.lists": "Lists",
"column_subheading.navigation": "Navigation",
"community.column_settings.allow_local_only": "Show local-only toots",
"compose.attach.doodle": "Draw something",
"compose.change_federation": "Change federation settings",
"compose.content-type.change": "Change advanced formatting options",
"compose.content-type.html": "HTML",