add ability to delete file/folder to new_files

closes: CNVS-14726
refs: CNVS-12727

test plan:
* go to new files,
* click the cog at the right end of the row,
* click the "Delete" option
* it should disappear
* reload the page, make sure it is still not there

Change-Id: Ieb6d1246885e1e7f4709bd6b2946fa58d8f3cdec
Reviewed-on: https://gerrit.instructure.com/39157
Reviewed-by: Jason Madsen <jmadsen@instructure.com>
Tested-by: Jenkins <jenkins@instructure.com>
Product-Review: Ryan Shaw <ryan@instructure.com>
QA-Review: Ryan Shaw <ryan@instructure.com>

app/coffeescripts/models/File.coffee

@@ -14,6 +14,18 @@ define [
   #    where <input> is the DOM node (not $-wrapped) of the file input
   class File extends Model
 
+    url: ->
+      if @isNew()
+        # if it is new, fall back to Backbone's default behavior of using
+        # the url of the collection this model belongs to.
+        # aka: POST /api/v1/folders/:folder_id/files (to create)
+        super
+      else
+        # for GET, PUT, and DELETE, our API expects "/api/v1/files/:file_id"
+        # not "/api/v1/folders/:folder_id/files/:file_id" which is what
+        # backbone would do by default.
+        "/api/v1/files/#{@id}"
+
     initialize: (attributes, options) ->
       @preflightUrl = options.preflightUrl
       super

app/coffeescripts/react_files/components/ItemCog.coffee

@@ -1,12 +1,13 @@
 define [
   'react'
   'compiled/react/shared/utils/withReactDOM'
+  'compiled/fn/preventDefault'
   'compiled/models/Folder'
   'compiled/models/File'
   './RestrictedDialogForm'
   './DialogAdapter'
-  'i18n!dialog_adapter'
-], (React, withReactDOM, Folder, File, RestrictedDialogForm, $DialogAdapter, I18n) ->
+  'i18n!react_files'
+], (React, withReactDOM, preventDefault, Folder, File, RestrictedDialogForm, $DialogAdapter, I18n) ->
 
   # Expects @props.model to be either a folder or a file collection/backbone model
   ItemCog = React.createClass
@@ -22,13 +23,19 @@ define [
 
     isAFolderCog: -> @props.model instanceof Folder
 
-    openRestrictedDialog: (event) ->
-      event.preventDefault()
+    openRestrictedDialog: preventDefault ->
       @setState restrictedDialogOpen: true
 
     closeRestrictedDialog: ->
       @setState restrictedDialogOpen: false
 
+    deleteItem: preventDefault ->
+      message = I18n.t('confirm_delete', 'Are you sure you want to delete %{name}?', {
+        name: @props.model.get('name') || @props.model.get('display_name')
+      })
+      if confirm message
+        @props.model.destroy()
+
     render: withReactDOM ->
       div null,
 
@@ -52,7 +59,7 @@ define [
                 li {},
                   a onClick: @openRestrictedDialog, href:'#', id:'content-3', tabIndex:'-1', role:'menuitem', title:'Restrict Access', 'Restrict Access'
                 li {},
-                  a href:'#', id:'content-3', tabIndex:'-1', role:'menuitem', title:'Delete', 'Delete'
+                  a onClick: @deleteItem, href:'#', id:'content-3', tabIndex:'-1', role:'menuitem', title:'Delete', 'Delete'
 
                 (li {},
                   a href:'#', id:'content-3', tabIndex:'-1', role:'menuitem', title:'Download as Zip',

app/coffeescripts/react_files/components/ShowFolder.coffee

@@ -1,4 +1,5 @@
 define [
+  'underscore'
   'react'
   'i18n!react_files'
   'compiled/react/shared/utils/withReactDOM'
@@ -8,10 +9,28 @@ define [
   '../utils/getAllPages'
   '../utils/updateAPIQuerySortParams'
   'compiled/models/Folder'
-], (React, I18n, withReactDOM, ColumnHeaders, LoadingIndicator, FolderChild, getAllPages, updateAPIQuerySortParams, Folder) ->
+], (_, React, I18n, withReactDOM, ColumnHeaders, LoadingIndicator, FolderChild, getAllPages, updateAPIQuerySortParams, Folder) ->
 
   ShowFolder = React.createClass
 
+    debouncedForceUpdate: _.debounce ->
+      @forceUpdate() if @isMounted()
+    , 0
+
+
+    registerListeners: (props) ->
+      return unless props.currentFolder
+      props.currentFolder.folders.on('all', @debouncedForceUpdate, this)
+      props.currentFolder.files.on('all', @debouncedForceUpdate, this)
+
+    unregisterListeners: ->
+      # Ensure that we clean up any dangling references when the component is destroyed.
+      @props.currentFolder?.off(null, null, this)
+
+    componentWillUnmount: ->
+      @unregisterListeners()
+
+
     getCurrentFolder: ->
       path = '/' + (@props.params.splat || '')
       Folder.resolvePath(@props.params.contextType, @props.params.contextId, path).then (rootTillCurrentFolder) =>
@@ -21,9 +40,10 @@ define [
         [currentFolder.folders, currentFolder.files].forEach (collection) =>
           updateAPIQuerySortParams(collection, @props.query)
           # TODO: use scroll position to only fetch the pages we need
-          getAllPages collection, => @forceUpdate() if @isMounted()
+          getAllPages(collection, @debouncedForceUpdate)
 
     componentWillMount: ->
+      @registerListeners(@props)
       @getCurrentFolder()
 
     componentWillUnmount: ->
@@ -32,7 +52,9 @@ define [
 
 
     componentWillReceiveProps: (newProps) ->
+      @unregisterListeners()
       return unless newProps.currentFolder
+      @registerListeners(newProps)
       [newProps.currentFolder.folders, newProps.currentFolder.files].forEach (collection) ->
         updateAPIQuerySortParams(collection, newProps.query)