debounce tile sort order

3 files changed, 13 insertions, 12 deletions

diff --git a/frontend/views/page/components/tile.list.js b/frontend/views/page/components/tile.list.js
index 232516d..1cdf4af 100644
--- a/frontend/views/page/components/tile.list.js
+++ b/frontend/views/page/components/tile.list.js
@@ -16,16 +16,12 @@ class TileList extends Component {
   componentDidMount(prevProps) {
     const { tiles } = this.props.page.show.res
     this.setState({ tiles })
-    // this.props.pageActions.setTileSortOrder(list)
   }
 
   componentDidUpdate(prevProps, prevState) {
     const { tiles } = this.state
-    const { tiles: oldTiles } = prevState
-    // const { tiles } = this.props.page.show.res
-    // const { tiles: oldTiles } = prevProps.page.show.res
-    if (tiles !== oldTiles) {
-      this.props.pageActions.setTileSortOrder(tiles)
+    if (tiles !== prevState.tiles) {
+      this.props.pageActions.setTileSortOrder(tiles, this.props.page.show.res.tiles)
     }
   }
 
diff --git a/frontend/views/page/page.actions.js b/frontend/views/page/page.actions.js
index dd94936..c382081 100644
--- a/frontend/views/page/page.actions.js
+++ b/frontend/views/page/page.actions.js
@@ -1,6 +1,7 @@
 import * as types from '../../types'
 import { store } from '../../store'
 import actions from '../../actions'
+import { default as debounce } from 'lodash.debounce'
 
 export const showAddTileForm = () => dispatch => {
   dispatch({ type: types.page.show_add_tile_form })
@@ -66,12 +67,13 @@ export const showGraphIfUnloaded = ({ graph_name }) => dispatch => (
   })
 )
 
-export const setTileSortOrder = tiles => dispatch => {
+export const setTileSortOrder = (tiles, oldTiles) => dispatch => {
   dispatch({ type: types.page.set_tile_sort_order, tiles })
-  updateTileSortOrder(tiles)(dispatch)
-}
-
-export const updateTileSortOrder = tiles => dispatch => {
-
+  updateTileSortOrder(tiles, oldTiles)
 }
 
+export const updateTileSortOrder = debounce((tiles, oldTiles) => {
+  if (tiles !== oldTiles) {
+    console.log('update tile sort order')
+  }
+}, 1000)
diff --git a/frontend/views/page/page.css b/frontend/views/page/page.css
index d828b82..7794254 100644
--- a/frontend/views/page/page.css
+++ b/frontend/views/page/page.css
@@ -35,6 +35,9 @@
   margin-bottom: 0.5rem;
   box-shadow: 4px 4px 6px rgba(0,0,0,0.5);
 }
+.tileList .row:last-child {
+  margin-bottom: 0;
+}
 .tileList .row:nth-child(odd) {
   background: rgba(0,0,0,0.2);
 }