Make topics selectable

app/src/actions/Tree.ts

@@ -3,22 +3,42 @@ import { ActionTypes } from '../reducers/Tree'
 import * as q from '../../../backend/src/Model'
 import { Dispatch, AnyAction } from 'redux'
 import { setTopic } from './Publish'
+import { TopicViewModel } from '../TopicViewModel'
+import { batchActions } from 'redux-batched-actions'
 
-export const selectTopic = (topic: q.TreeNode) => (dispatch: Dispatch<any>, getState: () => AppState): AnyAction  => {
+export const selectTopic = (topic: q.TreeNode<TopicViewModel>) => (dispatch: Dispatch<any>, getState: () => AppState)  => {
   const { selectedTopic } = getState().tree
-
-  // Update publish topic
-  if (selectedTopic && (selectedTopic.path() === getState().publish.topic || !getState().publish.topic)) {
-    dispatch(setTopic(topic.path()))
+  if (selectedTopic === topic) {
+    return
   }
 
-  return dispatch({
+  // Update publish topic
+  let setTopicDispatch: any | undefined
+  if (selectedTopic && (selectedTopic.path() === getState().publish.topic || !getState().publish.topic)) {
+    setTopicDispatch = setTopic(topic.path())
+  }
+
+  if (selectedTopic && selectedTopic.viewModel) {
+    selectedTopic.viewModel.setSelected(false)
+  }
+
+  if (topic.viewModel) {
+    topic.viewModel.setSelected(true)
+  }
+
+  const selectTreeTopicDispatch = {
     selectedTopic: topic,
     type: ActionTypes.TREE_SELECT_TOPIC,
-  })
+  }
+
+  if (setTopicDispatch) {
+    dispatch(batchActions([selectTreeTopicDispatch, setTopicDispatch]))
+  } else {
+    dispatch(selectTreeTopicDispatch)
+  }
 }
 
-export const showTree = (tree?: q.Tree) => (dispatch: Dispatch<any>, getState: () => AppState): AnyAction  => {
+export const showTree = (tree?: q.Tree<TopicViewModel>) => (dispatch: Dispatch<any>, getState: () => AppState): AnyAction  => {
   const visibleTree = getState().tree.tree
   const connectionTree = getState().connection.tree