         tree_state[path] = 'opening'
 
         if !state or state.isRejected()
-          promise = graphite.find(TreeComponent.subpath(path))
+          promise = @props.load_children path
           cache[path] = promise
           promise.then (result) =>
             return unless @state.cache[path] == promise

        @props.toggle path

  TreeComponent = React.createClass
    statics:
      subpath: (path) ->
        if path == ''
          '*'
        else
          "#{path}.*"

    getDefaultProps: ->
      root: ''

    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
