diff --git a/packages/client/src/pages/PortalSettings/categories/security/audit-trail/RowView/AuditContent.js b/packages/client/src/pages/PortalSettings/categories/security/audit-trail/RowView/AuditContent.js
index 6121675235..df67283940 100644
--- a/packages/client/src/pages/PortalSettings/categories/security/audit-trail/RowView/AuditContent.js
+++ b/packages/client/src/pages/PortalSettings/categories/security/audit-trail/RowView/AuditContent.js
@@ -3,6 +3,7 @@ import React from "react";
import Text from "@docspace/components/text";
import moment from "moment";
import styled from "styled-components";
+import { UnavailableStyles } from "../../../../utils/commonSettingsStyles";
const StyledRowContent = styled(RowContent)`
.row-main-container-wrapper {
@@ -10,9 +11,11 @@ const StyledRowContent = styled(RowContent)`
justify-content: space-between;
width: 100%;
}
+
+ ${(props) => props.isSettingNotPaid && UnavailableStyles}
`;
-export const AuditContent = ({ sectionWidth, item }) => {
+export const AuditContent = ({ sectionWidth, item, isSettingNotPaid }) => {
const DATE_FORMAT = "YYYY-MM-DD LT";
const to = moment(item.date).local();
@@ -22,9 +25,15 @@ export const AuditContent = ({ sectionWidth, item }) => {
sideColor="#A3A9AE"
nameColor="#D0D5DA"
sectionWidth={sectionWidth}
+ isSettingNotPaid={isSettingNotPaid}
>
-
+
{item.user}
@@ -34,10 +43,16 @@ export const AuditContent = ({ sectionWidth, item }) => {
fontSize="12px"
fontWeight={600}
truncate={true}
+ className="settings_unavailable"
>
{dateStr}
-
+
{`${item.room} | ${item.action}`}
diff --git a/packages/client/src/pages/PortalSettings/categories/security/audit-trail/TableView/TableContainer.js b/packages/client/src/pages/PortalSettings/categories/security/audit-trail/TableView/TableContainer.js
index 843db40688..6cff96a4c2 100644
--- a/packages/client/src/pages/PortalSettings/categories/security/audit-trail/TableView/TableContainer.js
+++ b/packages/client/src/pages/PortalSettings/categories/security/audit-trail/TableView/TableContainer.js
@@ -6,7 +6,14 @@ import TableHeader from "./TableHeader";
import TableBody from "@docspace/components/table-container/TableBody";
import { isMobile } from "react-device-detect";
-const Table = ({ auditTrailUsers, sectionWidth, viewAs, setViewAs, theme }) => {
+const Table = ({
+ auditTrailUsers,
+ sectionWidth,
+ viewAs,
+ setViewAs,
+ theme,
+ isSettingNotPaid,
+}) => {
const ref = useRef(null);
useEffect(() => {
if (!sectionWidth) return;
@@ -22,7 +29,12 @@ const Table = ({ auditTrailUsers, sectionWidth, viewAs, setViewAs, theme }) => {
{auditTrailUsers.map((item) => (
-
+
))}
diff --git a/packages/client/src/pages/PortalSettings/categories/security/audit-trail/TableView/TableRow.js b/packages/client/src/pages/PortalSettings/categories/security/audit-trail/TableView/TableRow.js
index 8210a37959..1db32ac021 100644
--- a/packages/client/src/pages/PortalSettings/categories/security/audit-trail/TableView/TableRow.js
+++ b/packages/client/src/pages/PortalSettings/categories/security/audit-trail/TableView/TableRow.js
@@ -5,6 +5,7 @@ import TableCell from "@docspace/components/table-container/TableCell";
import Text from "@docspace/components/text";
import styled from "styled-components";
import moment from "moment";
+import { UnavailableStyles } from "../../../../utils/commonSettingsStyles";
const StyledPeopleRow = styled(TableRow)`
.table-container_cell {
@@ -29,10 +30,11 @@ const StyledPeopleRow = styled(TableRow)`
.table-cell_username {
margin-right: 12px;
}
+ ${(props) => props.isSettingNotPaid && UnavailableStyles}
`;
const PeopleTableRow = (props) => {
- const { item, contextOptionsProps } = props;
+ const { item, contextOptionsProps, isSettingNotPaid } = props;
const { email, position } = item;
const DATE_FORMAT = "YYYY-MM-DD LT";
@@ -41,7 +43,11 @@ const PeopleTableRow = (props) => {
const dateStr = to.format(DATE_FORMAT);
return (
-
+
{
fontSize="12px"
fontWeight={600}
truncate
+ className="settings_unavailable"
>
{item.user}
@@ -60,6 +67,7 @@ const PeopleTableRow = (props) => {
fontSize="12px"
fontWeight={600}
truncate
+ className="settings_unavailable"
>
{dateStr}
@@ -71,6 +79,7 @@ const PeopleTableRow = (props) => {
fontSize="12px"
fontWeight={600}
isTextOverflow
+ className="settings_unavailable"
>
{item.room}
@@ -83,6 +92,7 @@ const PeopleTableRow = (props) => {
fontSize="12px"
fontWeight={600}
isTextOverflow
+ className="settings_unavailable"
>
{item.action}
diff --git a/packages/client/src/pages/PortalSettings/categories/security/audit-trail/index.js b/packages/client/src/pages/PortalSettings/categories/security/audit-trail/index.js
index 23e52917f7..8f377ec06f 100644
--- a/packages/client/src/pages/PortalSettings/categories/security/audit-trail/index.js
+++ b/packages/client/src/pages/PortalSettings/categories/security/audit-trail/index.js
@@ -19,6 +19,7 @@ const AuditTrail = (props) => {
getLifetimeAuditSettings,
getAuditTrailReport,
securityLifetime,
+ isAuditAvailable,
} = props;
useEffect(() => {
@@ -40,11 +41,15 @@ const AuditTrail = (props) => {
theme={theme}
auditTrailUsers={auditTrailUsers}
sectionWidth={context.sectionWidth}
+ isSettingNotPaid={!isAuditAvailable}
/>
>
) : (
<>
-
+
>
)
}
@@ -69,6 +74,7 @@ const AuditTrail = (props) => {
content={getContent()}
downloadReport={t("DownloadReportBtn")}
getReport={getAuditTrailReport}
+ isSettingNotPaid={!isAuditAvailable}
/>
)}
>
@@ -85,8 +91,9 @@ export default inject(({ setup, auth }) => {
getAuditTrailReport,
securityLifetime,
} = setup;
- const { theme } = auth.settingsStore;
-
+ const { settingsStore, currentQuotaStore } = auth;
+ const { theme } = settingsStore;
+ const { isAuditAvailable } = currentQuotaStore;
return {
getAuditTrail,
auditTrailUsers: security.auditTrail.users,
@@ -96,5 +103,6 @@ export default inject(({ setup, auth }) => {
setLifetimeAuditSettings,
getAuditTrailReport,
securityLifetime,
+ isAuditAvailable,
};
})(withTranslation("Settings")(withRouter(AuditTrail)));
diff --git a/packages/client/src/pages/PortalSettings/categories/security/sub-components/HistoryMainContent.js b/packages/client/src/pages/PortalSettings/categories/security/sub-components/HistoryMainContent.js
index a4abf09e62..eaeeeaa466 100644
--- a/packages/client/src/pages/PortalSettings/categories/security/sub-components/HistoryMainContent.js
+++ b/packages/client/src/pages/PortalSettings/categories/security/sub-components/HistoryMainContent.js
@@ -6,8 +6,9 @@ import SaveCancelButtons from "@docspace/components/save-cancel-buttons";
import styled from "styled-components";
import Button from "@docspace/components/button";
import toastr from "@docspace/components/toast/toastr";
-
+import { UnavailableStyles } from "../../../utils/commonSettingsStyles";
import { hugeMobile, tablet } from "@docspace/components/utils/device";
+import Badge from "@docspace/components/badge";
const StyledTextInput = styled(TextInput)`
margin-top: 4px;
@@ -74,6 +75,8 @@ const MainContainer = styled.div`
width: 100%;
}
}
+
+ ${(props) => props.isSettingNotPaid && UnavailableStyles}
`;
const HistoryMainContent = (props) => {
@@ -92,6 +95,7 @@ const HistoryMainContent = (props) => {
content,
downloadReport,
getReport,
+ isSettingNotPaid,
} = props;
const [lifeTime, setLifeTime] = useState(String(lifetime) || "180");
@@ -149,14 +153,18 @@ const HistoryMainContent = (props) => {
}, [lifeTime]);
return (
-
+
+ {isSettingNotPaid && }
-
+
{subHeader}
- {latestText}
+ {latestText}
-
{content}
);