From 677e95031e179ccdd69162002ccbfb482f396e4e Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Mon, 13 Feb 2017 17:20:18 +0100 Subject: [PATCH] Clean up collapsible components --- .../components/components/collapsable.jsx | 19 +++++++++ .../compose/components/compose_form.jsx | 42 ++++++++----------- .../components/reducers/compose.jsx | 2 +- 3 files changed, 38 insertions(+), 25 deletions(-) create mode 100644 app/assets/javascripts/components/components/collapsable.jsx diff --git a/app/assets/javascripts/components/components/collapsable.jsx b/app/assets/javascripts/components/components/collapsable.jsx new file mode 100644 index 00000000..aeebb4b0 --- /dev/null +++ b/app/assets/javascripts/components/components/collapsable.jsx @@ -0,0 +1,19 @@ +import { Motion, spring } from 'react-motion'; + +const Collapsable = ({ fullHeight, isVisible, children }) => ( + + {({ opacity, height }) => +
+ {children} +
+ } +
+); + +Collapsable.propTypes = { + fullHeight: React.PropTypes.number.isRequired, + isVisible: React.PropTypes.bool.isRequired, + children: React.PropTypes.node.isRequired +}; + +export default Collapsable; diff --git a/app/assets/javascripts/components/features/compose/components/compose_form.jsx b/app/assets/javascripts/components/features/compose/components/compose_form.jsx index 46b62964..273ebd83 100644 --- a/app/assets/javascripts/components/features/compose/components/compose_form.jsx +++ b/app/assets/javascripts/components/features/compose/components/compose_form.jsx @@ -10,7 +10,7 @@ import { debounce } from 'react-decoration'; import UploadButtonContainer from '../containers/upload_button_container'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import Toggle from 'react-toggle'; -import { Motion, spring } from 'react-motion'; +import Collapsable from '../../../components/collapsable'; const messages = defineMessages({ placeholder: { id: 'compose_form.placeholder', defaultMessage: 'What is on your mind?' }, @@ -136,13 +136,11 @@ const ComposeForm = React.createClass({ return (
- - {({ opacity, height }) => -
- -
- } -
+ +
+ +
+
{replyArea} @@ -176,23 +174,19 @@ const ComposeForm = React.createClass({ - - {({ opacity, height }) => - - } - + + + - - {({ opacity, height }) => - - } - + 0} fullHeight={39.5}> + +
); } diff --git a/app/assets/javascripts/components/reducers/compose.jsx b/app/assets/javascripts/components/reducers/compose.jsx index 042a2c67..ef8cde75 100644 --- a/app/assets/javascripts/components/reducers/compose.jsx +++ b/app/assets/javascripts/components/reducers/compose.jsx @@ -89,7 +89,7 @@ function removeMedia(state, mediaId) { map.update('text', text => text.replace(media.get('text_url'), '').trim()); if (prevSize === 1) { - map.update('sensitive', false); + map.set('sensitive', false); } }); };