Add topic filter

app/src/actions/Connection.ts

@@ -4,6 +4,7 @@ import { Dispatch } from 'redux'
 import { rendererEvents, addMqttConnectionEvent, makeConnectionStateEvent, removeConnection } from '../../../events'
 import { AppState } from '../reducers'
 import * as q from '../../../backend/src/Model'
+import { showTree } from './Tree'
 
 export const connect = (options: MqttOptions, connectionId: string) => (dispatch: Dispatch<any>, getState: () => AppState) => {
   dispatch(connecting(connectionId))
@@ -14,6 +15,7 @@ export const connect = (options: MqttOptions, connectionId: string) => (dispatch
       const tree = new q.Tree()
       tree.updateWithConnection(rendererEvents, connectionId)
       dispatch(connected(tree))
+      dispatch(showTree(tree))
     } else if (dataSourceState.error) {
       dispatch(showError(dataSourceState.error))
       dispatch(disconnect())
@@ -36,11 +38,12 @@ export const showError = (error?: string) => ({
   type: ActionTypes.CONNECTION_SET_SHOW_ERROR,
 })
 
-export const disconnect = () => (dispatch: Dispatch<Action>, getState: () => AppState)  => {
+export const disconnect = () => (dispatch: Dispatch<any>, getState: () => AppState)  => {
   const { connectionId, tree } = getState().connection
   rendererEvents.emit(removeConnection, connectionId)
   tree && tree.stopUpdating()
 
+  dispatch(showTree(undefined))
   dispatch({
     type: ActionTypes.CONNECTION_SET_DISCONNECTED,
   })

app/src/actions/Settings.ts

@@ -1,4 +1,8 @@
 import { Action, ActionTypes, TopicOrder } from '../reducers/Settings'
+import { ActionTypes as TreeActionTypes, Action as TreeAction } from '../reducers/Tree'
+import { Dispatch } from 'redux'
+import { AppState } from '../reducers'
+import * as q from '../../../backend/src/Model'
 
 export const setAutoExpandLimit = (autoExpandLimit: number = 0): Action => {
   return {
@@ -20,9 +24,44 @@ export const setTopicOrder = (topicOrder: TopicOrder = TopicOrder.none): Action
   }
 }
 
-export const filterTopics = (topicFilter: string): Action => {
-  return {
+export const filterTopics = (filterStr: string) => (dispatch: Dispatch<any>, getState: () => AppState)  => {
+  const topicFilter = filterStr.toLowerCase()
+
+  dispatch({
     topicFilter,
     type: ActionTypes.SETTINGS_FILTER_TOPICS,
+  })
+
+  const { tree } = getState().connection
+  if (!tree) {
+    return
   }
+
+  if (!topicFilter) {
+    dispatch({
+      tree,
+      filter: '',
+      type: TreeActionTypes.TREE_SHOW_TREE,
+    })
+
+    return
+  }
+
+  const resultTree = tree.leafes()
+    .filter(leaf => leaf.path().toLowerCase().indexOf(topicFilter) !== -1)
+    .map((node) => {
+      const clone = node.unconnectedClone()
+      q.TreeNodeFactory.insertNodeAtPosition(node.path().split('/'), clone)
+      return clone.firstNode()
+    })
+    .reduce((a: q.TreeNode, b: q.TreeNode) => {
+      a.updateWithNode(b)
+      return a
+    }, new q.Tree())
+
+  dispatch({
+    tree: resultTree,
+    filter: topicFilter,
+    type: TreeActionTypes.TREE_SHOW_TREE,
+  })
 }

app/src/actions/Sidebar.ts

@@ -3,7 +3,7 @@ import { AppState } from '../reducers'
 import { makePublishEvent, rendererEvents } from '../../../events'
 
 export const clearRetainedTopic = () => (dispatch: Dispatch<Action>, getState: () => AppState)  => {
-  const { selectedTopic } = getState().tooBigReducer
+  const { selectedTopic } = getState().tree
   const { connectionId } = getState().connection
 
   if (!selectedTopic || !connectionId) {

app/src/actions/Tree.ts

@@ -1,10 +1,11 @@
-import { ActionTypes, CustomAction, AppState } from '../reducers'
+import { AppState } from '../reducers'
+import { ActionTypes } from '../reducers/Tree'
 import * as q from '../../../backend/src/Model'
 import { Dispatch } from 'redux'
 import { setTopic } from './Publish'
 
 export const selectTopic = (topic: q.TreeNode) => (dispatch: Dispatch<any>, getState: () => AppState)  => {
-  const { selectedTopic } = getState().tooBigReducer
+  const { selectedTopic } = getState().tree
 
   // Update publish topic
   if (selectedTopic && (selectedTopic.path() === getState().publish.topic || !getState().publish.topic)) {
@@ -13,6 +14,13 @@ export const selectTopic = (topic: q.TreeNode) => (dispatch: Dispatch<any>, getS
 
   dispatch({
     selectedTopic: topic,
-    type: ActionTypes.selectTopic,
+    type: ActionTypes.TREE_SELECT_TOPIC,
   })
 }
+
+export const showTree = (tree?: q.Tree) => {
+  return {
+    tree,
+    type: ActionTypes.TREE_SHOW_TREE,
+  }
+}