Changed DeviceView structure

app/components/App.tsx

@@ -1,7 +1,6 @@
 import { observer } from "mobx-react";
 import DevTools from "mobx-react-devtools";
 import * as React from "react";
-import { Item } from "semantic-ui-react";
 
 import { DevicesView, MessagesView } from "@app/components";
 
@@ -12,11 +11,11 @@ import "semantic-ui-css/semantic.css";
 class App extends React.Component {
     render() {
         return (
-            <Item.Group divided>
+            <div>
                 <MessagesView />
                 <DevicesView />
                 <DevTools />
-            </Item.Group>
+            </div>
         );
     }
 }

app/components/DevicesView.tsx

@@ -1,11 +1,16 @@
 import { observer } from "mobx-react";
 import * as React from "react";
+import { Item } from "semantic-ui-react";
 
 import DeviceView from "@app/components/DeviceView";
 
 class DevicesView extends React.Component {
     render() {
-        return <DeviceView deviceId="grinklers" />;
+        return (
+            <Item.Group divided>
+                <DeviceView deviceId="grinklers" />
+            </Item.Group>
+        );
     }
 }
 

app/components/MessagesView.tsx

@@ -37,11 +37,9 @@ class MessagesView extends React.Component<{ state: State }> {
             <MessageView key={message.id} uiStore={uiStore} message={message} index={index} />
         ));
         return (
-            <div className="messages" >
+            <TransitionGroup className="messages" animation="scale" duration={200}>
-                <TransitionGroup animation="scale" duration={200}>
+                {messages}
-                    {messages}
+            </TransitionGroup>
-                </TransitionGroup>
-            </div>
         );
     }
 }

app/components/SectionRunnerView.tsx

@@ -10,6 +10,7 @@ export default class SectionRunnerView extends React.Component<{ sectionRunner:
         return (
             <Segment>
                 <h4>Section Runner Queue</h4>
+                {this.props.sectionRunner.toString()}
             </Segment>
         );
     }