@trap_stevo/legendarybuilderproreact-ui
Version:
The legendary UI & utility API that makes your application a legendary application. ~ Created by Steven Compton
895 lines • 86.8 kB
JavaScript
import _typeof from "@babel/runtime/helpers/typeof";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _extends from "@babel/runtime/helpers/extends";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
import React, { useState, useEffect } from "react";
import { motion } from "framer-motion";
import { HUDUniversalHUDUtilityManager, ConvertNumberToMoneyFormat, ConvertFileSizeToDisplay } from "../HUDManagers/HUDUniversalHUDUtilityManager.js";
import HUDScrollContainer from "./HUDScrollContainer.js";
import HUDIcon from "./HUDIcon.js";
var buildHierarchy = function buildHierarchy(files) {
var hierarchy = {};
files.forEach(function (file) {
var parts = file.filePath.split("/").filter(Boolean);
var current = hierarchy;
parts.forEach(function (part, index) {
var lastPart = index === parts.length - 1;
var directory = !/\.[^/.]+$/.test(file.filePath);
if (!current[part]) {
if (lastPart) {
current[part] = _objectSpread(_objectSpread({}, file), {}, {
type: directory ? "directory" : "file",
children: directory ? {} : undefined
});
} else {
var _current$part;
current[part] = current[part] || {
size: 0,
type: "directory",
children: ((_current$part = current[part]) === null || _current$part === void 0 ? void 0 : _current$part.children) || {}
};
}
}
current = current[part].children || current[part];
});
});
var calculateDirectorySize = function calculateDirectorySize(node) {
if (node.children) {
var totalSize = Object.values(node.children).reduce(function (total, childNode) {
return total + calculateDirectorySize(childNode);
}, 0);
node.size = totalSize;
return totalSize;
}
return node.size || 0;
};
var calculateDirectoryItemCount = function calculateDirectoryItemCount(node) {
if (!node.children) return 0;
var itemCount = 0;
Object.values(node.children).forEach(function (childNode) {
itemCount += 1;
if (childNode.children) {
itemCount += calculateDirectoryItemCount(childNode);
}
});
return itemCount;
};
var convertToArray = function convertToArray(obj) {
var path = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
return Object.keys(obj).map(function (key) {
var currentPath = "".concat(path, "/").concat(key);
var node = obj[key];
if (node.children) {
var itemCount = calculateDirectoryItemCount(node);
return {
name: key,
type: "directory",
size: node.size,
filePath: currentPath,
createdTime: node.createdTime || new Date().toLocaleString(),
modifiedTime: node.modifiedTime || new Date().toLocaleString(),
viewedUsers: node.viewedUsers || [],
totalItems: itemCount,
children: convertToArray(node.children, currentPath)
};
}
return {
name: node.name,
size: node.size,
type: node.type,
filePath: node.filePath,
createdTime: node.createdTime || new Date().toLocaleString(),
modifiedTime: node.modifiedTime || new Date().toLocaleString(),
viewedUsers: node.viewedUsers || []
};
});
};
Object.values(hierarchy).forEach(calculateDirectorySize);
return convertToArray(hierarchy);
};
var searchHierarchy = function searchHierarchy(files, searchTerm) {
var results = [];
var searchNode = function searchNode(node, searchTerm) {
if (node.name.toLowerCase().includes(searchTerm.toLowerCase())) {
results.push(node);
}
if (node.children) {
Object.values(node.children).forEach(function (childNode) {
searchNode(childNode, searchTerm);
});
}
};
files.forEach(function (file) {
searchNode(file, searchTerm);
});
return results;
};
var markNewlyAdded = function markNewlyAdded(files, currentPath) {
return files.map(function (file) {
return _objectSpread(_objectSpread({}, file), {}, {
filePath: "".concat(currentPath, "/").concat(file.name),
"new": true
});
});
};
var handleDroppedFiles = function handleDroppedFiles(items, currentPath) {
var newFiles = [];
for (var i = 0; i < items.length; i++) {
var item = items[i].webkitGetAsEntry ? items[i].webkitGetAsEntry() : items[i];
if (item) {
var directory = item.isDirectory;
var filePath = item.fullPath || item.name;
var fileName = item.name || filePath.split("/").pop();
var fileSize = item.size || "N/A";
var createdTime = item.createdDate || new Date().toLocaleString();
newFiles.push({
name: fileName,
type: directory ? "directory" : "file",
filePath: "".concat(currentPath, "/").concat(fileName),
size: fileSize,
createdTime: createdTime
});
}
}
return newFiles;
};
var Breadcrumb = function Breadcrumb(_ref) {
var _ref$breadcrumbDropDo = _ref.breadcrumbDropDownContainerConfigurationSettings,
breadcrumbDropDownContainerConfigurationSettings = _ref$breadcrumbDropDo === void 0 ? {} : _ref$breadcrumbDropDo,
_ref$breadcrumbDropDo2 = _ref.breadcrumbDropDownCrumbIconConfigurationSettings,
breadcrumbDropDownCrumbIconConfigurationSettings = _ref$breadcrumbDropDo2 === void 0 ? {} : _ref$breadcrumbDropDo2,
_ref$breadcrumbRootCr = _ref.breadcrumbRootCrumbIconConfigurationSettings,
breadcrumbRootCrumbIconConfigurationSettings = _ref$breadcrumbRootCr === void 0 ? {} : _ref$breadcrumbRootCr,
_ref$breadcrumbDropDo3 = _ref.breadcrumbDropDownCellConfigurationSettings,
breadcrumbDropDownCellConfigurationSettings = _ref$breadcrumbDropDo3 === void 0 ? {} : _ref$breadcrumbDropDo3,
_ref$breadcrumbDivide = _ref.breadcrumbDividerIconConfigurationSettings,
breadcrumbDividerIconConfigurationSettings = _ref$breadcrumbDivide === void 0 ? {} : _ref$breadcrumbDivide,
_ref$breadcrumbContai = _ref.breadcrumbContainerConfigurationSettings,
breadcrumbContainerConfigurationSettings = _ref$breadcrumbContai === void 0 ? {} : _ref$breadcrumbContai,
_ref$breadcrumbRootCr2 = _ref.breadcrumbRootCrumbConfigurationSettings,
breadcrumbRootCrumbConfigurationSettings = _ref$breadcrumbRootCr2 === void 0 ? {} : _ref$breadcrumbRootCr2,
_ref$breadcrumbCrumbI = _ref.breadcrumbCrumbIconConfigurationSettings,
breadcrumbCrumbIconConfigurationSettings = _ref$breadcrumbCrumbI === void 0 ? {} : _ref$breadcrumbCrumbI,
_ref$breadcrumbDropDo4 = _ref.breadcrumbDropDownConfigurationSettings,
breadcrumbDropDownConfigurationSettings = _ref$breadcrumbDropDo4 === void 0 ? {} : _ref$breadcrumbDropDo4,
_ref$breadcrumbCrumbC = _ref.breadcrumbCrumbConfigurationSettings,
breadcrumbCrumbConfigurationSettings = _ref$breadcrumbCrumbC === void 0 ? {} : _ref$breadcrumbCrumbC,
_ref$breadcrumbDropDo5 = _ref.breadcrumbDropDownContainerConfigurations,
breadcrumbDropDownContainerConfigurations = _ref$breadcrumbDropDo5 === void 0 ? {} : _ref$breadcrumbDropDo5,
_ref$breadcrumbDropDo6 = _ref.breadcrumbDropDownCrumbIconConfigurations,
breadcrumbDropDownCrumbIconConfigurations = _ref$breadcrumbDropDo6 === void 0 ? {} : _ref$breadcrumbDropDo6,
_ref$breadcrumbRootCr3 = _ref.breadcrumbRootCrumbIconConfigurations,
breadcrumbRootCrumbIconConfigurations = _ref$breadcrumbRootCr3 === void 0 ? {} : _ref$breadcrumbRootCr3,
_ref$breadcrumbEllips = _ref.breadcrumbEllipsisIconConfigurations,
breadcrumbEllipsisIconConfigurations = _ref$breadcrumbEllips === void 0 ? {} : _ref$breadcrumbEllips,
_ref$breadcrumbDropDo7 = _ref.breadcrumbDropDownCellConfigurations,
breadcrumbDropDownCellConfigurations = _ref$breadcrumbDropDo7 === void 0 ? {} : _ref$breadcrumbDropDo7,
_ref$breadcrumbDivide2 = _ref.breadcrumbDividerIconConfigurations,
breadcrumbDividerIconConfigurations = _ref$breadcrumbDivide2 === void 0 ? {} : _ref$breadcrumbDivide2,
_ref$breadcrumbCrumbI2 = _ref.breadcrumbCrumbIconConfigurations,
breadcrumbCrumbIconConfigurations = _ref$breadcrumbCrumbI2 === void 0 ? {} : _ref$breadcrumbCrumbI2,
_ref$breadcrumbContai2 = _ref.breadcrumbContainerConfigurations,
breadcrumbContainerConfigurations = _ref$breadcrumbContai2 === void 0 ? {} : _ref$breadcrumbContai2,
_ref$breadcrumbDropDo8 = _ref.breadcrumbDropDownConfigurations,
breadcrumbDropDownConfigurations = _ref$breadcrumbDropDo8 === void 0 ? {} : _ref$breadcrumbDropDo8,
_ref$breadcrumbCrumbC2 = _ref.breadcrumbCrumbConfigurations,
breadcrumbCrumbConfigurations = _ref$breadcrumbCrumbC2 === void 0 ? {} : _ref$breadcrumbCrumbC2,
_ref$maxVisibleParts = _ref.maxVisibleParts,
maxVisibleParts = _ref$maxVisibleParts === void 0 ? 3 : _ref$maxVisibleParts,
onBreadcrumbClick = _ref.onBreadcrumbClick,
path = _ref.path;
var parts = path.split("/").filter(Boolean);
var _useState = useState(false),
_useState2 = _slicedToArray(_useState, 2),
showDropdown = _useState2[0],
setShowDropdown = _useState2[1];
if (parts.length < 2) return null;
var rootFolder = parts[0] || "Home";
var shouldTruncate = parts.length > maxVisibleParts + 1;
var visibleStart = shouldTruncate ? parts.slice(0, 1) : parts;
var visibleEnd = shouldTruncate ? parts.slice(-2) : parts.slice(1);
var truncatedMiddle = shouldTruncate ? parts.slice(1, -2) : [];
return /*#__PURE__*/React.createElement(motion.div, _extends({
initial: {
opacity: 0,
y: -10
},
animate: {
opacity: 1,
y: 0
},
transition: {
duration: 0.5
},
style: _objectSpread({
position: "sticky",
display: "flex",
alignItems: "center",
boxShadow: "0 4px 10px rgba(0, 0, 0, 0.15)",
borderRadius: "10px",
background: "linear-gradient(145deg, #f5f7fa, #e4e6eb)",
zIndex: 869,
padding: "10px",
marginBottom: "20px",
top: "0"
}, breadcrumbContainerConfigurationSettings)
}, breadcrumbContainerConfigurations), /*#__PURE__*/React.createElement("span", {
style: _objectSpread({
display: "flex",
alignItems: "center",
cursor: "pointer",
transition: "background-color 0.3s ease, transform 0.3s ease",
fontWeight: "bold",
boxShadow: "0 4px 8px rgba(0, 0, 0, 0.1)",
borderRadius: "8px",
backgroundColor: "#ffffff",
color: "#1A73E8",
padding: "6px 12px",
marginRight: "10px"
}, breadcrumbRootCrumbConfigurationSettings),
onMouseEnter: function onMouseEnter(e) {
e.target.style.backgroundColor = "#E8F0FE";
e.target.style.transform = "scale(1.069)";
},
onMouseLeave: function onMouseLeave(e) {
e.target.style.backgroundColor = "#ffffff";
e.target.style.transform = "scale(1)";
},
onClick: function onClick() {
return onBreadcrumbClick("");
}
}, /*#__PURE__*/React.createElement(HUDIcon, _extends({
iconConfigurationSettings: _objectSpread({
marginRight: "8px"
}, breadcrumbRootCrumbIconConfigurationSettings),
name: "fa-folder"
}, breadcrumbRootCrumbIconConfigurations)), rootFolder), shouldTruncate && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(HUDIcon, _extends({
iconConfigurationSettings: _objectSpread({
transition: "color 0.369s ease",
margin: "0 10px"
}, breadcrumbDividerIconConfigurationSettings),
color: "#6c757d",
name: "fa-chevron-right"
}, breadcrumbDividerIconConfigurations)), /*#__PURE__*/React.createElement(motion.span, _extends({
style: _objectSpread({
position: "relative",
display: "flex",
alignItems: "center",
cursor: "pointer",
transition: "background-color 0.3s ease, transform 0.3s ease",
borderRadius: "8px",
backgroundColor: "#f1f3f4",
color: "#6c757d",
padding: "6px 12px",
marginRight: "10px"
}, breadcrumbDropDownContainerConfigurationSettings),
onMouseLeave: function onMouseLeave() {
return setShowDropdown(false);
},
onMouseEnter: function onMouseEnter() {
return setShowDropdown(true);
}
}, breadcrumbDropDownContainerConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
name: "fa-ellipsis"
}, breadcrumbEllipsisIconConfigurations)), showDropdown && /*#__PURE__*/React.createElement(motion.div, _extends({
initial: {
opacity: 0,
y: -10
},
animate: {
opacity: 1,
y: 0
},
transition: {
duration: 0.3
},
style: _objectSpread({
position: "absolute",
boxShadow: "0 8px 16px rgba(0, 0, 0, 0.2)",
border: "1px solid #e0e0e0",
borderRadius: "12px",
backgroundColor: "#ffffff",
width: "max-content",
zIndex: 10,
padding: "10px",
left: "0",
top: "40px"
}, breadcrumbDropDownConfigurationSettings)
}, breadcrumbDropDownConfigurations), truncatedMiddle.map(function (part, index) {
return /*#__PURE__*/React.createElement(motion.div, _extends({
key: index,
style: _objectSpread({
display: "flex",
alignItems: "center",
cursor: "pointer",
transition: "background-color 0.3s ease, transform 0.3s ease",
borderRadius: "8px",
color: "#1A73E8",
padding: "6px 12px",
marginBottom: "5px"
}, breadcrumbDropDownCellConfigurationSettings),
whileHover: {
scale: 1.069
},
onMouseLeave: function onMouseLeave(e) {
return e.target.style.backgroundColor = "transparent";
},
onMouseEnter: function onMouseEnter(e) {
return e.target.style.backgroundColor = "#f1f3f4";
},
onClick: function onClick() {
onBreadcrumbClick(parts.slice(0, index + 2).join("/"));
setShowDropdown(false);
}
}, breadcrumbDropDownCellConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
iconConfigurationSettings: _objectSpread({
marginRight: "8px"
}, breadcrumbDropDownCrumbIconConfigurationSettings),
name: "fa-folder"
}, breadcrumbDropDownCrumbIconConfigurations)), part);
})))), visibleEnd.map(function (part, index) {
return /*#__PURE__*/React.createElement(React.Fragment, {
key: index
}, /*#__PURE__*/React.createElement(HUDIcon, _extends({
iconConfigurationSettings: _objectSpread({
transition: "color 0.369s ease",
margin: "0 10px"
}, breadcrumbDividerIconConfigurationSettings),
color: "#6c757d",
name: "fa-chevron-right"
}, breadcrumbDividerIconConfigurations)), /*#__PURE__*/React.createElement(motion.span, _extends({
initial: {
scale: 1
},
whileHover: {
scale: 1.1
},
style: _objectSpread({
display: "flex",
alignItems: "center",
cursor: "pointer",
transition: "background-color 0.369s ease, transform 0.369s ease",
fontWeight: index === visibleEnd.length - 1 ? "bold" : "normal",
boxShadow: index === visibleEnd.length - 1 ? "0 4px 8px rgba(0, 0, 0, 0.2)" : "0 4px 8px rgba(0, 0, 0, 0.1)",
borderRadius: "8px",
backgroundColor: index === visibleEnd.length - 1 ? "#1A73E8" : "#F1F3F4",
color: index === visibleEnd.length - 1 ? "#FFFFFF" : "#1A73E8",
padding: "6px 12px",
marginRight: "10px"
}, breadcrumbCrumbConfigurationSettings),
onMouseLeave: function onMouseLeave(e) {
if (index !== visibleEnd.length - 1) {
e.target.style.backgroundColor = "#F1F3F4";
e.target.style.transform = "scale(1)";
}
},
onMouseEnter: function onMouseEnter(e) {
if (index !== visibleEnd.length - 1) {
e.target.style.backgroundColor = "#DDEBFF";
e.target.style.transform = "scale(1.05)";
}
},
onClick: function onClick() {
onBreadcrumbClick(parts.slice(0, parts.length - visibleEnd.length + index + 1).join("/"));
}
}, breadcrumbCrumbConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
iconConfigurationSettings: _objectSpread({
marginRight: "8px"
}, breadcrumbCrumbIconConfigurationSettings),
name: "fa-folder"
}, breadcrumbCrumbIconConfigurations)), part));
}));
};
var FileDetailsPanel = function FileDetailsPanel(_ref2) {
var _ref2$viewedUsersSect = _ref2.viewedUsersSectionContainerConfigurationSettings,
viewedUsersSectionContainerConfigurationSettings = _ref2$viewedUsersSect === void 0 ? {} : _ref2$viewedUsersSect,
_ref2$fileDetailsFile = _ref2.fileDetailsFileDetailsLabelConfigurationSettings,
fileDetailsFileDetailsLabelConfigurationSettings = _ref2$fileDetailsFile === void 0 ? {} : _ref2$fileDetailsFile,
_ref2$fileDetailsLast = _ref2.fileDetailsLastModifiedIconConfigurationSettings,
fileDetailsLastModifiedIconConfigurationSettings = _ref2$fileDetailsLast === void 0 ? {} : _ref2$fileDetailsLast,
_ref2$fileDetailsLast2 = _ref2.fileDetailsLastModifiedConfigurationSettings,
fileDetailsLastModifiedConfigurationSettings = _ref2$fileDetailsLast2 === void 0 ? {} : _ref2$fileDetailsLast2,
_ref2$viewedUserIniti = _ref2.viewedUserInitialsCellConfigurationSettings,
viewedUserInitialsCellConfigurationSettings = _ref2$viewedUserIniti === void 0 ? {} : _ref2$viewedUserIniti,
_ref2$fileDetailsFile2 = _ref2.fileDetailsFileDetailsConfigurationSettings,
fileDetailsFileDetailsConfigurationSettings = _ref2$fileDetailsFile2 === void 0 ? {} : _ref2$fileDetailsFile2,
_ref2$fileDetailsCrea = _ref2.fileDetailsCreatedIconConfigurationSettings,
fileDetailsCreatedIconConfigurationSettings = _ref2$fileDetailsCrea === void 0 ? {} : _ref2$fileDetailsCrea,
_ref2$viewedUsersSect2 = _ref2.viewedUsersSectionIconConfigurationSettings,
viewedUsersSectionIconConfigurationSettings = _ref2$viewedUsersSect2 === void 0 ? {} : _ref2$viewedUsersSect2,
_ref2$viewedUsersCont = _ref2.viewedUsersContainerConfigurationSettings,
viewedUsersContainerConfigurationSettings = _ref2$viewedUsersCont === void 0 ? {} : _ref2$viewedUsersCont,
_ref2$fileDetailsFile3 = _ref2.fileDetailsFileNameConfigurationSettings,
fileDetailsFileNameConfigurationSettings = _ref2$fileDetailsFile3 === void 0 ? {} : _ref2$fileDetailsFile3,
_ref2$viewedUsersSect3 = _ref2.viewedUsersSectionConfigurationSettings,
viewedUsersSectionConfigurationSettings = _ref2$viewedUsersSect3 === void 0 ? {} : _ref2$viewedUsersSect3,
_ref2$viewedUserNameC = _ref2.viewedUserNameCellConfigurationSettings,
viewedUserNameCellConfigurationSettings = _ref2$viewedUserNameC === void 0 ? {} : _ref2$viewedUserNameC,
_ref2$fileDetailsCrea2 = _ref2.fileDetailsCreatedConfigurationSettings,
fileDetailsCreatedConfigurationSettings = _ref2$fileDetailsCrea2 === void 0 ? {} : _ref2$fileDetailsCrea2,
_ref2$fileDetailsPane = _ref2.fileDetailsPanelConfigurationSettings,
fileDetailsPanelConfigurationSettings = _ref2$fileDetailsPane === void 0 ? {} : _ref2$fileDetailsPane,
_ref2$viewedUserCellC = _ref2.viewedUserCellConfigurationSettings,
viewedUserCellConfigurationSettings = _ref2$viewedUserCellC === void 0 ? {} : _ref2$viewedUserCellC,
_ref2$viewedUsersSect4 = _ref2.viewedUsersSectionContainerConfigurations,
viewedUsersSectionContainerConfigurations = _ref2$viewedUsersSect4 === void 0 ? {} : _ref2$viewedUsersSect4,
_ref2$fileDetailsFile4 = _ref2.fileDetailsFileDetailsLabelConfigurations,
fileDetailsFileDetailsLabelConfigurations = _ref2$fileDetailsFile4 === void 0 ? {} : _ref2$fileDetailsFile4,
_ref2$fileDetailsLast3 = _ref2.fileDetailsLastModifiedIconConfigurations,
fileDetailsLastModifiedIconConfigurations = _ref2$fileDetailsLast3 === void 0 ? {} : _ref2$fileDetailsLast3,
_ref2$fileDetailsLast4 = _ref2.fileDetailsLastModifiedConfigurations,
fileDetailsLastModifiedConfigurations = _ref2$fileDetailsLast4 === void 0 ? {} : _ref2$fileDetailsLast4,
_ref2$fileDetailsFile5 = _ref2.fileDetailsFileDetailsConfigurations,
fileDetailsFileDetailsConfigurations = _ref2$fileDetailsFile5 === void 0 ? {} : _ref2$fileDetailsFile5,
_ref2$fileDetailsCrea3 = _ref2.fileDetailsCreatedIconConfigurations,
fileDetailsCreatedIconConfigurations = _ref2$fileDetailsCrea3 === void 0 ? {} : _ref2$fileDetailsCrea3,
_ref2$viewedUsersSect5 = _ref2.viewedUsersSectionIconConfigurations,
viewedUsersSectionIconConfigurations = _ref2$viewedUsersSect5 === void 0 ? {} : _ref2$viewedUsersSect5,
_ref2$fileDetailsFile6 = _ref2.fileDetailsFileNameConfigurations,
fileDetailsFileNameConfigurations = _ref2$fileDetailsFile6 === void 0 ? {} : _ref2$fileDetailsFile6,
_ref2$viewedUsersSect6 = _ref2.viewedUsersSectionConfigurations,
viewedUsersSectionConfigurations = _ref2$viewedUsersSect6 === void 0 ? {} : _ref2$viewedUsersSect6,
_ref2$fileDetailsCrea4 = _ref2.fileDetailsCreatedConfigurations,
fileDetailsCreatedConfigurations = _ref2$fileDetailsCrea4 === void 0 ? {} : _ref2$fileDetailsCrea4,
_ref2$fileDetailsPane2 = _ref2.fileDetailsPanelConfigurations,
fileDetailsPanelConfigurations = _ref2$fileDetailsPane2 === void 0 ? {} : _ref2$fileDetailsPane2,
_ref2$viewedUserCellC2 = _ref2.viewedUserCellConfigurations,
viewedUserCellConfigurations = _ref2$viewedUserCellC2 === void 0 ? {} : _ref2$viewedUserCellC2,
_ref2$customDetailsCo = _ref2.customDetailsComponent,
customDetailsComponent = _ref2$customDetailsCo === void 0 ? null : _ref2$customDetailsCo,
_ref2$showViewedUsers = _ref2.showViewedUsers,
showViewedUsers = _ref2$showViewedUsers === void 0 ? true : _ref2$showViewedUsers,
node = _ref2.node;
var renderViewedUsers = function renderViewedUsers() {
if (!node.viewedUsers || node.viewedUsers.length === 0) {
return /*#__PURE__*/React.createElement("span", {
style: {
fontSize: "14px",
color: "#6c757d"
}
}, "No users");
}
return /*#__PURE__*/React.createElement("div", {
style: _objectSpread({
display: "flex",
gap: "15px",
flexWrap: "wrap",
marginTop: "10px"
}, viewedUsersContainerConfigurationSettings)
}, node.viewedUsers.map(function (user, index) {
return /*#__PURE__*/React.createElement(motion.div, _extends({
key: index,
style: _objectSpread({
display: "flex",
flexDirection: "column",
justifyContent: "center",
alignItems: "center",
cursor: "pointer",
transition: "transform 0.3s ease, box-shadow 0.3s ease",
textAlign: "center",
fontWeight: "bold",
fontSize: "16px",
boxShadow: "0 4px 8px rgba(0, 0, 0, 0.15)",
borderRadius: "12px",
backgroundColor: "#E8F0FE",
color: "#007BFF",
height: "90px",
width: "70px",
padding: "10px"
}, viewedUserCellConfigurationSettings),
whileHover: {
boxShadow: "0 6px 12px rgba(0, 0, 0, 0.25)",
scale: 1.069
}
}, viewedUserCellConfigurations), /*#__PURE__*/React.createElement("span", {
style: _objectSpread({
fontSize: "18px",
fontWeight: "600",
marginBottom: "4px"
}, viewedUserNameCellConfigurationSettings)
}, user), /*#__PURE__*/React.createElement("span", {
style: _objectSpread({
fontSize: "12px",
color: "#6c757d"
}, viewedUserInitialsCellConfigurationSettings)
}, user.slice(0, 2).toUpperCase()));
}));
};
return /*#__PURE__*/React.createElement(motion.div, _extends({
initial: {
opacity: 0
},
animate: {
opacity: 1
},
transition: {
duration: 0.5
},
style: _objectSpread({
display: "grid",
gridTemplateColumns: "1fr",
fontSize: "15px",
boxShadow: "0 8px 16px rgba(0, 0, 0, 0.2)",
border: "1px solid #007BFF",
borderRadius: "15px",
background: "linear-gradient(145deg, #ffffff, #f0f4f7)",
color: "#333333",
gap: "21.69px",
padding: "30px",
marginBottom: "15px"
}, fileDetailsPanelConfigurationSettings)
}, fileDetailsPanelConfigurations), /*#__PURE__*/React.createElement("h4", _extends({
style: _objectSpread({
textShadow: "1px 1px 2px rgba(0,0,0,0.1)",
fontSize: "25.69px",
fontWeight: "bold",
color: "#007BFF",
marginBottom: "-5px"
}, fileDetailsFileNameConfigurationSettings)
}, fileDetailsFileNameConfigurations), node.name), /*#__PURE__*/React.createElement("h5", _extends({
style: _objectSpread({
fontWeight: "600",
fontSize: "18px",
color: "#008AFF",
marginBottom: "5px"
}, fileDetailsFileDetailsLabelConfigurationSettings)
}, fileDetailsFileDetailsLabelConfigurations), node.type === "directory" ? "\uD83D\uDCC1 Folder | ".concat(ConvertNumberToMoneyFormat(node.totalItems, false) || 0, " items | ").concat(ConvertFileSizeToDisplay(node.size, 2) || ConvertFileSizeToDisplay(0, 2)) : "\uD83D\uDCC4 File | ".concat(ConvertFileSizeToDisplay(node.size, 2))), /*#__PURE__*/React.createElement("div", _extends({
style: _objectSpread({
display: "grid",
gridTemplateColumns: "1fr 1fr",
gap: "20px"
}, fileDetailsFileDetailsConfigurationSettings)
}, fileDetailsFileDetailsConfigurations), /*#__PURE__*/React.createElement("p", _extends({
style: _objectSpread({
display: "flex",
alignItems: "center",
color: "#555555"
}, fileDetailsLastModifiedConfigurationSettings)
}, fileDetailsLastModifiedConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
iconConfigurationSettings: _objectSpread({
color: "#007BFF",
marginRight: "8px"
}, fileDetailsLastModifiedIconConfigurationSettings),
name: "fa-clock"
}, fileDetailsLastModifiedIconConfigurations)), "Last modified: ", HUDUniversalHUDUtilityManager.ConvertUTCDateToDateDisplay(node.modifiedTime)), /*#__PURE__*/React.createElement("p", _extends({
style: _objectSpread({
display: "flex",
alignItems: "center",
color: "#555555"
}, fileDetailsCreatedConfigurationSettings)
}, fileDetailsCreatedConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
iconConfigurationSettings: _objectSpread({
color: "#007BFF",
marginRight: "8px"
}, fileDetailsCreatedIconConfigurationSettings),
name: "fa-calendar"
}, fileDetailsCreatedIconConfigurations)), "Created: ", HUDUniversalHUDUtilityManager.ConvertUTCDateToDateDisplay(node.createdTime))), showViewedUsers ? /*#__PURE__*/React.createElement("div", _extends({
style: _objectSpread({
display: "flex",
flexDirection: "column",
gap: "15px"
}, viewedUsersSectionContainerConfigurationSettings)
}, viewedUsersSectionContainerConfigurations), /*#__PURE__*/React.createElement("div", _extends({
style: _objectSpread({
display: "flex",
alignItems: "center",
gap: "10px"
}, viewedUsersSectionConfigurationSettings)
}, viewedUsersSectionConfigurations), /*#__PURE__*/React.createElement(HUDIcon, _extends({
iconConfigurationSettings: _objectSpread({
color: "#007BFF"
}, viewedUsersSectionIconConfigurationSettings),
name: "fa-eye"
}, viewedUsersSectionIconConfigurations)), "Viewed by:"), renderViewedUsers()) : null, customDetailsComponent && /*#__PURE__*/React.cloneElement(customDetailsComponent, {
node: node
}));
};
var FileNode = function FileNode(_ref3) {
var _ref3$fileNodeCreated = _ref3.fileNodeCreatedTimeContainerConfigurationSettings,
fileNodeCreatedTimeContainerConfigurationSettings = _ref3$fileNodeCreated === void 0 ? {} : _ref3$fileNodeCreated,
_ref3$fileNodeNameCon = _ref3.fileNodeNameContainerConfigurationSettings,
fileNodeNameContainerConfigurationSettings = _ref3$fileNodeNameCon === void 0 ? {} : _ref3$fileNodeNameCon,
_ref3$fileNodeCreated2 = _ref3.fileNodeCreatedTimeConfigurationSettings,
fileNodeCreatedTimeConfigurationSettings = _ref3$fileNodeCreated2 === void 0 ? {} : _ref3$fileNodeCreated2,
_ref3$fileNodeContain = _ref3.fileNodeContainerConfigurationSettings,
fileNodeContainerConfigurationSettings = _ref3$fileNodeContain === void 0 ? {} : _ref3$fileNodeContain,
_ref3$fileNodeNameCon2 = _ref3.fileNodeNameConfigurationSettings,
fileNodeNameConfigurationSettings = _ref3$fileNodeNameCon2 === void 0 ? {} : _ref3$fileNodeNameCon2,
_ref3$fileNodeCreated3 = _ref3.fileNodeCreatedTimeContainerConfigurations,
fileNodeCreatedTimeContainerConfigurations = _ref3$fileNodeCreated3 === void 0 ? {} : _ref3$fileNodeCreated3,
_ref3$fileNodeNameCon3 = _ref3.fileNodeNameContainerConfigurations,
fileNodeNameContainerConfigurations = _ref3$fileNodeNameCon3 === void 0 ? {} : _ref3$fileNodeNameCon3,
_ref3$fileNodeCreated4 = _ref3.fileNodeCreatedTimeConfigurations,
fileNodeCreatedTimeConfigurations = _ref3$fileNodeCreated4 === void 0 ? {} : _ref3$fileNodeCreated4,
_ref3$fileNodeContain2 = _ref3.fileNodeContainerConfigurations,
fileNodeContainerConfigurations = _ref3$fileNodeContain2 === void 0 ? {} : _ref3$fileNodeContain2,
_ref3$fileNodeNameCon4 = _ref3.fileNodeNameConfigurations,
fileNodeNameConfigurations = _ref3$fileNodeNameCon4 === void 0 ? {} : _ref3$fileNodeNameCon4,
onNodeSelect = _ref3.onNodeSelect,
onNodeClick = _ref3.onNodeClick,
selectedNodes = _ref3.selectedNodes,
expandedNodes = _ref3.expandedNodes,
customIcons = _ref3.customIcons,
expanded = _ref3.expanded,
node = _ref3.node;
var _useState3 = useState(false),
_useState4 = _slicedToArray(_useState3, 2),
hovered = _useState4[0],
setHovered = _useState4[1];
var handleClick = function handleClick(event) {
event.stopPropagation();
onNodeSelect(node, event);
if (onNodeClick) onNodeClick(node, event);
};
return /*#__PURE__*/React.createElement("div", _extends({
style: _objectSpread({
position: "relative",
display: "flex",
flexDirection: "column",
cursor: "pointer",
paddingLeft: "20px",
marginBottom: "15px"
}, fileNodeContainerConfigurationSettings),
onMouseLeave: function onMouseLeave() {
return setHovered(false);
},
onMouseEnter: function onMouseEnter() {
return setHovered(true);
}
}, fileNodeContainerConfigurations), /*#__PURE__*/React.createElement(motion.div, _extends({
style: _objectSpread({
display: "flex",
alignItems: "center",
transition: "background-color 0.3s ease",
border: selectedNodes.some(function (selected) {
return selected.filePath === node.filePath;
}) ? "1px solid #007BFF" : "none",
borderRadius: "6px",
backgroundColor: hovered ? "#F0F8FF" : "transparent",
padding: "6px"
}, fileNodeNameContainerConfigurationSettings),
whileHover: {
scale: 1.05
},
onClick: handleClick
}, fileNodeNameContainerConfigurations), node.type === "directory" ? expanded ? customIcons.openFolder : customIcons.closedFolder : "📄", /*#__PURE__*/React.createElement("span", _extends({
style: _objectSpread({
color: "rgba(69, 69, 69, 1)",
marginLeft: "10px"
}, fileNodeNameConfigurationSettings)
}, fileNodeNameConfigurations), node.name)), /*#__PURE__*/React.createElement(motion.div, _extends({
initial: {
opacity: 0,
x: -15
},
animate: {
opacity: 1,
x: 0
},
transition: {
duration: 0.369
},
style: _objectSpread({
display: "flex",
marginBottom: "5px"
}, fileNodeCreatedTimeContainerConfigurationSettings)
}, fileNodeCreatedTimeContainerConfigurations), /*#__PURE__*/React.createElement("span", _extends({
style: _objectSpread({
fontStyle: "italic",
fontSize: "12.169px",
color: "rgba(115.69, 115.69, 115.69, 1)",
marginLeft: "10px"
}, fileNodeCreatedTimeConfigurationSettings)
}, fileNodeCreatedTimeConfigurations), HUDUniversalHUDUtilityManager.ConvertUTCDateToDateDisplay(node.createdTime))), expanded && node.children && Object.keys(node.children).length > 0 && Object.values(node.children).map(function (childNode, index) {
return /*#__PURE__*/React.createElement(FileNode, {
fileNodeCreatedTimeContainerConfigurationSettings: fileNodeCreatedTimeContainerConfigurationSettings,
fileNodeNameContainerConfigurationSettings: fileNodeNameContainerConfigurationSettings,
fileNodeCreatedTimeConfigurationSettings: fileNodeCreatedTimeConfigurationSettings,
fileNodeContainerConfigurationSettings: fileNodeContainerConfigurationSettings,
fileNodeNameConfigurationSettings: fileNodeNameConfigurationSettings,
fileNodeCreatedTimeContainerConfigurations: fileNodeCreatedTimeContainerConfigurations,
fileNodeNameContainerConfigurations: fileNodeNameContainerConfigurations,
fileNodeCreatedTimeConfigurations: fileNodeCreatedTimeConfigurations,
fileNodeContainerConfigurations: fileNodeContainerConfigurations,
fileNodeNameConfigurations: fileNodeNameConfigurations,
expanded: expandedNodes.has(childNode.filePath),
onNodeSelect: onNodeSelect,
onNodeClick: onNodeClick,
selectedNodes: selectedNodes,
expandedNodes: expandedNodes,
customIcons: customIcons,
node: childNode,
key: index
});
}));
};
var FileTree = function FileTree(fileTreeConfigurationSettings) {
var _fileTreeConfiguratio = fileTreeConfigurationSettings.breadcrumbDropDownContainerConfigurationSettings,
breadcrumbDropDownContainerConfigurationSettings = _fileTreeConfiguratio === void 0 ? {} : _fileTreeConfiguratio,
_fileTreeConfiguratio2 = fileTreeConfigurationSettings.breadcrumbDropDownCrumbIconConfigurationSettings,
breadcrumbDropDownCrumbIconConfigurationSettings = _fileTreeConfiguratio2 === void 0 ? {} : _fileTreeConfiguratio2,
_fileTreeConfiguratio3 = fileTreeConfigurationSettings.breadcrumbRootCrumbIconConfigurationSettings,
breadcrumbRootCrumbIconConfigurationSettings = _fileTreeConfiguratio3 === void 0 ? {} : _fileTreeConfiguratio3,
_fileTreeConfiguratio4 = fileTreeConfigurationSettings.breadcrumbDropDownCellConfigurationSettings,
breadcrumbDropDownCellConfigurationSettings = _fileTreeConfiguratio4 === void 0 ? {} : _fileTreeConfiguratio4,
_fileTreeConfiguratio5 = fileTreeConfigurationSettings.breadcrumbDividerIconConfigurationSettings,
breadcrumbDividerIconConfigurationSettings = _fileTreeConfiguratio5 === void 0 ? {} : _fileTreeConfiguratio5,
_fileTreeConfiguratio6 = fileTreeConfigurationSettings.breadcrumbContainerConfigurationSettings,
breadcrumbContainerConfigurationSettings = _fileTreeConfiguratio6 === void 0 ? {} : _fileTreeConfiguratio6,
_fileTreeConfiguratio7 = fileTreeConfigurationSettings.breadcrumbRootCrumbConfigurationSettings,
breadcrumbRootCrumbConfigurationSettings = _fileTreeConfiguratio7 === void 0 ? {} : _fileTreeConfiguratio7,
_fileTreeConfiguratio8 = fileTreeConfigurationSettings.breadcrumbCrumbIconConfigurationSettings,
breadcrumbCrumbIconConfigurationSettings = _fileTreeConfiguratio8 === void 0 ? {} : _fileTreeConfiguratio8,
_fileTreeConfiguratio9 = fileTreeConfigurationSettings.breadcrumbDropDownConfigurationSettings,
breadcrumbDropDownConfigurationSettings = _fileTreeConfiguratio9 === void 0 ? {} : _fileTreeConfiguratio9,
_fileTreeConfiguratio10 = fileTreeConfigurationSettings.breadcrumbCrumbConfigurationSettings,
breadcrumbCrumbConfigurationSettings = _fileTreeConfiguratio10 === void 0 ? {} : _fileTreeConfiguratio10,
_fileTreeConfiguratio11 = fileTreeConfigurationSettings.breadcrumbDropDownContainerConfigurations,
breadcrumbDropDownContainerConfigurations = _fileTreeConfiguratio11 === void 0 ? {} : _fileTreeConfiguratio11,
_fileTreeConfiguratio12 = fileTreeConfigurationSettings.breadcrumbDropDownCrumbIconConfigurations,
breadcrumbDropDownCrumbIconConfigurations = _fileTreeConfiguratio12 === void 0 ? {} : _fileTreeConfiguratio12,
_fileTreeConfiguratio13 = fileTreeConfigurationSettings.breadcrumbRootCrumbIconConfigurations,
breadcrumbRootCrumbIconConfigurations = _fileTreeConfiguratio13 === void 0 ? {} : _fileTreeConfiguratio13,
_fileTreeConfiguratio14 = fileTreeConfigurationSettings.breadcrumbEllipsisIconConfigurations,
breadcrumbEllipsisIconConfigurations = _fileTreeConfiguratio14 === void 0 ? {} : _fileTreeConfiguratio14,
_fileTreeConfiguratio15 = fileTreeConfigurationSettings.breadcrumbDropDownCellConfigurations,
breadcrumbDropDownCellConfigurations = _fileTreeConfiguratio15 === void 0 ? {} : _fileTreeConfiguratio15,
_fileTreeConfiguratio16 = fileTreeConfigurationSettings.breadcrumbDividerIconConfigurations,
breadcrumbDividerIconConfigurations = _fileTreeConfiguratio16 === void 0 ? {} : _fileTreeConfiguratio16,
_fileTreeConfiguratio17 = fileTreeConfigurationSettings.breadcrumbCrumbIconConfigurations,
breadcrumbCrumbIconConfigurations = _fileTreeConfiguratio17 === void 0 ? {} : _fileTreeConfiguratio17,
_fileTreeConfiguratio18 = fileTreeConfigurationSettings.breadcrumbContainerConfigurations,
breadcrumbContainerConfigurations = _fileTreeConfiguratio18 === void 0 ? {} : _fileTreeConfiguratio18,
_fileTreeConfiguratio19 = fileTreeConfigurationSettings.breadcrumbDropDownConfigurations,
breadcrumbDropDownConfigurations = _fileTreeConfiguratio19 === void 0 ? {} : _fileTreeConfiguratio19,
_fileTreeConfiguratio20 = fileTreeConfigurationSettings.breadcrumbCrumbConfigurations,
breadcrumbCrumbConfigurations = _fileTreeConfiguratio20 === void 0 ? {} : _fileTreeConfiguratio20,
_fileTreeConfiguratio21 = fileTreeConfigurationSettings.fileNodeCreatedTimeContainerConfigurationSettings,
fileNodeCreatedTimeContainerConfigurationSettings = _fileTreeConfiguratio21 === void 0 ? {} : _fileTreeConfiguratio21,
_fileTreeConfiguratio22 = fileTreeConfigurationSettings.fileNodeNameContainerConfigurationSettings,
fileNodeNameContainerConfigurationSettings = _fileTreeConfiguratio22 === void 0 ? {} : _fileTreeConfiguratio22,
_fileTreeConfiguratio23 = fileTreeConfigurationSettings.fileNodeCreatedTimeConfigurationSettings,
fileNodeCreatedTimeConfigurationSettings = _fileTreeConfiguratio23 === void 0 ? {} : _fileTreeConfiguratio23,
_fileTreeConfiguratio24 = fileTreeConfigurationSettings.fileNodeContainerConfigurationSettings,
fileNodeContainerConfigurationSettings = _fileTreeConfiguratio24 === void 0 ? {} : _fileTreeConfiguratio24,
_fileTreeConfiguratio25 = fileTreeConfigurationSettings.fileNodeNameConfigurationSettings,
fileNodeNameConfigurationSettings = _fileTreeConfiguratio25 === void 0 ? {} : _fileTreeConfiguratio25,
_fileTreeConfiguratio26 = fileTreeConfigurationSettings.fileNodeCreatedTimeContainerConfigurations,
fileNodeCreatedTimeContainerConfigurations = _fileTreeConfiguratio26 === void 0 ? {} : _fileTreeConfiguratio26,
_fileTreeConfiguratio27 = fileTreeConfigurationSettings.fileNodeNameContainerConfigurations,
fileNodeNameContainerConfigurations = _fileTreeConfiguratio27 === void 0 ? {} : _fileTreeConfiguratio27,
_fileTreeConfiguratio28 = fileTreeConfigurationSettings.fileNodeCreatedTimeConfigurations,
fileNodeCreatedTimeConfigurations = _fileTreeConfiguratio28 === void 0 ? {} : _fileTreeConfiguratio28,
_fileTreeConfiguratio29 = fileTreeConfigurationSettings.fileNodeContainerConfigurations,
fileNodeContainerConfigurations = _fileTreeConfiguratio29 === void 0 ? {} : _fileTreeConfiguratio29,
_fileTreeConfiguratio30 = fileTreeConfigurationSettings.fileNodeNameConfigurations,
fileNodeNameConfigurations = _fileTreeConfiguratio30 === void 0 ? {} : _fileTreeConfiguratio30,
_fileTreeConfiguratio31 = fileTreeConfigurationSettings.fileTreeContainerConfigurationSettings,
fileTreeContainerConfigurationSettings = _fileTreeConfiguratio31 === void 0 ? {} : _fileTreeConfiguratio31,
_fileTreeConfiguratio32 = fileTreeConfigurationSettings.scrollContainerConfigurationSettings,
scrollContainerConfigurationSettings = _fileTreeConfiguratio32 === void 0 ? {} : _fileTreeConfiguratio32,
_fileTreeConfiguratio33 = fileTreeConfigurationSettings.fileTreeContainerConfigurations,
fileTreeContainerConfigurations = _fileTreeConfiguratio33 === void 0 ? {} : _fileTreeConfiguratio33,
_fileTreeConfiguratio34 = fileTreeConfigurationSettings.scrollContainerConfigurations,
scrollContainerConfigurations = _fileTreeConfiguratio34 === void 0 ? {} : _fileTreeConfiguratio34,
_fileTreeConfiguratio35 = fileTreeConfigurationSettings.allowDragNDrop,
allowDragNDrop = _fileTreeConfiguratio35 === void 0 ? true : _fileTreeConfiguratio35,
_fileTreeConfiguratio36 = fileTreeConfigurationSettings.maxVisibleParts,
maxVisibleParts = _fileTreeConfiguratio36 === void 0 ? 3 : _fileTreeConfiguratio36,
_onBreadcrumbClick = fileTreeConfigurationSettings.onBreadcrumbClick,
onNodeSelect = fileTreeConfigurationSettings.onNodeSelect,
onNodeClick = fileTreeConfigurationSettings.onNodeClick,
onDropFiles = fileTreeConfigurationSettings.onDropFiles,
selectedFolder = fileTreeConfigurationSettings.selectedFolder,
selectedNodes = fileTreeConfigurationSettings.selectedNodes,
expandedNodes = fileTreeConfigurationSettings.expandedNodes,
customIcons = fileTreeConfigurationSettings.customIcons,
hierarchy = fileTreeConfigurationSettings.hierarchy;
var _useState5 = useState(false),
_useState6 = _slicedToArray(_useState5, 2),
draggingOver = _useState6[0],
setDraggingOver = _useState6[1];
var renderFolderDomain = function renderFolderDomain(node) {
return /*#__PURE__*/React.createElement(React.Fragment, null, node.filePath && node.filePath !== "/" && /*#__PURE__*/React.createElement(Breadcrumb, {
breadcrumbDropDownContainerConfigurationSettings: breadcrumbDropDownContainerConfigurationSettings,
breadcrumbDropDownCrumbIconConfigurationSettings: breadcrumbDropDownCrumbIconConfigurationSettings,
breadcrumbRootCrumbIconConfigurationSettings: breadcrumbRootCrumbIconConfigurationSettings,
breadcrumbDropDownCellConfigurationSettings: breadcrumbDropDownCellConfigurationSettings,
breadcrumbDividerIconConfigurationSettings: breadcrumbDividerIconConfigurationSettings,
breadcrumbContainerConfigurationSettings: breadcrumbContainerConfigurationSettings,
breadcrumbRootCrumbConfigurationSettings: breadcrumbRootCrumbConfigurationSettings,
breadcrumbCrumbIconConfigurationSettings: breadcrumbCrumbIconConfigurationSettings,
breadcrumbDropDownConfigurationSettings: breadcrumbDropDownConfigurationSettings,
breadcrumbCrumbConfigurationSettings: breadcrumbCrumbConfigurationSettings,
breadcrumbDropDownContainerConfigurations: breadcrumbDropDownContainerConfigurations,
breadcrumbDropDownCrumbIconConfigurations: breadcrumbDropDownCrumbIconConfigurations,
breadcrumbRootCrumbIconConfigurations: breadcrumbRootCrumbIconConfigurations,
breadcrumbEllipsisIconConfigurations: breadcrumbEllipsisIconConfigurations,
breadcrumbDropDownCellConfigurations: breadcrumbDropDownCellConfigurations,
breadcrumbDividerIconConfigurations: breadcrumbDividerIconConfigurations,
breadcrumbCrumbIconConfigurations: breadcrumbCrumbIconConfigurations,
breadcrumbContainerConfigurations: breadcrumbContainerConfigurations,
breadcrumbDropDownConfigurations: breadcrumbDropDownConfigurations,
breadcrumbCrumbConfigurations: breadcrumbCrumbConfigurations,
maxVisibleParts: maxVisibleParts,
path: node.filePath,
onBreadcrumbClick: function onBreadcrumbClick(path) {
_onBreadcrumbClick(path);
}
}), node.children && Object.values(node.children).map(function (child, index) {
return /*#__PURE__*/React.createElement(FileNode, {
fileNodeCreatedTimeContainerConfigurationSettings: fileNodeCreatedTimeContainerConfigurationSettings,
fileNodeNameContainerConfigurationSettings: fileNodeNameContainerConfigurationSettings,
fileNodeCreatedTimeConfigurationSettings: fileNodeCreatedTimeConfigurationSettings,
fileNodeContainerConfigurationSettings: fileNodeContainerConfigurationSettings,
fileNodeNameConfigurationSettings: fileNodeNameConfigurationSettings,
fileNodeCreatedTimeContainerConfigurations: fileNodeCreatedTimeContainerConfigurations,
fileNodeNameContainerConfigurations: fileNodeNameContainerConfigurations,
fileNodeCreatedTimeConfigurations: fileNodeCreatedTimeConfigurations,
fileNodeContainerConfigurations: fileNodeContainerConfigurations,
fileNodeNameConfigurations: fileNodeNameConfigurations,
expanded: expandedNodes.has(child.filePath),
selectedNodes: selectedNodes,
expandedNodes: expandedNodes,
onNodeSelect: onNodeSelect,
onNodeClick: onNodeClick,
customIcons: customIcons,
node: child,
key: index
});
}));
};
var handleDrop = function handleDrop(event) {
event.preventDefault();
var droppedItems = event.dataTransfer.items;
setDraggingOver(false);
if (droppedItems && selectedNodes.length > 0) {
var newFiles = handleDroppedFiles(droppedItems, selectedNodes[0].filePath);
onDropFiles(newFiles);
}
};
var handleDragLeave = function handleDragLeave() {
setDraggingOver(false);
};
var handleDragOver = function handleDragOver(event) {
event.preventDefault();
setDraggingOver(true);
};
return /*#__PURE__*/React.createElement("div", _extends({
style: _objectSpread({
display: "flex",
flexDirection: "column",
transition: "all 0.369s ease",
boxShadow: draggingOver ? "0 4px 12px rgba(26, 115, 232, 0.3)" : "0 2px 8px rgba(0, 0, 0, 0.1)",
border: draggingOver ? "2px dashed #1A73E8" : "none",
borderRadius: "10px",
backgroundColor: draggingOver ? "#E3F2FD" : "#FFF",
height: "31.69rem",
padding: "20px",
marginTop: "20px"
}, fileTreeContainerConfigurationSettings),
onDragLeave: allowDragNDrop ? handleDragLeave : undefined,
onDragOver: allowDragNDrop ? handleDragOver : undefined,
onDrop: allowDragNDrop ? handleDrop : undefined
}, fileTreeContainerConfigurations), /*#__PURE__*/React.createElement(HUDScrollContainer, _extends({
containerConfigurationSettings: _objectSpread({
overflowY: "auto",
height: "calc(100%)"
}, scrollContainerConfigurationSettings),
width: "8px",
hoverThumbColor: "rgba(0, 187, 247, 1)",
borderRadius: "8px",
scrollThumbColors: ["rgba(69, 127, 227, 1)", "rgba(69, 187, 247, 1)"],
thumbGradient: "linear-gradient(45deg, rgba(69, 127, 227, 1), rgba(27, 169, 247, 1))",
trackGradient: "linear-gradient(90deg, #e0e0e0, rgba(0, 0, 0, 0.169))",
trackColor: "tranpsarent"
}, scro