@tradly/asset 1.0.21 → 1.0.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/FilesGallery.js +13 -0
- package/dist/core/FileTypes.js +11 -0
- package/dist/esm/components/FilesGallery.js +1 -0
- package/dist/esm/core/FileTypes.js +6 -0
- package/dist/esm/native/FilesGallery.native.js +288 -0
- package/dist/esm/native/MediaGallery.native.js +1 -1
- package/dist/esm/native/MediaTab.native.js +3 -2
- package/dist/esm/native/VideosGallery.native.js +23 -23
- package/dist/esm/web/FilesGallery.web.js +173 -0
- package/dist/esm/web/MediaGallery.web.js +12 -12
- package/dist/esm/web/MediaTab.web.js +26 -26
- package/dist/esm/web/VideosGallery.web.js +11 -11
- package/dist/native/FilesGallery.native.js +297 -0
- package/dist/native/MediaGallery.native.js +2 -2
- package/dist/native/MediaTab.native.js +3 -2
- package/dist/native/VideosGallery.native.js +18 -18
- package/dist/web/FilesGallery.web.js +182 -0
- package/dist/web/MediaGallery.web.js +9 -9
- package/dist/web/MediaTab.web.js +23 -23
- package/dist/web/VideosGallery.web.js +8 -8
- package/package.json +1 -1
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function get() {
|
|
9
|
+
return _FilesGallery.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
var _FilesGallery = _interopRequireDefault(require("../web/FilesGallery.web"));
|
|
13
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.VIDEO_MIME_TYPES = exports.IMAGE_MIME_TYPES = exports.FILE_MIME_TYPES = void 0;
|
|
7
|
+
var IMAGE_MIME_TYPES = exports.IMAGE_MIME_TYPES = ["image/png", "image/jpeg", "image/webp", "image/svg+xml", "image/gif", "image/avif", "image/x-icon", "image/vnd.microsoft.icon", "image/heic", "image/heif", "image/tiff", "image/heic", "image/jpg", "image/jfif"];
|
|
8
|
+
var VIDEO_MIME_TYPES = exports.VIDEO_MIME_TYPES = ["video/mp4", "video/quicktime", "video/x-ms-wmv", "video/h265", "video/hevc", "video/webm", "video/mpeg", "video/mpg", "video/mov", "video/avi", "video/wmv", "video/flv", "video/mkv", "video/webm", "video/quicktime", "video/x-ms-wmv", "video/h265", "video/hevc", "video/webm", "video/mp4", "video/quicktime", "video/x-ms-wmv"];
|
|
9
|
+
|
|
10
|
+
// not video or image
|
|
11
|
+
var FILE_MIME_TYPES = exports.FILE_MIME_TYPES = ["application/pdf", "application/msword", "application/vnd.openxmlformats-officedocument.wordprocessingml.document", "application/vnd.ms-excel", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", "application/vnd.ms-powerpoint", "application/vnd.openxmlformats-officedocument.presentationml.presentation", "application/json", "text/html", "text/xml", "text/php", "application/x-php", "application/pdf", "application/zip", "application/x-zip-compressed", "application/vnd.openxmlformats-officedocument.presentationml.presentation", "application/vnd.ms-excel", "application/postscript", "application/octet-stream", "application/rar", "audio/mpeg"];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from '../web/FilesGallery.web';
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
var IMAGE_MIME_TYPES = ["image/png", "image/jpeg", "image/webp", "image/svg+xml", "image/gif", "image/avif", "image/x-icon", "image/vnd.microsoft.icon", "image/heic", "image/heif", "image/tiff", "image/heic", "image/jpg", "image/jfif"];
|
|
2
|
+
var VIDEO_MIME_TYPES = ["video/mp4", "video/quicktime", "video/x-ms-wmv", "video/h265", "video/hevc", "video/webm", "video/mpeg", "video/mpg", "video/mov", "video/avi", "video/wmv", "video/flv", "video/mkv", "video/webm", "video/quicktime", "video/x-ms-wmv", "video/h265", "video/hevc", "video/webm", "video/mp4", "video/quicktime", "video/x-ms-wmv"];
|
|
3
|
+
|
|
4
|
+
// not video or image
|
|
5
|
+
var FILE_MIME_TYPES = ["application/pdf", "application/msword", "application/vnd.openxmlformats-officedocument.wordprocessingml.document", "application/vnd.ms-excel", "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", "application/vnd.ms-powerpoint", "application/vnd.openxmlformats-officedocument.presentationml.presentation", "application/json", "text/html", "text/xml", "text/php", "application/x-php", "application/pdf", "application/zip", "application/x-zip-compressed", "application/vnd.openxmlformats-officedocument.presentationml.presentation", "application/vnd.ms-excel", "application/postscript", "application/octet-stream", "application/rar", "audio/mpeg"];
|
|
6
|
+
export { IMAGE_MIME_TYPES, VIDEO_MIME_TYPES, FILE_MIME_TYPES };
|
|
@@ -0,0 +1,288 @@
|
|
|
1
|
+
function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
|
|
2
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
3
|
+
function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
|
|
4
|
+
function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
|
|
5
|
+
function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
|
|
6
|
+
function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
|
|
7
|
+
function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
|
|
8
|
+
function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
|
|
9
|
+
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
10
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
11
|
+
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
12
|
+
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
13
|
+
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
14
|
+
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
15
|
+
import React, { useState, useEffect } from "react";
|
|
16
|
+
import { View, FlatList, TouchableOpacity, StyleSheet, Dimensions, Text } from "react-native";
|
|
17
|
+
import FileUpload from "./FileUpload.native";
|
|
18
|
+
import ImagesSkeleton from "./ImagesSkeleton.native";
|
|
19
|
+
import Pagination from "./Pagination.native";
|
|
20
|
+
import { FILE_MIME_TYPES } from "../core/FileTypes";
|
|
21
|
+
import { defaultTheme } from "./theme";
|
|
22
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
23
|
+
var _Dimensions$get = Dimensions.get("window"),
|
|
24
|
+
SCREEN_WIDTH = _Dimensions$get.width;
|
|
25
|
+
var NUM_COLUMNS = 3;
|
|
26
|
+
var ITEM_MARGIN = 4; // Reduced margin for better fit
|
|
27
|
+
// Calculate item size accounting for:
|
|
28
|
+
// - Container padding (md = 12px on each side = 24px total)
|
|
29
|
+
// - Grid padding (2px on each side = 4px total)
|
|
30
|
+
// - Item margins between items (4px * 2 gaps = 8px total)
|
|
31
|
+
var CONTAINER_PADDING = 24; // paddingHorizontal md (12 * 2)
|
|
32
|
+
var GRID_PADDING = 4; // padding 2 on each side (2 * 2)
|
|
33
|
+
var TOTAL_MARGINS = ITEM_MARGIN * (NUM_COLUMNS - 1) * 2; // margins between items (4px * 2 gaps = 8px)
|
|
34
|
+
var ITEM_SIZE = (SCREEN_WIDTH - CONTAINER_PADDING - GRID_PADDING - TOTAL_MARGINS) / NUM_COLUMNS;
|
|
35
|
+
var FilesGallery = function FilesGallery(_ref) {
|
|
36
|
+
var update_data = _ref.update_data,
|
|
37
|
+
closePopup = _ref.closePopup,
|
|
38
|
+
apiService = _ref.apiService,
|
|
39
|
+
onError = _ref.onError,
|
|
40
|
+
picker = _ref.picker,
|
|
41
|
+
pickerOptions = _ref.pickerOptions,
|
|
42
|
+
icons = _ref.icons,
|
|
43
|
+
_ref$theme = _ref.theme,
|
|
44
|
+
theme = _ref$theme === void 0 ? defaultTheme : _ref$theme,
|
|
45
|
+
containerStyle = _ref.containerStyle,
|
|
46
|
+
gridStyle = _ref.gridStyle,
|
|
47
|
+
fileItemStyle = _ref.fileItemStyle,
|
|
48
|
+
paginationContainerStyle = _ref.paginationContainerStyle;
|
|
49
|
+
var _useState = useState([]),
|
|
50
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
51
|
+
files = _useState2[0],
|
|
52
|
+
setFiles = _useState2[1];
|
|
53
|
+
var _useState3 = useState(0),
|
|
54
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
55
|
+
total_count = _useState4[0],
|
|
56
|
+
setTotalCount = _useState4[1];
|
|
57
|
+
var _useState5 = useState(1),
|
|
58
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
59
|
+
currentPage = _useState6[0],
|
|
60
|
+
setCurrentPage = _useState6[1];
|
|
61
|
+
var _useState7 = useState(false),
|
|
62
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
63
|
+
isLoading = _useState8[0],
|
|
64
|
+
setISLoading = _useState8[1];
|
|
65
|
+
|
|
66
|
+
// Fetch files
|
|
67
|
+
useEffect(function () {
|
|
68
|
+
loadMedia();
|
|
69
|
+
}, []);
|
|
70
|
+
var loadMedia = /*#__PURE__*/function () {
|
|
71
|
+
var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
|
|
72
|
+
var page_number,
|
|
73
|
+
_response$data,
|
|
74
|
+
_response$data2,
|
|
75
|
+
response,
|
|
76
|
+
mediaData,
|
|
77
|
+
count,
|
|
78
|
+
_args = arguments,
|
|
79
|
+
_t;
|
|
80
|
+
return _regenerator().w(function (_context) {
|
|
81
|
+
while (1) switch (_context.p = _context.n) {
|
|
82
|
+
case 0:
|
|
83
|
+
page_number = _args.length > 0 && _args[0] !== undefined ? _args[0] : 1;
|
|
84
|
+
_context.p = 1;
|
|
85
|
+
_context.n = 2;
|
|
86
|
+
return apiService.fetchMedia({
|
|
87
|
+
mimeTypes: FILE_MIME_TYPES,
|
|
88
|
+
page: page_number,
|
|
89
|
+
setISLoading: setISLoading,
|
|
90
|
+
isLoading: isLoading
|
|
91
|
+
});
|
|
92
|
+
case 2:
|
|
93
|
+
response = _context.v;
|
|
94
|
+
// Handle different response formats
|
|
95
|
+
mediaData = (response === null || response === void 0 ? void 0 : response.media) || (response === null || response === void 0 || (_response$data = response.data) === null || _response$data === void 0 ? void 0 : _response$data.media) || (response === null || response === void 0 ? void 0 : response.data) || response || [];
|
|
96
|
+
count = (response === null || response === void 0 ? void 0 : response.count) || (response === null || response === void 0 || (_response$data2 = response.data) === null || _response$data2 === void 0 ? void 0 : _response$data2.count) || (response === null || response === void 0 ? void 0 : response.total) || 0;
|
|
97
|
+
setFiles(Array.isArray(mediaData) ? mediaData : []);
|
|
98
|
+
setTotalCount(count);
|
|
99
|
+
setCurrentPage(page_number);
|
|
100
|
+
_context.n = 4;
|
|
101
|
+
break;
|
|
102
|
+
case 3:
|
|
103
|
+
_context.p = 3;
|
|
104
|
+
_t = _context.v;
|
|
105
|
+
console.error("Error loading files:", _t);
|
|
106
|
+
if (onError) {
|
|
107
|
+
onError(_t);
|
|
108
|
+
}
|
|
109
|
+
case 4:
|
|
110
|
+
return _context.a(2);
|
|
111
|
+
}
|
|
112
|
+
}, _callee, null, [[1, 3]]);
|
|
113
|
+
}));
|
|
114
|
+
return function loadMedia() {
|
|
115
|
+
return _ref2.apply(this, arguments);
|
|
116
|
+
};
|
|
117
|
+
}();
|
|
118
|
+
var handleFileClick = function handleFileClick(file) {
|
|
119
|
+
if (update_data) {
|
|
120
|
+
update_data(file.url || file);
|
|
121
|
+
}
|
|
122
|
+
if (closePopup) {
|
|
123
|
+
closePopup();
|
|
124
|
+
}
|
|
125
|
+
};
|
|
126
|
+
|
|
127
|
+
// Get file icon based on mime type
|
|
128
|
+
var getFileIcon = function getFileIcon(mimeType) {
|
|
129
|
+
if (!mimeType) return "📄";
|
|
130
|
+
if (mimeType.includes("pdf")) return "📕";
|
|
131
|
+
if (mimeType.includes("word") || mimeType.includes("document")) return "📘";
|
|
132
|
+
if (mimeType.includes("excel") || mimeType.includes("spreadsheet")) return "📗";
|
|
133
|
+
if (mimeType.includes("powerpoint") || mimeType.includes("presentation")) return "📙";
|
|
134
|
+
if (mimeType.includes("zip") || mimeType.includes("rar")) return "📦";
|
|
135
|
+
if (mimeType.includes("audio")) return "🎵";
|
|
136
|
+
if (mimeType.includes("text")) return "📝";
|
|
137
|
+
return "📄";
|
|
138
|
+
};
|
|
139
|
+
|
|
140
|
+
// Get file extension from name or URL
|
|
141
|
+
var getFileExtension = function getFileExtension(file) {
|
|
142
|
+
var fileName = file.name || file.url || "";
|
|
143
|
+
var parts = fileName.split(".");
|
|
144
|
+
return parts.length > 1 ? parts[parts.length - 1].toUpperCase() : "";
|
|
145
|
+
};
|
|
146
|
+
var renderItem = function renderItem(_ref3) {
|
|
147
|
+
var item = _ref3.item,
|
|
148
|
+
index = _ref3.index;
|
|
149
|
+
// First item is the upload button
|
|
150
|
+
if (index === 0) {
|
|
151
|
+
return /*#__PURE__*/_jsx(View, {
|
|
152
|
+
style: [styles.uploadContainer, {
|
|
153
|
+
width: ITEM_SIZE,
|
|
154
|
+
height: ITEM_SIZE
|
|
155
|
+
}],
|
|
156
|
+
children: /*#__PURE__*/_jsx(FileUpload, {
|
|
157
|
+
loadMedia: loadMedia,
|
|
158
|
+
accept: "file/*",
|
|
159
|
+
title: "Add File",
|
|
160
|
+
apiService: apiService,
|
|
161
|
+
onUploadError: onError,
|
|
162
|
+
picker: picker,
|
|
163
|
+
pickerOptions: pickerOptions,
|
|
164
|
+
icons: icons,
|
|
165
|
+
theme: theme
|
|
166
|
+
})
|
|
167
|
+
});
|
|
168
|
+
}
|
|
169
|
+
var file = files[index - 1];
|
|
170
|
+
var fileUrl = typeof file === "string" ? file : file.url;
|
|
171
|
+
var fileKey = file.id || file.url || index;
|
|
172
|
+
var mimeType = file.mime_type || file.type || "";
|
|
173
|
+
var fileName = file.name || (fileUrl === null || fileUrl === void 0 ? void 0 : fileUrl.split("/").pop()) || "File";
|
|
174
|
+
return /*#__PURE__*/_jsxs(TouchableOpacity, {
|
|
175
|
+
onPress: function onPress() {
|
|
176
|
+
return handleFileClick(file);
|
|
177
|
+
},
|
|
178
|
+
style: [styles.fileItem, {
|
|
179
|
+
width: ITEM_SIZE,
|
|
180
|
+
height: ITEM_SIZE,
|
|
181
|
+
backgroundColor: theme.colors.itemBackground,
|
|
182
|
+
shadowColor: theme.colors.itemShadow
|
|
183
|
+
}, fileItemStyle],
|
|
184
|
+
children: [/*#__PURE__*/_jsx(View, {
|
|
185
|
+
style: styles.fileIconContainer,
|
|
186
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
187
|
+
style: styles.fileIcon,
|
|
188
|
+
children: getFileIcon(mimeType)
|
|
189
|
+
})
|
|
190
|
+
}), /*#__PURE__*/_jsx(Text, {
|
|
191
|
+
style: [styles.fileName, {
|
|
192
|
+
color: theme.colors.text
|
|
193
|
+
}],
|
|
194
|
+
numberOfLines: 2,
|
|
195
|
+
ellipsizeMode: "tail",
|
|
196
|
+
children: fileName
|
|
197
|
+
}), getFileExtension(file) && /*#__PURE__*/_jsx(Text, {
|
|
198
|
+
style: [styles.fileExtension, {
|
|
199
|
+
color: theme.colors.textSecondary
|
|
200
|
+
}],
|
|
201
|
+
children: getFileExtension(file)
|
|
202
|
+
})]
|
|
203
|
+
});
|
|
204
|
+
};
|
|
205
|
+
var data = isLoading ? [] : [{
|
|
206
|
+
type: "upload"
|
|
207
|
+
}].concat(_toConsumableArray(files));
|
|
208
|
+
return /*#__PURE__*/_jsx(View, {
|
|
209
|
+
style: [styles.container, containerStyle],
|
|
210
|
+
children: isLoading ? /*#__PURE__*/_jsx(ImagesSkeleton, {}) : /*#__PURE__*/_jsx(FlatList, {
|
|
211
|
+
data: data,
|
|
212
|
+
renderItem: renderItem,
|
|
213
|
+
keyExtractor: function keyExtractor(item, index) {
|
|
214
|
+
if (index === 0) return "upload";
|
|
215
|
+
var file = files[index - 1];
|
|
216
|
+
return file.id || file.url || "file-".concat(index);
|
|
217
|
+
},
|
|
218
|
+
numColumns: NUM_COLUMNS,
|
|
219
|
+
contentContainerStyle: [styles.grid, gridStyle],
|
|
220
|
+
showsVerticalScrollIndicator: false,
|
|
221
|
+
ListFooterComponent: total_count > 0 ? /*#__PURE__*/_jsx(View, {
|
|
222
|
+
style: [styles.paginationContainer, {
|
|
223
|
+
backgroundColor: theme.colors.paginationBackground,
|
|
224
|
+
paddingVertical: theme.spacing.lg,
|
|
225
|
+
paddingHorizontal: theme.spacing.sm,
|
|
226
|
+
marginTop: theme.spacing.sm
|
|
227
|
+
}, paginationContainerStyle],
|
|
228
|
+
children: /*#__PURE__*/_jsx(Pagination, {
|
|
229
|
+
nextPage: function nextPage(value) {
|
|
230
|
+
return loadMedia(value);
|
|
231
|
+
},
|
|
232
|
+
pageCount: Math.ceil(total_count / 30),
|
|
233
|
+
current_page: currentPage,
|
|
234
|
+
theme: theme
|
|
235
|
+
})
|
|
236
|
+
}) : null
|
|
237
|
+
})
|
|
238
|
+
});
|
|
239
|
+
};
|
|
240
|
+
var styles = StyleSheet.create({
|
|
241
|
+
container: {
|
|
242
|
+
flex: 1
|
|
243
|
+
},
|
|
244
|
+
grid: {
|
|
245
|
+
padding: 2 // Reduced padding for better fit
|
|
246
|
+
},
|
|
247
|
+
uploadContainer: {
|
|
248
|
+
margin: ITEM_MARGIN,
|
|
249
|
+
overflow: "hidden"
|
|
250
|
+
},
|
|
251
|
+
fileItem: {
|
|
252
|
+
margin: ITEM_MARGIN,
|
|
253
|
+
borderRadius: 8,
|
|
254
|
+
overflow: "hidden",
|
|
255
|
+
padding: 8,
|
|
256
|
+
justifyContent: "center",
|
|
257
|
+
alignItems: "center",
|
|
258
|
+
shadowOffset: {
|
|
259
|
+
width: 0,
|
|
260
|
+
height: 2
|
|
261
|
+
},
|
|
262
|
+
shadowOpacity: 0.1,
|
|
263
|
+
shadowRadius: 3.84,
|
|
264
|
+
elevation: 5
|
|
265
|
+
},
|
|
266
|
+
fileIconContainer: {
|
|
267
|
+
marginBottom: 4
|
|
268
|
+
},
|
|
269
|
+
fileIcon: {
|
|
270
|
+
fontSize: 32
|
|
271
|
+
},
|
|
272
|
+
fileName: {
|
|
273
|
+
fontSize: 10,
|
|
274
|
+
textAlign: "center",
|
|
275
|
+
marginTop: 4,
|
|
276
|
+
fontWeight: "500"
|
|
277
|
+
},
|
|
278
|
+
fileExtension: {
|
|
279
|
+
fontSize: 8,
|
|
280
|
+
textAlign: "center",
|
|
281
|
+
marginTop: 2,
|
|
282
|
+
fontWeight: "400"
|
|
283
|
+
},
|
|
284
|
+
paginationContainer: {
|
|
285
|
+
// Styles applied via theme
|
|
286
|
+
}
|
|
287
|
+
});
|
|
288
|
+
export default FilesGallery;
|
|
@@ -19,6 +19,7 @@ import ImagesSkeleton from "./ImagesSkeleton.native";
|
|
|
19
19
|
import Pagination from "./Pagination.native";
|
|
20
20
|
// Icons are now passed via props, no need to import here
|
|
21
21
|
import { defaultTheme } from "./theme";
|
|
22
|
+
import { IMAGE_MIME_TYPES } from "../core/FileTypes";
|
|
22
23
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
23
24
|
var _Dimensions$get = Dimensions.get("window"),
|
|
24
25
|
SCREEN_WIDTH = _Dimensions$get.width;
|
|
@@ -32,7 +33,6 @@ var CONTAINER_PADDING = 24; // paddingHorizontal md (12 * 2)
|
|
|
32
33
|
var GRID_PADDING = 4; // padding 2 on each side (2 * 2)
|
|
33
34
|
var TOTAL_MARGINS = ITEM_MARGIN * (NUM_COLUMNS - 1) * 2; // margins between items (4px * 2 gaps = 8px)
|
|
34
35
|
var ITEM_SIZE = (SCREEN_WIDTH - CONTAINER_PADDING - GRID_PADDING - TOTAL_MARGINS) / NUM_COLUMNS;
|
|
35
|
-
var IMAGE_MIME_TYPES = ["image/png", "image/jpeg", "image/webp", "image/svg+xml", "image/gif", "image/avif", "image/x-icon", "image/vnd.microsoft.icon", "image/heic", "image/heif"];
|
|
36
36
|
var ImagesGallery = function ImagesGallery(_ref) {
|
|
37
37
|
var update_data = _ref.update_data,
|
|
38
38
|
closePopup = _ref.closePopup,
|
|
@@ -8,6 +8,7 @@ import React, { useMemo, useState } from "react";
|
|
|
8
8
|
import { View, Text, TouchableOpacity, StyleSheet } from "react-native";
|
|
9
9
|
import ImagesGallery from "./MediaGallery.native";
|
|
10
10
|
import VideosGallery from "./VideosGallery.native";
|
|
11
|
+
import FilesGallery from "./FilesGallery.native";
|
|
11
12
|
import { defaultTheme } from "./theme";
|
|
12
13
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
14
|
var MediaTab = function MediaTab(_ref) {
|
|
@@ -86,8 +87,8 @@ var MediaTab = function MediaTab(_ref) {
|
|
|
86
87
|
});
|
|
87
88
|
}
|
|
88
89
|
if (type === "file") {
|
|
89
|
-
//
|
|
90
|
-
return /*#__PURE__*/_jsx(
|
|
90
|
+
// Use FilesGallery for non-image, non-video files
|
|
91
|
+
return /*#__PURE__*/_jsx(FilesGallery, {
|
|
91
92
|
imagePopup: imagePopup,
|
|
92
93
|
update_data: update_data,
|
|
93
94
|
current_data: current_data,
|
|
@@ -12,17 +12,18 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
|
|
|
12
12
|
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
13
13
|
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
14
14
|
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
15
|
-
import React, { useState, useEffect } from
|
|
16
|
-
import { View, FlatList, TouchableOpacity, StyleSheet, Dimensions, Text } from
|
|
17
|
-
import FileUpload from
|
|
18
|
-
import ImagesSkeleton from
|
|
19
|
-
import Pagination from
|
|
15
|
+
import React, { useState, useEffect } from "react";
|
|
16
|
+
import { View, FlatList, TouchableOpacity, StyleSheet, Dimensions, Text } from "react-native";
|
|
17
|
+
import FileUpload from "./FileUpload.native";
|
|
18
|
+
import ImagesSkeleton from "./ImagesSkeleton.native";
|
|
19
|
+
import Pagination from "./Pagination.native";
|
|
20
20
|
// Icons are now passed via props, no need to import here
|
|
21
|
-
import { defaultTheme } from
|
|
21
|
+
import { defaultTheme } from "./theme";
|
|
22
|
+
import { VIDEO_MIME_TYPES } from "../core/FileTypes";
|
|
22
23
|
// Note: You'll need to install react-native-video for video playback
|
|
23
24
|
// import Video from 'react-native-video'
|
|
24
25
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
25
|
-
var _Dimensions$get = Dimensions.get(
|
|
26
|
+
var _Dimensions$get = Dimensions.get("window"),
|
|
26
27
|
SCREEN_WIDTH = _Dimensions$get.width;
|
|
27
28
|
var NUM_COLUMNS = 3;
|
|
28
29
|
var ITEM_MARGIN = 4; // Reduced margin for better fit
|
|
@@ -34,7 +35,6 @@ var CONTAINER_PADDING = 24; // paddingHorizontal md (12 * 2)
|
|
|
34
35
|
var GRID_PADDING = 4; // padding 2 on each side (2 * 2)
|
|
35
36
|
var TOTAL_MARGINS = ITEM_MARGIN * (NUM_COLUMNS - 1) * 2; // margins between items (4px * 2 gaps = 8px)
|
|
36
37
|
var ITEM_SIZE = (SCREEN_WIDTH - CONTAINER_PADDING - GRID_PADDING - TOTAL_MARGINS) / NUM_COLUMNS;
|
|
37
|
-
var VIDEO_MIME_TYPES = ['video/mp4', 'video/quicktime', 'video/x-ms-wmv', 'video/h265', 'video/hevc', 'video/webm'];
|
|
38
38
|
var VideosGallery = function VideosGallery(_ref) {
|
|
39
39
|
var update_data = _ref.update_data,
|
|
40
40
|
closePopup = _ref.closePopup,
|
|
@@ -105,7 +105,7 @@ var VideosGallery = function VideosGallery(_ref) {
|
|
|
105
105
|
case 3:
|
|
106
106
|
_context.p = 3;
|
|
107
107
|
_t = _context.v;
|
|
108
|
-
console.error(
|
|
108
|
+
console.error("Error loading videos:", _t);
|
|
109
109
|
if (onError) {
|
|
110
110
|
onError(_t);
|
|
111
111
|
}
|
|
@@ -150,7 +150,7 @@ var VideosGallery = function VideosGallery(_ref) {
|
|
|
150
150
|
});
|
|
151
151
|
}
|
|
152
152
|
var video = videos[index - 1];
|
|
153
|
-
var videoUrl = typeof video ===
|
|
153
|
+
var videoUrl = typeof video === "string" ? video : video.url;
|
|
154
154
|
var videoKey = video.id || video.url || index;
|
|
155
155
|
return /*#__PURE__*/_jsx(TouchableOpacity, {
|
|
156
156
|
onPress: function onPress() {
|
|
@@ -170,7 +170,7 @@ var VideosGallery = function VideosGallery(_ref) {
|
|
|
170
170
|
});
|
|
171
171
|
};
|
|
172
172
|
var data = isLoading ? [] : [{
|
|
173
|
-
type:
|
|
173
|
+
type: "upload"
|
|
174
174
|
}].concat(_toConsumableArray(videos));
|
|
175
175
|
return /*#__PURE__*/_jsx(View, {
|
|
176
176
|
style: [styles.container, containerStyle],
|
|
@@ -178,7 +178,7 @@ var VideosGallery = function VideosGallery(_ref) {
|
|
|
178
178
|
data: data,
|
|
179
179
|
renderItem: renderItem,
|
|
180
180
|
keyExtractor: function keyExtractor(item, index) {
|
|
181
|
-
if (index === 0) return
|
|
181
|
+
if (index === 0) return "upload";
|
|
182
182
|
var video = videos[index - 1];
|
|
183
183
|
return video.id || video.url || "video-".concat(index);
|
|
184
184
|
},
|
|
@@ -217,9 +217,9 @@ var styles = StyleSheet.create({
|
|
|
217
217
|
videoItem: {
|
|
218
218
|
margin: ITEM_MARGIN,
|
|
219
219
|
borderRadius: 8,
|
|
220
|
-
overflow:
|
|
221
|
-
backgroundColor:
|
|
222
|
-
shadowColor:
|
|
220
|
+
overflow: "hidden",
|
|
221
|
+
backgroundColor: "#000000",
|
|
222
|
+
shadowColor: "#000",
|
|
223
223
|
shadowOffset: {
|
|
224
224
|
width: 0,
|
|
225
225
|
height: 2
|
|
@@ -229,19 +229,19 @@ var styles = StyleSheet.create({
|
|
|
229
229
|
elevation: 5
|
|
230
230
|
},
|
|
231
231
|
videoPlaceholder: {
|
|
232
|
-
width:
|
|
233
|
-
height:
|
|
234
|
-
backgroundColor:
|
|
235
|
-
justifyContent:
|
|
236
|
-
alignItems:
|
|
232
|
+
width: "100%",
|
|
233
|
+
height: "100%",
|
|
234
|
+
backgroundColor: "#1a1a1a",
|
|
235
|
+
justifyContent: "center",
|
|
236
|
+
alignItems: "center"
|
|
237
237
|
},
|
|
238
238
|
playIcon: {
|
|
239
239
|
fontSize: 32,
|
|
240
|
-
color:
|
|
240
|
+
color: "#FFFFFF"
|
|
241
241
|
},
|
|
242
242
|
video: {
|
|
243
|
-
width:
|
|
244
|
-
height:
|
|
243
|
+
width: "100%",
|
|
244
|
+
height: "100%"
|
|
245
245
|
},
|
|
246
246
|
paginationContainer: {
|
|
247
247
|
// Styles applied via theme
|