Add Ctr/CMD - R hotkey for refresh tables

Author: VladimirPal

app/actions/currentTable.js

@@ -497,6 +497,12 @@ export function refreshTable() {
   };
 }
 
+export function stopRefresh() {
+  return {
+    type: types.STOP_REFRESH
+  };
+}
+
 export function toggleConfirmationModal(modalType) {
   return {
     type: types.TOGGLE_CONFIRMATION_MODAL,

app/actions/tables.js

@@ -98,6 +98,14 @@ export function getTables(clear = undefined) {
   });
 }
 
+
+export function clearTables() {
+  return {
+    type: types.CLEAR_TABLES
+  };
+}
+
+
 export function searchTables(keyword) {
   return {
     type: types.SEARCH_TABLES,

app/components/Main/Content/Content/Table/FixedTable.js

@@ -20,6 +20,11 @@ const propTypes = {
   toggleRowHighlight: PropTypes.func.isRequired,
   rowsCount: PropTypes.number.isRequired,
   structureTable: PropTypes.object.isRequired,
+  getTables: PropTypes.func.isRequired,
+  setCurrentTable: PropTypes.func.isRequired,
+  clearTables: PropTypes.func.isRequired,
+  initTable: PropTypes.func.isRequired,
+  stopRefresh: PropTypes.func.isRequired,
   tables: PropTypes.array.isRequired,
   rows: PropTypes.object.isRequired
 };
@@ -46,7 +51,20 @@ class FixedTable extends Component {
       this.setState({ widths: {} });
     }
     this.handleResize();
+    // TODO: Fix this ugly refresh logic
     if (nextProps.refresh) {
+      this.props.stopRefresh();
+      this.props.clearTables();
+      this.props.getTables()
+        .then(
+          () => {
+            if (this.props.tableName) {
+              this.props.setCurrentTable(this.props.tableName);
+              this.props.initTable({ tableName: this.props.tableName });
+            }
+          }
+        );
+
       this.props.getTableContent({
         tableName: this.props.tableName,
         order: nextProps.order,

app/components/Main/Content/Footer/Blocks/Left/LeftFooterBlock.js

@@ -19,7 +19,8 @@ const propTypes = {
   editStructureRow: PropTypes.func.isRequired,
   undoEdits: PropTypes.func.isRequired,
   selectNextRow: PropTypes.func.isRequired,
-  toggleRowHighlight: PropTypes.func.isRequired
+  toggleRowHighlight: PropTypes.func.isRequired,
+  refreshTable: PropTypes.func.isRequired
 };
 
 class LeftFooterBlock extends Component {
@@ -31,6 +32,9 @@ class LeftFooterBlock extends Component {
   handleKeyDown = (e) => {
     if (e.ctrlKey || e.metaKey) {
       switch (e.keyCode) {
+        case 82: // 'R'
+          this.props.refreshTable();
+          break;
         case 70: // 'F'
           this.toggleFilter();
           break;

app/components/Main/Sidebar/MainSidebar.js

@@ -76,14 +76,16 @@ class MainSidebar extends Component {
              NEW TABLE
           </button>
         </div>
-        <div className="navbar-bottom-search-word">
-          <i className="fa fa-search" />
-          <input
-            type="search"
-            className="form-control filter-element"
-            onChange={this.handleSearch}
-          />
-        </div>
+        {tables.length &&
+          <div className="navbar-bottom-search-word">
+            <i className="fa fa-search" />
+            <input
+              type="search"
+              className="form-control filter-element"
+              onChange={this.handleSearch}
+            />
+          </div>
+        }
         <nav className="sidebar" id="sidebar0">
           <ul className="nav ">
             {

app/constants/currentTableConstants.js

@@ -50,6 +50,7 @@ export const CLOSE_ERRORS_MODAL = 'currentTable/CLOSE_ERRORS_MODAL';
 export const CLOSE_FOREIGN_TABLE = 'currentTable/CLOSE_FOREIGN_TABLE';
 export const VIEW_QUERIES = 'currentTable/VIEW_QUERIES';
 export const REFRESH_TABLE = 'currentTable/REFRESH_TABLE';
+export const STOP_REFRESH = 'currentTable/STOP_REFRESH';
 export const TOGGLE_CONFIRMATION_MODAL = 'currentTable/TOGGLE_CONFIRMATION_MODAL';
 export const TOGGLE_CONTEXT_MENU = 'currentTable/TOGGLE_CONTEXT_MENU';
 export const TOGGLE_EDITOR = 'currentTable/TOGGLE_EDITOR';

app/constants/tablesConstants.js

@@ -2,4 +2,5 @@ export const GET_TABLES = 'tables/GET_TABLES';
 export const SET_CURRENT_TABLE = 'tables/SET_CURRENT_TABLE';
 export const CHANGE_TABLE_NAME = 'tables/CHANGE_TABLE_NAME';
 export const CREATE_TABLE = 'tables/CREATE_TABLE';
+export const CLEAR_TABLES = 'tables/CLEAR_TABLES';
 export const SEARCH_TABLES = 'tables/SEARCH_TABLES';

app/reducers/currentTable.js

@@ -876,6 +876,10 @@ export default function currentTable(state = { ...currentTableDefault }, action)
     }
     case types.CLOSE_ERRORS_MODAL:
       return Object.assign({}, state, { errors: currentTableDefault.errors });
+    case types.STOP_REFRESH:
+      return Object.assign({}, state, {
+        refresh: false
+      });
     case types.REFRESH_TABLE:
       return Object.assign({}, state, {
         refresh: true,

app/reducers/tables.js

@@ -43,6 +43,7 @@ export default function tables(tablesDefault = [], action) {
         }
       });
       return tablesDefault.slice();
+    case types.CLEAR_TABLES:
     case RESET_STATE:
       return [];
     default:

app/styles/theme/sidebar.less

@@ -9,7 +9,7 @@
   z-index: 21;
   height: 100%;
   max-width: 210px;
-  max-height: calc(~"100vh - 100px");
+  max-height: calc(~"100vh - 130px");
   overflow: auto;
   background-color: @light-black;
   color: white;