diff --git a/frontend/src/main/web/src/actions/glossary.js b/frontend/src/main/web/src/actions/glossary.js index def351df86..3494608eed 100644 --- a/frontend/src/main/web/src/actions/glossary.js +++ b/frontend/src/main/web/src/actions/glossary.js @@ -49,6 +49,7 @@ export const GLOSSARY_CREATE_REQUEST = 'GLOSSARY_CREATE_REQUEST' export const GLOSSARY_CREATE_SUCCESS = 'GLOSSARY_CREATE_SUCCESS' export const GLOSSARY_CREATE_FAILURE = 'GLOSSARY_CREATE_FAILURE' +//TODO export const GLOSSARY_CLEAR_MESSAGE = 'GLOSSARY_CLEAR_MESSAGE' export const glossaryUpdateIndex = createAction(GLOSSARY_UPDATE_INDEX) diff --git a/frontend/src/main/web/src/components/TextInput.jsx b/frontend/src/main/web/src/components/TextInput.jsx index 74971c6dab..e858bdd14a 100644 --- a/frontend/src/main/web/src/components/TextInput.jsx +++ b/frontend/src/main/web/src/components/TextInput.jsx @@ -2,7 +2,6 @@ import React, { Component, PropTypes } from 'react' import ReactDOM from 'react-dom' import TextareaAutosize from 'react-textarea-autosize' import { flattenClasses } from 'zanata-ui' -import { debounce } from 'lodash' const classes = { base: { diff --git a/frontend/src/main/web/src/containers/Glossary/Entry.js b/frontend/src/main/web/src/containers/Glossary/Entry.js index 5154944795..164c077859 100644 --- a/frontend/src/main/web/src/containers/Glossary/Entry.js +++ b/frontend/src/main/web/src/containers/Glossary/Entry.js @@ -1,5 +1,5 @@ import React, { Component, PropTypes } from 'react' -import { isUndefined } from 'lodash' +import { isUndefined, debounce, cloneDeep } from 'lodash' import { EditableText, @@ -27,10 +27,13 @@ const isSameRender = () => { } class Entry extends Component { - constructor () { - super() + constructor (props) { + super(props) this.state = { - showModal: false + showModal: false, + description: props.entry.description, + pos: props.entry.pos, + handleTermFieldUpdate: debounce(this.props.handleTermFieldUpdate, 100) } } @@ -40,6 +43,14 @@ class Entry extends Component { }) } + onTermFieldUpdate (field, event) { + let state = this.state + const value = event.target.value || '' + state[field] = value + this.setState(state) + this.state.handleTermFieldUpdate(field, state[field]) + } + render () { const { handleSelectTerm, @@ -56,6 +67,10 @@ class Entry extends Component { isSaving } = this.props + if(entry.id === 2) { + console.info(this.state) + } + const transContent = entry && entry.transTerm ? entry.transTerm.content : '' const transSelected = !!selectedTransLocale @@ -127,10 +142,10 @@ class Entry extends Component { handleTermFieldUpdate('pos', e)} + onChange={(e) => this.onTermFieldUpdate('pos', e)} placeholder='Add part of speech…' emptyReadOnlyText='No part of speech'> - {entry.pos} + {this.state.pos} {!transSelected ? ( @@ -138,10 +153,10 @@ class Entry extends Component { handleTermFieldUpdate('description', e)} + onChange={(e) => this.onTermFieldUpdate('description', e)} placeholder='Add a description…' emptyReadOnlyText='No description'> - {entry.description} + {this.state.description} ) : '' @@ -170,7 +185,7 @@ class Entry extends Component {
{displayUpdateButton && !isSaving ? ( handleResetTerm(entryId)}> + onClick={() => handleResetTerm(entry.id)}> Cancel ) : '' diff --git a/frontend/src/main/web/src/containers/Glossary/index.js b/frontend/src/main/web/src/containers/Glossary/index.js index 9f4d40c11c..8c7db608bd 100644 --- a/frontend/src/main/web/src/containers/Glossary/index.js +++ b/frontend/src/main/web/src/containers/Glossary/index.js @@ -162,7 +162,7 @@ const mapStateToProps = (state) => { transLocales: stats.transLocales, srcLocale: stats.srcLocale, filterText: filter, - selectedTerm: selectedTerm, + selectedTerm, selectedTransLocale: query.locale, scrollIndex: Number.parseInt(query.index, 10), permission, @@ -177,7 +177,7 @@ const mapDispatchToProps = (dispatch) => { dispatch, handleSelectTerm: (termId) => dispatch(glossarySelectTerm(termId)), handleTermFieldUpdate: (field, event) => { - dispatch(glossaryUpdateField({ field, value: event.target.value || '' })) + dispatch(glossaryUpdateField({ field, value: event || '' })) }, handleDeleteTerm: (termId) => dispatch(glossaryDeleteTerm(termId)), handleResetTerm: (termId) => dispatch(glossaryResetTerm(termId)),