@oxyhq/services/lib/commonjs/ui/components/fileManagement/FileDetailsModal.js

OxyHQ Expo/React Native SDK — UI components, screens, and native features

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.FileDetailsModal = void 0;
var _react = _interopRequireDefault(require("react"));
var _reactNative = require("react-native");
var _vectorIcons = require("@expo/vector-icons");
var _fileManagement = require("../../utils/fileManagement.js");
var _styles = require("./styles.js");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const FileDetailsModal = ({
  visible,
  file,
  onClose,
  onDownload,
  onDelete,
  themeStyles,
  isOwner
}) => {
  const backgroundColor = themeStyles.backgroundColor;
  const borderColor = themeStyles.borderColor;
  if (!file) return null;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Modal, {
    visible: visible,
    animationType: "slide",
    presentationStyle: "pageSheet",
    onRequestClose: onClose,
    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
      style: [_styles.fileManagementStyles.modalContainer, {
        backgroundColor
      }],
      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
        style: [_styles.fileManagementStyles.modalHeader, {
          borderBottomColor: borderColor
        }],
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
          style: _styles.fileManagementStyles.modalCloseButton,
          onPress: onClose,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
            name: "close",
            size: 24,
            color: themeStyles.textColor
          })
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
          style: [_styles.fileManagementStyles.modalTitle, {
            color: themeStyles.textColor
          }],
          children: "File Details"
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
          style: _styles.fileManagementStyles.modalPlaceholder
        })]
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.ScrollView, {
        style: _styles.fileManagementStyles.modalContent,
        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
          style: [_styles.fileManagementStyles.fileDetailCard, {
            backgroundColor: themeStyles.secondaryBackgroundColor,
            borderColor
          }],
          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
            style: _styles.fileManagementStyles.fileDetailIcon,
            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
              name: (0, _fileManagement.getFileIcon)(file.contentType),
              size: 64,
              color: themeStyles.primaryColor
            })
          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
            style: [_styles.fileManagementStyles.fileDetailName, {
              color: themeStyles.textColor
            }],
            children: file.filename
          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
            style: _styles.fileManagementStyles.fileDetailInfo,
            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
              style: _styles.fileManagementStyles.detailRow,
              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                style: [_styles.fileManagementStyles.detailLabel, {
                  color: themeStyles.isDarkTheme ? '#BBBBBB' : '#666666'
                }],
                children: "Size:"
              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                style: [_styles.fileManagementStyles.detailValue, {
                  color: themeStyles.textColor
                }],
                children: (0, _fileManagement.formatFileSize)(file.length)
              })]
            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
              style: _styles.fileManagementStyles.detailRow,
              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                style: [_styles.fileManagementStyles.detailLabel, {
                  color: themeStyles.isDarkTheme ? '#BBBBBB' : '#666666'
                }],
                children: "Type:"
              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                style: [_styles.fileManagementStyles.detailValue, {
                  color: themeStyles.textColor
                }],
                children: file.contentType
              })]
            }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
              style: _styles.fileManagementStyles.detailRow,
              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                style: [_styles.fileManagementStyles.detailLabel, {
                  color: themeStyles.isDarkTheme ? '#BBBBBB' : '#666666'
                }],
                children: "Uploaded:"
              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                style: [_styles.fileManagementStyles.detailValue, {
                  color: themeStyles.textColor
                }],
                children: new Date(file.uploadDate).toLocaleString()
              })]
            }), file.metadata?.description && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
              style: _styles.fileManagementStyles.detailRow,
              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                style: [_styles.fileManagementStyles.detailLabel, {
                  color: themeStyles.isDarkTheme ? '#BBBBBB' : '#666666'
                }],
                children: "Description:"
              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                style: [_styles.fileManagementStyles.detailValue, {
                  color: themeStyles.textColor
                }],
                children: file.metadata.description
              })]
            })]
          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
            style: _styles.fileManagementStyles.modalActions,
            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
              style: [_styles.fileManagementStyles.modalActionButton, {
                backgroundColor: themeStyles.primaryColor
              }],
              onPress: () => {
                onDownload(file.id, file.filename);
                onClose();
              },
              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
                name: "download",
                size: 20,
                color: "#FFFFFF"
              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                style: _styles.fileManagementStyles.modalActionText,
                children: "Download"
              })]
            }), isOwner && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
              style: [_styles.fileManagementStyles.modalActionButton, {
                backgroundColor: themeStyles.dangerColor
              }],
              onPress: () => {
                onClose();
                onDelete(file.id, file.filename);
              },
              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_vectorIcons.Ionicons, {
                name: "trash",
                size: 20,
                color: "#FFFFFF"
              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
                style: _styles.fileManagementStyles.modalActionText,
                children: "Delete"
              })]
            })]
          })]
        })
      })]
    })
  });
};
exports.FileDetailsModal = FileDetailsModal;
//# sourceMappingURL=FileDetailsModal.js.map