Update the text to be clear that the export was successfull

Summary: This diff adds the capability to show the plugin names for which flipper failed to fetch metadata. These changes are done for both export as URL and export as File. This diff also fixes the logging for the export as a file and logs the result object in scuba.

Reviewed By: jknoxville

Differential Revision: D20724860

fbshipit-source-id: 4c9591267ca05045e0ed084804d96851c9d7636d

desktop/app/src/chrome/ShareSheetExportFile.tsx

@@ -18,6 +18,7 @@ import {Idler} from '../utils/Idler';
 import {
   exportStoreToFile,
   EXPORT_FLIPPER_TRACE_EVENT,
+  displayFetchMetadataErrors,
 } from '../utils/exportData';
 import ShareSheetErrorList from './ShareSheetErrorList';
 import ShareSheetPendingDialog from './ShareSheetPendingDialog';
@@ -53,7 +54,9 @@ type Props = {
 };
 
 type State = {
-  errorArray: Array<Error>;
+  fetchMetaDataErrors: {
+    [plugin: string]: Error;
+  } | null;
   result:
     | {
         kind: 'success';
@@ -77,7 +80,7 @@ export default class ShareSheetExportFile extends Component<Props, State> {
   }
 
   state: State = {
-    errorArray: [],
+    fetchMetaDataErrors: null,
     result: {kind: 'pending'},
     statusUpdate: null,
     runInBackground: false,
@@ -106,7 +109,7 @@ export default class ShareSheetExportFile extends Component<Props, State> {
       if (!this.props.file) {
         return;
       }
-      const {errorArray} = await reportPlatformFailures(
+      const {fetchMetaDataErrors} = await reportPlatformFailures(
         exportStoreToFile(
           this.props.file,
           this.store,
@@ -130,18 +133,31 @@ export default class ShareSheetExportFile extends Component<Props, State> {
         });
         return;
       }
-      this.setState({errorArray, result: {kind: 'success'}});
+      this.setState({fetchMetaDataErrors, result: {kind: 'success'}});
       this.props.logger.trackTimeSince(mark, 'export:file-success');
     } catch (err) {
+      const result: {
+        kind: 'error';
+        error: Error;
+      } = {
+        kind: 'error',
+        error: err,
+      };
       if (!this.state.runInBackground) {
-        this.setState({errorArray: [], result: {kind: 'error', error: err}});
+        // Show the error in UI.
+        this.setState({result});
       }
-      this.props.logger.trackTimeSince(mark, 'export:file-error');
+      this.store.dispatch(unsetShare());
+      this.props.logger.trackTimeSince(mark, 'export:file-error', result);
       throw err;
     }
   }
 
   renderSuccess() {
+    const {title, errorArray} = displayFetchMetadataErrors(
+      this.state.fetchMetaDataErrors,
+    );
+
     return (
       <ReactReduxContext.Consumer>
         {({store}) => (
@@ -153,7 +169,11 @@ export default class ShareSheetExportFile extends Component<Props, State> {
                 might contain sensitive information like access tokens used in
                 network requests.
               </InfoText>
-              <ShareSheetErrorList errors={this.state.errorArray} />
+              <ShareSheetErrorList
+                errors={errorArray}
+                title={title}
+                type={'warning'}
+              />
             </FlexColumn>
             <FlexRow>
               <Spacer />