Merge pull request #21343 from wireapp/fire-and-forget

Migrate MessagesList asset loading to the fire-and-forget invoker [WPB-22420]

Author: screendriver

apps/webapp/project.json

@@ -55,7 +55,7 @@
       "executor": "nx:run-commands",
       "dependsOn": ["webapp:stylelint", "webapp:type-check"],
       "options": {
-        "command": "eslint --max-warnings=1032 --ext .js,.ts,.tsx {projectRoot}"
+        "command": "eslint --max-warnings=1030 --ext .js,.ts,.tsx {projectRoot}"
       }
     },
     "stylelint": {

apps/webapp/src/script/components/FileFullscreenModal/FileEditor/FileEditor.tsx

@@ -27,6 +27,7 @@ import {PrimaryModal} from 'Components/Modals/PrimaryModal';
 import {removeCurrentModal} from 'Components/Modals/PrimaryModal/PrimaryModalState';
 import {CellsRepository} from 'Repositories/cells/cellsRepository';
 import {Config} from 'src/script/Config';
+import {useApplicationContext} from 'src/script/page/RootProvider';
 import {t} from 'Util/localizerUtil';
 import {TIME_IN_MILLIS} from 'Util/timeUtil';
 
@@ -43,6 +44,7 @@ interface FileEditorProps {
 
 export const FileEditor = ({id}: FileEditorProps) => {
   const cellsRepository = container.resolve(CellsRepository);
+  const {fireAndForgetInvoker} = useApplicationContext();
   const [node, setNode] = useState<Node | null>(null);
   const [isRecycled, setIsRecycled] = useState(false);
   const [isLoading, setIsLoading] = useState(true);
@@ -74,18 +76,19 @@ export const FileEditor = ({id}: FileEditorProps) => {
 
   const handleRetry = useCallback(() => {
     hasShownErrorModal.current = false;
-    void (async () => {
+
+    fireAndForgetInvoker.fireAndForget(async (): Promise<void> => {
       const isSuccessful = await fetchNode();
       if (isSuccessful) {
         removeCurrentModal();
       }
-    })();
-  }, [fetchNode]);
+    });
+  }, [fetchNode, fireAndForgetInvoker]);
 
   // Initial fetch
   useEffect(() => {
-    void fetchNode();
-  }, [id, cellsRepository, fetchNode]);
+    fireAndForgetInvoker.fireAndForget(fetchNode);
+  }, [fetchNode, fireAndForgetInvoker]);
 
   // Auto-refresh mechanism before expiry
   useEffect(() => {
@@ -98,16 +101,16 @@ export const FileEditor = ({id}: FileEditorProps) => {
 
     // Set timeout to refresh before expiry
     const timeoutId = setTimeout(() => {
-      void fetchNode();
+      fireAndForgetInvoker.fireAndForget(fetchNode);
     }, refreshInSeconds * TIME_IN_MILLIS.SECOND);
 
     return () => {
       clearTimeout(timeoutId);
     };
-  }, [node, fetchNode]);
+  }, [fetchNode, fireAndForgetInvoker, node]);
 
   useEffect(() => {
-    if (isLoading || isRecycled || (!isError && node)) {
+    if (isLoading || isRecycled || (!isError && node !== null)) {
       return;
     }
 
@@ -134,7 +137,7 @@ export const FileEditor = ({id}: FileEditorProps) => {
   }, [handleRetry, isError, isLoading, isRecycled, node]);
 
   useEffect(() => {
-    if (!isLoading && !isError && node && !isRecycled) {
+    if (!isLoading && !isError && node !== null && !isRecycled) {
       hasShownErrorModal.current = false;
     }
   }, [isError, isLoading, isRecycled, node]);