Upload timeout (#8895) (#8899)

* Increase upload timeout for attachments

* Increase default API timeout

- To account for distant connections

* Use longer timeout when uploading files

* Debug for RTD testing

* Adjust commit extraction

* Cleanup debug output

* Include more vars in output

* Move debug output to top of file

* Add useful link

(cherry picked from commit c7e960728d)

Co-authored-by: Oliver <oliver.henry.walters@gmail.com>

src/frontend/src/App.tsx

@@ -15,7 +15,7 @@ export function setApiDefaults() {
   const token = useUserState.getState().token;
 
   api.defaults.baseURL = host;
-  api.defaults.timeout = 2500;
+  api.defaults.timeout = 5000;
 
   api.defaults.withCredentials = true;
   api.defaults.withXSRFToken = true;

src/frontend/src/components/forms/ApiForm.tsx

@@ -431,11 +431,18 @@ export function ApiForm({
       }
     });
 
+    /* Set the timeout for the request:
+     * - If a timeout is provided in the props, use that
+     * - If the form contains files, use a longer timeout
+     * - Otherwise, use the default timeout
+     */
+    const timeout = props.timeout ?? (hasFiles ? 30000 : undefined);
+
     return api({
       method: method,
       url: url,
       data: hasFiles ? formData : jsonData,
-      timeout: props.timeout,
+      timeout: timeout,
       headers: {
         'Content-Type': hasFiles ? 'multipart/form-data' : 'application/json'
       }

src/frontend/src/tables/general/AttachmentTable.tsx

@@ -130,7 +130,9 @@ export function AttachmentTable({
       setIsUploading(true);
 
       api
-        .post(url, formData)
+        .post(url, formData, {
+          timeout: 30 * 1000
+        })
         .then((response) => {
           notifications.show({
             title: t`File uploaded`,