in plc4j/tools/ui/frontend/project/src/pages/Inspect.tsx [110:140]
export default function Inspect() {
const lists = useSelector((state: RootState) => {
console.log("Updated connections " + JSON.stringify(state.connections))
return state.connections
})
return (
<Splitter className="h-full">
<SplitterPanel
size={16} minSize={1}
className="flex align-items-center justify-content-center">
<TabView style={{width: '100%', height:'100%'}}>
<TabPanel header="By Driver" className="m-0">
<ScrollPanel style={{width: '100%', height:'100%'}} className="h-full">
<NavigationTree treeItems={getByDriverTree(lists.driverList, lists.deviceList)}/>
</ScrollPanel>
</TabPanel>
<TabPanel header="By Device">
<ScrollPanel style={{width: '100%', height:'100%'}}>
<NavigationTree treeItems={getByDeviceTree(lists.deviceList)}/>
</ScrollPanel>
</TabPanel>
</TabView>
</SplitterPanel>
<SplitterPanel size={84} className="flex align-items-center justify-content-center">
<TabView className="h-full w-full" panelContainerClassName="h-full">
<PlcConnection connectionString={"ads://192.168.23.20"}/>
</TabView>
</SplitterPanel>
</Splitter>
)
}