gab-social/app/javascript/gabsocial/components/floating_action_button.js

68 lines
1.6 KiB
JavaScript
Raw Normal View History

import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
2020-04-23 07:13:29 +01:00
import { defineMessages, injectIntl } from 'react-intl'
2020-05-14 21:45:39 +01:00
import { me } from '../initial_state'
import { CX } from '../constants'
2020-04-23 07:13:29 +01:00
import { openModal } from '../actions/modal'
2020-02-24 21:56:07 +00:00
import Button from './button'
2020-01-27 22:20:07 +00:00
class FloatingActionButton extends React.PureComponent {
2020-05-14 21:45:39 +01:00
render() {
const {
intl,
onOpenCompose,
isDesktop,
} = this.props
2020-04-23 07:13:29 +01:00
2020-05-14 21:45:39 +01:00
if (!me) return null
2020-04-23 07:13:29 +01:00
const message = intl.formatMessage(messages.gab)
2020-03-26 03:11:32 +00:00
const containerClasses = CX({
posFixed: 1,
z3: 1,
mb15: 1,
mr15: 1,
right0: 1,
bottom55PX: !isDesktop,
bottom0: isDesktop,
pb15: isDesktop,
pr15: isDesktop,
})
return (
<div
className={containerClasses}
>
<Button
to={isDesktop ? undefined : '/compose'}
onClick={isDesktop ? onOpenCompose : undefined}
className={[_s.py15, _s.h60PX, _s.saveAreaInsetMR, _s.saveAreaInsetMB, _s.w60PX, _s.jcCenter, _s.aiCenter].join(' ')}
title={message}
aria-label={message}
icon='pencil'
iconSize='20px'
/>
</div>
)
}
2020-05-14 21:45:39 +01:00
}
const messages = defineMessages({
gab: { id: 'gab', defaultMessage: 'Gab' },
})
const mapDispatchToProps = (dispatch) => ({
onOpenCompose: () => dispatch(openModal('COMPOSE')),
})
FloatingActionButton.propTypes = {
intl: PropTypes.object.isRequired,
onOpenCompose: PropTypes.func.isRequired,
isDesktop: PropTypes.bool,
}
export default injectIntl(connect(null, mapDispatchToProps)(FloatingActionButton))