exports.id = 904;
exports.ids = [904];
exports.modules = {

/***/ 6877:
/***/ ((module) => {

// Exports
module.exports = {
	"center": "MarketItem_center__dLc3p",
	"paper": "MarketItem_paper__uTPMo",
	"styledScrollBarList": "MarketItem_styledScrollBarList__xHc_T",
	"page": "MarketItem_page__Edm6W",
	"pageHeader": "MarketItem_pageHeader__XGbG4",
	"pageContent": "MarketItem_pageContent__cpdT0",
	"pageTitle": "MarketItem_pageTitle__hB2mx",
	"customIcon": "MarketItem_customIcon__JnNnH",
	"listItem": "MarketItem_listItem__hTfFi",
	"listItemContent": "MarketItem_listItemContent__hoGhm",
	"cardActionArea": "MarketItem_cardActionArea__SoWdY",
	"image": "MarketItem_image__n9eWD",
	"caption": "MarketItem_caption__2Rtjf",
	"title": "MarketItem_title__6uUMf",
	"version": "MarketItem_version__DazpC",
	"excerpt": "MarketItem_excerpt__jH_qx",
	"actions": "MarketItem_actions__p_sHQ",
	"updateProgress": "MarketItem_updateProgress__mPUIi",
	"installing": "MarketItem_installing__YazoF"
};


/***/ }),

/***/ 5904:
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {

"use strict";
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */   "Z": () => (/* binding */ MarketItem)
/* harmony export */ });
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(2322);
/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(5692);
/* harmony import */ var _mui_material__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_mui_material__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var clsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(8103);
/* harmony import */ var clsx__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(clsx__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(6689);
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(6877);
/* harmony import */ var _MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4__);





function MarketItem(props) {
    const data = props?.data;
    const [installing, setInstalling] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(false);
    const [installed, setInstalled] = (0,react__WEBPACK_IMPORTED_MODULE_3__.useState)(!!(props.data?.name && props?.listItemProps?.installedModules?.find((inst)=>inst.name === props.data?.name)));
    const installModule = async ()=>{
        if (!props.listItemProps?.install || !data) return;
        setInstalling(true);
        const success = await props.listItemProps.install(data);
        if (success) setInstalled(true);
        setInstalling(false);
    };
    return /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_mui_material__WEBPACK_IMPORTED_MODULE_1__.Grid, {
        item: true,
        xs: 6,
        lg: 4,
        className: (_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().listItem),
        children: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
            className: clsx__WEBPACK_IMPORTED_MODULE_2___default()((_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().listItemContent), installing && (_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().installing)),
            children: [
                data?.image && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_mui_material__WEBPACK_IMPORTED_MODULE_1__.CardActionArea, {
                    onClick: ()=>props.listItemProps?.open(props.data),
                    className: (_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().cardActionArea),
                    children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("img", {
                        src: data.image,
                        className: (_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().image)
                    })
                }),
                /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
                    className: (_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().caption),
                    children: [
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_mui_material__WEBPACK_IMPORTED_MODULE_1__.Badge, {
                            color: "secondary",
                            badgeContent: installed ? "installed" : null,
                            children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_mui_material__WEBPACK_IMPORTED_MODULE_1__.Typography, {
                                gutterBottom: true,
                                variant: "h5",
                                component: "h3",
                                className: (_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().title),
                                children: data?.title ?? ""
                            })
                        }),
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("p", {
                            className: (_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().version),
                            children: data?.version ?? ""
                        }),
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("p", {
                            className: (_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().excerpt),
                            children: data?.excerpt ?? ""
                        })
                    ]
                }),
                /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
                    className: (_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().actions),
                    children: [
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_mui_material__WEBPACK_IMPORTED_MODULE_1__.Button, {
                            size: "small",
                            color: "primary",
                            variant: "contained",
                            onClick: ()=>props.listItemProps?.open(props.data),
                            children: "Open"
                        }),
                        /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_mui_material__WEBPACK_IMPORTED_MODULE_1__.Button, {
                            disabled: installed || installing,
                            size: "small",
                            color: "primary",
                            variant: "contained",
                            onClick: installModule,
                            children: "Install"
                        })
                    ]
                }),
                installing && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(_mui_material__WEBPACK_IMPORTED_MODULE_1__.LinearProgress, {
                    className: (_MarketItem_module_scss__WEBPACK_IMPORTED_MODULE_4___default().updateProgress)
                })
            ]
        })
    });
}


/***/ })

};
;