Reset store after disconnect
This commit is contained in:
@@ -2,6 +2,10 @@
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta
|
||||
name="viewport"
|
||||
content="minimum-scale=1, initial-scale=1, width=device-width, shrink-to-fit=no"
|
||||
>
|
||||
<title>MQTT Explorer</title>
|
||||
<script src="./bugtracking.bundle.js"></script>
|
||||
|
||||
|
||||
@@ -1,12 +1,13 @@
|
||||
import * as q from '../../../backend/src/Model'
|
||||
import * as url from 'url'
|
||||
import { Action, ActionTypes } from '../reducers/Connection'
|
||||
import { Action as SettingsAction, ActionTypes as SettingsActionTypes } from '../reducers/Settings'
|
||||
import { AppState } from '../reducers'
|
||||
import { DataSourceState, MqttOptions } from '../../../backend/src/DataSource'
|
||||
import { Dispatch } from 'redux'
|
||||
import { globalActions } from '.'
|
||||
import { showError } from './Global'
|
||||
import { showTree } from './Tree'
|
||||
import { showTree, resetStore as resetTreeStore } from './Tree'
|
||||
import { TopicViewModel } from '../model/TopicViewModel'
|
||||
import {
|
||||
addMqttConnectionEvent,
|
||||
@@ -52,8 +53,6 @@ const updateHealth = (dataSourceState: DataSourceState) => (dispatch: Dispatch<a
|
||||
state = undefined
|
||||
}
|
||||
|
||||
console.log(state)
|
||||
|
||||
dispatch({
|
||||
type: ActionTypes.CONNECTION_SET_HEALTH,
|
||||
health: state,
|
||||
@@ -79,8 +78,13 @@ export const disconnect = () => (dispatch: Dispatch<any>, getState: () => AppSta
|
||||
}
|
||||
|
||||
tree && tree.stopUpdating()
|
||||
// Clear topic filter
|
||||
dispatch({
|
||||
topicFilter: '',
|
||||
type: SettingsActionTypes.SETTINGS_FILTER_TOPICS,
|
||||
})
|
||||
|
||||
dispatch(showTree(undefined))
|
||||
dispatch(resetTreeStore())
|
||||
dispatch({
|
||||
type: ActionTypes.CONNECTION_SET_DISCONNECTED,
|
||||
})
|
||||
|
||||
@@ -4,7 +4,7 @@ import { AppState } from '../reducers'
|
||||
import { makePublishEvent, rendererEvents } from '../../../events'
|
||||
|
||||
export const clearRetainedTopic = () => (dispatch: Dispatch<any>, getState: () => AppState) => {
|
||||
const { selectedTopic } = getState().tree
|
||||
const selectedTopic = getState().tree.get('selectedTopic')
|
||||
if (!selectedTopic) {
|
||||
return
|
||||
}
|
||||
|
||||
@@ -13,7 +13,7 @@ export const selectTopic = (topic: q.TreeNode<TopicViewModel>) => (dispatch: Dis
|
||||
}
|
||||
|
||||
const debouncedSelectTopic = debounce((topic: q.TreeNode<TopicViewModel>, dispatch: Dispatch<any>, getState: () => AppState) => {
|
||||
const { selectedTopic } = getState().tree
|
||||
const selectedTopic = getState().tree.get('selectedTopic')
|
||||
if (selectedTopic === topic) {
|
||||
return
|
||||
}
|
||||
@@ -44,8 +44,14 @@ const debouncedSelectTopic = debounce((topic: q.TreeNode<TopicViewModel>, dispat
|
||||
}
|
||||
}, 70)
|
||||
|
||||
export const showTree = (tree?: q.Tree<TopicViewModel>) => (dispatch: Dispatch<any>, getState: () => AppState): AnyAction => {
|
||||
const visibleTree = getState().tree.tree
|
||||
export const resetStore = () => (dispatch: Dispatch<any>): AnyAction => {
|
||||
return dispatch({
|
||||
type: ActionTypes.TREE_RESET_STORE,
|
||||
})
|
||||
}
|
||||
|
||||
export const showTree = (tree: q.Tree<TopicViewModel> | undefined) => (dispatch: Dispatch<any>, getState: () => AppState): AnyAction => {
|
||||
const visibleTree = getState().tree.get('tree')
|
||||
const connectionTree = getState().connection.tree
|
||||
|
||||
// Stop updates of old tree
|
||||
@@ -60,8 +66,8 @@ export const showTree = (tree?: q.Tree<TopicViewModel>) => (dispatch: Dispatch<a
|
||||
}
|
||||
|
||||
export const togglePause = (tree?: q.Tree<TopicViewModel>) => (dispatch: Dispatch<any>, getState: () => AppState) => {
|
||||
const paused = getState().tree.paused
|
||||
const tree = getState().tree.tree
|
||||
const paused = getState().tree.get('paused')
|
||||
const tree = getState().tree.get('tree')
|
||||
const changes = tree ? tree.unmergedChanges().length : 0
|
||||
|
||||
if (paused && changes > 0) {
|
||||
@@ -79,5 +85,4 @@ export const togglePause = (tree?: q.Tree<TopicViewModel>) => (dispatch: Dispatc
|
||||
dispatch({
|
||||
type: paused ? ActionTypes.TREE_RESUME_UPDATES : ActionTypes.TREE_PAUSE_UPDATES,
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
@@ -84,8 +84,8 @@ class PauseButton extends React.Component<Props, {changes: number}> {
|
||||
|
||||
const mapStateToProps = (state: AppState) => {
|
||||
return {
|
||||
paused: state.tree.paused,
|
||||
tree: state.tree.tree,
|
||||
paused: state.tree.get('paused'),
|
||||
tree: state.tree.get('tree'),
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -185,7 +185,7 @@ class Sidebar extends React.Component<Props, State> {
|
||||
|
||||
const mapStateToProps = (state: AppState) => {
|
||||
return {
|
||||
node: state.tree.selectedTopic,
|
||||
node: state.tree.get('selectedTopic'),
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -180,7 +180,7 @@ const mapDispatchToProps = (dispatch: any) => {
|
||||
const mapStateToProps = (state: AppState) => {
|
||||
return {
|
||||
valueRendererDisplayMode: state.settings.get('valueRendererDisplayMode'),
|
||||
node: state.tree.selectedTopic,
|
||||
node: state.tree.get('selectedTopic'),
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -123,9 +123,9 @@ class Tree extends React.PureComponent<Props, State> {
|
||||
|
||||
const mapStateToProps = (state: AppState) => {
|
||||
return {
|
||||
tree: state.tree.tree,
|
||||
paused: state.tree.paused,
|
||||
filter: state.tree.filter,
|
||||
tree: state.tree.get('tree'),
|
||||
paused: state.tree.get('paused'),
|
||||
filter: state.tree.get('filter'),
|
||||
host: state.connection.host,
|
||||
settings: state.settings,
|
||||
}
|
||||
|
||||
@@ -1,22 +1,26 @@
|
||||
import * as q from '../../../backend/src/Model'
|
||||
import { Action } from 'redux'
|
||||
import { createReducer } from './lib'
|
||||
import { Record } from 'immutable'
|
||||
import { TopicViewModel } from '../model/TopicViewModel'
|
||||
|
||||
export interface TreeState {
|
||||
interface TreeStateModel {
|
||||
tree?: q.Tree<TopicViewModel>
|
||||
selectedTopic?: q.TreeNode<TopicViewModel>
|
||||
filter?: string
|
||||
paused: boolean
|
||||
}
|
||||
|
||||
export type Action = ShowTree | SelectTopic
|
||||
export type TreeState = Record<TreeStateModel>
|
||||
|
||||
export type Action = ShowTree | SelectTopic | ResetStore
|
||||
|
||||
export enum ActionTypes {
|
||||
TREE_SHOW_TREE = 'TREE_SHOW_TREE',
|
||||
TREE_SELECT_TOPIC = 'TREE_SELECT_TOPIC',
|
||||
TREE_RESUME_UPDATES = 'TREE_RESUME_UPDATES',
|
||||
TREE_PAUSE_UPDATES = 'TREE_PAUSE_UPDATES',
|
||||
TREE_RESET_STORE = 'TREE_RESET_STORE',
|
||||
}
|
||||
|
||||
export interface ShowTree {
|
||||
@@ -34,35 +38,42 @@ export interface SetPause {
|
||||
type: ActionTypes.TREE_PAUSE_UPDATES | ActionTypes.TREE_RESUME_UPDATES
|
||||
}
|
||||
|
||||
const initialState: TreeState = {
|
||||
const initialStateFactory = Record<TreeStateModel>({
|
||||
paused: false,
|
||||
tree: undefined,
|
||||
selectedTopic: undefined,
|
||||
filter: undefined,
|
||||
})
|
||||
|
||||
const setPaused = (pause: boolean) => (state: TreeState, action: ShowTree): TreeState => {
|
||||
return state.set('paused', pause)
|
||||
}
|
||||
|
||||
const setPaused = (pause: boolean) => (state: TreeState, action: ShowTree) => {
|
||||
return {
|
||||
...state,
|
||||
paused: pause,
|
||||
}
|
||||
}
|
||||
|
||||
export const treeReducer = createReducer(initialState, {
|
||||
const actions: {[s: string]: (state: TreeState, action: Action) => TreeState} = {
|
||||
TREE_SHOW_TREE: showTree,
|
||||
TREE_SELECT_TOPIC: selectTopic,
|
||||
TREE_PAUSE_UPDATES: setPaused(true),
|
||||
TREE_RESUME_UPDATES: setPaused(false),
|
||||
})
|
||||
TREE_RESET_STORE: resetStore,
|
||||
}
|
||||
|
||||
function showTree(state: TreeState, action: ShowTree) {
|
||||
return {
|
||||
...state,
|
||||
export const treeReducer = createReducer(initialStateFactory(), actions)
|
||||
|
||||
function showTree(state: TreeState, action: ShowTree): TreeState {
|
||||
return state.merge({
|
||||
tree: action.tree,
|
||||
filter: action.filter,
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function selectTopic(state: TreeState, action: SelectTopic) {
|
||||
return {
|
||||
...state,
|
||||
selectedTopic: action.selectedTopic,
|
||||
function selectTopic(state: TreeState, action: SelectTopic): TreeState {
|
||||
return state.set('selectedTopic', action.selectedTopic)
|
||||
}
|
||||
|
||||
export interface ResetStore {
|
||||
type: ActionTypes.TREE_RESET_STORE
|
||||
}
|
||||
|
||||
function resetStore(state: TreeState, action: ResetStore): TreeState {
|
||||
return initialStateFactory()
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user