added react function to open/close editionmode

src/component/Input/TextAreaApp/TextAreaApp.jsx

@@ -6,7 +6,16 @@ require('./TextAreaApp.styl')
 export const TextAreaApp = props =>
   <form className={`${props.customClass} editionmode`}>
     <textarea className={`${props.customClass}__text editionmode__text`} />
-    <input type='submit' className={`${props.customClass}__submit editionmode__submit`} value='Valider' />
+    <div className={`${props.customClass}__button editionmode__button`}>
+      <button
+        type='button'
+        className={`${props.customClass}__cancel editionmode__button__cancel btn btn-outline-primary mr-3`}
+        onClick={props.onClickCancelBtn}
+      >
+        Annuler
+      </button>
+      <button type='submit' className={`${props.customClass}__submit editionmode__button__submit btn btn-outline-primary`}>Valider</button>
+    </div>
   </form>
 
 export default TextAreaApp

src/component/Input/TextAreaApp/TextAreaApp.styl

@@ -7,18 +7,17 @@
   display flex
   flex-direction column
   align-items center
-  width auto
+  width 100%
   &__text
     margin-bottom 25px
     width 100%
     height 250px
-  &__submit
-    border 1px solid blue
-    box-shadow none
-    border-radius 10px
-    padding 8px 45px
-    background-color transparent
-    color blue
-    &:hover, &:focus
-      background-color blue
-      color off-white
+  &__button
+    display flex
+    justify-content flex-end
+    margin-top 15px
+    width 100%
+    &__cancel
+      cursor pointer
+    &__submit
+      cursor pointer

src/component/PopinFixed/PopinFixedHeader.jsx

@@ -2,29 +2,54 @@ import React from 'react'
 import classnames from 'classnames'
 import PropTypes from 'prop-types'
 
-const PopinFixedHeader = props => {
-  return (
-    <div className={classnames('wsContentGeneric__header', `${props.customClass}__header`)}>
-      <div className={classnames('wsContentGeneric__header__icon', `${props.customClass}__header__icon`)}>
-        <i className={props.icon} />
-      </div>
+class PopinFixedHeader extends React.Component {
+  constructor (props) {
+    super(props)
+    this.state = {
+      editTitle: false
+    }
+  }
 
-      <div className={classnames('wsContentGeneric__header__title mr-auto', `${props.customClass}__header__title`)}>
-        {props.name}
-      </div>
+  handleClickChangeTitleBtn = () => this.setState(prevState => ({
+    editTitle: !prevState.editTitle
+  }))
 
-      <div className={classnames('wsContentGeneric__header__edittitle', `${props.customClass}__header__changetitle`)}>
-        <i className='fa fa-pencil' />
-      </div>
+  render () {
+    const { customClass, icon, name, onChangeTitle, onClickCloseBtn } = this.props
+
+    return (
+      <div className={classnames('wsContentGeneric__header', `${customClass}__header`)}>
+        <div className={classnames('wsContentGeneric__header__icon', `${customClass}__header__icon`)}>
+          <i className={icon} />
+        </div>
+
+        <div className={classnames('wsContentGeneric__header__title mr-auto', `${customClass}__header__title`)}>
+          {this.state.editTitle === false &&
+            <div>
+              {name}
+            </div>
+          }
+          {this.state.editTitle === true &&
+            <input onChange={onChangeTitle} />
+          }
+        </div>
+
+        <div
+          className={classnames('wsContentGeneric__header__edittitle', `${customClass}__header__changetitle`)}
+          onClick={this.handleClickChangeTitleBtn}
+        >
+          <i className='fa fa-pencil' />
+        </div>
 
-      <div
-        className={classnames('wsContentGeneric__header__close', `${props.customClass}__header__close`)}
-        onClick={props.onClickCloseBtn}
-      >
-        <i className='fa fa-times' />
+        <div
+          className={classnames('wsContentGeneric__header__close', `${customClass}__header__close`)}
+          onClick={onClickCloseBtn}
+        >
+          <i className='fa fa-times' />
+        </div>
       </div>
-    </div>
-  )
+    )
+  }
 }
 
 export default PopinFixedHeader
@@ -33,10 +58,12 @@ PopinFixedHeader.propTypes = {
   icon: PropTypes.string.isRequired,
   onClickCloseBtn: PropTypes.func.isRequired,
   customClass: PropTypes.string,
-  name: PropTypes.string
+  name: PropTypes.string,
+  onChangeTitle: PropTypes.func
 }
 
 PopinFixedHeader.defaultProps = {
   customClass: '',
-  name: ''
+  name: '',
+  onChangeTitle: () => {}
 }

src/component/PopinFixed/PopinFixedOption.jsx

@@ -11,7 +11,10 @@ const PopinFixedOption = props => {
   return (
     <div className={classnames('wsContentGeneric__option', `${props.customClass}__option`)}>
       <div className={classnames('wsContentGeneric__option__menu', `${props.customClass}__option__menu`)}>
-        <div className='wsContentGeneric__option__menu__addversion btn btn-outline-primary mr-auto'>
+        <div
+          className='wsContentGeneric__option__menu__addversion btn btn-outline-primary mr-auto'
+          onClick={props.onClickNewVersion}
+        >
           {props.t('PopinFixedOption.new_version')}
           <i className='fa fa-plus-circle ml-3' />
         </div>
@@ -32,5 +35,11 @@ const PopinFixedOption = props => {
 export default translate()(PopinFixedOption)
 
 PopinFixedOption.propTypes = {
-  i18n: PropTypes.object // translate resource to overrides default one
+  i18n: PropTypes.object, // translate resource to overrides default one,
+  onClickNewVersionBtn: PropTypes.func
+}
+
+PopinFixedOption.defaultProps = {
+  i18n: {},
+  onClickNewVersionBtn: () => {}
 }