fix: Video - Invalid file is downloaded when downloading video.

Signed-off-by: Krishna Gupta <belivethatkg@gmail.com>

src/CONST.ts

@@ -1003,6 +1003,7 @@ const CONST = {
     ATTACHMENT_THUMBNAIL_WIDTH_ATTRIBUTE: 'data-expensify-width',
     ATTACHMENT_THUMBNAIL_HEIGHT_ATTRIBUTE: 'data-expensify-height',
     ATTACHMENT_DURATION_ATTRIBUTE: 'data-expensify-duration',
+    ENCRYPTED_AUTH_TOKEN_KEY: 'encryptedAuthToken',
 
     ATTACHMENT_PICKER_TYPE: {
         FILE: 'file',

src/components/Image/index.js

@@ -4,6 +4,7 @@ import {Image as RNImage} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import _ from 'underscore';
 import useNetwork from '@hooks/useNetwork';
+import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import {defaultProps, imagePropTypes} from './imagePropTypes';
 import RESIZE_MODES from './resizeModes';
@@ -21,8 +22,8 @@ function Image(props) {
             // There is currently a `react-native-web` bug preventing the authToken being passed
             // in the headers of the image request so the authToken is added as a query param.
             // On native the authToken IS passed in the image request headers
-            const authToken = lodashGet(session, 'encryptedAuthToken', null);
-            return {uri: `${propsSource.uri}?encryptedAuthToken=${encodeURIComponent(authToken)}`};
+            const authToken = lodashGet(session, CONST.ENCRYPTED_AUTH_TOKEN_KEY, null);
+            return {uri: `${propsSource.uri}?${CONST.ENCRYPTED_AUTH_TOKEN_KEY}=${encodeURIComponent(authToken)}`};
         }
         return propsSource;
         // The session prop is not required, as it causes the image to reload whenever the session changes. For more information, please refer to issue #26034.

src/libs/addEncryptedAuthTokenToURL.ts

@@ -1,4 +1,5 @@
 import Onyx from 'react-native-onyx';
+import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 
 let encryptedAuthToken = '';
@@ -11,5 +12,5 @@ Onyx.connect({
  * Add encryptedAuthToken to this attachment URL
  */
 export default function (url: string) {
-    return `${url}?encryptedAuthToken=${encodeURIComponent(encryptedAuthToken)}`;
+    return `${url}?${CONST.ENCRYPTED_AUTH_TOKEN_KEY}=${encodeURIComponent(encryptedAuthToken)}`;
 }

src/libs/fileDownload/FileUtils.ts

@@ -87,7 +87,19 @@ function showCameraPermissionsAlert() {
  *    with underscores.
  */
 function getFileName(url: string): string {
-    const fileName = url.split(/[#?/]/).pop() ?? '';
+    let fileName = url;
+
+    // Remove encryptedAuthToken if exists
+    if (fileName.includes(`?${CONST.ENCRYPTED_AUTH_TOKEN_KEY}=`)) {
+        fileName = fileName.split(`?${CONST.ENCRYPTED_AUTH_TOKEN_KEY}=`)[0];
+    }
+
+    fileName = fileName.split(/[#?/]/).pop() ?? '';
+
+    if (!fileName) {
+        Log.warn('[FileUtils] Could not get attachment name', {url});
+    }
+
     if (!fileName) {
         Log.warn('[FileUtils] Could not get attachment name', {url});
     }