Merge pull request #304 from metasfresh/dev-215

fix #215 - added shortcut for change doc status to complete

src/components/shortcuts/DocumentStatusContextShortcuts.js

@@ -0,0 +1,30 @@
+import React, { Component } from 'react';
+import { Shortcuts } from 'react-shortcuts';
+
+class DocumentStatusContextShortcuts extends Component {
+    handleShortcuts = (action) => {
+        const {
+            handleDocumentCompleteStatus
+        } = this.props;
+
+        switch (action) {
+            case 'COMPLETE_STATUS':
+                return handleDocumentCompleteStatus();
+        }
+    }
+
+    render() {
+        return (
+            <Shortcuts
+                name={"DOCUMENT_STATUS_CONTEXT"}
+                handler = { this.handleShortcuts }
+                targetNodeSelector = { "body" }
+                isolate = { true }
+                preventDefault = { true }
+                stopPropagation = { true }
+            />
+        )
+    }
+}
+
+export default DocumentStatusContextShortcuts;

src/components/widget/ActionButton.js

@@ -4,6 +4,7 @@ import { connect } from 'react-redux';
 import {
     dropdownRequest
 } from '../../actions/GenericActions';
+import DocumentStatusContextShortcuts from '../shortcuts/DocumentStatusContextShortcuts';
 
 class ActionButton extends Component {
     constructor(props) {
@@ -16,6 +17,10 @@ class ActionButton extends Component {
         }
     }
 
+    componentDidMount(){
+        this.fetchStatusList();
+    }
+
     handleKeyDown = (e) => {
         const {list, selected} = this.state;
         switch(e.key){
@@ -57,18 +62,28 @@ class ActionButton extends Component {
     }
 
     handleDropdownFocus = () => {
-        const { dispatch, windowType, fields, dataId, dropdownOpenCallback} = this.props;
+        const {dropdownOpenCallback} = this.props;
+
+        this.fetchStatusList();
+        dropdownOpenCallback();
+        this.statusDropdown.classList.add('dropdown-status-open');
+    }
 
+    fetchStatusList(){
+        const { dispatch, windowType, fields, dataId} = this.props;
         dispatch(dropdownRequest(windowType, fields[1].field, dataId, null, null, "window")).then((res) => {
             this.setState({list: res.data});
         });
-        dropdownOpenCallback();
-        this.statusDropdown.classList.add('dropdown-status-open');
     }
 
     handleChangeStatus = (status) => {
-        this.props.onChange(status);
+        const { onChange } = this.props;
+        const changePromise = onChange(status);
+
         this.statusDropdown.blur();
+        if (changePromise instanceof Promise){
+            changePromise.then(() => this.fetchStatusList());
+        }
     }
 
     getStatusClassName = (abrev) => {
@@ -119,6 +134,7 @@ class ActionButton extends Component {
         const {data} = this.props;
         const abrev = (data.status.value !== undefined) ? Object.keys(data.status.value)[0] : null;
         const value = (abrev !== null || undefined) ? data.status.value[abrev] : null;
+        const { list } = this.state;
 
         return (
             <div
@@ -132,8 +148,13 @@ class ActionButton extends Component {
                 <div className={"tag tag-" + this.getStatusContext(abrev)}>{value} </div>
                 <i className={"meta-icon-chevron-1 meta-icon-" + this.getStatusContext(abrev)} />
                 <ul className="dropdown-status-list">
-                    {this.renderStatusList(this.state.list)}
+                    {this.renderStatusList(list)}
                 </ul>
+                <DocumentStatusContextShortcuts
+                    handleDocumentCompleteStatus={() => {
+                        this.handleChangeStatus(list.values.filter(elem => !!elem.CO)[0])
+                    }}
+                />
             </div>
         )
     }

src/keymap.js

@@ -40,5 +40,8 @@ export default {
     },
     QUICK_ACTIONS: {
         QUICK_ACTION_POS: mod + '+' + 'u'
+    },
+    DOCUMENT_STATUS_CONTEXT: {
+        COMPLETE_STATUS: mod + '+' + 'u'
     }
 }