UNPKG

@etsoo/materialui

Version:

TypeScript Material-UI Implementation

56 lines (55 loc) 2.97 kB
"use strict"; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); exports.AuditDisplay = AuditDisplay; const jsx_runtime_1 = require("react/jsx-runtime"); const shared_1 = require("@etsoo/shared"); const react_1 = __importDefault(require("react")); const ListMoreDisplay_1 = require("./ListMoreDisplay"); const ShowDataComparison_1 = require("./ShowDataComparison"); const ReactApp_1 = require("./app/ReactApp"); const styles_1 = require("@mui/material/styles"); const Button_1 = __importDefault(require("@mui/material/Button")); const Typography_1 = __importDefault(require("@mui/material/Typography")); const Divider_1 = __importDefault(require("@mui/material/Divider")); /** * Audit display * @param props Props * @returns Component */ function AuditDisplay(props) { // Theme const theme = (0, styles_1.useTheme)(); // Global app const app = (0, ReactApp_1.useAppContext)(); // Get label const getLabel = (key) => { return app?.get(shared_1.Utils.formatInitial(key)) ?? key; }; // Format date const formatDate = (date) => { return app?.formatDate(date, "ds") ?? date.toUTCString(); }; // Title var title = getLabel("dataComparison"); // Destruct const { getItemStyle = (index, theme) => ({ padding: [theme.spacing(1.5), theme.spacing(1)].join(" "), background: index % 2 === 0 ? theme.palette.grey[100] : theme.palette.grey[50] }), getColumnLabel, equalCheck, itemRenderer = (data) => { const { newData, oldData, changes = { newData: newData ?? {}, oldData: oldData ?? {} } } = data; return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [changes != null && ((0, jsx_runtime_1.jsx)(Button_1.default, { variant: "outlined", size: "small", onClick: () => (0, ShowDataComparison_1.ShowDataComparison)(changes, title, getColumnLabel, equalCheck), sx: { marginLeft: theme.spacing(1), marginTop: theme.spacing(-0.5), float: "right" }, children: title })), (0, jsx_runtime_1.jsx)(Typography_1.default, { children: formatDate(data.creation) + ", [" + getLabel(data.action) + "], " + data.user })] })); }, headerTitle = ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(Typography_1.default, { children: getLabel("audits") }), (0, jsx_runtime_1.jsx)(Divider_1.default, {})] })), ...rest } = props; // Layout return ((0, jsx_runtime_1.jsx)(ListMoreDisplay_1.ListMoreDisplay, { headerTitle: headerTitle, ...rest, children: (data, index) => ((0, jsx_runtime_1.jsx)("div", { style: getItemStyle(index, theme), children: itemRenderer(data, index) }, data.id)) })); }