Add support for editing strings and links

- Add edit for strings and links
- Fix conflict between change
- Use old change to create new change

src/redux/reducers/siloDomainData/stringManagement.js

@@ -88,6 +88,8 @@ const setSelectedLinkCollectionName = (state, action) => {
 
 // LINK CHANGE
 
+// TODO: fix for link as we did for string
+
 const addLinkChange = (state, action) => {
     const {
         change,
@@ -112,7 +114,7 @@ const addLinkChange = (state, action) => {
 
 const editLinkChange = (state, action) => {
     const { change, languageName, linkCollectionName } = action;
-    const { languageChanges } = state;
+    const { stringManagementView: { languageChanges } } = state;
 
     let index = -1;
     if (
@@ -145,7 +147,7 @@ const editLinkChange = (state, action) => {
 
 const removeLinkChange = (state, action) => {
     const { change, languageName, linkCollectionName } = action;
-    const { languageChanges } = state;
+    const { stringManagementView: { languageChanges } } = state;
 
     let index = -1;
     if (
@@ -178,59 +180,51 @@ const removeLinkChange = (state, action) => {
 
 // STRING CHANGE
 
-const addStringChange = (state, action) => {
-    const {
-        change,
-        languageName,
-    } = action;
-
-    const settings = {
-        stringManagementView: {
-            languageChanges: {
-                [languageName]: { $auto: {
-                    strings: { $autoArray: {
-                        $push: [change],
-                    } },
-                } },
-            },
-        },
-    };
-    return update(state, settings);
-};
-
 const editStringChange = (state, action) => {
-    const { change, languageName } = action;
-    const { languageChanges } = state;
+    const { change: originalChange, languageName } = action;
+    const { stringManagementView: { languageChanges } } = state;
 
+    let change = originalChange;
     let index = -1;
     if (
+        languageChanges &&
         languageChanges[languageName] &&
         languageChanges[languageName].strings
     ) {
         index = languageChanges[languageName].strings.findIndex(
-            l => change.action === l.action && change.id === l.id,
+            l => change.id === l.id,
         );
+        if (index !== -1) {
+            const oldChange = languageChanges[languageName].strings[index];
+            change = {
+                ...originalChange,
+                oldValue: oldChange.oldValue,
+            };
+        }
     }
-    if (index === -1) {
-        return state;
-    }
+
     const settings = {
         stringManagementView: {
-            languageChanges: {
-                [languageName]: {
-                    strings: {
-                        $splice: [[index, 1, change]],
-                    },
-                },
-            },
+            languageChanges: { $auto: {
+                [languageName]: { $auto: {
+                    strings: { $autoArray: {
+                        $if: [
+                            index === -1,
+                            { $push: [change] },
+                            { $splice: [[index, 1, change]] },
+                        ],
+                    } },
+                } },
+            } },
         },
     };
     return update(state, settings);
 };
+const addStringChange = editStringChange;
 
 const removeStringChange = (state, action) => {
     const { change, languageName } = action;
-    const { languageChanges } = state;
+    const { stringManagementView: { languageChanges } } = state;
 
     let index = -1;
     if (

src/views/StringManagement/DeleteConfirm/index.js

@@ -67,10 +67,9 @@ export default class DeleteConfirm extends React.PureComponent {
             addStringChange,
             addLinkChange,
         } = this.props;
+
         if (result && type === 'all') {
-            const value = allStrings.find(
-                str => str.id === deleteId,
-            ).string;
+            const value = allStrings.find(str => str.id === deleteId).string;
             const change = {
                 id: deleteId,
                 oldValue: value,
@@ -81,9 +80,7 @@ export default class DeleteConfirm extends React.PureComponent {
                 languageName: selectedLanguageName,
             });
         } else if (result && type === 'link') {
-            const value = linkCollection.find(
-                lnk => lnk.id === deleteId,
-            ).stringId;
+            const value = linkCollection.find(lnk => lnk.id === deleteId).stringId;
             const change = {
                 key: deleteId,
                 oldString: value,
@@ -122,16 +119,11 @@ export default class DeleteConfirm extends React.PureComponent {
             allStrings,
         } = this.props;
 
-        const strings = {
-            link: linkCollection,
-            all: allStrings,
-        };
-
         let properties = [];
 
         switch (type) {
             case 'link': {
-                const string = strings[type].find(d => String(d.stringId) === String(id));
+                const string = linkCollection.find(d => d.id === id);
                 if (string) {
                     properties = [
                         { label: 'ID', value: string.id },
@@ -142,8 +134,7 @@ export default class DeleteConfirm extends React.PureComponent {
                 break;
             }
             case 'all': {
-                console.warn(strings[type]);
-                const string = strings[type].find(d => String(d.id) === String(id));
+                const string = allStrings.find(d => d.id === id);
                 if (string) {
                     properties = [
                         { label: 'ID', value: string.id },

src/views/StringManagement/Detail/LinksTable/EditLinkModal/index.js

@@ -14,6 +14,9 @@ import SelectInput from '../../../../../vendor/react-store/components/Input/Sele
 import {
     linkCollectionSelector,
     allStringsSelector,
+    selectedLanguageNameSelector,
+    stringMgmtAddLinkChangeAction,
+    selectedLinkCollectionNameSelector,
 } from '../../../../../redux';
 import styles from './styles.scss';
 
@@ -29,7 +32,9 @@ const propTypes = {
         PropTypes.string,
     ]),
     onClose: PropTypes.func.isRequired,
-    show: PropTypes.bool.isRequired,
+    selectedLanguageName: PropTypes.string.isRequired,
+    selectedLinkCollectionName: PropTypes.string.isRequired,
+    addLinkChange: PropTypes.func.isRequired,
 };
 
 const defaultProps = {
@@ -39,30 +44,36 @@ const defaultProps = {
 const mapStateToProps = state => ({
     linkCollection: linkCollectionSelector(state),
     allStrings: allStringsSelector(state),
+    selectedLanguageName: selectedLanguageNameSelector(state),
+    selectedLinkCollectionName: selectedLinkCollectionNameSelector(state),
 });
 
-@connect(mapStateToProps)
+const mapDispatchToProps = dispatch => ({
+    addLinkChange: params => dispatch(stringMgmtAddLinkChangeAction(params)),
+});
+
+@connect(mapStateToProps, mapDispatchToProps)
 export default class EditStringModal extends React.PureComponent {
     static propTypes = propTypes;
     static defaultProps = defaultProps;
 
     constructor(props) {
         super(props);
         const {
-            allStrings,
             editLinkId,
             linkCollection,
         } = props;
 
-        const string = allStrings.find(d => d.id === editLinkId) || {};
-        const link = linkCollection.find(d => d.stringId === editLinkId) || {};
+        // const string = allStrings.find(d => d.id === editLinkId) || {};
+        const link = linkCollection.find(d => d.id === editLinkId) || {};
 
         this.state = {
-            string,
-            inputValue: string.id,
+            link,
+            inputValue: link.stringId,
         };
     }
 
+    /*
     componentWillReceiveProps(nextProps) {
         const {
             allStrings: newAllStrings,
@@ -90,6 +101,7 @@ export default class EditStringModal extends React.PureComponent {
             }
         }
     }
+    */
 
     handleInputValueChange = (value) => {
         this.setState({ inputValue: value });
@@ -99,9 +111,28 @@ export default class EditStringModal extends React.PureComponent {
         const {
             onClose,
             editLinkId,
+            selectedLanguageName,
+            selectedLinkCollectionName,
+            addLinkChange,
         } = this.props;
+        const {
+            link,
+            inputValue,
+        } = this.state;
+
+        const change = {
+            action: 'edit',
+            key: link.id,
+            string: inputValue,
+            oldString: link.stringId,
+        };
+
+        addLinkChange({
+            change,
+            languageName: selectedLanguageName,
+            linkCollectionName: selectedLinkCollectionName,
+        });
 
-        const { inputValue } = this.state;
         onClose(true, editLinkId, inputValue);
     }
 
@@ -125,14 +156,11 @@ export default class EditStringModal extends React.PureComponent {
     );
 
     renderProperties = () => {
-        const {
-            string,
-            link = {},
-        } = this.state;
+        const { link } = this.state;
 
         const properties = [
             { label: 'ID', value: link.id },
-            { label: 'String id', value: string.id },
+            { label: 'String ID', value: link.stringId },
         ];
 
         return (
@@ -146,26 +174,20 @@ export default class EditStringModal extends React.PureComponent {
 
     render() {
         const {
-            show,
             allStrings,
-            editLinkId,
         } = this.props;
 
         const {
-            string,
+            link,
             inputValue,
         } = this.state;
 
-        if (!show) {
-            return null;
-        }
-
         const title = 'Edit string';
         const saveButtonTitle = 'Save';
         const cancelButtonTitle = 'Cancel';
         const inputTitle = 'String';
 
-        const saveButtonDisabled = inputValue === string.id;
+        const saveButtonDisabled = inputValue === link.string;
         const Properties = this.renderProperties;
         console.warn(inputValue, editLinkId);
 

src/views/StringManagement/Detail/LinksTable/index.js

@@ -155,11 +155,12 @@ export default class LinksTable extends React.PureComponent {
                     type="link"
                     onClose={this.handleDeleteLinkConfirmClose}
                 />
-                <EditLinkModal
-                    show={showEditLinkModal}
-                    editLinkId={editLinkId}
-                    onClose={this.handleEditLinkModalClose}
-                />
+                { showEditLinkModal &&
+                    <EditLinkModal
+                        editLinkId={editLinkId}
+                        onClose={this.handleEditLinkModalClose}
+                    />
+                }
             </React.Fragment>
         );
     }

src/views/StringManagement/Detail/StringsTable/EditStringModal/index.js

@@ -11,7 +11,11 @@ import Button from '../../../../../vendor/react-store/components/Action/Button';
 import SuccessButton from '../../../../../vendor/react-store/components/Action/Button/SuccessButton';
 import TextInput from '../../../../../vendor/react-store/components/Input/TextInput';
 
-import { allStringsSelector } from '../../../../../redux';
+import {
+    allStringsSelector,
+    selectedLanguageNameSelector,
+    stringMgmtAddStringChangeAction,
+} from '../../../../../redux';
 import styles from './styles.scss';
 
 const propTypes = {
@@ -23,6 +27,8 @@ const propTypes = {
     ]),
     onClose: PropTypes.func.isRequired,
     show: PropTypes.bool.isRequired,
+    selectedLanguageName: PropTypes.string.isRequired,
+    addStringChange: PropTypes.func.isRequired,
 };
 
 const defaultProps = {
@@ -31,9 +37,14 @@ const defaultProps = {
 
 const mapStateToProps = state => ({
     allStrings: allStringsSelector(state),
+    selectedLanguageName: selectedLanguageNameSelector(state),
 });
 
-@connect(mapStateToProps)
+const mapDispatchToProps = dispatch => ({
+    addStringChange: params => dispatch(stringMgmtAddStringChangeAction(params)),
+});
+
+@connect(mapStateToProps, mapDispatchToProps)
 export default class EditStringModal extends React.PureComponent {
     static propTypes = propTypes;
     static defaultProps = defaultProps;
@@ -85,9 +96,26 @@ export default class EditStringModal extends React.PureComponent {
         const {
             onClose,
             editStringId,
+            allStrings,
+
+            selectedLanguageName,
+            addStringChange,
         } = this.props;
 
         const { inputValue } = this.state;
+        const val = allStrings.find(d => d.id === editStringId).string;
+        const change = {
+            action: 'edit',
+            id: editStringId,
+            value: inputValue,
+            oldValue: val,
+        };
+
+        addStringChange({
+            change,
+            languageName: selectedLanguageName,
+        });
+
         onClose(true, editStringId, inputValue);
     }