@tradly/asset 1.0.18 → 1.0.19

package/dist/core/MediaApiService.js

@@ -249,7 +249,7 @@ var MediaApiService = /*#__PURE__*/function () {
     key: "uploadMedia",
     value: (function () {
       var _uploadMedia = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4(files, authKey) {
-        var auth_key, all_files_uri, upload_files, upload_full_files, i, element, file_data, responseFiles, index, path, fileURI, originalFile, fileBody, uri, fileResponse, blob, res, mediaData, _t3, _t4, _t5;
+        var auth_key, all_files_uri, upload_files, upload_full_files, i, element, file_data, responseFiles, index, path, fileURI, originalFile, fileBody, uri, fileResponse, arrayBuffer, res, errorText, mediaData, _t3, _t4, _t5;
         return _regenerator().w(function (_context4) {
           while (1) switch (_context4.p = _context4.n) {
             case 0:
@@ -266,7 +266,7 @@ var MediaApiService = /*#__PURE__*/function () {
               i = 0;
             case 2:
               if (!(i < files.length)) {
-                _context4.n = 21;
+                _context4.n = 27;
                 break;
               }
               element = files[i]; // Check if file already has a path (from previous upload)
@@ -284,7 +284,7 @@ var MediaApiService = /*#__PURE__*/function () {
 
               // Upload files when we've processed all files
               if (!(files.length === i + 1 && upload_files.length > 0)) {
-                _context4.n = 20;
+                _context4.n = 26;
                 break;
               }
               _context4.p = 3;
@@ -295,7 +295,7 @@ var MediaApiService = /*#__PURE__*/function () {
               index = 0;
             case 5:
               if (!(index < responseFiles.length)) {
-                _context4.n = 17;
+                _context4.n = 23;
                 break;
               }
               path = responseFiles[index].signedUrl;
@@ -305,73 +305,117 @@ var MediaApiService = /*#__PURE__*/function () {
               fileBody = originalFile; // Handle React Native file URIs
               // If file has a uri property, it's from React Native - fetch it first
               if (!(originalFile.uri && typeof originalFile.uri === "string")) {
-                _context4.n = 13;
+                _context4.n = 16;
                 break;
               }
               // For React Native, handle file://, content://, or http:// URIs
               uri = originalFile.uri;
               _context4.p = 7;
+              // For React Native file:// URIs, fetch should work
+              // Convert file:// URI to blob for S3 upload
+              console.log("Fetching file from URI:", uri);
               _context4.n = 8;
               return fetch(uri);
             case 8:
               fileResponse = _context4.v;
+              if (fileResponse.ok) {
+                _context4.n = 9;
+                break;
+              }
+              throw new Error("Failed to fetch file: ".concat(fileResponse.status, " ").concat(fileResponse.statusText));
+            case 9:
               if (!fileResponse.blob) {
-                _context4.n = 10;
+                _context4.n = 11;
                 break;
               }
-              _context4.n = 9;
+              _context4.n = 10;
               return fileResponse.blob();
-            case 9:
-              blob = _context4.v;
-              fileBody = blob;
-              _context4.n = 11;
-              break;
             case 10:
-              // Fallback: use the response as-is if blob() is not available
-              // Some React Native versions might need different handling
-              fileBody = fileResponse;
-            case 11:
-              _context4.n = 13;
+              fileBody = _context4.v;
+              console.log("File converted to blob, size:", fileBody.size);
+              _context4.n = 14;
               break;
+            case 11:
+              if (!fileResponse.arrayBuffer) {
+                _context4.n = 13;
+                break;
+              }
+              _context4.n = 12;
+              return fileResponse.arrayBuffer();
             case 12:
-              _context4.p = 12;
-              _t3 = _context4.v;
-              // If fetch fails, try using the URI directly
-              // Some React Native environments might handle this differently
-              console.warn("Fetch failed for URI, trying direct upload:", _t3);
-              // For S3 PUT, we need the actual file content
-              // If fetch fails, we'll try to use the file object directly
-              // This might require additional React Native file handling libraries
-              throw new Error("Failed to read file from URI: ".concat(uri, ". Make sure the file URI is accessible. Error: ").concat(_t3.message));
-            case 13:
+              arrayBuffer = _context4.v;
+              // Check if Blob constructor is available
+              if (typeof Blob !== "undefined") {
+                fileBody = new Blob([arrayBuffer], {
+                  type: upload_files[index].type
+                });
+              } else {
+                // If Blob is not available, use arrayBuffer directly
+                fileBody = arrayBuffer;
+              }
               _context4.n = 14;
+              break;
+            case 13:
+              // Last resort: use response directly (might not work for all cases)
+              fileBody = fileResponse;
+            case 14:
+              _context4.n = 16;
+              break;
+            case 15:
+              _context4.p = 15;
+              _t3 = _context4.v;
+              console.error("Error fetching file from URI:", _t3);
+              console.error("URI was:", uri);
+              console.error("File details:", {
+                name: originalFile.name,
+                type: originalFile.type
+              });
+              throw new Error("Failed to read file from URI: ".concat(uri, ". Error: ").concat(_t3.message, ". Make sure the file URI is accessible."));
+            case 16:
+              // Upload to S3 using PUT request
+              console.log("Uploading to S3:", path);
+              console.log("File type:", upload_files[index].type);
+              _context4.n = 17;
               return fetch(path, {
                 method: "PUT",
                 headers: {
-                  ContentType: upload_files[index].type
+                  "Content-Type": upload_files[index].type
                 },
                 body: fileBody
               });
-            case 14:
+            case 17:
               res = _context4.v;
-              if (res.ok) {
-                all_files_uri.push(fileURI);
-              } else {
-                console.error("Failed to upload file ".concat(index + 1));
+              if (!res.ok) {
+                _context4.n = 18;
+                break;
               }
-              _context4.n = 16;
+              console.log("File ".concat(index + 1, " uploaded successfully"));
+              all_files_uri.push(fileURI);
+              _context4.n = 20;
               break;
-            case 15:
-              _context4.p = 15;
+            case 18:
+              _context4.n = 19;
+              return res.text().catch(function () {
+                return "";
+              });
+            case 19:
+              errorText = _context4.v;
+              console.error("Failed to upload file ".concat(index + 1, ":"), res.status, res.statusText, errorText);
+              throw new Error("S3 upload failed: ".concat(res.status, " ").concat(res.statusText));
+            case 20:
+              _context4.n = 22;
+              break;
+            case 21:
+              _context4.p = 21;
               _t4 = _context4.v;
               console.error("Error uploading file ".concat(index + 1, ":"), _t4);
-            case 16:
+            case 22:
               index++;
               _context4.n = 5;
               break;
-            case 17:
+            case 23:
               if (!(all_files_uri.length > 0)) {
-                _context4.n = 18;
+                _context4.n = 24;
                 break;
               }
               mediaData = all_files_uri.map(function (url, index) {
@@ -384,7 +428,7 @@ var MediaApiService = /*#__PURE__*/function () {
                   mime_type: originalFile.type
                 };
               }); // Save to media API - POST /v1/media with { media: [...] }
-              _context4.n = 18;
+              _context4.n = 24;
               return this.apiCall({
                 method: "POST",
                 path: "/v1/media",
@@ -392,25 +436,25 @@ var MediaApiService = /*#__PURE__*/function () {
                   media: mediaData
                 }
               });
-            case 18:
-              _context4.n = 20;
+            case 24:
+              _context4.n = 26;
               break;
-            case 19:
-              _context4.p = 19;
+            case 25:
+              _context4.p = 25;
               _t5 = _context4.v;
               console.error("Upload error:", _t5);
               if (this.onError) {
                 this.onError(_t5);
               }
               throw _t5;
-            case 20:
+            case 26:
               i++;
               _context4.n = 2;
               break;
-            case 21:
+            case 27:
               return _context4.a(2, all_files_uri);
           }
-        }, _callee4, this, [[7, 12], [6, 15], [3, 19]]);
+        }, _callee4, this, [[7, 15], [6, 21], [3, 25]]);
       }));
       function uploadMedia(_x5, _x6) {
         return _uploadMedia.apply(this, arguments);

package/dist/esm/core/MediaApiService.js

@@ -243,7 +243,7 @@ var MediaApiService = /*#__PURE__*/function () {
     key: "uploadMedia",
     value: (function () {
       var _uploadMedia = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee4(files, authKey) {
-        var auth_key, all_files_uri, upload_files, upload_full_files, i, element, file_data, responseFiles, index, path, fileURI, originalFile, fileBody, uri, fileResponse, blob, res, mediaData, _t3, _t4, _t5;
+        var auth_key, all_files_uri, upload_files, upload_full_files, i, element, file_data, responseFiles, index, path, fileURI, originalFile, fileBody, uri, fileResponse, arrayBuffer, res, errorText, mediaData, _t3, _t4, _t5;
         return _regenerator().w(function (_context4) {
           while (1) switch (_context4.p = _context4.n) {
             case 0:
@@ -260,7 +260,7 @@ var MediaApiService = /*#__PURE__*/function () {
               i = 0;
             case 2:
               if (!(i < files.length)) {
-                _context4.n = 21;
+                _context4.n = 27;
                 break;
               }
               element = files[i]; // Check if file already has a path (from previous upload)
@@ -278,7 +278,7 @@ var MediaApiService = /*#__PURE__*/function () {
 
               // Upload files when we've processed all files
               if (!(files.length === i + 1 && upload_files.length > 0)) {
-                _context4.n = 20;
+                _context4.n = 26;
                 break;
               }
               _context4.p = 3;
@@ -289,7 +289,7 @@ var MediaApiService = /*#__PURE__*/function () {
               index = 0;
             case 5:
               if (!(index < responseFiles.length)) {
-                _context4.n = 17;
+                _context4.n = 23;
                 break;
               }
               path = responseFiles[index].signedUrl;
@@ -299,73 +299,117 @@ var MediaApiService = /*#__PURE__*/function () {
               fileBody = originalFile; // Handle React Native file URIs
               // If file has a uri property, it's from React Native - fetch it first
               if (!(originalFile.uri && typeof originalFile.uri === "string")) {
-                _context4.n = 13;
+                _context4.n = 16;
                 break;
               }
               // For React Native, handle file://, content://, or http:// URIs
               uri = originalFile.uri;
               _context4.p = 7;
+              // For React Native file:// URIs, fetch should work
+              // Convert file:// URI to blob for S3 upload
+              console.log("Fetching file from URI:", uri);
               _context4.n = 8;
               return fetch(uri);
             case 8:
               fileResponse = _context4.v;
+              if (fileResponse.ok) {
+                _context4.n = 9;
+                break;
+              }
+              throw new Error("Failed to fetch file: ".concat(fileResponse.status, " ").concat(fileResponse.statusText));
+            case 9:
               if (!fileResponse.blob) {
-                _context4.n = 10;
+                _context4.n = 11;
                 break;
               }
-              _context4.n = 9;
+              _context4.n = 10;
               return fileResponse.blob();
-            case 9:
-              blob = _context4.v;
-              fileBody = blob;
-              _context4.n = 11;
-              break;
             case 10:
-              // Fallback: use the response as-is if blob() is not available
-              // Some React Native versions might need different handling
-              fileBody = fileResponse;
-            case 11:
-              _context4.n = 13;
+              fileBody = _context4.v;
+              console.log("File converted to blob, size:", fileBody.size);
+              _context4.n = 14;
               break;
+            case 11:
+              if (!fileResponse.arrayBuffer) {
+                _context4.n = 13;
+                break;
+              }
+              _context4.n = 12;
+              return fileResponse.arrayBuffer();
             case 12:
-              _context4.p = 12;
-              _t3 = _context4.v;
-              // If fetch fails, try using the URI directly
-              // Some React Native environments might handle this differently
-              console.warn("Fetch failed for URI, trying direct upload:", _t3);
-              // For S3 PUT, we need the actual file content
-              // If fetch fails, we'll try to use the file object directly
-              // This might require additional React Native file handling libraries
-              throw new Error("Failed to read file from URI: ".concat(uri, ". Make sure the file URI is accessible. Error: ").concat(_t3.message));
-            case 13:
+              arrayBuffer = _context4.v;
+              // Check if Blob constructor is available
+              if (typeof Blob !== "undefined") {
+                fileBody = new Blob([arrayBuffer], {
+                  type: upload_files[index].type
+                });
+              } else {
+                // If Blob is not available, use arrayBuffer directly
+                fileBody = arrayBuffer;
+              }
               _context4.n = 14;
+              break;
+            case 13:
+              // Last resort: use response directly (might not work for all cases)
+              fileBody = fileResponse;
+            case 14:
+              _context4.n = 16;
+              break;
+            case 15:
+              _context4.p = 15;
+              _t3 = _context4.v;
+              console.error("Error fetching file from URI:", _t3);
+              console.error("URI was:", uri);
+              console.error("File details:", {
+                name: originalFile.name,
+                type: originalFile.type
+              });
+              throw new Error("Failed to read file from URI: ".concat(uri, ". Error: ").concat(_t3.message, ". Make sure the file URI is accessible."));
+            case 16:
+              // Upload to S3 using PUT request
+              console.log("Uploading to S3:", path);
+              console.log("File type:", upload_files[index].type);
+              _context4.n = 17;
               return fetch(path, {
                 method: "PUT",
                 headers: {
-                  ContentType: upload_files[index].type
+                  "Content-Type": upload_files[index].type
                 },
                 body: fileBody
               });
-            case 14:
+            case 17:
               res = _context4.v;
-              if (res.ok) {
-                all_files_uri.push(fileURI);
-              } else {
-                console.error("Failed to upload file ".concat(index + 1));
+              if (!res.ok) {
+                _context4.n = 18;
+                break;
               }
-              _context4.n = 16;
+              console.log("File ".concat(index + 1, " uploaded successfully"));
+              all_files_uri.push(fileURI);
+              _context4.n = 20;
               break;
-            case 15:
-              _context4.p = 15;
+            case 18:
+              _context4.n = 19;
+              return res.text().catch(function () {
+                return "";
+              });
+            case 19:
+              errorText = _context4.v;
+              console.error("Failed to upload file ".concat(index + 1, ":"), res.status, res.statusText, errorText);
+              throw new Error("S3 upload failed: ".concat(res.status, " ").concat(res.statusText));
+            case 20:
+              _context4.n = 22;
+              break;
+            case 21:
+              _context4.p = 21;
               _t4 = _context4.v;
               console.error("Error uploading file ".concat(index + 1, ":"), _t4);
-            case 16:
+            case 22:
               index++;
               _context4.n = 5;
               break;
-            case 17:
+            case 23:
               if (!(all_files_uri.length > 0)) {
-                _context4.n = 18;
+                _context4.n = 24;
                 break;
               }
               mediaData = all_files_uri.map(function (url, index) {
@@ -378,7 +422,7 @@ var MediaApiService = /*#__PURE__*/function () {
                   mime_type: originalFile.type
                 };
               }); // Save to media API - POST /v1/media with { media: [...] }
-              _context4.n = 18;
+              _context4.n = 24;
               return this.apiCall({
                 method: "POST",
                 path: "/v1/media",
@@ -386,25 +430,25 @@ var MediaApiService = /*#__PURE__*/function () {
                   media: mediaData
                 }
               });
-            case 18:
-              _context4.n = 20;
+            case 24:
+              _context4.n = 26;
               break;
-            case 19:
-              _context4.p = 19;
+            case 25:
+              _context4.p = 25;
               _t5 = _context4.v;
               console.error("Upload error:", _t5);
               if (this.onError) {
                 this.onError(_t5);
               }
               throw _t5;
-            case 20:
+            case 26:
               i++;
               _context4.n = 2;
               break;
-            case 21:
+            case 27:
               return _context4.a(2, all_files_uri);
           }
-        }, _callee4, this, [[7, 12], [6, 15], [3, 19]]);
+        }, _callee4, this, [[7, 15], [6, 21], [3, 25]]);
       }));
       function uploadMedia(_x5, _x6) {
         return _uploadMedia.apply(this, arguments);

package/dist/esm/native/FileUpload.native.js

@@ -153,7 +153,16 @@ var FileUpload = function FileUpload(_ref) {
             setUploadProgress(0);
             _context.p = 1;
             // Convert picker results to File-like objects
-            filesToUpload = fileList.map(convertToFile); // Use the API service to upload files
+            filesToUpload = fileList.map(convertToFile); // Debug: Log file format for troubleshooting
+            console.log("Files to upload:", filesToUpload.map(function (f) {
+              return {
+                uri: f.uri,
+                name: f.name,
+                type: f.type
+              };
+            }));
+
+            // Use the API service to upload files
             // Note: uploadMedia will need to handle React Native file URIs
             _context.n = 2;
             return apiService.uploadMedia(filesToUpload, apiService.authKey);
@@ -311,7 +320,7 @@ var FileUpload = function FileUpload(_ref) {
 var styles = StyleSheet.create({
   container: {
     width: "100%",
-    height: 160
+    height: "100%"
   },
   button: {
     width: "100%",
@@ -327,11 +336,12 @@ var styles = StyleSheet.create({
     // Colors and spacing applied via theme
   },
   title: {
+    textAlign: "center"
     // Colors and typography applied via theme
   },
   loadingContainer: {
     width: "100%",
-    height: 160,
+    height: "100%",
     justifyContent: "center",
     alignItems: "center"
     // Colors applied via theme

package/dist/esm/native/MediaGallery.native.js

@@ -205,7 +205,8 @@ var styles = StyleSheet.create({
     padding: 4
   },
   uploadContainer: {
-    margin: ITEM_MARGIN
+    margin: ITEM_MARGIN,
+    overflow: 'hidden'
   },
   imageItem: {
     margin: ITEM_MARGIN,

package/dist/esm/native/MediaPopup.native.js

@@ -86,7 +86,9 @@ var MediaPopup = function MediaPopup(_ref) {
               borderTopRightRadius: currentTheme.radius.xxl,
               height: SCREEN_HEIGHT * sheetHeight,
               maxHeight: SCREEN_HEIGHT * sheetHeight,
-              padding: currentTheme.spacing.xl
+              paddingTop: currentTheme.spacing.sm,
+              paddingBottom: currentTheme.spacing.xl,
+              paddingHorizontal: currentTheme.spacing.xl
             }, containerStyle, {
               transform: [{
                 translateY: slideAnim
@@ -94,7 +96,7 @@ var MediaPopup = function MediaPopup(_ref) {
             }],
             children: [/*#__PURE__*/_jsxs(View, {
               style: [styles.header, {
-                marginBottom: currentTheme.spacing.md
+                marginBottom: currentTheme.spacing.sm
               }, headerStyle],
               children: [/*#__PURE__*/_jsx(Text, {
                 style: [styles.title, {

package/dist/esm/native/MediaTab.native.js

@@ -105,11 +105,13 @@ var MediaTab = function MediaTab(_ref) {
         backgroundColor: theme.colors.tabBackground,
         borderBottomColor: theme.colors.border,
         paddingHorizontal: theme.spacing.xs,
-        // Always left align
-        justifyContent: "flex-start"
+        // Always left align - no center alignment
+        justifyContent: "flex-start",
+        alignItems: "flex-start"
       }, tabListStyle],
       children: availableTabs.map(function (type, index) {
         var isSelected = index === selectedIndex;
+        var isSingleTab = availableTabs.length === 1;
         return /*#__PURE__*/_jsxs(TouchableOpacity, {
           onPress: function onPress() {
             return setSelectedIndex(index);
@@ -117,7 +119,10 @@ var MediaTab = function MediaTab(_ref) {
           style: [styles.tabButton, {
             paddingVertical: theme.spacing.md,
             paddingHorizontal: theme.spacing.lg,
-            flex: 1
+            // For single tab, don't use flex: 1 to prevent centering
+            // Use auto width so it stays left-aligned
+            flex: isSingleTab ? 0 : 1,
+            alignSelf: "flex-start"
           }, tabButtonStyle, isSelected ? [styles.tabButtonActive, tabButtonActiveStyle] : [styles.tabButtonInactive, tabButtonInactiveStyle]],
           children: [/*#__PURE__*/_jsx(Text, {
             style: [styles.tabButtonText, {

package/dist/native/FileUpload.native.js

@@ -159,7 +159,16 @@ var FileUpload = function FileUpload(_ref) {
             setUploadProgress(0);
             _context.p = 1;
             // Convert picker results to File-like objects
-            filesToUpload = fileList.map(convertToFile); // Use the API service to upload files
+            filesToUpload = fileList.map(convertToFile); // Debug: Log file format for troubleshooting
+            console.log("Files to upload:", filesToUpload.map(function (f) {
+              return {
+                uri: f.uri,
+                name: f.name,
+                type: f.type
+              };
+            }));
+
+            // Use the API service to upload files
             // Note: uploadMedia will need to handle React Native file URIs
             _context.n = 2;
             return apiService.uploadMedia(filesToUpload, apiService.authKey);
@@ -317,7 +326,7 @@ var FileUpload = function FileUpload(_ref) {
 var styles = _reactNative.StyleSheet.create({
   container: {
     width: "100%",
-    height: 160
+    height: "100%"
   },
   button: {
     width: "100%",
@@ -333,11 +342,12 @@ var styles = _reactNative.StyleSheet.create({
     // Colors and spacing applied via theme
   },
   title: {
+    textAlign: "center"
     // Colors and typography applied via theme
   },
   loadingContainer: {
     width: "100%",
-    height: 160,
+    height: "100%",
     justifyContent: "center",
     alignItems: "center"
     // Colors applied via theme

package/dist/native/MediaGallery.native.js

@@ -214,7 +214,8 @@ var styles = _reactNative.StyleSheet.create({
     padding: 4
   },
   uploadContainer: {
-    margin: ITEM_MARGIN
+    margin: ITEM_MARGIN,
+    overflow: 'hidden'
   },
   imageItem: {
     margin: ITEM_MARGIN,

package/dist/native/MediaPopup.native.js

@@ -93,7 +93,9 @@ var MediaPopup = function MediaPopup(_ref) {
               borderTopRightRadius: currentTheme.radius.xxl,
               height: SCREEN_HEIGHT * sheetHeight,
               maxHeight: SCREEN_HEIGHT * sheetHeight,
-              padding: currentTheme.spacing.xl
+              paddingTop: currentTheme.spacing.sm,
+              paddingBottom: currentTheme.spacing.xl,
+              paddingHorizontal: currentTheme.spacing.xl
             }, containerStyle, {
               transform: [{
                 translateY: slideAnim
@@ -101,7 +103,7 @@ var MediaPopup = function MediaPopup(_ref) {
             }],
             children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
               style: [styles.header, {
-                marginBottom: currentTheme.spacing.md
+                marginBottom: currentTheme.spacing.sm
               }, headerStyle],
               children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                 style: [styles.title, {

package/dist/native/MediaTab.native.js

@@ -114,11 +114,13 @@ var MediaTab = function MediaTab(_ref) {
         backgroundColor: theme.colors.tabBackground,
         borderBottomColor: theme.colors.border,
         paddingHorizontal: theme.spacing.xs,
-        // Always left align
-        justifyContent: "flex-start"
+        // Always left align - no center alignment
+        justifyContent: "flex-start",
+        alignItems: "flex-start"
       }, tabListStyle],
       children: availableTabs.map(function (type, index) {
         var isSelected = index === selectedIndex;
+        var isSingleTab = availableTabs.length === 1;
         return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
           onPress: function onPress() {
             return setSelectedIndex(index);
@@ -126,7 +128,10 @@ var MediaTab = function MediaTab(_ref) {
           style: [styles.tabButton, {
             paddingVertical: theme.spacing.md,
             paddingHorizontal: theme.spacing.lg,
-            flex: 1
+            // For single tab, don't use flex: 1 to prevent centering
+            // Use auto width so it stays left-aligned
+            flex: isSingleTab ? 0 : 1,
+            alignSelf: "flex-start"
           }, tabButtonStyle, isSelected ? [styles.tabButtonActive, tabButtonActiveStyle] : [styles.tabButtonInactive, tabButtonInactiveStyle]],
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
             style: [styles.tabButtonText, {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@tradly/asset",
-    "version": "1.0.18",
+    "version": "1.0.19",
     "description": "A reusable media gallery component for uploading and selecting images, videos, and files with Tradly authentication",
     "main": "dist/index.js",
     "module": "dist/esm/index.js",