random-mirrors/gab-social
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Beginning to reformat propTypes and set redux, intl functions to end of component files

Browse Source 
• Beginning:
- to reformat propTypes and set redux, intl functions to end of component files
This commit is contained in:
mgabdev
2020-08-17 17:06:22 -05:00
parent 0a331ad389
commit 46a0cbca7d
28 changed files with 650 additions and 645 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
app/javascript/gabsocial/features/compose/components/compose_extra_button.js
View File

@@ -5,16 +5,7 @@ import Button from '../../../components/button'
const cx = classNames.bind(_s)
export default class ComposeExtraButton extends React.PureComponent {
static propTypes = {
title: PropTypes.string,
disabled: PropTypes.bool,
onClick: PropTypes.func,
icon: PropTypes.string,
small: PropTypes.bool,
active: PropTypes.bool,
buttonRef: PropTypes.func,
}
class ComposeExtraButton extends React.PureComponent {
render() {
const {
@@ -79,4 +70,17 @@ export default class ComposeExtraButton extends React.PureComponent {
</div>
)
}
}
}
ComposeExtraButton.propTypes = {
title: PropTypes.string,
disabled: PropTypes.bool,
onClick: PropTypes.func,
icon: PropTypes.string,
small: PropTypes.bool,
active: PropTypes.bool,
buttonRef: PropTypes.func,
}
export default ComposeExtraButton

100
app/javascript/gabsocial/features/compose/components/compose_form.js
View File

@@ -41,8 +41,6 @@ const messages = defineMessages({
schedulePost: { id: 'compose_form.schedule_post', defaultMessage: 'Schedule Post' },
})
export default
@injectIntl
class ComposeForm extends ImmutablePureComponent {
static contextTypes = {
@@ -53,53 +51,6 @@ class ComposeForm extends ImmutablePureComponent {
composeFocused: false,
}
static propTypes = {
intl: PropTypes.object.isRequired,
edit: PropTypes.bool,
isMatch: PropTypes.bool,
text: PropTypes.string.isRequired,
markdown: PropTypes.string,
suggestions: ImmutablePropTypes.list,
account: ImmutablePropTypes.map.isRequired,
status: ImmutablePropTypes.map,
spoiler: PropTypes.bool,
privacy: PropTypes.string,
spoilerText: PropTypes.string,
focusDate: PropTypes.instanceOf(Date),
caretPosition: PropTypes.number,
preselectDate: PropTypes.instanceOf(Date),
isSubmitting: PropTypes.bool,
isChangingUpload: PropTypes.bool,
isUploading: PropTypes.bool,
onChange: PropTypes.func.isRequired,
onSubmit: PropTypes.func.isRequired,
onClearSuggestions: PropTypes.func.isRequired,
onFetchSuggestions: PropTypes.func.isRequired,
onSuggestionSelected: PropTypes.func.isRequired,
onChangeSpoilerText: PropTypes.func.isRequired,
onPaste: PropTypes.func.isRequired,
onPickEmoji: PropTypes.func.isRequired,
showSearch: PropTypes.bool,
anyMedia: PropTypes.bool,
shouldCondense: PropTypes.bool,
autoFocus: PropTypes.bool,
groupId: PropTypes.string,
isModalOpen: PropTypes.bool,
scheduledAt: PropTypes.instanceOf(Date),
setScheduledAt: PropTypes.func.isRequired,
replyToId: PropTypes.string,
reduxReplyToId: PropTypes.string,
hasPoll: PropTypes.bool,
selectedGifSrc: PropTypes.string,
isPro: PropTypes.bool,
hidePro: PropTypes.bool,
autoJoinGroup: PropTypes.bool,
}
static defaultProps = {
showSearch: false,
};
handleChange = (e, selectionStart) => {
this.props.onChange(e.target.value, e.target.markdown, this.props.replyToId, selectionStart)
}
@@ -528,4 +479,53 @@ class ComposeForm extends ImmutablePureComponent {
)
}
}
}
ComposeForm.propTypes = {
intl: PropTypes.object.isRequired,
edit: PropTypes.bool,
isMatch: PropTypes.bool,
text: PropTypes.string.isRequired,
markdown: PropTypes.string,
suggestions: ImmutablePropTypes.list,
account: ImmutablePropTypes.map.isRequired,
status: ImmutablePropTypes.map,
spoiler: PropTypes.bool,
privacy: PropTypes.string,
spoilerText: PropTypes.string,
focusDate: PropTypes.instanceOf(Date),
caretPosition: PropTypes.number,
preselectDate: PropTypes.instanceOf(Date),
isSubmitting: PropTypes.bool,
isChangingUpload: PropTypes.bool,
isUploading: PropTypes.bool,
onChange: PropTypes.func.isRequired,
onSubmit: PropTypes.func.isRequired,
onClearSuggestions: PropTypes.func.isRequired,
onFetchSuggestions: PropTypes.func.isRequired,
onSuggestionSelected: PropTypes.func.isRequired,
onChangeSpoilerText: PropTypes.func.isRequired,
onPaste: PropTypes.func.isRequired,
onPickEmoji: PropTypes.func.isRequired,
showSearch: PropTypes.bool,
anyMedia: PropTypes.bool,
shouldCondense: PropTypes.bool,
autoFocus: PropTypes.bool,
groupId: PropTypes.string,
isModalOpen: PropTypes.bool,
scheduledAt: PropTypes.instanceOf(Date),
setScheduledAt: PropTypes.func.isRequired,
replyToId: PropTypes.string,
reduxReplyToId: PropTypes.string,
hasPoll: PropTypes.bool,
selectedGifSrc: PropTypes.string,
isPro: PropTypes.bool,
hidePro: PropTypes.bool,
autoJoinGroup: PropTypes.bool,
}
ComposeForm.defaultProps = {
showSearch: false,
}
export default injectIntl(ComposeForm)

57
app/javascript/gabsocial/features/compose/components/emoji_picker_button.js
View File

@@ -5,37 +5,8 @@ import { defineMessages, injectIntl } from 'react-intl'
import { openPopover } from '../../../actions/popover'
import ComposeExtraButton from './compose_extra_button'
const messages = defineMessages({
emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' },
})
const mapStateToProps = (state) => ({
active: state.getIn(['popover', 'popoverType']) === 'EMOJI_PICKER',
})
const mapDispatchToProps = (dispatch) => ({
onClick(targetRef) {
dispatch(openPopover('EMOJI_PICKER', {
targetRef,
}))
},
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class EmojiPickerButton extends React.PureComponent {
static propTypes = {
intl: PropTypes.object.isRequired,
onClick: PropTypes.func.isRequired,
active: PropTypes.bool,
small: PropTypes.bool,
isMatch: PropTypes.bool,
}
handleClick = (e) => {
e.preventDefault()
this.props.onClick(this.button)
@@ -66,3 +37,31 @@ class EmojiPickerButton extends React.PureComponent {
}
}
const messages = defineMessages({
emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' },
})
const mapStateToProps = (state) => ({
active: state.getIn(['popover', 'popoverType']) === 'EMOJI_PICKER',
})
const mapDispatchToProps = (dispatch) => ({
onClick(targetRef) {
dispatch(openPopover('EMOJI_PICKER', {
targetRef,
}))
},
})
EmojiPickerButton.propTypes = {
intl: PropTypes.object.isRequired,
onClick: PropTypes.func.isRequired,
active: PropTypes.bool,
small: PropTypes.bool,
isMatch: PropTypes.bool,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(EmojiPickerButton))

67
app/javascript/gabsocial/features/compose/components/expires_post_button.js
View File

@@ -8,42 +8,8 @@ import { me } from '../../../initial_state'
import { POPOVER_STATUS_EXPIRATION_OPTIONS } from '../../../constants'
import ComposeExtraButton from './compose_extra_button'
const messages = defineMessages({
expires: { id: 'expiration.title', defaultMessage: 'Add status expiration' },
})
const mapStateToProps = (state) => ({
hasScheduledAt: !!state.getIn(['compose', 'scheduled_at']),
active: !!state.getIn(['compose', 'expires_at']) || state.getIn(['popover', 'popoverType']) === POPOVER_STATUS_EXPIRATION_OPTIONS,
isPro: state.getIn(['accounts', me, 'is_pro']),
})
const mapDispatchToProps = (dispatch) => ({
onOpenExpirationPopover(targetRef) {
dispatch(openPopover(POPOVER_STATUS_EXPIRATION_OPTIONS, {
targetRef,
}))
},
onOpenProUpgradeModal() {
dispatch(openModal('PRO_UPGRADE'))
},
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class ExpiresPostButton extends React.PureComponent {
static propTypes = {
active: PropTypes.bool.isRequired,
intl: PropTypes.object.isRequired,
isPro: PropTypes.bool,
hasScheduledAt: PropTypes.bool,
onOpenProUpgradeModal: PropTypes.func.isRequired,
onOpenExpirationPopover: PropTypes.func.isRequired,
small: PropTypes.bool,
}
handleToggle = () => {
if (!this.props.isPro) {
this.props.onOpenProUpgradeModal()
@@ -79,3 +45,36 @@ class ExpiresPostButton extends React.PureComponent {
}
}
const messages = defineMessages({
expires: { id: 'expiration.title', defaultMessage: 'Add status expiration' },
})
const mapStateToProps = (state) => ({
hasScheduledAt: !!state.getIn(['compose', 'scheduled_at']),
active: !!state.getIn(['compose', 'expires_at']) || state.getIn(['popover', 'popoverType']) === POPOVER_STATUS_EXPIRATION_OPTIONS,
isPro: state.getIn(['accounts', me, 'is_pro']),
})
const mapDispatchToProps = (dispatch) => ({
onOpenExpirationPopover(targetRef) {
dispatch(openPopover(POPOVER_STATUS_EXPIRATION_OPTIONS, {
targetRef,
}))
},
onOpenProUpgradeModal() {
dispatch(openModal('PRO_UPGRADE'))
},
})
ExpiresPostButton.propTypes = {
active: PropTypes.bool.isRequired,
intl: PropTypes.object.isRequired,
isPro: PropTypes.bool,
hasScheduledAt: PropTypes.bool,
onOpenProUpgradeModal: PropTypes.func.isRequired,
onOpenExpirationPopover: PropTypes.func.isRequired,
small: PropTypes.bool,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(ExpiresPostButton))

30
app/javascript/gabsocial/features/compose/components/gif_form.js
View File

@@ -4,23 +4,8 @@ import { connect } from 'react-redux'
import { clearSelectedGif } from '../../../actions/tenor'
import Image from '../../../components/image'
const mapDispatchToProps = (dispatch) => ({
onClearSelectedGif() {
dispatch(clearSelectedGif())
},
})
export default
@connect(null, mapDispatchToProps)
class GifForm extends React.PureComponent {
static propTypes = {
onClearSelectedGif: PropTypes.func.isRequired,
replyToId: PropTypes.string,
small: PropTypes.bool,
selectedGifSrc: PropTypes.string.isRequired,
}
render () {
const {
selectedGifSrc,
@@ -43,3 +28,18 @@ class GifForm extends React.PureComponent {
}
}
const mapDispatchToProps = (dispatch) => ({
onClearSelectedGif() {
dispatch(clearSelectedGif())
},
})
GifForm.propTypes = {
onClearSelectedGif: PropTypes.func.isRequired,
replyToId: PropTypes.string,
small: PropTypes.bool,
selectedGifSrc: PropTypes.string.isRequired,
}
export default connect(null, mapDispatchToProps)(GifForm)

55
app/javascript/gabsocial/features/compose/components/gif_selector_button.js
View File

@@ -5,36 +5,8 @@ import { injectIntl, defineMessages } from 'react-intl'
import ComposeExtraButton from './compose_extra_button'
import { openModal } from '../../../actions/modal'
const messages = defineMessages({
marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
title: { id: 'compose_form.gif.title', defaultMessage: 'Insert gif' },
})
const mapStateToProps = (state) => ({
active: !!state.getIn(['compose', 'gif']) || state.getIn(['modal', 'modalType']) === 'GIF_PICKER',
})
const mapDispatchToProps = (dispatch) => ({
onClick() {
dispatch(openModal('GIF_PICKER'))
},
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class GifSelectorButton extends React.PureComponent {
static propTypes = {
intl: PropTypes.object.isRequired,
onClick: PropTypes.func.isRequired,
active: PropTypes.bool,
small: PropTypes.bool,
}
handleClick = (e) => {
e.preventDefault()
this.props.onClick(this.button)
@@ -60,3 +32,30 @@ class GifSelectorButton extends React.PureComponent {
}
}
const messages = defineMessages({
marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
title: { id: 'compose_form.gif.title', defaultMessage: 'Insert gif' },
})
const mapStateToProps = (state) => ({
active: !!state.getIn(['compose', 'gif']) || state.getIn(['modal', 'modalType']) === 'GIF_PICKER',
})
const mapDispatchToProps = (dispatch) => ({
onClick() {
dispatch(openModal('GIF_PICKER'))
},
})
GifSelectorButton.propTypes = {
intl: PropTypes.object.isRequired,
onClick: PropTypes.func.isRequired,
active: PropTypes.bool,
small: PropTypes.bool,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(GifSelectorButton))

67
app/javascript/gabsocial/features/compose/components/media_upload_button.js
View File

@@ -7,42 +7,8 @@ import { defineMessages, injectIntl } from 'react-intl'
import { uploadCompose } from '../../../actions/compose'
import ComposeExtraButton from './compose_extra_button'
const messages = defineMessages({
upload: { id: 'upload_button.label', defaultMessage: 'Add media (JPEG, PNG, GIF, WebM, MP4, MOV)' },
title: { id: 'upload_button.title', defaultMessage: 'Photo/Video' },
})
const makeMapStateToProps = () => {
const mapStateToProps = (state) => ({
acceptContentTypes: state.getIn(['media_attachments', 'accept_content_types']),
disabled: state.getIn(['compose', 'is_uploading']) || (state.getIn(['compose', 'media_attachments']).size + state.getIn(['compose', 'pending_media_attachments']) > 3 || state.getIn(['compose', 'media_attachments']).some(m => ['video', 'audio', 'gifv'].includes(m.get('type')))),
unavailable: state.getIn(['compose', 'poll']) !== null,
resetFileKey: state.getIn(['compose', 'resetFileKey']),
})
return mapStateToProps
}
const mapDispatchToProps = (dispatch) => ({
onSelectFile: (files) => dispatch(uploadCompose(files)),
})
export default
@connect(makeMapStateToProps, mapDispatchToProps)
@injectIntl
class UploadButton extends ImmutablePureComponent {
static propTypes = {
disabled: PropTypes.bool,
unavailable: PropTypes.bool,
onSelectFile: PropTypes.func.isRequired,
style: PropTypes.object,
resetFileKey: PropTypes.number,
acceptContentTypes: ImmutablePropTypes.listOf(PropTypes.string).isRequired,
intl: PropTypes.object.isRequired,
small: PropTypes.bool,
}
handleChange = (e) => {
if (e.target.files.length > 0) {
this.props.onSelectFile(e.target.files)
@@ -88,3 +54,36 @@ class UploadButton extends ImmutablePureComponent {
}
}
const messages = defineMessages({
upload: { id: 'upload_button.label', defaultMessage: 'Add media (JPEG, PNG, GIF, WebM, MP4, MOV)' },
title: { id: 'upload_button.title', defaultMessage: 'Photo/Video' },
})
const makeMapStateToProps = () => {
const mapStateToProps = (state) => ({
acceptContentTypes: state.getIn(['media_attachments', 'accept_content_types']),
disabled: state.getIn(['compose', 'is_uploading']) || (state.getIn(['compose', 'media_attachments']).size + state.getIn(['compose', 'pending_media_attachments']) > 3 || state.getIn(['compose', 'media_attachments']).some(m => ['video', 'audio', 'gifv'].includes(m.get('type')))),
unavailable: state.getIn(['compose', 'poll']) !== null,
resetFileKey: state.getIn(['compose', 'resetFileKey']),
})
return mapStateToProps
}
const mapDispatchToProps = (dispatch) => ({
onSelectFile: (files) => dispatch(uploadCompose(files)),
})
UploadButton.propTypes = {
disabled: PropTypes.bool,
unavailable: PropTypes.bool,
onSelectFile: PropTypes.func.isRequired,
style: PropTypes.object,
resetFileKey: PropTypes.number,
acceptContentTypes: ImmutablePropTypes.listOf(PropTypes.string).isRequired,
intl: PropTypes.object.isRequired,
small: PropTypes.bool,
}
export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(UploadButton))

63
app/javascript/gabsocial/features/compose/components/media_upload_item.js
View File

@@ -14,44 +14,12 @@ import Text from '../../../components/text'
const cx = classNames.bind(_s)
const messages = defineMessages({
description: { id: 'upload_form.description', defaultMessage: 'Describe for the visually impaired' },
delete: { id: 'upload_form.undo', defaultMessage: 'Delete' },
})
const mapStateToProps = (state, { id }) => ({
media: state.getIn(['compose', 'media_attachments']).find(item => item.get('id') === id),
})
const mapDispatchToProps = (dispatch) => ({
onUndo: (id) => {
dispatch(undoUploadCompose(id))
},
onDescriptionChange: (id, description) => {
dispatch(changeUploadCompose(id, { description }))
},
onSubmit () {
dispatch(submitCompose())
},
});
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class Upload extends ImmutablePureComponent {
static contextTypes = {
router: PropTypes.object,
}
static propTypes = {
media: ImmutablePropTypes.map.isRequired,
intl: PropTypes.object.isRequired,
onUndo: PropTypes.func.isRequired,
onDescriptionChange: PropTypes.func.isRequired,
onSubmit: PropTypes.func.isRequired,
}
state = {
hovered: false,
focused: false,
@@ -177,3 +145,34 @@ class Upload extends ImmutablePureComponent {
}
}
const messages = defineMessages({
description: { id: 'upload_form.description', defaultMessage: 'Describe for the visually impaired' },
delete: { id: 'upload_form.undo', defaultMessage: 'Delete' },
})
const mapStateToProps = (state, { id }) => ({
media: state.getIn(['compose', 'media_attachments']).find(item => item.get('id') === id),
})
const mapDispatchToProps = (dispatch) => ({
onUndo: (id) => {
dispatch(undoUploadCompose(id))
},
onDescriptionChange: (id, description) => {
dispatch(changeUploadCompose(id, { description }))
},
onSubmit () {
dispatch(submitCompose())
},
});
Upload.propTypes = {
media: ImmutablePropTypes.map.isRequired,
intl: PropTypes.object.isRequired,
onUndo: PropTypes.func.isRequired,
onDescriptionChange: PropTypes.func.isRequired,
onSubmit: PropTypes.func.isRequired,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(Upload))

69
app/javascript/gabsocial/features/compose/components/poll_button.js
View File

@@ -5,6 +5,31 @@ import { defineMessages, injectIntl } from 'react-intl'
import { addPoll, removePoll } from '../../../actions/compose'
import ComposeExtraButton from './compose_extra_button'
class PollButton extends React.PureComponent {
handleClick = () => {
this.props.onClick()
}
render() {
const { intl, active, unavailable, disabled, small } = this.props
if (unavailable) return null
return (
<ComposeExtraButton
title={intl.formatMessage(active ? messages.remove_poll : messages.title)}
disabled={disabled}
onClick={this.handleClick}
icon='poll'
small={small}
active={active}
/>
)
}
}
const messages = defineMessages({
add_poll: { id: 'poll_button.add_poll', defaultMessage: 'Add poll' },
title: { id: 'poll_button.title', defaultMessage: 'Poll' },
@@ -30,39 +55,13 @@ const mapDispatchToProps = (dispatch) => ({
})
export default
@connect(mapStateToProps, mapDispatchToProps)
@injectIntl
class PollButton extends React.PureComponent {
static propTypes = {
disabled: PropTypes.bool,
unavailable: PropTypes.bool,
active: PropTypes.bool,
onClick: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
small: PropTypes.bool,
}
handleClick = () => {
this.props.onClick()
}
render() {
const { intl, active, unavailable, disabled, small } = this.props
if (unavailable) return null
return (
<ComposeExtraButton
title={intl.formatMessage(active ? messages.remove_poll : messages.title)}
disabled={disabled}
onClick={this.handleClick}
icon='poll'
small={small}
active={active}
/>
)
}
PollButton.propTypes = {
disabled: PropTypes.bool,
unavailable: PropTypes.bool,
active: PropTypes.bool,
onClick: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
small: PropTypes.bool,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(PollButton))

97
app/javascript/gabsocial/features/compose/components/poll_form.js
View File

@@ -18,57 +18,8 @@ import Input from '../../../components/input'
const cx = classNames.bind(_s)
const messages = defineMessages({
option_placeholder: { id: 'compose_form.poll.option_placeholder', defaultMessage: 'Choice {number}' },
add_option: { id: 'compose_form.poll.add_option', defaultMessage: 'Add a choice' },
remove_option: { id: 'compose_form.poll.remove_option', defaultMessage: 'Remove this choice' },
poll_duration: { id: 'compose_form.poll.duration', defaultMessage: 'Poll duration' },
minutes: { id: 'intervals.full.minutes', defaultMessage: '{number, plural, one {# minute} other {# minutes}}' },
hours: { id: 'intervals.full.hours', defaultMessage: '{number, plural, one {# hour} other {# hours}}' },
days: { id: 'intervals.full.days', defaultMessage: '{number, plural, one {# day} other {# days}}' },
})
const mapStateToProps = (state) => ({
options: state.getIn(['compose', 'poll', 'options']),
expiresIn: state.getIn(['compose', 'poll', 'expires_in']),
isMultiple: state.getIn(['compose', 'poll', 'multiple']),
})
const mapDispatchToProps = (dispatch) => ({
onAddOption() {
dispatch(addPollOption(''))
},
onRemoveOption(index) {
dispatch(removePollOption(index))
},
onChangeOption(index, title) {
dispatch(changePollOption(index, title))
},
onChangeSettings(expiresIn, isMultiple) {
dispatch(changePollSettings(expiresIn, isMultiple))
},
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class PollForm extends ImmutablePureComponent {
static propTypes = {
options: ImmutablePropTypes.list,
expiresIn: PropTypes.number,
isMultiple: PropTypes.bool,
onChangeOption: PropTypes.func.isRequired,
onAddOption: PropTypes.func.isRequired,
onRemoveOption: PropTypes.func.isRequired,
onChangeSettings: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
}
handleSelectDuration = (e) => {
this.props.onChangeSettings(e.target.value, this.props.isMultiple)
}
@@ -243,3 +194,51 @@ class PollFormOption extends ImmutablePureComponent {
}
}
const messages = defineMessages({
option_placeholder: { id: 'compose_form.poll.option_placeholder', defaultMessage: 'Choice {number}' },
add_option: { id: 'compose_form.poll.add_option', defaultMessage: 'Add a choice' },
remove_option: { id: 'compose_form.poll.remove_option', defaultMessage: 'Remove this choice' },
poll_duration: { id: 'compose_form.poll.duration', defaultMessage: 'Poll duration' },
minutes: { id: 'intervals.full.minutes', defaultMessage: '{number, plural, one {# minute} other {# minutes}}' },
hours: { id: 'intervals.full.hours', defaultMessage: '{number, plural, one {# hour} other {# hours}}' },
days: { id: 'intervals.full.days', defaultMessage: '{number, plural, one {# day} other {# days}}' },
})
const mapStateToProps = (state) => ({
options: state.getIn(['compose', 'poll', 'options']),
expiresIn: state.getIn(['compose', 'poll', 'expires_in']),
isMultiple: state.getIn(['compose', 'poll', 'multiple']),
})
const mapDispatchToProps = (dispatch) => ({
onAddOption() {
dispatch(addPollOption(''))
},
onRemoveOption(index) {
dispatch(removePollOption(index))
},
onChangeOption(index, title) {
dispatch(changePollOption(index, title))
},
onChangeSettings(expiresIn, isMultiple) {
dispatch(changePollSettings(expiresIn, isMultiple))
},
})
PollForm.propTypes = {
options: ImmutablePropTypes.list,
expiresIn: PropTypes.number,
isMultiple: PropTypes.bool,
onChangeOption: PropTypes.func.isRequired,
onAddOption: PropTypes.func.isRequired,
onRemoveOption: PropTypes.func.isRequired,
onChangeSettings: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(PollForm))

67
app/javascript/gabsocial/features/compose/components/rich_text_editor_button.js
View File

@@ -7,42 +7,8 @@ import { openModal } from '../../../actions/modal'
import { me } from '../../../initial_state'
import ComposeExtraButton from './compose_extra_button'
const messages = defineMessages({
marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
title: { id: 'compose_form.rte.title', defaultMessage: 'Rich Text Editor' },
})
const mapStateToProps = (state) => ({
active: state.getIn(['compose', 'rte_controls_visible']),
isPro: state.getIn(['accounts', me, 'is_pro']),
})
const mapDispatchToProps = (dispatch) => ({
onChangeRichTextEditorControlsVisibility() {
dispatch(changeRichTextEditorControlsVisibility())
},
onOpenProUpgradeModal() {
dispatch(openModal('PRO_UPGRADE'))
},
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class RichTextEditorButton extends React.PureComponent {
static propTypes = {
active: PropTypes.bool,
intl: PropTypes.object.isRequired,
small: PropTypes.bool,
isPro: PropTypes.bool,
onOpenProUpgradeModal: PropTypes.func.isRequired,
onChangeRichTextEditorControlsVisibility: PropTypes.func.isRequired,
}
handleClick = (e) => {
e.preventDefault()
if (!this.props.isPro) {
@@ -67,3 +33,36 @@ class RichTextEditorButton extends React.PureComponent {
}
}
const messages = defineMessages({
marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
title: { id: 'compose_form.rte.title', defaultMessage: 'Rich Text Editor' },
})
const mapStateToProps = (state) => ({
active: state.getIn(['compose', 'rte_controls_visible']),
isPro: state.getIn(['accounts', me, 'is_pro']),
})
const mapDispatchToProps = (dispatch) => ({
onChangeRichTextEditorControlsVisibility() {
dispatch(changeRichTextEditorControlsVisibility())
},
onOpenProUpgradeModal() {
dispatch(openModal('PRO_UPGRADE'))
},
})
RichTextEditorButton.propTypes = {
active: PropTypes.bool,
intl: PropTypes.object.isRequired,
small: PropTypes.bool,
isPro: PropTypes.bool,
onOpenProUpgradeModal: PropTypes.func.isRequired,
onChangeRichTextEditorControlsVisibility: PropTypes.func.isRequired,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(RichTextEditorButton))

79
app/javascript/gabsocial/features/compose/components/schedule_post_button.js
View File

@@ -9,48 +9,8 @@ import ComposeExtraButton from './compose_extra_button'
// import 'react-datepicker/dist/react-datepicker.css'
const messages = defineMessages({
schedule_status: { id: 'schedule_status.title', defaultMessage: 'Schedule' },
})
const mapStateToProps = (state) => ({
hasExpiresAt: !!state.getIn(['compose', 'expires_at']),
active: !!state.getIn(['compose', 'scheduled_at']) || state.getIn(['popover', 'popoverType']) === 'DATE_PICKER',
isPro: state.getIn(['accounts', me, 'is_pro']),
})
const mapDispatchToProps = (dispatch) => ({
onOpenDatePickerPopover(targetRef) {
dispatch(openPopover('DATE_PICKER', {
targetRef,
}))
},
onCloseDatePickerPopover() {
dispatch(closePopover())
},
onOpenProUpgradeModal() {
dispatch(openModal('PRO_UPGRADE'))
},
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class SchedulePostButton extends React.PureComponent {
static propTypes = {
active: PropTypes.bool.isRequired,
intl: PropTypes.object.isRequired,
isPro: PropTypes.bool,
hasExpiresAt: PropTypes.bool,
onOpenProUpgradeModal: PropTypes.func.isRequired,
onOpenDatePickerPopover: PropTypes.func.isRequired,
onCloseDatePickerPopover: PropTypes.func.isRequired,
small: PropTypes.bool,
}
handleToggle = () => {
if (!this.props.isPro) {
this.props.onOpenProUpgradeModal()
@@ -86,3 +46,42 @@ class SchedulePostButton extends React.PureComponent {
}
}
const messages = defineMessages({
schedule_status: { id: 'schedule_status.title', defaultMessage: 'Schedule' },
})
const mapStateToProps = (state) => ({
hasExpiresAt: !!state.getIn(['compose', 'expires_at']),
active: !!state.getIn(['compose', 'scheduled_at']) || state.getIn(['popover', 'popoverType']) === 'DATE_PICKER',
isPro: state.getIn(['accounts', me, 'is_pro']),
})
const mapDispatchToProps = (dispatch) => ({
onOpenDatePickerPopover(targetRef) {
dispatch(openPopover('DATE_PICKER', {
targetRef,
}))
},
onCloseDatePickerPopover() {
dispatch(closePopover())
},
onOpenProUpgradeModal() {
dispatch(openModal('PRO_UPGRADE'))
},
})
SchedulePostButton.propTypes = {
active: PropTypes.bool.isRequired,
intl: PropTypes.object.isRequired,
isPro: PropTypes.bool,
hasExpiresAt: PropTypes.bool,
onOpenProUpgradeModal: PropTypes.func.isRequired,
onOpenDatePickerPopover: PropTypes.func.isRequired,
onCloseDatePickerPopover: PropTypes.func.isRequired,
small: PropTypes.bool,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(SchedulePostButton))

53
app/javascript/gabsocial/features/compose/components/sensitive_media_button.js
View File

@@ -5,35 +5,8 @@ import { injectIntl, defineMessages } from 'react-intl'
import { changeComposeSensitivity } from '../../../actions/compose'
import Switch from '../../../components/switch'
const messages = defineMessages({
markAsSensitive: { id: 'compose_form.sensitive.hide', defaultMessage: 'Mark media as sensitive' },
})
const mapStateToProps = (state) => ({
active: state.getIn(['compose', 'sensitive']),
disabled: state.getIn(['compose', 'spoiler']),
})
const mapDispatchToProps = (dispatch) => ({
onClick () {
dispatch(changeComposeSensitivity())
},
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class SensitiveMediaButton extends React.PureComponent {
static propTypes = {
active: PropTypes.bool,
disabled: PropTypes.bool,
onClick: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
}
render () {
const { active, disabled, onClick, intl } = this.props
@@ -52,3 +25,29 @@ class SensitiveMediaButton extends React.PureComponent {
}
}
const messages = defineMessages({
markAsSensitive: { id: 'compose_form.sensitive.hide', defaultMessage: 'Mark media as sensitive' },
})
const mapStateToProps = (state) => ({
active: state.getIn(['compose', 'sensitive']),
disabled: state.getIn(['compose', 'spoiler']),
})
const mapDispatchToProps = (dispatch) => ({
onClick () {
dispatch(changeComposeSensitivity())
},
})
SensitiveMediaButton.propTypes = {
active: PropTypes.bool,
disabled: PropTypes.bool,
onClick: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(SensitiveMediaButton))

53
app/javascript/gabsocial/features/compose/components/spoiler_button.js
View File

@@ -5,35 +5,8 @@ import { injectIntl, defineMessages } from 'react-intl'
import { changeComposeSpoilerness } from '../../../actions/compose'
import ComposeExtraButton from './compose_extra_button'
const messages = defineMessages({
marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
title: { id: 'compose_form.spoiler.title', defaultMessage: 'Warning' },
})
const mapStateToProps = (state) => ({
active: state.getIn(['compose', 'spoiler']),
})
const mapDispatchToProps = (dispatch) => ({
onClick () {
dispatch(changeComposeSpoilerness())
},
})
export default
@injectIntl
@connect(mapStateToProps, mapDispatchToProps)
class SpoilerButton extends React.PureComponent {
static propTypes = {
active: PropTypes.bool,
intl: PropTypes.object.isRequired,
small: PropTypes.bool,
}
handleClick = (e) => {
e.preventDefault()
this.props.onClick()
@@ -54,3 +27,29 @@ class SpoilerButton extends React.PureComponent {
}
}
const messages = defineMessages({
marked: { id: 'compose_form.spoiler.marked', defaultMessage: 'Text is hidden behind warning' },
unmarked: { id: 'compose_form.spoiler.unmarked', defaultMessage: 'Text is not hidden' },
title: { id: 'compose_form.spoiler.title', defaultMessage: 'Warning' },
})
const mapStateToProps = (state) => ({
active: state.getIn(['compose', 'spoiler']),
})
const mapDispatchToProps = (dispatch) => ({
onClick () {
dispatch(changeComposeSpoilerness())
},
})
SpoilerButton.propTypes = {
active: PropTypes.bool,
intl: PropTypes.object.isRequired,
small: PropTypes.bool,
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(SpoilerButton))

59
app/javascript/gabsocial/features/compose/components/status_visibility_button.js
View File

@@ -5,38 +5,8 @@ import { defineMessages, injectIntl } from 'react-intl'
import { openPopover } from '../../../actions/popover'
import ComposeExtraButton from './compose_extra_button'
const messages = defineMessages({
visibility: { id: 'privacy.visibility', defaultMessage: 'Visibility' },
})
const mapStateToProps = (state) => ({
value: state.getIn(['compose', 'privacy']),
})
const mapDispatchToProps = (dispatch) => ({
onOpenPopover(targetRef) {
dispatch(openPopover('STATUS_VISIBILITY', {
targetRef,
}))
},
})
export default
@connect(mapStateToProps, mapDispatchToProps)
@injectIntl
class StatusVisibilityButton extends React.PureComponent {
static propTypes = {
intl: PropTypes.object.isRequired,
small: PropTypes.bool,
onOpenPopover: PropTypes.func.isRequired,
value: PropTypes.oneOf([
'private',
'unlisted',
'public',
]),
}
handleOnClick = () => {
this.props.onOpenPopover(this.button)
}
@@ -77,3 +47,32 @@ class StatusVisibilityButton extends React.PureComponent {
}
}
const messages = defineMessages({
visibility: { id: 'privacy.visibility', defaultMessage: 'Visibility' },
})
const mapStateToProps = (state) => ({
value: state.getIn(['compose', 'privacy']),
})
const mapDispatchToProps = (dispatch) => ({
onOpenPopover(targetRef) {
dispatch(openPopover('STATUS_VISIBILITY', {
targetRef,
}))
},
})
StatusVisibilityButton.propTypes = {
intl: PropTypes.object.isRequired,
small: PropTypes.bool,
onOpenPopover: PropTypes.func.isRequired,
value: PropTypes.oneOf([
'private',
'unlisted',
'public',
]),
}
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(StatusVisibilityButton))

30
app/javascript/gabsocial/features/compose/components/upload_form.js
View File

@@ -7,23 +7,8 @@ import ProgressBar from '../../../components/progress_bar'
import Upload from './media_upload_item'
import SensitiveMediaButton from './sensitive_media_button'
const mapStateToProps = (state) => ({
mediaIds: state.getIn(['compose', 'media_attachments']).map(item => item.get('id')),
isUploading: state.getIn(['compose', 'is_uploading']),
uploadProgress: state.getIn(['compose', 'progress'], 0),
});
export default
@connect(mapStateToProps)
class UploadForm extends ImmutablePureComponent {
static propTypes = {
isModalOpen: PropTypes.bool,
isUploading: PropTypes.bool,
mediaIds: ImmutablePropTypes.list.isRequired,
uploadProgress: PropTypes.number,
};
render () {
const {
mediaIds,
@@ -55,3 +40,18 @@ class UploadForm extends ImmutablePureComponent {
}
}
const mapStateToProps = (state) => ({
mediaIds: state.getIn(['compose', 'media_attachments']).map(item => item.get('id')),
isUploading: state.getIn(['compose', 'is_uploading']),
uploadProgress: state.getIn(['compose', 'progress'], 0),
})
UploadForm.propTypes = {
isModalOpen: PropTypes.bool,
isUploading: PropTypes.bool,
mediaIds: ImmutablePropTypes.list.isRequired,
uploadProgress: PropTypes.number,
}
export default connect(mapStateToProps)(UploadForm)