feat: chat center

src/client/chat--center.jsx

@@ -0,0 +1,11 @@
+import './chat--center.scss';
+
+import React from 'react';
+
+export default function ChatCenter() {
+  return (
+    <div className="chat__center flexed" />
+  );
+}
+
+ChatCenter.propTypes = {};

src/client/chat--center.scss

@@ -0,0 +1,3 @@
+.chat__center {
+  flex-grow: 1;
+}

src/client/chat.jsx

@@ -2,6 +2,7 @@ import './chat.scss';
 
 import React from 'react';
 
+import ChatCenter from './chat--center';
 import ChatLeft from './chat--left';
 import ChatRight from './chat--right';
 
@@ -9,7 +10,7 @@ export default function Chat() {
   return (
     <div className="chat">
       <ChatLeft />
-      <div className="chat__messages flexed"></div>
+      <ChatCenter />
       <ChatRight />
     </div>
   );

src/client/chat.scss

@@ -9,7 +9,3 @@
   width: 4em;
   overflow: hidden;
 }
-
-.chat__messages {
-  flex-grow: 1;
-}