@webiny/app-audit-logs 0.0.0-unstable.eb196ccd2f → 0.0.0-unstable.eb81deee7e

package/views/Logs/LogsModule.js

@@ -1,26 +1,26 @@
-import React from "react";
-import { AuditLogsListConfig } from "../../config/list";
-import { FilterByTimestamp, FilterByInitiator, FilterByApp, FilterByEntity, FilterByAction } from "./Filters";
-const {
-  Browser
-} = AuditLogsListConfig;
-export const LogsModule = () => {
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AuditLogsListConfig, null, /*#__PURE__*/React.createElement(Browser.Filter, {
-    name: "timestamp",
-    element: /*#__PURE__*/React.createElement(FilterByTimestamp, null)
-  }), /*#__PURE__*/React.createElement(Browser.Filter, {
-    name: "initiator",
-    element: /*#__PURE__*/React.createElement(FilterByInitiator, null)
-  }), /*#__PURE__*/React.createElement(Browser.Filter, {
-    name: "app",
-    element: /*#__PURE__*/React.createElement(FilterByApp, null)
-  }), /*#__PURE__*/React.createElement(Browser.Filter, {
-    name: "entity",
-    element: /*#__PURE__*/React.createElement(FilterByEntity, null)
-  }), /*#__PURE__*/React.createElement(Browser.Filter, {
-    name: "action",
-    element: /*#__PURE__*/React.createElement(FilterByAction, null)
-  })));
-};
+import react from "react";
+import { AuditLogsListConfig } from "../../config/list/index.js";
+import { FilterByAction, FilterByApp, FilterByCreatedBy, FilterByCreatedOn, FilterByEntity, FilterByEntityId } from "./Filters/index.js";
+const { Browser: Browser } = AuditLogsListConfig;
+const LogsModule = ()=>/*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(AuditLogsListConfig, null, /*#__PURE__*/ react.createElement(Browser.Filter, {
+        name: "app",
+        element: /*#__PURE__*/ react.createElement(FilterByApp, null)
+    }), /*#__PURE__*/ react.createElement(Browser.Filter, {
+        name: "entity",
+        element: /*#__PURE__*/ react.createElement(FilterByEntity, null)
+    }), /*#__PURE__*/ react.createElement(Browser.Filter, {
+        name: "action",
+        element: /*#__PURE__*/ react.createElement(FilterByAction, null)
+    }), /*#__PURE__*/ react.createElement(Browser.Filter, {
+        name: "createdBy",
+        element: /*#__PURE__*/ react.createElement(FilterByCreatedBy, null)
+    }), /*#__PURE__*/ react.createElement(Browser.Filter, {
+        name: "entityId",
+        element: /*#__PURE__*/ react.createElement(FilterByEntityId, null)
+    }), /*#__PURE__*/ react.createElement(Browser.Filter, {
+        name: "createdOn",
+        element: /*#__PURE__*/ react.createElement(FilterByCreatedOn, null)
+    })));
+export { LogsModule };
 
 //# sourceMappingURL=LogsModule.js.map

package/views/Logs/LogsModule.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","AuditLogsListConfig","FilterByTimestamp","FilterByInitiator","FilterByApp","FilterByEntity","FilterByAction","Browser","LogsModule","createElement","Fragment","Filter","name","element"],"sources":["LogsModule.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { AuditLogsListConfig } from \"~/config/list\";\nimport {\n    FilterByTimestamp,\n    FilterByInitiator,\n    FilterByApp,\n    FilterByEntity,\n    FilterByAction\n} from \"~/views/Logs/Filters\";\n\nconst { Browser } = AuditLogsListConfig;\n\nexport const LogsModule = () => {\n    return (\n        <>\n            <AuditLogsListConfig>\n                <Browser.Filter name={\"timestamp\"} element={<FilterByTimestamp />} />\n                <Browser.Filter name={\"initiator\"} element={<FilterByInitiator />} />\n                <Browser.Filter name={\"app\"} element={<FilterByApp />} />\n                <Browser.Filter name={\"entity\"} element={<FilterByEntity />} />\n                <Browser.Filter name={\"action\"} element={<FilterByAction />} />\n            </AuditLogsListConfig>\n        </>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,mBAAmB;AAC5B,SACIC,iBAAiB,EACjBC,iBAAiB,EACjBC,WAAW,EACXC,cAAc,EACdC,cAAc;AAGlB,MAAM;EAAEC;AAAQ,CAAC,GAAGN,mBAAmB;AAEvC,OAAO,MAAMO,UAAU,GAAGA,CAAA,KAAM;EAC5B,oBACIR,KAAA,CAAAS,aAAA,CAAAT,KAAA,CAAAU,QAAA,qBACIV,KAAA,CAAAS,aAAA,CAACR,mBAAmB,qBAChBD,KAAA,CAAAS,aAAA,CAACF,OAAO,CAACI,MAAM;IAACC,IAAI,EAAE,WAAY;IAACC,OAAO,eAAEb,KAAA,CAAAS,aAAA,CAACP,iBAAiB,MAAE;EAAE,CAAE,CAAC,eACrEF,KAAA,CAAAS,aAAA,CAACF,OAAO,CAACI,MAAM;IAACC,IAAI,EAAE,WAAY;IAACC,OAAO,eAAEb,KAAA,CAAAS,aAAA,CAACN,iBAAiB,MAAE;EAAE,CAAE,CAAC,eACrEH,KAAA,CAAAS,aAAA,CAACF,OAAO,CAACI,MAAM;IAACC,IAAI,EAAE,KAAM;IAACC,OAAO,eAAEb,KAAA,CAAAS,aAAA,CAACL,WAAW,MAAE;EAAE,CAAE,CAAC,eACzDJ,KAAA,CAAAS,aAAA,CAACF,OAAO,CAACI,MAAM;IAACC,IAAI,EAAE,QAAS;IAACC,OAAO,eAAEb,KAAA,CAAAS,aAAA,CAACJ,cAAc,MAAE;EAAE,CAAE,CAAC,eAC/DL,KAAA,CAAAS,aAAA,CAACF,OAAO,CAACI,MAAM;IAACC,IAAI,EAAE,QAAS;IAACC,OAAO,eAAEb,KAAA,CAAAS,aAAA,CAACH,cAAc,MAAE;EAAE,CAAE,CAC7C,CACvB,CAAC;AAEX,CAAC","ignoreList":[]}
+{"version":3,"file":"views/Logs/LogsModule.js","sources":["../../../src/views/Logs/LogsModule.tsx"],"sourcesContent":["import React from \"react\";\nimport { AuditLogsListConfig } from \"~/config/list/index.js\";\nimport {\n    FilterByAction,\n    FilterByApp,\n    FilterByCreatedBy,\n    FilterByCreatedOn,\n    FilterByEntity,\n    FilterByEntityId\n} from \"~/views/Logs/Filters/index.js\";\n\nconst { Browser } = AuditLogsListConfig;\n\nexport const LogsModule = () => {\n    return (\n        <>\n            <AuditLogsListConfig>\n                <Browser.Filter name={\"app\"} element={<FilterByApp />} />\n                <Browser.Filter name={\"entity\"} element={<FilterByEntity />} />\n                <Browser.Filter name={\"action\"} element={<FilterByAction />} />\n                <Browser.Filter name={\"createdBy\"} element={<FilterByCreatedBy />} />\n                <Browser.Filter name={\"entityId\"} element={<FilterByEntityId />} />\n                <Browser.Filter name={\"createdOn\"} element={<FilterByCreatedOn />} />\n            </AuditLogsListConfig>\n        </>\n    );\n};\n"],"names":["Browser","AuditLogsListConfig","LogsModule","FilterByApp","FilterByEntity","FilterByAction","FilterByCreatedBy","FilterByEntityId","FilterByCreatedOn"],"mappings":";;;AAWA,MAAM,EAAEA,SAAAA,OAAO,EAAE,GAAGC;AAEb,MAAMC,aAAa,IACf,WAAP,GACI,wDACI,oBAACD,qBAAmBA,MAAAA,WAAAA,GAChB,oBAACD,QAAQ,MAAM;QAAC,MAAM;QAAO,uBAAS,oBAACG,aAAWA;sBAClD,oBAACH,QAAQ,MAAM;QAAC,MAAM;QAAU,uBAAS,oBAACI,gBAAcA;sBACxD,oBAACJ,QAAQ,MAAM;QAAC,MAAM;QAAU,uBAAS,oBAACK,gBAAcA;sBACxD,oBAACL,QAAQ,MAAM;QAAC,MAAM;QAAa,uBAAS,oBAACM,mBAAiBA;sBAC9D,oBAACN,QAAQ,MAAM;QAAC,MAAM;QAAY,uBAAS,oBAACO,kBAAgBA;sBAC5D,oBAACP,QAAQ,MAAM;QAAC,MAAM;QAAa,uBAAS,oBAACQ,mBAAiBA"}

package/views/Logs/LogsView.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const LogsView: () => React.JSX.Element;

package/views/Logs/LogsView.js

@@ -0,0 +1,73 @@
+import react, { useCallback, useEffect, useRef, useState } from "react";
+import debounce from "lodash/debounce.js";
+import { i18n } from "@webiny/app/i18n/index.js";
+import { EmptyView, useSecurity } from "@webiny/app-admin";
+import { Scrollbar } from "@webiny/admin-ui";
+import { LoadingMore } from "./LoadingMore/index.js";
+import { LoadMoreButton } from "./LoadMoreButton/index.js";
+import { Header } from "./Header/index.js";
+import { Filters } from "./Filters/index.js";
+import { Table } from "./Table/index.js";
+import { Preview } from "./Preview/index.js";
+import { useAuditLogsList } from "../../hooks/index.js";
+const t = i18n.ns("app-audit-logs/views/logs");
+const LogsView = ()=>{
+    const [selectedAuditLog, setSelectedAuditLog] = useState(null);
+    const handleAuditLogSelect = useCallback((auditLog)=>setSelectedAuditLog(auditLog), []);
+    const closePreviewModal = useCallback(()=>setSelectedAuditLog(null), []);
+    const { innerHeight: windowHeight } = window;
+    const [tableHeight, setTableHeight] = useState(0);
+    const tableRef = useRef(null);
+    const { getPermissions } = useSecurity();
+    const hasAccessToUsers = Boolean(getPermissions("adminUsers").length);
+    const list = useAuditLogsList();
+    useEffect(()=>{
+        setTableHeight(tableRef?.current?.clientHeight || 0);
+        return ()=>{
+            setTableHeight(0);
+        };
+    });
+    const loadMoreOnScroll = debounce(({ scrollFrame })=>{
+        if (scrollFrame.top > 0.8 && !list.isListLoadingMore && list.meta.hasMoreItems) list.listMoreRecords();
+    }, 200);
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col h-main-content"
+    }, /*#__PURE__*/ react.createElement(Header, {
+        title: "Audit Logs"
+    }, /*#__PURE__*/ react.createElement(Filters, {
+        setWhere: list.setWhere
+    })), /*#__PURE__*/ react.createElement("div", {
+        className: "flex-1 min-h-0"
+    }, 0 !== list.records.length || list.isListLoading ? /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(Preview, {
+        auditLog: selectedAuditLog,
+        onClose: ()=>closePreviewModal(),
+        hasAccessToUsers: hasAccessToUsers
+    }), /*#__PURE__*/ react.createElement(Scrollbar, {
+        "data-testid": "default-data-list",
+        onScrollFrame: (scrollFrame)=>loadMoreOnScroll({
+                scrollFrame
+            })
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "h-[500px]"
+    }, /*#__PURE__*/ react.createElement(Table, {
+        ref: tableRef,
+        records: list.records,
+        loading: list.isListLoading && !list.isListLoadingMore,
+        handleRecordSelect: handleAuditLogSelect,
+        sorting: list.sorting,
+        onSortingChange: list.setSorting,
+        hasAccessToUsers: hasAccessToUsers
+    }), /*#__PURE__*/ react.createElement(LoadMoreButton, {
+        show: !list.isListLoading && list.meta.hasMoreItems,
+        disabled: list.isListLoadingMore,
+        windowHeight: windowHeight,
+        tableHeight: tableHeight,
+        onClick: list.listMoreRecords
+    }))), list.isListLoadingMore && /*#__PURE__*/ react.createElement(LoadingMore, null)) : /*#__PURE__*/ react.createElement(EmptyView, {
+        title: t`No results found.`,
+        action: null
+    })));
+};
+export { LogsView };
+
+//# sourceMappingURL=LogsView.js.map

package/views/Logs/LogsView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"views/Logs/LogsView.js","sources":["../../../src/views/Logs/LogsView.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState } from \"react\";\nimport debounce from \"lodash/debounce.js\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { EmptyView } from \"@webiny/app-admin\";\nimport { useSecurity } from \"@webiny/app-admin\";\nimport { Scrollbar } from \"@webiny/admin-ui\";\nimport { LoadingMore } from \"~/views/Logs/LoadingMore/index.js\";\nimport { LoadMoreButton } from \"~/views/Logs/LoadMoreButton/index.js\";\nimport { Header } from \"~/views/Logs/Header/index.js\";\nimport { Filters } from \"~/views/Logs/Filters/index.js\";\nimport { Table } from \"~/views/Logs/Table/index.js\";\nimport { Preview } from \"~/views/Logs/Preview/index.js\";\nimport { useAuditLogsList } from \"~/hooks/index.js\";\nimport type { IAuditLog } from \"~/types.js\";\n\nconst t = i18n.ns(\"app-audit-logs/views/logs\");\n\nexport const LogsView = () => {\n    const [selectedAuditLog, setSelectedAuditLog] = useState<IAuditLog | null>(null);\n    const handleAuditLogSelect = useCallback(\n        (auditLog: IAuditLog) => setSelectedAuditLog(auditLog),\n        []\n    );\n    const closePreviewModal = useCallback(() => setSelectedAuditLog(null), []);\n\n    const { innerHeight: windowHeight } = window;\n    const [tableHeight, setTableHeight] = useState(0);\n    const tableRef = useRef<HTMLDivElement>(null);\n    const { getPermissions } = useSecurity();\n    const hasAccessToUsers = Boolean(getPermissions(\"adminUsers\").length);\n\n    const list = useAuditLogsList();\n\n    useEffect(() => {\n        setTableHeight(tableRef?.current?.clientHeight || 0);\n\n        return () => {\n            setTableHeight(0);\n        };\n    });\n\n    const loadMoreOnScroll = debounce(({ scrollFrame }) => {\n        if (scrollFrame.top > 0.8 && !list.isListLoadingMore && list.meta.hasMoreItems) {\n            list.listMoreRecords();\n        }\n    }, 200);\n\n    return (\n        <div className={\"flex flex-col h-main-content\"}>\n            <Header title=\"Audit Logs\">\n                <Filters setWhere={list.setWhere} />\n            </Header>\n            <div className={\"flex-1 min-h-0\"}>\n                {list.records.length === 0 && !list.isListLoading ? (\n                    <EmptyView title={t`No results found.`} action={null} />\n                ) : (\n                    <>\n                        <Preview\n                            auditLog={selectedAuditLog}\n                            onClose={() => closePreviewModal()}\n                            hasAccessToUsers={hasAccessToUsers}\n                        />\n                        <Scrollbar\n                            data-testid=\"default-data-list\"\n                            onScrollFrame={scrollFrame => loadMoreOnScroll({ scrollFrame })}\n                        >\n                            <div className={\"h-[500px]\"}>\n                                <Table\n                                    ref={tableRef}\n                                    records={list.records}\n                                    loading={list.isListLoading && !list.isListLoadingMore}\n                                    handleRecordSelect={handleAuditLogSelect}\n                                    sorting={list.sorting}\n                                    onSortingChange={list.setSorting}\n                                    hasAccessToUsers={hasAccessToUsers}\n                                />\n                                <LoadMoreButton\n                                    show={!list.isListLoading && list.meta.hasMoreItems}\n                                    disabled={list.isListLoadingMore}\n                                    windowHeight={windowHeight}\n                                    tableHeight={tableHeight}\n                                    onClick={list.listMoreRecords}\n                                />\n                            </div>\n                        </Scrollbar>\n                        {list.isListLoadingMore && <LoadingMore />}\n                    </>\n                )}\n            </div>\n        </div>\n    );\n};\n"],"names":["t","i18n","LogsView","selectedAuditLog","setSelectedAuditLog","useState","handleAuditLogSelect","useCallback","auditLog","closePreviewModal","windowHeight","window","tableHeight","setTableHeight","tableRef","useRef","getPermissions","useSecurity","hasAccessToUsers","Boolean","list","useAuditLogsList","useEffect","loadMoreOnScroll","debounce","scrollFrame","Header","Filters","Preview","Scrollbar","Table","LoadMoreButton","LoadingMore","EmptyView"],"mappings":";;;;;;;;;;;;AAeA,MAAMA,IAAIC,KAAK,EAAE,CAAC;AAEX,MAAMC,WAAW;IACpB,MAAM,CAACC,kBAAkBC,oBAAoB,GAAGC,SAA2B;IAC3E,MAAMC,uBAAuBC,YACzB,CAACC,WAAwBJ,oBAAoBI,WAC7C,EAAE;IAEN,MAAMC,oBAAoBF,YAAY,IAAMH,oBAAoB,OAAO,EAAE;IAEzE,MAAM,EAAE,aAAaM,YAAY,EAAE,GAAGC;IACtC,MAAM,CAACC,aAAaC,eAAe,GAAGR,SAAS;IAC/C,MAAMS,WAAWC,OAAuB;IACxC,MAAM,EAAEC,cAAc,EAAE,GAAGC;IAC3B,MAAMC,mBAAmBC,QAAQH,eAAe,cAAc,MAAM;IAEpE,MAAMI,OAAOC;IAEbC,UAAU;QACNT,eAAeC,UAAU,SAAS,gBAAgB;QAElD,OAAO;YACHD,eAAe;QACnB;IACJ;IAEA,MAAMU,mBAAmBC,SAAS,CAAC,EAAEC,WAAW,EAAE;QAC9C,IAAIA,YAAY,GAAG,GAAG,OAAO,CAACL,KAAK,iBAAiB,IAAIA,KAAK,IAAI,CAAC,YAAY,EAC1EA,KAAK,eAAe;IAE5B,GAAG;IAEH,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAACM,QAAMA;QAAC,OAAM;qBACV,oBAACC,SAAOA;QAAC,UAAUP,KAAK,QAAQ;uBAEpC,oBAAC;QAAI,WAAW;OACXA,AAAwB,MAAxBA,KAAK,OAAO,CAAC,MAAM,IAAWA,KAAK,aAAa,G,cAG7C,wDACI,oBAACQ,SAAOA;QACJ,UAAUzB;QACV,SAAS,IAAMM;QACf,kBAAkBS;sBAEtB,oBAACW,WAASA;QACN,eAAY;QACZ,eAAeJ,CAAAA,cAAeF,iBAAiB;gBAAEE;YAAY;qBAE7D,oBAAC;QAAI,WAAW;qBACZ,oBAACK,OAAKA;QACF,KAAKhB;QACL,SAASM,KAAK,OAAO;QACrB,SAASA,KAAK,aAAa,IAAI,CAACA,KAAK,iBAAiB;QACtD,oBAAoBd;QACpB,SAASc,KAAK,OAAO;QACrB,iBAAiBA,KAAK,UAAU;QAChC,kBAAkBF;sBAEtB,oBAACa,gBAAcA;QACX,MAAM,CAACX,KAAK,aAAa,IAAIA,KAAK,IAAI,CAAC,YAAY;QACnD,UAAUA,KAAK,iBAAiB;QAChC,cAAcV;QACd,aAAaE;QACb,SAASQ,KAAK,eAAe;UAIxCA,KAAK,iBAAiB,IAAI,WAAJ,GAAI,oBAACY,aAAWA,SAhCK,WAAH,GAC7C,oBAACC,WAASA;QAAC,OAAOjC,CAAC,CAAC,iBAAiB,CAAC;QAAE,QAAQ;;AAqCpE"}

package/views/Logs/Preview/AuditLogDetailsPresenter.d.ts

@@ -0,0 +1,13 @@
+import { AuditLogDetailsPresenter as Abstraction, type IAuditLogDetailsVm } from "./abstractions.js";
+import type { IAuditLog } from "../../../types.js";
+declare class AuditLogDetailsPresenterImpl implements Abstraction.Interface {
+    private _auditLog;
+    constructor();
+    get vm(): IAuditLogDetailsVm;
+    init(auditLog: IAuditLog): void;
+    private parseContent;
+}
+export declare const AuditLogDetailsPresenter: typeof AuditLogDetailsPresenterImpl & {
+    __abstraction: import("@webiny/di").Abstraction<import("./abstractions.js").IAuditLogDetailsPresenter>;
+};
+export {};

package/views/Logs/Preview/AuditLogDetailsPresenter.js

@@ -0,0 +1,36 @@
+import { computed, makeAutoObservable } from "mobx";
+import { AuditLogDetailsPresenter } from "./abstractions.js";
+class AuditLogDetailsPresenterImpl {
+    constructor(){
+        this._auditLog = null;
+        makeAutoObservable(this, {
+            vm: computed
+        }, {
+            autoBind: true
+        });
+    }
+    get vm() {
+        return {
+            auditLog: this._auditLog,
+            content: this.parseContent()
+        };
+    }
+    init(auditLog) {
+        this._auditLog = auditLog;
+    }
+    parseContent() {
+        if (!this._auditLog) return {};
+        try {
+            return JSON.parse(this._auditLog.content);
+        } catch  {
+            return {};
+        }
+    }
+}
+const AuditLogDetailsPresenter_AuditLogDetailsPresenter = AuditLogDetailsPresenter.createImplementation({
+    implementation: AuditLogDetailsPresenterImpl,
+    dependencies: []
+});
+export { AuditLogDetailsPresenter_AuditLogDetailsPresenter as AuditLogDetailsPresenter };
+
+//# sourceMappingURL=AuditLogDetailsPresenter.js.map

package/views/Logs/Preview/AuditLogDetailsPresenter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"views/Logs/Preview/AuditLogDetailsPresenter.js","sources":["../../../../src/views/Logs/Preview/AuditLogDetailsPresenter.ts"],"sourcesContent":["import { makeAutoObservable, computed } from \"mobx\";\nimport {\n    AuditLogDetailsPresenter as Abstraction,\n    type IAuditLogDetailsVm\n} from \"./abstractions.js\";\nimport type { IAuditLog } from \"~/types.js\";\n\nclass AuditLogDetailsPresenterImpl implements Abstraction.Interface {\n    private _auditLog: IAuditLog | null = null;\n\n    constructor() {\n        makeAutoObservable(this, { vm: computed }, { autoBind: true });\n    }\n\n    get vm(): IAuditLogDetailsVm {\n        return {\n            auditLog: this._auditLog,\n            content: this.parseContent()\n        };\n    }\n\n    init(auditLog: IAuditLog): void {\n        this._auditLog = auditLog;\n    }\n\n    private parseContent(): Record<string, unknown> {\n        if (!this._auditLog) {\n            return {};\n        }\n        try {\n            return JSON.parse(this._auditLog.content);\n        } catch {\n            return {};\n        }\n    }\n}\n\nexport const AuditLogDetailsPresenter = Abstraction.createImplementation({\n    implementation: AuditLogDetailsPresenterImpl,\n    dependencies: []\n});\n"],"names":["AuditLogDetailsPresenterImpl","makeAutoObservable","computed","auditLog","JSON","AuditLogDetailsPresenter","Abstraction"],"mappings":";;AAOA,MAAMA;IAGF,aAAc;aAFN,SAAS,GAAqB;QAGlCC,mBAAmB,IAAI,EAAE;YAAE,IAAIC;QAAS,GAAG;YAAE,UAAU;QAAK;IAChE;IAEA,IAAI,KAAyB;QACzB,OAAO;YACH,UAAU,IAAI,CAAC,SAAS;YACxB,SAAS,IAAI,CAAC,YAAY;QAC9B;IACJ;IAEA,KAAKC,QAAmB,EAAQ;QAC5B,IAAI,CAAC,SAAS,GAAGA;IACrB;IAEQ,eAAwC;QAC5C,IAAI,CAAC,IAAI,CAAC,SAAS,EACf,OAAO,CAAC;QAEZ,IAAI;YACA,OAAOC,KAAK,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO;QAC5C,EAAE,OAAM;YACJ,OAAO,CAAC;QACZ;IACJ;AACJ;AAEO,MAAMC,oDAA2BC,yBAAAA,oBAAgC,CAAC;IACrE,gBAAgBN;IAChB,cAAc,EAAE;AACpB"}

package/views/Logs/Preview/Preview.d.ts

@@ -1,9 +1,11 @@
 import React from "react";
-import type { Entry } from "../../../utils/transformCmsContentEntriesToRecordEntries";
-type HeaderProps = {
-    auditLog: Entry | null;
+import type { IAuditLog } from "../../../types.js";
+interface PreviewProps {
+    auditLog: IAuditLog | null;
     onClose: () => void;
     hasAccessToUsers: boolean;
+}
+export declare const Preview: (({ auditLog, onClose, hasAccessToUsers }: PreviewProps) => React.JSX.Element | null) & React.NamedExoticComponent<PreviewProps> & {
+    readonly type: ({ auditLog, onClose, hasAccessToUsers }: PreviewProps) => React.JSX.Element | null;
 };
-export declare const Preview: ({ auditLog, onClose, hasAccessToUsers }: HeaderProps) => React.JSX.Element | null;
 export {};

package/views/Logs/Preview/Preview.js

@@ -1,90 +1,127 @@
-import React from "react";
-import { format, addMinutes } from "date-fns";
-import { Grid, Cell } from "@webiny/ui/Grid";
-import { Dialog, DialogContent, DialogTitle, DialogCancel, DialogActions } from "@webiny/ui/Dialog";
-import { CodeEditor } from "@webiny/ui/CodeEditor";
-import { Tooltip } from "@webiny/ui/Tooltip";
-import { Action } from "../Table";
-import { Text } from "../../../components/Text";
-import { PayloadWrapper, previewDialog } from "./styled";
-export const Preview = ({
-  auditLog,
-  onClose,
-  hasAccessToUsers
-}) => {
-  if (!auditLog) {
-    return null;
-  }
-  const date = new Date(auditLog.savedOn);
-  return /*#__PURE__*/React.createElement(Dialog, {
-    open: !!auditLog,
-    onClose: onClose,
-    className: previewDialog
-  }, /*#__PURE__*/React.createElement(DialogTitle, null, auditLog.message, /*#__PURE__*/React.createElement("div", {
-    className: "title-actions",
-    tabIndex: 0
-  })), /*#__PURE__*/React.createElement(DialogContent, null, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Cell, {
-    span: 6
-  }, /*#__PURE__*/React.createElement(Text, {
-    use: "overline"
-  }, "Application"), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Text, {
-    use: "subtitle2"
-  }, auditLog.app)), /*#__PURE__*/React.createElement(Cell, {
-    span: 6
-  }, /*#__PURE__*/React.createElement(Text, {
-    use: "overline"
-  }, "Date"), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Tooltip, {
-    placement: "right",
-    content: `UTC: ${format(addMinutes(date, date.getTimezoneOffset()), "yyyy-MM-dd HH:mm:ss")}`
-  }, /*#__PURE__*/React.createElement(Text, {
-    use: "subtitle2"
-  }, format(date, "yyyy-MM-dd HH:mm:ss (O)")))), /*#__PURE__*/React.createElement(Cell, {
-    span: 6
-  }, /*#__PURE__*/React.createElement(Text, {
-    use: "overline"
-  }, "Entity"), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Text, {
-    use: "subtitle2"
-  }, auditLog.entity.label)), /*#__PURE__*/React.createElement(Cell, {
-    span: 6
-  }, /*#__PURE__*/React.createElement(Text, {
-    use: "overline"
-  }, "Entity Id"), /*#__PURE__*/React.createElement("br", null), auditLog.entity.link ? /*#__PURE__*/React.createElement("a", {
-    href: auditLog.entity.link,
-    target: "blank"
-  }, /*#__PURE__*/React.createElement(Text, {
-    use: "subtitle2"
-  }, auditLog.entityId)) : /*#__PURE__*/React.createElement(Text, {
-    use: "subtitle2"
-  }, auditLog.entityId)), /*#__PURE__*/React.createElement(Cell, {
-    span: 6
-  }, /*#__PURE__*/React.createElement(Text, {
-    use: "overline"
-  }, "Action"), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement(Action, {
-    label: auditLog.action.label,
-    value: auditLog.action.value
-  })), hasAccessToUsers && /*#__PURE__*/React.createElement(Cell, {
-    span: 6
-  }, /*#__PURE__*/React.createElement(Text, {
-    use: "overline"
-  }, "Initiator"), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("a", {
-    href: `/admin-users?id=${auditLog.initiator.id}`,
-    target: "blank"
-  }, /*#__PURE__*/React.createElement(Text, {
-    use: "subtitle2"
-  }, auditLog.initiator.name)), /*#__PURE__*/React.createElement(Text, {
-    use: "body2"
-  }, ` (${auditLog.initiator.role})`)), /*#__PURE__*/React.createElement(Cell, {
-    span: 12
-  }, /*#__PURE__*/React.createElement(Text, {
-    use: "overline"
-  }, "Payload"), /*#__PURE__*/React.createElement(PayloadWrapper, null, /*#__PURE__*/React.createElement(CodeEditor, {
-    mode: "json",
-    theme: "chrome",
-    value: JSON.stringify(JSON.parse(auditLog.data), null, 2),
-    readOnly: true
-  }))))), /*#__PURE__*/React.createElement(DialogActions, null, /*#__PURE__*/React.createElement(DialogCancel, {
-    onClick: onClose
-  }, "Close")));
-};
+import react, { useEffect, useMemo } from "react";
+import { addMinutes, format } from "date-fns";
+import { CodeEditor, Drawer, Grid, Tabs, Tooltip } from "@webiny/admin-ui";
+import { createReactiveComponent } from "@webiny/app-admin";
+import { Action } from "../Table/index.js";
+import { Text } from "../../../components/Text.js";
+import { useAuditLogsListConfig } from "../../../config/list/AuditLogsListConfig.js";
+import { useAuditLogDetailsPresenter } from "./feature.js";
+const EDITOR_HEIGHT = "calc(100vh - 350px)";
+const Preview_PayloadTab = createReactiveComponent(function() {
+    const presenter = useAuditLogDetailsPresenter();
+    const { auditLog } = presenter.vm;
+    if (!auditLog) return null;
+    return /*#__PURE__*/ react.createElement(CodeEditor, {
+        language: "json",
+        value: JSON.stringify(JSON.parse(auditLog.content), null, 2),
+        height: EDITOR_HEIGHT
+    });
+});
+const Preview_Preview = createReactiveComponent(function({ auditLog, onClose, hasAccessToUsers }) {
+    const presenter = useAuditLogDetailsPresenter();
+    const config = useAuditLogsListConfig();
+    useEffect(()=>{
+        if (auditLog) presenter.init(auditLog);
+    }, [
+        presenter,
+        auditLog
+    ]);
+    const tabs = useMemo(()=>{
+        if (!auditLog) return [];
+        const customTabs = config.details.tabs.filter((tab)=>!tab.canRender || tab.canRender(auditLog));
+        return [
+            /*#__PURE__*/ react.createElement(Tabs.Tab, {
+                key: "payload",
+                value: "payload",
+                trigger: "Payload",
+                content: /*#__PURE__*/ react.createElement(Preview_PayloadTab, null)
+            }),
+            ...customTabs.map((tab)=>/*#__PURE__*/ react.createElement(Tabs.Tab, {
+                    key: tab.name,
+                    value: tab.name,
+                    trigger: tab.label,
+                    content: tab.element
+                }))
+        ];
+    }, [
+        auditLog,
+        config.details.tabs
+    ]);
+    if (!auditLog) return null;
+    const date = new Date(auditLog.createdOn);
+    return /*#__PURE__*/ react.createElement(Drawer, {
+        open: true,
+        onClose: onClose,
+        modal: true,
+        width: 720,
+        title: auditLog.message,
+        headerSeparator: true,
+        bodyPadding: false,
+        actions: /*#__PURE__*/ react.createElement(Drawer.CancelButton, {
+            text: "Close",
+            onClick: onClose
+        })
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col h-full"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "shrink-0 p-md pb-0"
+    }, /*#__PURE__*/ react.createElement(Grid, null, /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 6
+    }, /*#__PURE__*/ react.createElement(Text, {
+        use: "overline"
+    }, "Application"), /*#__PURE__*/ react.createElement("br", null), /*#__PURE__*/ react.createElement(Text, {
+        use: "subtitle2"
+    }, auditLog.app)), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 6
+    }, /*#__PURE__*/ react.createElement(Text, {
+        use: "overline"
+    }, "Date"), /*#__PURE__*/ react.createElement("br", null), /*#__PURE__*/ react.createElement(Tooltip, {
+        side: "left",
+        content: `UTC: ${format(addMinutes(date, date.getTimezoneOffset()), "yyyy-MM-dd HH:mm:ss")}`,
+        trigger: /*#__PURE__*/ react.createElement(Text, {
+            use: "subtitle2"
+        }, format(date, "yyyy-MM-dd HH:mm:ss (O)"))
+    })), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 6
+    }, /*#__PURE__*/ react.createElement(Text, {
+        use: "overline"
+    }, "Entity"), /*#__PURE__*/ react.createElement("br", null), /*#__PURE__*/ react.createElement(Text, {
+        use: "subtitle2"
+    }, auditLog.entity.label)), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 6
+    }, /*#__PURE__*/ react.createElement(Text, {
+        use: "overline"
+    }, "Entity Id"), /*#__PURE__*/ react.createElement("br", null), auditLog.entity.link ? /*#__PURE__*/ react.createElement("a", {
+        href: auditLog.entity.link,
+        target: "blank"
+    }, /*#__PURE__*/ react.createElement(Text, {
+        use: "subtitle2"
+    }, auditLog.entityId)) : /*#__PURE__*/ react.createElement(Text, {
+        use: "subtitle2"
+    }, auditLog.entityId)), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 6
+    }, /*#__PURE__*/ react.createElement(Text, {
+        use: "overline"
+    }, "Action"), /*#__PURE__*/ react.createElement("br", null), /*#__PURE__*/ react.createElement(Action, {
+        label: auditLog.action.label,
+        value: auditLog.action.value
+    })), hasAccessToUsers ? /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 6
+    }, /*#__PURE__*/ react.createElement(Text, {
+        use: "overline"
+    }, "Initiator"), /*#__PURE__*/ react.createElement("br", null), /*#__PURE__*/ react.createElement("a", {
+        href: `/admin-users?id=${auditLog.createdBy.id}`,
+        target: "blank"
+    }, /*#__PURE__*/ react.createElement(Text, {
+        use: "subtitle2"
+    }, auditLog.createdBy.displayName)), /*#__PURE__*/ react.createElement(Text, {
+        use: "body2"
+    }, ` (${auditLog.createdBy.role})`)) : null)), /*#__PURE__*/ react.createElement("div", {
+        className: "px-md pb-md"
+    }, /*#__PURE__*/ react.createElement(Tabs, {
+        tabs: tabs
+    }))));
+});
+export { Preview_Preview as Preview };
 
 //# sourceMappingURL=Preview.js.map

package/views/Logs/Preview/Preview.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","format","addMinutes","Grid","Cell","Dialog","DialogContent","DialogTitle","DialogCancel","DialogActions","CodeEditor","Tooltip","Action","Text","PayloadWrapper","previewDialog","Preview","auditLog","onClose","hasAccessToUsers","date","Date","savedOn","createElement","open","className","message","tabIndex","span","use","app","placement","content","getTimezoneOffset","entity","label","link","href","target","entityId","action","value","initiator","id","name","role","mode","theme","JSON","stringify","parse","data","readOnly","onClick"],"sources":["Preview.tsx"],"sourcesContent":["import React from \"react\";\nimport { format, addMinutes } from \"date-fns\";\n\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { Dialog, DialogContent, DialogTitle, DialogCancel, DialogActions } from \"@webiny/ui/Dialog\";\nimport { CodeEditor } from \"@webiny/ui/CodeEditor\";\nimport { Tooltip } from \"@webiny/ui/Tooltip\";\n\nimport { Action } from \"~/views/Logs/Table\";\nimport { Text } from \"~/components/Text\";\nimport type { Entry } from \"~/utils/transformCmsContentEntriesToRecordEntries\";\nimport { PayloadWrapper, previewDialog } from \"./styled\";\n\ntype HeaderProps = {\n    auditLog: Entry | null;\n    onClose: () => void;\n    hasAccessToUsers: boolean;\n};\n\nexport const Preview = ({ auditLog, onClose, hasAccessToUsers }: HeaderProps) => {\n    if (!auditLog) {\n        return null;\n    }\n\n    const date = new Date(auditLog.savedOn);\n\n    return (\n        <Dialog open={!!auditLog} onClose={onClose} className={previewDialog}>\n            <DialogTitle>\n                {auditLog.message}\n                <div className=\"title-actions\" tabIndex={0}></div>\n            </DialogTitle>\n\n            <DialogContent>\n                <Grid>\n                    <Cell span={6}>\n                        <Text use=\"overline\">Application</Text>\n                        <br />\n                        <Text use=\"subtitle2\">{auditLog.app}</Text>\n                    </Cell>\n                    <Cell span={6}>\n                        <Text use=\"overline\">Date</Text>\n                        <br />\n                        <Tooltip\n                            placement=\"right\"\n                            content={`UTC: ${format(\n                                addMinutes(date, date.getTimezoneOffset()),\n                                \"yyyy-MM-dd HH:mm:ss\"\n                            )}`}\n                        >\n                            <Text use={\"subtitle2\"}>{format(date, \"yyyy-MM-dd HH:mm:ss (O)\")}</Text>\n                        </Tooltip>\n                    </Cell>\n                    <Cell span={6}>\n                        <Text use=\"overline\">Entity</Text>\n                        <br />\n                        <Text use=\"subtitle2\">{auditLog.entity.label}</Text>\n                    </Cell>\n                    <Cell span={6}>\n                        <Text use=\"overline\">Entity Id</Text>\n                        <br />\n                        {auditLog.entity.link ? (\n                            <a href={auditLog.entity.link} target={\"blank\"}>\n                                <Text use=\"subtitle2\">{auditLog.entityId}</Text>\n                            </a>\n                        ) : (\n                            <Text use=\"subtitle2\">{auditLog.entityId}</Text>\n                        )}\n                    </Cell>\n                    <Cell span={6}>\n                        <Text use=\"overline\">Action</Text>\n                        <br />\n                        <Action label={auditLog.action.label} value={auditLog.action.value} />\n                    </Cell>\n                    {hasAccessToUsers && (\n                        <Cell span={6}>\n                            <Text use=\"overline\">Initiator</Text>\n                            <br />\n                            <a href={`/admin-users?id=${auditLog.initiator.id}`} target={\"blank\"}>\n                                <Text use={\"subtitle2\"}>{auditLog.initiator.name}</Text>\n                            </a>\n                            <Text use={\"body2\"}>{` (${auditLog.initiator.role})`}</Text>\n                        </Cell>\n                    )}\n                    <Cell span={12}>\n                        <Text use=\"overline\">Payload</Text>\n                        <PayloadWrapper>\n                            <CodeEditor\n                                mode=\"json\"\n                                theme=\"chrome\"\n                                value={JSON.stringify(JSON.parse(auditLog.data), null, 2)}\n                                readOnly\n                            />\n                        </PayloadWrapper>\n                    </Cell>\n                </Grid>\n            </DialogContent>\n            <DialogActions>\n                <DialogCancel onClick={onClose}>Close</DialogCancel>\n            </DialogActions>\n        </Dialog>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"views/Logs/Preview/Preview.js","sources":["../../../../src/views/Logs/Preview/Preview.tsx"],"sourcesContent":["import React, { useEffect, useMemo } from \"react\";\nimport { addMinutes, format } from \"date-fns\";\nimport { Grid, Drawer, CodeEditor, Tooltip, Tabs } from \"@webiny/admin-ui\";\nimport { createReactiveComponent } from \"@webiny/app-admin\";\nimport { Action } from \"~/views/Logs/Table/index.js\";\nimport { Text } from \"~/components/Text.js\";\nimport { useAuditLogsListConfig } from \"~/config/list/AuditLogsListConfig.js\";\nimport { useAuditLogDetailsPresenter } from \"./feature.js\";\nimport type { IAuditLog } from \"~/types.js\";\n\ninterface PreviewProps {\n    auditLog: IAuditLog | null;\n    onClose: () => void;\n    hasAccessToUsers: boolean;\n}\n\nconst EDITOR_HEIGHT = \"calc(100vh - 350px)\";\n\nconst PayloadTab = createReactiveComponent(function PayloadTab() {\n    const presenter = useAuditLogDetailsPresenter();\n    const { auditLog } = presenter.vm;\n    if (!auditLog) {\n        return null;\n    }\n    return (\n        <CodeEditor\n            language=\"json\"\n            value={JSON.stringify(JSON.parse(auditLog.content), null, 2)}\n            height={EDITOR_HEIGHT}\n        />\n    );\n});\n\nexport const Preview = createReactiveComponent(function Preview({\n    auditLog,\n    onClose,\n    hasAccessToUsers\n}: PreviewProps) {\n    const presenter = useAuditLogDetailsPresenter();\n    const config = useAuditLogsListConfig();\n\n    useEffect(() => {\n        if (auditLog) {\n            presenter.init(auditLog);\n        }\n    }, [presenter, auditLog]);\n\n    const tabs = useMemo(() => {\n        if (!auditLog) {\n            return [];\n        }\n\n        const customTabs = config.details.tabs.filter(\n            tab => !tab.canRender || tab.canRender(auditLog)\n        );\n\n        return [\n            <Tabs.Tab key=\"payload\" value=\"payload\" trigger=\"Payload\" content={<PayloadTab />} />,\n            ...customTabs.map(tab => (\n                <Tabs.Tab\n                    key={tab.name}\n                    value={tab.name}\n                    trigger={tab.label}\n                    content={tab.element}\n                />\n            ))\n        ];\n    }, [auditLog, config.details.tabs]);\n\n    if (!auditLog) {\n        return null;\n    }\n\n    const date = new Date(auditLog.createdOn);\n\n    return (\n        <Drawer\n            open={true}\n            onClose={onClose}\n            modal={true}\n            width={720}\n            title={auditLog.message}\n            headerSeparator={true}\n            bodyPadding={false}\n            actions={<Drawer.CancelButton text={\"Close\"} onClick={onClose} />}\n        >\n            <div className={\"flex flex-col h-full\"}>\n                <div className={\"shrink-0 p-md pb-0\"}>\n                    <Grid>\n                        <Grid.Column span={6}>\n                            <Text use=\"overline\">Application</Text>\n                            <br />\n                            <Text use=\"subtitle2\">{auditLog.app}</Text>\n                        </Grid.Column>\n                        <Grid.Column span={6}>\n                            <Text use=\"overline\">Date</Text>\n                            <br />\n                            <Tooltip\n                                side=\"left\"\n                                content={`UTC: ${format(\n                                    addMinutes(date, date.getTimezoneOffset()),\n                                    \"yyyy-MM-dd HH:mm:ss\"\n                                )}`}\n                                trigger={\n                                    <Text use={\"subtitle2\"}>\n                                        {format(date, \"yyyy-MM-dd HH:mm:ss (O)\")}\n                                    </Text>\n                                }\n                            />\n                        </Grid.Column>\n                        <Grid.Column span={6}>\n                            <Text use=\"overline\">Entity</Text>\n                            <br />\n                            <Text use=\"subtitle2\">{auditLog.entity.label}</Text>\n                        </Grid.Column>\n                        <Grid.Column span={6}>\n                            <Text use=\"overline\">Entity Id</Text>\n                            <br />\n                            {auditLog.entity.link ? (\n                                <a href={auditLog.entity.link} target={\"blank\"}>\n                                    <Text use=\"subtitle2\">{auditLog.entityId}</Text>\n                                </a>\n                            ) : (\n                                <Text use=\"subtitle2\">{auditLog.entityId}</Text>\n                            )}\n                        </Grid.Column>\n                        <Grid.Column span={6}>\n                            <Text use=\"overline\">Action</Text>\n                            <br />\n                            <Action label={auditLog.action.label} value={auditLog.action.value} />\n                        </Grid.Column>\n                        {hasAccessToUsers ? (\n                            <Grid.Column span={6}>\n                                <Text use=\"overline\">Initiator</Text>\n                                <br />\n                                <a\n                                    href={`/admin-users?id=${auditLog.createdBy.id}`}\n                                    target={\"blank\"}\n                                >\n                                    <Text use={\"subtitle2\"}>{auditLog.createdBy.displayName}</Text>\n                                </a>\n                                <Text use={\"body2\"}>{` (${auditLog.createdBy.role})`}</Text>\n                            </Grid.Column>\n                        ) : null}\n                    </Grid>\n                </div>\n                <div className={\"px-md pb-md\"}>\n                    <Tabs tabs={tabs} />\n                </div>\n            </div>\n        </Drawer>\n    );\n});\n"],"names":["EDITOR_HEIGHT","PayloadTab","createReactiveComponent","presenter","useAuditLogDetailsPresenter","auditLog","CodeEditor","JSON","Preview","onClose","hasAccessToUsers","config","useAuditLogsListConfig","useEffect","tabs","useMemo","customTabs","tab","Tabs","date","Date","Drawer","Grid","Text","Tooltip","format","addMinutes","Action"],"mappings":"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"}

package/views/Logs/Preview/abstractions.d.ts

@@ -0,0 +1,14 @@
+import type { IAuditLog } from "../../../types.js";
+export interface IAuditLogDetailsVm {
+    auditLog: IAuditLog | null;
+    content: Record<string, unknown>;
+}
+export interface IAuditLogDetailsPresenter {
+    readonly vm: IAuditLogDetailsVm;
+    init(auditLog: IAuditLog): void;
+}
+export declare const AuditLogDetailsPresenter: import("@webiny/di").Abstraction<IAuditLogDetailsPresenter>;
+export declare namespace AuditLogDetailsPresenter {
+    type Interface = IAuditLogDetailsPresenter;
+    type ViewModel = IAuditLogDetailsVm;
+}

package/views/Logs/Preview/abstractions.js

@@ -0,0 +1,5 @@
+import { createAbstraction } from "@webiny/feature/admin";
+const AuditLogDetailsPresenter = createAbstraction("AuditLogDetailsPresenter");
+export { AuditLogDetailsPresenter };
+
+//# sourceMappingURL=abstractions.js.map

package/views/Logs/Preview/abstractions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"views/Logs/Preview/abstractions.js","sources":["../../../../src/views/Logs/Preview/abstractions.ts"],"sourcesContent":["import { createAbstraction } from \"@webiny/feature/admin\";\nimport type { IAuditLog } from \"~/types.js\";\n\nexport interface IAuditLogDetailsVm {\n    auditLog: IAuditLog | null;\n    content: Record<string, unknown>;\n}\n\nexport interface IAuditLogDetailsPresenter {\n    readonly vm: IAuditLogDetailsVm;\n    init(auditLog: IAuditLog): void;\n}\n\nexport const AuditLogDetailsPresenter = createAbstraction<IAuditLogDetailsPresenter>(\n    \"AuditLogDetailsPresenter\"\n);\n\nexport namespace AuditLogDetailsPresenter {\n    export type Interface = IAuditLogDetailsPresenter;\n    export type ViewModel = IAuditLogDetailsVm;\n}\n"],"names":["AuditLogDetailsPresenter","createAbstraction"],"mappings":";AAaO,MAAMA,2BAA2BC,kBACpC"}

package/views/Logs/Preview/feature.d.ts

@@ -0,0 +1,5 @@
+import { AuditLogDetailsPresenter as Abstraction } from "./abstractions.js";
+export declare const AuditLogDetailsPresenterFeature: import("@webiny/feature/admin").FeatureDefinition<{
+    presenter: import("./abstractions.js").IAuditLogDetailsPresenter;
+}, []>;
+export declare function useAuditLogDetailsPresenter(): Abstraction.Interface;

package/views/Logs/Preview/feature.js

@@ -0,0 +1,22 @@
+import { createFeature } from "@webiny/feature/admin";
+import { useFeature } from "@webiny/app-admin";
+import { AuditLogDetailsPresenter } from "./abstractions.js";
+import { AuditLogDetailsPresenter as external_AuditLogDetailsPresenter_js_AuditLogDetailsPresenter } from "./AuditLogDetailsPresenter.js";
+const AuditLogDetailsPresenterFeature = createFeature({
+    name: "AuditLogs/DetailsPresenter",
+    register (container) {
+        container.register(external_AuditLogDetailsPresenter_js_AuditLogDetailsPresenter).inSingletonScope();
+    },
+    resolve (container) {
+        return {
+            presenter: container.resolve(AuditLogDetailsPresenter)
+        };
+    }
+});
+function useAuditLogDetailsPresenter() {
+    const { presenter } = useFeature(AuditLogDetailsPresenterFeature);
+    return presenter;
+}
+export { AuditLogDetailsPresenterFeature, useAuditLogDetailsPresenter };
+
+//# sourceMappingURL=feature.js.map

package/views/Logs/Preview/feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"views/Logs/Preview/feature.js","sources":["../../../../src/views/Logs/Preview/feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { useFeature } from \"@webiny/app-admin\";\nimport { AuditLogDetailsPresenter as Abstraction } from \"./abstractions.js\";\nimport { AuditLogDetailsPresenter } from \"./AuditLogDetailsPresenter.js\";\n\nexport const AuditLogDetailsPresenterFeature = createFeature({\n    name: \"AuditLogs/DetailsPresenter\",\n    register(container) {\n        container.register(AuditLogDetailsPresenter).inSingletonScope();\n    },\n    resolve(container) {\n        return {\n            presenter: container.resolve(Abstraction)\n        };\n    }\n});\n\nexport function useAuditLogDetailsPresenter(): Abstraction.Interface {\n    const { presenter } = useFeature(AuditLogDetailsPresenterFeature);\n    return presenter;\n}\n"],"names":["AuditLogDetailsPresenterFeature","createFeature","container","AuditLogDetailsPresenter","Abstraction","useAuditLogDetailsPresenter","presenter","useFeature"],"mappings":";;;;AAKO,MAAMA,kCAAkCC,cAAc;IACzD,MAAM;IACN,UAASC,SAAS;QACdA,UAAU,QAAQ,CAACC,+DAA0B,gBAAgB;IACjE;IACA,SAAQD,SAAS;QACb,OAAO;YACH,WAAWA,UAAU,OAAO,CAACE;QACjC;IACJ;AACJ;AAEO,SAASC;IACZ,MAAM,EAAEC,SAAS,EAAE,GAAGC,WAAWP;IACjC,OAAOM;AACX"}

package/views/Logs/Preview/index.d.ts

@@ -1 +1,3 @@
-export * from "./Preview";
+export * from "./Preview.js";
+export { useAuditLogDetailsPresenter } from "./feature.js";
+export type { IAuditLogDetailsPresenter, IAuditLogDetailsVm } from "./abstractions.js";

package/views/Logs/Preview/index.js

@@ -1,3 +1,2 @@
-export * from "./Preview";
-
-//# sourceMappingURL=index.js.map
+export * from "./Preview.js";
+export { useAuditLogDetailsPresenter } from "./feature.js";