Screw up looks, greatly improve performance

app/src/components/Sidebar/NodeStats.tsx

@@ -25,15 +25,12 @@ class NodeStats extends React.Component<Props, State> {
   }
 
   public render() {
-    const leafes = this.props.node.leafes()
-    const leafMessages = leafes
-      .map(leaf => leaf.messages)
-      .reduce((a, b) => a + b)
+    const { node } = this.props
 
     return <div>
-      <Typography>Messages: #{this.props.node.messages}</Typography>
-      <Typography>Subtopics: {leafes.length}</Typography>
-      <Typography>Messages Subtopics: #{leafMessages}</Typography>
+      <Typography>Messages: #{node.messages}</Typography>
+      <Typography>Subtopics: {node.leafCount()}</Typography>
+      <Typography>Messages Subtopics: #{node.leafMessageCount()}</Typography>
     </div>
   }
 }

app/src/components/Sidebar/Topic.tsx

@@ -2,6 +2,7 @@ import * as React from 'react'
 import * as q from '../../../../backend/src/Model'
 import { withStyles, Theme, StyleRulesCallback } from '@material-ui/core/styles'
 import Button from '@material-ui/core/Button'
+const copy = require('copy-text-to-clipboard')
 
 interface Props {
   classes: any
@@ -50,7 +51,10 @@ class Topic extends React.Component<Props, {}> {
       prev.concat([<span key={key += 1}>/</span>]).concat(current),
     )
 
-    return <span style={{ lineHeight: '2.2em' }}>{joinedBreadCrumps}</span>
+    return <span style={{ lineHeight: '2.2em' }}>
+      <a onClick={() => copy(this.props.node && this.props.node.path())}>📋</a>
+      {joinedBreadCrumps}
+    </span>
   }
 }