158 lines
7.9 KiB
JavaScript
158 lines
7.9 KiB
JavaScript
|
"use strict";
|
||
|
exports.id = 1336;
|
||
|
exports.ids = [1336];
|
||
|
exports.modules = {
|
||
|
|
||
|
/***/ 1336:
|
||
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||
|
|
||
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||
|
/* harmony export */ "Z": () => (/* binding */ UserCard)
|
||
|
/* harmony export */ });
|
||
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(997);
|
||
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
|
||
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(6689);
|
||
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
|
||
|
// @ts-check
|
||
|
/**
|
||
|
* ==============================================================================
|
||
|
* Imports
|
||
|
* ==============================================================================
|
||
|
*/
|
||
|
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
/**
|
||
|
* ==============================================================================
|
||
|
* Main Component { Functional }
|
||
|
* ==============================================================================
|
||
|
* @param {object} props - Server props
|
||
|
* @param {import("@/package-shared/types").UserType} props.userObject
|
||
|
* @param {boolean} [props.userPage]
|
||
|
*/ function UserCard({ userObject , userPage }) {
|
||
|
/**
|
||
|
* Get Contexts
|
||
|
*
|
||
|
* @abstract { React.useContext }
|
||
|
*/ ////////////////////////////////////////////////
|
||
|
////////////////////////////////////////////////
|
||
|
////////////////////////////////////////////////
|
||
|
/**
|
||
|
* Javascript Variables
|
||
|
*
|
||
|
* @abstract Non hook variables and functions
|
||
|
*/ const userTitles = Object.keys(userObject);
|
||
|
////////////////////////////////////////////////
|
||
|
////////////////////////////////////////////////
|
||
|
////////////////////////////////////////////////
|
||
|
/**
|
||
|
* React Hooks
|
||
|
*
|
||
|
* @abstract { useState, useEffect, useRef, etc ... }
|
||
|
*/ const [loading, setLoading] = react__WEBPACK_IMPORTED_MODULE_1___default().useState(false);
|
||
|
const [refresh, setRefresh] = react__WEBPACK_IMPORTED_MODULE_1___default().useState(0);
|
||
|
const [collapsed, setCollapsed] = react__WEBPACK_IMPORTED_MODULE_1___default().useState(userPage ? false : true);
|
||
|
////////////////////////////////////////////////
|
||
|
////////////////////////////////////////////////
|
||
|
////////////////////////////////////////////////
|
||
|
/**
|
||
|
* Function Return
|
||
|
*
|
||
|
* @description Main Function Return
|
||
|
*/ return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
|
||
|
className: "card col green w-full overflow-hidden" + (collapsed ? userPage ? " h-[100px]" : " h-[85px]" : " "),
|
||
|
children: [
|
||
|
/*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
|
||
|
className: "items-center w-full",
|
||
|
children: [
|
||
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("img", {
|
||
|
src: userObject["image_thumbnail"],
|
||
|
alt: "",
|
||
|
className: "rounded-full object-cover" + (userPage ? " w-16 h-16" : " w-12 h-12")
|
||
|
}),
|
||
|
!userPage && /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("h3", {
|
||
|
className: "m-0 text-xl",
|
||
|
children: [
|
||
|
userObject["first_name"],
|
||
|
" ",
|
||
|
userObject["last_name"],
|
||
|
" "
|
||
|
]
|
||
|
}),
|
||
|
/*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
|
||
|
className: "ml-auto",
|
||
|
children: [
|
||
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("button", {
|
||
|
className: "outlined gray small-text",
|
||
|
onClick: (e)=>{
|
||
|
if (collapsed) {
|
||
|
setCollapsed(false);
|
||
|
} else {
|
||
|
setCollapsed(true);
|
||
|
}
|
||
|
},
|
||
|
children: collapsed ? "More Details" : "Collapse"
|
||
|
}),
|
||
|
!userPage && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("a", {
|
||
|
href: `/su/users/${userObject.id}`,
|
||
|
className: "button outlined gray small-text",
|
||
|
children: "View User"
|
||
|
})
|
||
|
]
|
||
|
})
|
||
|
]
|
||
|
}),
|
||
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
|
||
|
className: "card no-hover col w-full light-gray-bg",
|
||
|
children: userTitles.map((userTitle, utIndex)=>{
|
||
|
return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), {
|
||
|
children: [
|
||
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
|
||
|
children: /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("span", {
|
||
|
style: {
|
||
|
wordBreak: "break-all"
|
||
|
},
|
||
|
children: [
|
||
|
userTitle,
|
||
|
":",
|
||
|
" ",
|
||
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("b", {
|
||
|
children: // @ts-ignore
|
||
|
userObject[userTitle]
|
||
|
})
|
||
|
]
|
||
|
})
|
||
|
}),
|
||
|
utIndex < userTitles.length - 1 && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("hr", {})
|
||
|
]
|
||
|
}, utIndex + 1);
|
||
|
})
|
||
|
}),
|
||
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("button", {
|
||
|
className: "outlined gray small-text w-full",
|
||
|
onClick: (e)=>{
|
||
|
setCollapsed(true);
|
||
|
},
|
||
|
children: "Collapse"
|
||
|
})
|
||
|
]
|
||
|
});
|
||
|
////////////////////////////////////////////////
|
||
|
////////////////////////////////////////////////
|
||
|
////////////////////////////////////////////////
|
||
|
} //////////////////////////////////////////////////////////////////////////////////
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
//////////////////////////////////////////////////////////////////////////////////
|
||
|
|
||
|
|
||
|
/***/ })
|
||
|
|
||
|
};
|
||
|
;
|