luneski/mqtt-explorer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: fix ui updates

Browse Source
This commit is contained in:
Thomas Nordquist
2024-05-22 15:06:58 +02:00
parent b3a37e4794
commit c88978f0dd
12 changed files with 67 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
app/src/components/Sidebar/Sidebar.tsx
View File

@@ -28,10 +28,10 @@ interface Props {
}
function useUpdateNodeWhenNodeReceivesUpdates(node?: q.TreeNode<any>) {
const [lastUpdate, setLastUpdate] = useState(0)
const [, setLastUpdate] = useState(0)
const updateNode = useCallback(
throttle(() => {
setLastUpdate(Date.now())
setLastUpdate(node ? node.lastUpdate : 0)
}, 300),
[node]
)
@@ -52,7 +52,6 @@ function Sidebar(props: Props) {
const { classes, tree, nodePath } = props
const node = usePollingToFetchTreeNode(tree, nodePath || '')
useUpdateNodeWhenNodeReceivesUpdates(node)
// console.log(node && node.path(), tree, nodePath)
return (
<div id="Sidebar" className={classes.drawer}>

6
app/src/components/Sidebar/TopicPanel/TopicTypeButton.tsx
View File

@@ -8,7 +8,7 @@ import Popper from '@material-ui/core/Popper'
import MenuItem from '@material-ui/core/MenuItem'
import MenuList from '@material-ui/core/MenuList'
import WarningRounded from '@material-ui/icons/WarningRounded'
import { IDecoder, decoders } from '../../../../../backend/src/Model/sparkplugb'
import { MessageDecoder, decoders } from '../../../decoders'
import { Tooltip } from '@material-ui/core'
export const TopicTypeButton = (props: { node?: q.TreeNode<any> }) => {
@@ -23,7 +23,7 @@ export const TopicTypeButton = (props: { node?: q.TreeNode<any> }) => {
const [open, setOpen] = React.useState(false)
const selectOption = useCallback(
(decoder: IDecoder, format: string) => {
(decoder: MessageDecoder, format: string) => {
if (!node) {
return
}
@@ -86,7 +86,7 @@ export const TopicTypeButton = (props: { node?: q.TreeNode<any> }) => {
)
}
function DecoderStatus({ node, decoder, format }: { node: q.TreeNode<any>; decoder: IDecoder; format: string }) {
function DecoderStatus({ node, decoder, format }: { node: q.TreeNode<any>; decoder: MessageDecoder; format: string }) {
const decoded = useMemo(() => {
return node.message?.payload && decoder.decode(node.message?.payload, format)
}, [node.message, decoder, format])