Describe the bug
Refreshing the page after a File Block after an invalid file type has been added results in a block in an erroneous state

Related to umbrella issue #8119, since this happens when the file block edit componentDidMount and triggers particular transitions in state.

To Reproduce
Steps to reproduce the behavior:

1. Create a new post
2. Drag and drop a file with an unsupported file type (.exe, .dmg, .json etc.)
3. Observe that a file block is created and displays an error "Sorry, this file type is not permitted for security reasons."
4. Update/Save the post
5. Refresh the page
6. Observe that 'This block has encountered an error and cannot be previewed.' is displayed where the file block once was.

Expected behavior
The file block should still be displayed and should probably not display any kind of error.

Screenshots

Desktop (please complete the following information):

• OS: Mac OS
• Browser: Chrome
• Version: 67

Additional context

• Discovered while testing File block: Handle drag-and-drop errors #8066, but not caused by it
• This is caused by the file block retaining the 'href' attribute for a blob that no longer exists after previously encountering an error. When mounting after the page reload the file variable is undefined. The call to mediaUpload then results in an error:
  

  gutenberg/core-blocks/file/edit.js

  Lines 58 to 68 in 7aacd2d

  	const file = getBlobByURL( href );
  	mediaUpload( {
  	allowedType: '*',
  	filesList: [ file ],
  	onFileChange: ( [ media ] ) => this.onSelectFile( media ),
  	onError: ( message ) => {
  	this.setState( { hasError: true } );
  	noticeOperations.createErrorNotice( message );
  	},
  	} );