Create and upload a universal export when using the support request link

Summary: Design doc: https://docs.google.com/document/d/1HLCFl46RfqG0o1mSt8SWrwf_HMfOCRg_oENioc1rkvQ/edit#

Reviewed By: passy

Differential Revision: D40586468

fbshipit-source-id: 4d6a8706c7d1cad1951bda701c51f0998c985628

desktop/flipper-ui-core/src/sandy-chrome/LeftRail.tsx

@@ -255,8 +255,6 @@ function ExtrasMenu() {
   const {showWelcomeAtStartup} = settings;
   const [welcomeVisible, setWelcomeVisible] = useState(showWelcomeAtStartup);
 
-  const fullState = useStore((state) => state);
-
   return (
     <>
       <NUX
@@ -305,21 +303,7 @@ function ExtrasMenu() {
               </Menu.Item>
             </Menu.SubMenu>
             <Menu.Divider />
-            {config.isFBBuild ? (
-              <>
-                <Menu.Item
-                  key="feedback"
-                  onClick={() => {
-                    getLogger().track('usage', 'support-form-source', {
-                      source: 'sidebar',
-                      group: undefined,
-                    });
-                    openSupportRequestForm(fullState);
-                  }}>
-                  Feedback
-                </Menu.Item>
-              </>
-            ) : null}
+            {config.isFBBuild ? <OpenSupportRequestMenuItem /> : null}
             <Menu.Item key="settings" onClick={() => setShowSettings(true)}>
               Settings
             </Menu.Item>
@@ -433,21 +417,51 @@ function DebugLogsButton({
   );
 }
 
-function ExportEverythingEverywhereAllAtOnceButton() {
+function OpenSupportRequestMenuItem() {
   const store = useStore();
+
   const [status, setStatus] = useState<
     ExportEverythingEverywhereAllAtOnceStatus | undefined
   >();
+
+  return (
+    <>
+      <ExportEverythingEverywhereAllAtOnceStatusModal
+        status={status}
+        setStatus={setStatus}
+      />
+      <Menu.Item
+        key="feedback"
+        onClick={async () => {
+          getLogger().track('usage', 'support-form-source', {
+            source: 'sidebar',
+            group: undefined,
+          });
+          await exportEverythingEverywhereAllAtOnce(
+            store,
+            (...args) => setStatus(args),
+            true,
+          );
+        }}>
+        Feedback
+      </Menu.Item>
+    </>
+  );
+}
+
+function ExportEverythingEverywhereAllAtOnceStatusModal({
+  status,
+  setStatus,
+}: {
+  status: ExportEverythingEverywhereAllAtOnceStatus | undefined;
+  setStatus: (
+    newStatus: ExportEverythingEverywhereAllAtOnceStatus | undefined,
+  ) => void;
+}) {
   const [statusMessage, setStatusMessage] = useState<JSX.Element | undefined>();
 
-  const exportEverythingEverywhereAllAtOnceTracked = useTrackedCallback(
-    'Debug data export',
-    () => exportEverythingEverywhereAllAtOnce(store, setStatus),
-    [store, setStatus],
-  );
-
   useEffect(() => {
-    switch (status) {
+    switch (status?.[0]) {
       case 'logs': {
         setStatusMessage(<p>Exporting Flipper logs...</p>);
         return;
@@ -492,6 +506,23 @@ function ExportEverythingEverywhereAllAtOnceButton() {
         setStatusMessage(<p>Creating an archive...</p>);
         return;
       }
+      case 'upload': {
+        setStatusMessage(<p>Uploading the archive...</p>);
+        return;
+      }
+      case 'support': {
+        setStatusMessage(<p>Creating a support request...</p>);
+        return;
+      }
+      case 'error': {
+        setStatusMessage(
+          <>
+            <p>Oops! Something went wrong.</p>
+            <p>{status[1]}</p>
+          </>,
+        );
+        return;
+      }
       case 'done': {
         setStatusMessage(<p>Done!</p>);
         return;
@@ -503,18 +534,39 @@ function ExportEverythingEverywhereAllAtOnceButton() {
     }
   }, [status]);
 
+  return (
+    <Modal
+      visible={!!status}
+      centered
+      onCancel={() => {
+        setStatus(undefined);
+      }}
+      title="Exporting everything everywhere all at once"
+      footer={null}>
+      {statusMessage}
+    </Modal>
+  );
+}
+
+function ExportEverythingEverywhereAllAtOnceButton() {
+  const store = useStore();
+  const [status, setStatus] = useState<
+    ExportEverythingEverywhereAllAtOnceStatus | undefined
+  >();
+
+  const exportEverythingEverywhereAllAtOnceTracked = useTrackedCallback(
+    'Debug data export',
+    () =>
+      exportEverythingEverywhereAllAtOnce(store, (...args) => setStatus(args)),
+    [store, setStatus],
+  );
+
   return (
     <>
-      <Modal
-        visible={!!status}
-        centered
-        onCancel={() => {
-          setStatus(undefined);
-        }}
-        title="Exporting everything everywhere all at once"
-        footer={null}>
-        {statusMessage}
-      </Modal>
+      <ExportEverythingEverywhereAllAtOnceStatusModal
+        status={status}
+        setStatus={setStatus}
+      />
       <NUX title="Press this button if you have issues with Flipper. It will collect Flipper debug data that you can send to the Flipper team to get help.">
         <LeftRailButton
           icon={<BugOutlined />}