             dragleave: (e) => @show_upload(e, false)
             complete: =>@props.actions.set_directory_files(@props.current_path)
 
-        if @props.show_upload
-            <Col sm=12>
+        <div>
+            {<Col sm=12 key='upload'>
+                <div className='close-button pull-right'>
+                    <span
+                        onClick={=>@show_upload(null, false)}
+                        className='close-button-x'
+                        style={cursor: 'pointer', fontSize: '18px'}><i className="fa fa-times"></i></span>
+                </div>
                 <Tip icon='file' title='Drag and drop files'
                     tip='Drag and drop files from your computer into the box below to upload them into your project.  You can upload individual files that are up to 30MB in size.'>
                     <h4 style={color:"#666"}>Drag and drop files (Currently, each file must be under 30MB; for bigger files, use SSH as explained in project settings.)</h4>

                actions       = {@props.actions}
                create_file   = {@create_file}
                create_folder = {@create_folder} />
            <Button bsStyle={style} onClick={@props.actions.toggle_upload}><Icon name='upload' /> Upload</Button>
        </Col>

    render_activity : ->

                        eventHandlers={dropzone_handler}
                        djsConfig={previewTemplate: ReactDOMServer.renderToStaticMarkup(@dropzone_template())} />
                </div>
            </Col> if @props.show_upload}
            <Col sm=12 onDragEnter={(e) => @show_upload(e, true)}>
                {@render_terminal_mode()}
                {@parent_directory()}
                {@render_rows()}
                {@render_no_files()}
            </Col>
        </div>

ProjectFilesPath = rclass
    displayName : 'ProjectFiles-ProjectFilesPath'
