@premieroctet/next-admin
Version:
Next-Admin provides a customizable and turnkey admin dashboard for applications built with Next.js and powered by the Prisma ORM. It aims to simplify the development process by providing a turnkey admin system that can be easily integrated into your proje
129 lines (128 loc) • 5.87 kB
JavaScript
;
var __webpack_require__ = {};
(()=>{
__webpack_require__.n = (module)=>{
var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
__webpack_require__.d(getter, {
a: getter
});
return getter;
};
})();
(()=>{
__webpack_require__.d = (exports1, definition)=>{
for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
enumerable: true,
get: definition[key]
});
};
})();
(()=>{
__webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
})();
(()=>{
__webpack_require__.r = (exports1)=>{
if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
value: 'Module'
});
Object.defineProperty(exports1, '__esModule', {
value: true
});
};
})();
var __webpack_exports__ = {};
__webpack_require__.r(__webpack_exports__);
__webpack_require__.d(__webpack_exports__, {
default: ()=>FileItem
});
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
const external_react_namespaceObject = require("react");
const file_js_namespaceObject = require("../../../utils/file.js");
const external_clsx_namespaceObject = require("clsx");
var external_clsx_default = /*#__PURE__*/ __webpack_require__.n(external_clsx_namespaceObject);
const Loader_js_namespaceObject = require("../../../assets/icons/Loader.js");
var Loader_js_default = /*#__PURE__*/ __webpack_require__.n(Loader_js_namespaceObject);
const outline_namespaceObject = require("@heroicons/react/24/outline");
const FileItem_FileItem = ({ file, hasError, onDelete, disabled })=>{
const [isPending, setIsPending] = (0, external_react_namespaceObject.useState)(false);
const [fileIsImage, setFileIsImage] = (0, external_react_namespaceObject.useState)(true);
const [filename, setFilename] = (0, external_react_namespaceObject.useState)(()=>{
if (file instanceof File) return file.name;
return null;
});
const fileUri = (0, external_react_namespaceObject.useMemo)(()=>{
if ("string" == typeof file) return file;
return URL.createObjectURL(file);
}, [
file
]);
(0, external_react_namespaceObject.useEffect)(()=>{
if (fileUri) {
setIsPending(true);
const image = document.createElement("img");
image.src = fileUri;
image.onload = ()=>{
setFileIsImage(true);
setIsPending(false);
};
image.onerror = (e)=>{
setFileIsImage(false);
setIsPending(false);
};
const name = (0, file_js_namespaceObject.getFilenameFromUrl)(fileUri);
if (!filename && name) setFilename(name);
setIsPending(false);
} else setIsPending(false);
}, [
fileUri
]);
return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
className: external_clsx_default()("ring-nextadmin-border-default dark:ring-dark-nextadmin-border-default relative flex cursor-default items-center justify-between rounded-md px-3 px-8 py-2 text-sm placeholder-gray-500 shadow-sm ring-1", {
"ring-red-600 dark:ring-red-400": hasError
}),
children: [
/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("a", {
href: fileUri ?? void 0,
className: "relative flex flex-1 cursor-pointer flex-col items-center gap-2",
target: "_blank",
rel: "noopener noreferrer",
children: [
isPending && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
className: "flex h-10 w-10 items-center justify-center",
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(Loader_js_default(), {
className: "stroke-nextadmin-content-default dark:stroke-dark-nextadmin-content-default h-6 w-6 animate-spin dark:stroke-gray-300"
})
}),
!isPending && (fileIsImage ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("img", {
src: fileUri,
alt: "file",
className: "h-32"
}) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(outline_namespaceObject.DocumentIcon, {
className: "text-nextadmin-content-default dark:text-dark-nextadmin-content-default h-10 w-10"
})),
!!filename && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
className: "text-nextadmin-content-inverted/50 dark:text-dark-nextadmin-content-inverted/50 text-sm",
children: filename
})
]
}),
!isPending && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
onClick: onDelete,
className: external_clsx_default()({
hidden: disabled
}),
children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(outline_namespaceObject.XMarkIcon, {
className: "absolute right-2 top-2 h-5 w-5 cursor-pointer text-gray-400"
})
})
]
});
};
const FileItem = FileItem_FileItem;
exports["default"] = __webpack_exports__["default"];
for(var __webpack_i__ in __webpack_exports__)if (-1 === [
"default"
].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
Object.defineProperty(exports, '__esModule', {
value: true
});