         @props.toggle path
 
   TreeComponent = React.createClass
-    statics:
-      subpath: (path) ->
-        if path == ''
-          '*'
-        else
-          "#{path}.*"
+    displayName: 'TreeComponent'
+    propTypes:
+      root: React.PropTypes.string.isRequired
+      load: React.PropTypes.func.isRequired
+      load_children: React.PropTypes.func.isRequired
+      create_node: React.PropTypes.func.isRequired
+      create_error_node: React.PropTypes.func.isRequired
 
     getDefaultProps: ->
       root: ''

        @close path

    value: (path) ->
      @state.cache[path]?.inspect()?.value?.result

    open: (path) ->
      tree_state = _.clone @state.tree_state

    componentWillMount: ->
      @open @props.root
    render: ->
      React.DOM.ul {className: 'simple-tree'},
        @props.create_node {
          value: @value
          tree_state: @state.tree_state
          node: {path: @props.root, is_leaf: false}
          toggle: @toggle
          load: @props.load
          create_node: @props.create_node
          create_error_node: @props.create_error_node
        }, name

  component_fn 'tree', 'Generates a browsable tree of metrics', (ctx, query) ->
    TreeComponent
      root: query ? '',
      load: (path) =>
        ctx.run "q(#{JSON.stringify path})"
      load_children: (path) ->
        if path == ''
          subpath = '*'
        else
          subpath = "#{path}.*"
        graphite.find(subpath).get 'result'
      create_node: (props) ->
        if props.node.path == ''
          name = 'All Metrics'
        else
          parts = props.node.path.split '.'
          name = parts[parts.length - 1]
        TreeNodeComponent _.extend({}, props, {name}), name
      create_error_node: (props) ->
        React.DOM.div null,
          React.DOM.i {className: 'fa fa-exclamation-triangle'}
          ' Error loading metric names'


  FindResultsComponent = React.createClass
