@amityco/ts-sdk-react-native 6.28.0 → 6.28.1

package/dist/storyRepository/utils/createOptimisticEvent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createOptimisticEvent.d.ts","sourceRoot":"","sources":["../../../src/storyRepository/utils/createOptimisticEvent.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,qBAAqB;aAMrB,MAAM,kBAAkB;;;8BAIR,MAAM,YAAY,KAAK,IAAI,SA8CvD,CAAC"}
+{"version":3,"file":"createOptimisticEvent.d.ts","sourceRoot":"","sources":["../../../src/storyRepository/utils/createOptimisticEvent.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,qBAAqB;aAMrB,MAAM,kBAAkB;;;8BAIR,MAAM,YAAY,KAAK,IAAI,SAiCvD,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@amityco/ts-sdk-react-native",
-  "version": "6.28.0",
+  "version": "6.28.1",
   "license": "CC-BY-ND-4.0",
   "author": "amity.co <developers@amity.co> (https://amity.co)",
   "description": "Amity Social Cloud Typescript SDK",
@@ -32,7 +32,6 @@
     "test": "jest",
     "test:coverage": "jest --coverage --silent"
   },
-  "private": false,
   "publishConfig": {
     "access": "public"
   },
@@ -72,6 +71,7 @@
     "debug": "^4.3.4",
     "hls.js": "^1.4.10",
     "js-base64": "^3.7.2",
+    "mime": "3.0.0",
     "mitt": "^3.0.0",
     "mqtt": "^4.3.7",
     "object-hash": "^3.0.0",

package/src/fileRepository/api/uploadFile.ts

@@ -2,6 +2,7 @@ import { getActiveClient } from '~/client/api';
 
 import { ingestInCache } from '~/cache/api/ingestInCache';
 import GlobalFileAccessType from '~/client/utils/GlobalFileAccessType';
+import { rebuildFormDataWithMimeType } from '~/fileRepository/utils/rebuildFormDataWithMimeType';
 
 /* begin_public_function
   id: file.upload.file
@@ -42,12 +43,16 @@ export const uploadFile = async <T extends Amity.FileType = any>(
       ? (formData as any).getHeaders()
       : { 'content-type': 'multipart/form-data' };
 
-  const { data } = await client.http.post<Amity.CreateFilePayload<T>>('/api/v4/files', formData, {
-    headers,
-    onUploadProgress({ loaded, total = 100 }) {
-      onProgress && onProgress(Math.round((loaded * 100) / total));
+  const { data } = await client.http.post<Amity.CreateFilePayload<T>>(
+    '/api/v4/files',
+    rebuildFormDataWithMimeType(formData),
+    {
+      headers,
+      onUploadProgress({ loaded, total = 100 }) {
+        onProgress && onProgress(Math.round((loaded * 100) / total));
+      },
     },
-  });
+  );
 
   // API-FIX: payload should be serialized properly
   // const { files } = data

package/src/fileRepository/api/uploadImage.ts

@@ -2,6 +2,7 @@ import { getActiveClient } from '~/client/api';
 
 import { ingestInCache } from '~/cache/api/ingestInCache';
 import GlobalFileAccessType from '~/client/utils/GlobalFileAccessType';
+import { rebuildFormDataWithMimeType } from '../utils/rebuildFormDataWithMimeType';
 
 /* begin_public_function
   id: file.upload.image
@@ -44,7 +45,7 @@ export const uploadImage = async (
 
   const { data } = await client.http.post<Amity.CreateFilePayload<'image'>>(
     '/api/v4/images',
-    formData,
+    rebuildFormDataWithMimeType(formData),
     {
       headers,
       onUploadProgress({ loaded, total = 100 }) {

package/src/fileRepository/api/uploadVideo.ts

@@ -2,6 +2,7 @@ import { getActiveClient } from '~/client/api';
 
 import { ingestInCache } from '~/cache/api/ingestInCache';
 import GlobalFileAccessType from '~/client/utils/GlobalFileAccessType';
+import { rebuildFormDataWithMimeType } from '../utils/rebuildFormDataWithMimeType';
 
 /* begin_public_function
   id: file.upload.video, file.upload.audio
@@ -50,7 +51,7 @@ export const uploadVideo = async (
 
   const { data } = await client.http.post<Amity.CreateFilePayload<'video'>>(
     '/api/v4/videos',
-    formData,
+    rebuildFormDataWithMimeType(formData),
     {
       headers,
       onUploadProgress({ loaded, total = 100 }) {

package/src/fileRepository/utils/rebuildFormDataWithMimeType.ts

@@ -0,0 +1,16 @@
+import mime from 'mime';
+
+export const rebuildFormDataWithMimeType = (formData: FormData): FormData => {
+  const files = formData.getAll('files') || [];
+  if (!files.length) return formData;
+
+  const newFormData = new FormData();
+  const imageFile = files[0] as File & { uri: string };
+
+  // In ReactNative Android, we need to define a file type for all upload items; otherwise backend will reject a request
+  // @ts-ignore - we need to modify `type` because in android this value will not set by default (https://github.com/axios/axios/issues/4823)
+  imageFile.type = mime.getType(imageFile.uri);
+  newFormData.append('files', imageFile);
+
+  return newFormData;
+};

package/src/storyRepository/utils/createOptimisticEvent.ts

@@ -21,37 +21,24 @@ export const createOptimisticEvent = (
 ) => {
   if (formData) {
     const files = formData.getAll('files');
-    const fileObject = files[0] || undefined;
+    const fileObject = (files[0] as File & { uri: string }) || undefined;
 
     if (!fileObject) return;
 
-    const fileData = new FileReader();
-
-    fileData.readAsDataURL(fileObject as Blob);
-    fileData.onload = () => {
-      return callback(
-        saveOptimisticToCache(
-          isVideo
-            ? {
-                ...payload,
-                data: {
-                  ...payload.data,
-                  fileId: undefined,
-                  videoFileId: { original: undefined },
-                  fileData: fileData?.result,
-                },
-              }
-            : {
-                ...payload,
-                data: {
-                  ...payload.data,
-                  fileId: undefined,
-                  fileData: fileData?.result,
-                },
-              },
-        ),
-      );
+    const optimisticData = {
+      ...payload,
+      data: {
+        ...payload.data,
+        fileId: undefined,
+        fileData: fileObject.uri,
+      },
     };
+
+    if (isVideo) {
+      optimisticData.data.videoFileId = { original: undefined };
+    }
+
+    return callback(saveOptimisticToCache(optimisticData));
   }
 
   return callback(