refactor: show number of elements in message

src/components/header.tsx

@@ -47,7 +47,6 @@ const Head = styled.div`
     display: grid;
     grid-template-columns: auto 1fr auto;
     width: 100%;
-    .back-button,
     .left {
       cursor: pointer;
     }
@@ -56,8 +55,6 @@ const Head = styled.div`
       font-weight: bold;
       align-self: center;
     }
-    .right {
-    }
     .icon {
       cursor: pointer;
     }

src/components/message.tsx

@@ -12,6 +12,7 @@ interface Props {
 const Message: FunctionComponent<Props> = ({ data, instanceId }) => {
   const username = data.user.name || '';
   const colorClass = colors[data.user.color] || 'blue';
+  const selection = data?.message?.selection;
 
   return (
     <MessageContainer
@@ -25,17 +26,18 @@ const Message: FunctionComponent<Props> = ({ data, instanceId }) => {
           </div>
         )}
       </MessageHeader>
-      {data.message.selection ? (
+      {selection ? (
         <span
           onClick={() =>
             sendMainMessage('focus-nodes', {
-              ids: data.message.selection
+              ids: selection
             })
           }
         >
           {data.message.text}
           <button className="selection button button--secondary">
-            attached elements
+            attached {selection.length} element
+            {selection.length > 1 ? 's' : ''}
           </button>
         </span>
       ) : (

src/views/minimized.tsx

@@ -51,6 +51,7 @@ const Maximize = styled.div`
     }
   }
 `;
+
 const Minimized = styled.div`
   display: grid;
   text-align: center;