Merge pull request #1342 from metasfresh/dev-1222

Add ctrl+a for both of select all / select x items on table #1222
metasfresh · Nov 14, 2017 · f058c01 · f058c01
2 parents c760c88 + 425202a
commit f058c01
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 19 deletions.
diff --git a/src/components/shortcuts/PaginationContextShortcuts.js b/src/components/shortcuts/PaginationContextShortcuts.js
@@ -8,7 +8,7 @@ class PaginationContextShortcuts extends Component {
 
     handleShortcuts = (action, event) => {
         const {
-            handleFirstPage, handleLastPage, handlePrevPage, handleNextPage, pages
+            handleFirstPage, handleLastPage, handlePrevPage, handleNextPage, pages, handleSelectAll
         } = this.props;
 
         switch (action) {
@@ -28,6 +28,9 @@ class PaginationContextShortcuts extends Component {
                 if (pages > 1)
                     return handlePrevPage();
                 return;
+            case 'SELECT_ALL_ROWS':
+                event.preventDefault();
+                return handleSelectAll();
         }
     }
 
@@ -40,6 +43,7 @@ class PaginationContextShortcuts extends Component {
                 isolate = { true }
                 preventDefault = { true }
                 stopPropagation = { true }
+                global
             />
         )
     }

diff --git a/src/components/table/TablePagination.js b/src/components/table/TablePagination.js
@@ -20,6 +20,17 @@ class TablePagination extends Component {
         })
     }
 
+    _handleSelectAll = () => {
+        const {
+            selected, rowLength, handleSelectAll, handleSelectRange
+        } = this.props;
+
+        const selectedWholePage = selected && (selected.length === rowLength);
+
+        return selectedWholePage?
+            handleSelectRange(['all']) :handleSelectAll();
+    }
+
     handleSubmit = (e, value, pages) => {
         const {handleChangePage, deselect} = this.props;
         if(e.key === 'Enter'){
@@ -203,7 +214,7 @@ class TablePagination extends Component {
 
     renderSelectAll = () => {
         const {
-            selected, handleSelectAll, handleSelectRange, size, rowLength
+            selected, size, rowLength
         } = this.props;
 
         const selectedWholePage = selected && (selected.length === rowLength);
@@ -224,8 +235,7 @@ class TablePagination extends Component {
                 <div
                     className="pagination-link pointer"
                     onClick={() => {
-                        selectedWholePage ?
-                             handleSelectRange(['all']) : handleSelectAll()
+                        this._handleSelectAll();
                     }}
                 >
                     {selectedWholePage ?
@@ -260,10 +270,26 @@ class TablePagination extends Component {
         )
     }
 
+    paginationShortcuts = () => {
+        const {
+            size, pageLength, disablePaginationShortcuts, handleChangePage
+        } = this.props;
+
+        const pages = size ? Math.ceil(size / pageLength) : 0;
+
+        return !disablePaginationShortcuts && {
+            handleFirstPage : () => handleChangePage(1),
+            handleLastPage : () => handleChangePage(
+                size ? Math.ceil(size / pageLength) : 0),
+            handleNextPage : () => handleChangePage('up'),
+            handlePrevPage : () => handleChangePage('down'),
+            pages : pages
+        }
+    }
+
     render() {
         const {
-            size, pageLength, handleChangePage, page, compressed,
-            disablePaginationShortcuts
+            size, pageLength, page, compressed
         } = this.props;
 
         const pages = size ? Math.ceil(size / pageLength) : 0;
@@ -310,18 +336,10 @@ class TablePagination extends Component {
                     </div>
                 </div>
 
-                {
-                    !disablePaginationShortcuts &&
-                    <PaginationContextShortcuts
-                        handleFirstPage={() => handleChangePage(1)}
-                        handleLastPage={() => handleChangePage(
-                            size ? Math.ceil(size / pageLength) : 0)
-                        }
-                        handleNextPage={() => handleChangePage('up')}
-                        handlePrevPage={() => handleChangePage('down')}
-                        pages={pages}
-                    />
-                }
+                <PaginationContextShortcuts
+                    handleSelectAll={() => this._handleSelectAll()}
+                    {...this.paginationShortcuts()}
+                />
             </div>
         );
 

diff --git a/src/keymap.js b/src/keymap.js
@@ -46,7 +46,8 @@ export default {
         NEXT_PAGE: 'pagedown',
         PREV_PAGE: 'pageup',
         FIRST_PAGE: 'home',
-        LAST_PAGE: 'end'
+        LAST_PAGE: 'end',
+        SELECT_ALL_ROWS: mod + '+' + 'a'
     },
     QUICK_ACTIONS: {
         QUICK_ACTION_POS: mod + '+' + 'u',