Skip to content

Commit 244845f

Browse files
BrunoQuaresmaBrunoQuaresma
committed
Add paywall to the audit route
1 parent 2117eb4 commit 244845f

File tree

3 files changed

+86
-68
lines changed

3 files changed

+86
-68
lines changed

‎site/src/AppRouter.tsx

Lines changed: 2 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
1-
import { useSelector } from "@xstate/react"
21
import { FullScreenLoader } from "components/Loader/FullScreenLoader"
3-
import { RequirePermission } from "components/RequirePermission/RequirePermission"
42
import { TemplateLayout } from "components/TemplateLayout/TemplateLayout"
53
import { UsersLayout } from "components/UsersLayout/UsersLayout"
64
import IndexPage from "pages"
@@ -12,11 +10,8 @@ import { TemplateSettingsPage } from "pages/TemplateSettingsPage/TemplateSetting
1210
import TemplatesPage from "pages/TemplatesPage/TemplatesPage"
1311
import UsersPage from "pages/UsersPage/UsersPage"
1412
import WorkspacesPage from "pages/WorkspacesPage/WorkspacesPage"
15-
import { FC, lazy, Suspense, useContext } from "react"
13+
import { FC, lazy, Suspense } from "react"
1614
import { Route, Routes } from "react-router-dom"
17-
import { selectPermissions } from "xServices/auth/authSelectors"
18-
import { selectFeatureVisibility } from "xServices/entitlements/entitlementsSelectors"
19-
import { XServiceContext } from "xServices/StateContext"
2015
import { DashboardLayout } from "./components/DashboardLayout/DashboardLayout"
2116
import { RequireAuth } from "./components/RequireAuth/RequireAuth"
2217
import { SettingsLayout } from "./components/SettingsLayout/SettingsLayout"
@@ -123,13 +118,6 @@ const CreateTemplatePage = lazy(
123118
)
124119

125120
export const AppRouter: FC = () => {
126-
const xServices = useContext(XServiceContext)
127-
const permissions = useSelector(xServices.authXService, selectPermissions)
128-
const featureVisibility = useSelector(
129-
xServices.entitlementsXService,
130-
selectFeatureVisibility,
131-
)
132-
133121
return (
134122
<Suspense fallback={<FullScreenLoader />}>
135123
<Routes>
@@ -188,21 +176,7 @@ export const AppRouter: FC = () => {
188176
<Route path=":groupId/settings" element={<SettingsGroupPage />} />
189177
</Route>
190178

191-
<Route path="/audit">
192-
<Route
193-
index
194-
element={
195-
<RequirePermission
196-
isFeatureVisible={
197-
featureVisibility["audit_log"] &&
198-
Boolean(permissions?.viewAuditLog)
199-
}
200-
>
201-
<AuditPage />
202-
</RequirePermission>
203-
}
204-
/>
205-
</Route>
179+
<Route path="/audit" element={<AuditPage />} />
206180

207181
<Route
208182
path="/settings/deployment"

‎site/src/pages/AuditPage/AuditPage.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import {
33
getPaginationContext,
44
nonInitialPage,
55
} from "components/PaginationWidget/utils"
6+
import { useFeatureVisibility } from "hooks/useFeatureVisibility"
67
import { FC } from "react"
78
import { Helmet } from "react-helmet-async"
89
import { useSearchParams } from "react-router-dom"
@@ -27,6 +28,7 @@ const AuditPage: FC = () => {
2728

2829
const { auditLogs, count } = auditState.context
2930
const paginationRef = auditState.context.paginationRef as PaginationMachineRef
31+
const { audit_log: isAuditLogVisible } = useFeatureVisibility()
3032

3133
return (
3234
<>
@@ -42,6 +44,7 @@ const AuditPage: FC = () => {
4244
}}
4345
paginationRef={paginationRef}
4446
isNonInitialPage={nonInitialPage(searchParams)}
47+
isAuditLogVisible={isAuditLogVisible}
4548
/>
4649
</>
4750
)

‎site/src/pages/AuditPage/AuditPageView.tsx

Lines changed: 81 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
import Button from "@material-ui/core/Button"
2+
import Link from "@material-ui/core/Link"
13
import Table from "@material-ui/core/Table"
24
import TableBody from "@material-ui/core/TableBody"
35
import TableCell from "@material-ui/core/TableCell"
@@ -8,12 +10,14 @@ import { AuditLogRow } from "components/AuditLogRow/AuditLogRow"
810
import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"
911
import { EmptyState } from "components/EmptyState/EmptyState"
1012
import { Margins } from "components/Margins/Margins"
13+
import ArrowRightAltOutlined from "@material-ui/icons/ArrowRightAltOutlined"
1114
import {
1215
PageHeader,
1316
PageHeaderSubtitle,
1417
PageHeaderTitle,
1518
} from "components/PageHeader/PageHeader"
1619
import { PaginationWidget } from "components/PaginationWidget/PaginationWidget"
20+
import { Paywall } from "components/Paywall/Paywall"
1721
import { SearchBarWithFilter } from "components/SearchBarWithFilter/SearchBarWithFilter"
1822
import { Stack } from "components/Stack/Stack"
1923
import { TableLoader } from "components/TableLoader/TableLoader"
@@ -46,6 +50,7 @@ export interface AuditPageViewProps {
4650
onFilter: (filter: string) => void
4751
paginationRef: PaginationMachineRef
4852
isNonInitialPage: boolean
53+
isAuditLogVisible: boolean
4954
}
5055

5156
export const AuditPageView: FC<AuditPageViewProps> = ({
@@ -55,6 +60,7 @@ export const AuditPageView: FC<AuditPageViewProps> = ({
5560
onFilter,
5661
paginationRef,
5762
isNonInitialPage,
63+
isAuditLogVisible,
5864
}) => {
5965
const { t } = useTranslation("auditLog")
6066
const isLoading = auditLogs === undefined || count === undefined
@@ -72,53 +78,88 @@ export const AuditPageView: FC<AuditPageViewProps> = ({
7278
<PageHeaderSubtitle>{Language.subtitle}</PageHeaderSubtitle>
7379
</PageHeader>
7480

75-
<SearchBarWithFilter
76-
docs="https://coder.com/docs/coder-oss/latest/admin/audit-logs#filtering-logs"
77-
filter={filter}
78-
onFilter={onFilter}
79-
presetFilters={presetFilters}
80-
/>
81+
<ChooseOne>
82+
<Cond condition={isAuditLogVisible}>
83+
<SearchBarWithFilter
84+
docs="https://coder.com/docs/coder-oss/latest/admin/audit-logs#filtering-logs"
85+
filter={filter}
86+
onFilter={onFilter}
87+
presetFilters={presetFilters}
88+
/>
8189

82-
<TableContainer>
83-
<Table>
84-
<TableBody>
85-
<ChooseOne>
86-
<Cond condition={isLoading}>
87-
<TableLoader />
88-
</Cond>
89-
<Cond condition={isEmpty}>
90+
<TableContainer>
91+
<Table>
92+
<TableBody>
9093
<ChooseOne>
91-
<Cond condition={isNonInitialPage}>
92-
<TableRow>
93-
<TableCell colSpan={999}>
94-
<EmptyState message={t("table.emptyPage")} />
95-
</TableCell>
96-
</TableRow>
94+
<Cond condition={isLoading}>
95+
<TableLoader />
96+
</Cond>
97+
<Cond condition={isEmpty}>
98+
<ChooseOne>
99+
<Cond condition={isNonInitialPage}>
100+
<TableRow>
101+
<TableCell colSpan={999}>
102+
<EmptyState message={t("table.emptyPage")} />
103+
</TableCell>
104+
</TableRow>
105+
</Cond>
106+
<Cond>
107+
<TableRow>
108+
<TableCell colSpan={999}>
109+
<EmptyState message={t("table.noLogs")} />
110+
</TableCell>
111+
</TableRow>
112+
</Cond>
113+
</ChooseOne>
97114
</Cond>
98115
<Cond>
99-
<TableRow>
100-
<TableCell colSpan={999}>
101-
<EmptyState message={t("table.noLogs")} />
102-
</TableCell>
103-
</TableRow>
116+
{auditLogs && (
117+
<Timeline
118+
items={auditLogs}
119+
getDate={(log) => new Date(log.time)}
120+
row={(log) => (
121+
<AuditLogRow key={log.id} auditLog={log} />
122+
)}
123+
/>
124+
)}
104125
</Cond>
105126
</ChooseOne>
106-
</Cond>
107-
<Cond>
108-
{auditLogs && (
109-
<Timeline
110-
items={auditLogs}
111-
getDate={(log) => new Date(log.time)}
112-
row={(log) => <AuditLogRow key={log.id} auditLog={log} />}
113-
/>
114-
)}
115-
</Cond>
116-
</ChooseOne>
117-
</TableBody>
118-
</Table>
119-
</TableContainer>
127+
</TableBody>
128+
</Table>
129+
</TableContainer>
130+
131+
<PaginationWidget numRecords={count} paginationRef={paginationRef} />
132+
</Cond>
120133

121-
<PaginationWidget numRecords={count} paginationRef={paginationRef} />
134+
<Cond>
135+
<Paywall
136+
message="Audit logs"
137+
description="Audit Logs allows Auditors to monitor user operations in their deployment. To use this feature, you have to upgrade your account."
138+
cta={
139+
<Stack direction="row" alignItems="center">
140+
<Link
141+
underline="none"
142+
href="https://coder.com/docs/coder-oss/latest/admin/upgrade"
143+
target="_blank"
144+
rel="noreferrer"
145+
>
146+
<Button size="small" startIcon={<ArrowRightAltOutlined />}>
147+
See how to upgrade
148+
</Button>
149+
</Link>
150+
<Link
151+
underline="none"
152+
href="https://coder.com/docs/coder-oss/latest/admin/audit-logs"
153+
target="_blank"
154+
rel="noreferrer"
155+
>
156+
Read the docs
157+
</Link>
158+
</Stack>
159+
}
160+
/>
161+
</Cond>
162+
</ChooseOne>
122163
</Margins>
123164
)
124165
}

0 commit comments

Comments
 (0)