import React, { useEffect, useMemo, useState } from 'react';
import { SideSheet } from '../../../UI/surfaces/SideSheet';
import { useTranslation } from 'react-i18next';
import { FluentTextField } from '../../../UI/inputs/textField/FluentTextField';
import { GridRow } from '../../../layout/GridRow';
import { GridUnit } from '../../../layout/GridUnit';
import { AmbientCard } from '../../../UI/surfaces/cards/AmbientCard/AmbientCard';
import { makeStyles, Box } from "@material-ui/core";
import { AuditEventTypeEnums } from '../../../enums/auditEventEnums';
import ReactJsonView from '@microlink/react-json-view';
import { LinearProgress } from '../../../UI/loading/LinearProgress';
import { useGetLocalizedUserDateTimeString } from '../../utilities/dateLocalizationHooks';
import { UdpEnums } from '../../../enums/unitySystemEnums';
import { executeQueryWithParameters, getBaseMethod } from '../../utilities/methodUtils';
const useStyles = makeStyles((theme) => ({
    textField: {
        marginTop: theme.spacing(0),
    },
    loadingBar: {
        top: theme.spacing(-2),
        marginLeft: theme.spacing(-2),
        marginRight: theme.spacing(-2),
    },
}));
const UdpAuditEventSidesheet = props => {
    var _a;
    const { auditEvent, isSideSheetOpen, handleSideSheet, promotedEntities, sheetProps, } = props;
    const { t } = useTranslation();
    const classes = useStyles();
    const getLocalizedDateTimeString = useGetLocalizedUserDateTimeString();
    const [auditEventDetail, setAuditEventDetail] = React.useState({});
    const [loading, setLoading] = useState(false);
    const auditEventDetailGetApiMethod = useMemo(() => {
        return getBaseMethod(UdpEnums.Udp_Audit_Event, 'unityBaseGetMethod', promotedEntities);
    }, [promotedEntities]);
    const onCloseSideSheet = () => {
        handleSideSheet(false);
    };
    useEffect(() => {
        const getAuditEventDetail = async () => {
            var _a;
            let auditEventDetail = {};
            const data = {};
            try {
                if (auditEventDetailGetApiMethod && auditEvent) {
                    setLoading(true);
                    data['{id}'] = auditEvent.id;
                    const response = await executeQueryWithParameters({ data }, auditEventDetailGetApiMethod.apiMethodId).catch((e) => {
                        console.error(e);
                        setLoading(false);
                    });
                    if ((response === null || response === void 0 ? void 0 : response.status) === 200) {
                        auditEventDetail = (_a = response === null || response === void 0 ? void 0 : response.data) === null || _a === void 0 ? void 0 : _a.udpAuditEventUdpAuditEventDetail[0];
                        setAuditEventDetail(auditEventDetail);
                    }
                }
            }
            finally {
                setLoading(false);
            }
        };
        getAuditEventDetail();
    }, [auditEvent, auditEventDetailGetApiMethod]);
    return (React.createElement(SideSheet, Object.assign({}, sheetProps, { open: isSideSheetOpen, onClose: onCloseSideSheet, title: t(`Audit Event Details`), width: 800, color: "primary" }), loading ? (React.createElement(LinearProgress, { className: classes.loadingBar, color: "secondary" })) : (React.createElement(GridRow, null, React.createElement(GridUnit, { ratio: "1:1", width: "100%" }, React.createElement(AmbientCard, { fullWidth: true, header: true }, React.createElement(React.Fragment, null, React.createElement(FluentTextField, { className: classes.textField, id: "auditEventTypeName", label: t('Event Type'), value: (auditEvent === null || auditEvent === void 0 ? void 0 : auditEvent.auditEventTypeName) || '', disabled: true }), React.createElement(FluentTextField, { className: classes.textField, id: "auditEventUserDisplayName", label: t('User'), value: (auditEvent === null || auditEvent === void 0 ? void 0 : auditEvent.userDisplayName) || '', disabled: true }), React.createElement(FluentTextField, { className: classes.textField, id: "auditEventDomain", label: t('Description'), value: (auditEvent === null || auditEvent === void 0 ? void 0 : auditEvent.domain) || '', disabled: true }), React.createElement(FluentTextField, { className: classes.textField, id: "auditEventCreatedOn", label: t('Created On'), value: getLocalizedDateTimeString((_a = auditEvent === null || auditEvent === void 0 ? void 0 : auditEvent.createdOn) !== null && _a !== void 0 ? _a : ''), disabled: true }), React.createElement(Box, null, ((auditEvent === null || auditEvent === void 0 ? void 0 : auditEvent.typeCode) === AuditEventTypeEnums.Update_Domain ||
        (auditEvent === null || auditEvent === void 0 ? void 0 : auditEvent.typeCode) === AuditEventTypeEnums.Delete_Domain) &&
        React.createElement(ReactJsonView, { src: (auditEventDetail === null || auditEventDetail === void 0 ? void 0 : auditEventDetail.oldObj) ? JSON.parse(auditEventDetail === null || auditEventDetail === void 0 ? void 0 : auditEventDetail.oldObj) : {}, name: t('Old Details'), displayDataTypes: false, displayObjectSize: false }), ((auditEvent === null || auditEvent === void 0 ? void 0 : auditEvent.typeCode) === AuditEventTypeEnums.Update_Domain ||
        (auditEvent === null || auditEvent === void 0 ? void 0 : auditEvent.typeCode) === AuditEventTypeEnums.Create_Domain) &&
        React.createElement(ReactJsonView, { src: (auditEventDetail === null || auditEventDetail === void 0 ? void 0 : auditEventDetail.newObj) ? JSON.parse(auditEventDetail === null || auditEventDetail === void 0 ? void 0 : auditEventDetail.newObj) : {}, name: t('New Details'), displayDataTypes: false, displayObjectSize: false })))))))));
};
export default UdpAuditEventSidesheet;
//# sourceMappingURL=UdpAuditEventSidesheet.js.map