feat: switched audit log stream from project level to org level

This commit is contained in:
Akhil Mohan
2024-05-03 00:23:59 +05:30
parent fa18ca41ac
commit 68a1aa6f46
18 changed files with 92 additions and 147 deletions
@@ -21,8 +21,8 @@ export const useCreateAuditLogStream = () => {
);
return data;
},
onSuccess: (_, { projectSlug }) => {
queryClient.invalidateQueries(auditLogStreamKeys.list(projectSlug));
onSuccess: (_, { orgId }) => {
queryClient.invalidateQueries(auditLogStreamKeys.list(orgId));
}
});
};
@@ -38,8 +38,8 @@ export const useUpdateAuditLogStream = () => {
);
return data;
},
onSuccess: (_, { projectSlug }) => {
queryClient.invalidateQueries(auditLogStreamKeys.list(projectSlug));
onSuccess: (_, { orgId }) => {
queryClient.invalidateQueries(auditLogStreamKeys.list(orgId));
}
});
};
@@ -54,8 +54,8 @@ export const useDeleteAuditLogStream = () => {
);
return data;
},
onSuccess: (_, { projectSlug }) => {
queryClient.invalidateQueries(auditLogStreamKeys.list(projectSlug));
onSuccess: (_, { orgId }) => {
queryClient.invalidateQueries(auditLogStreamKeys.list(orgId));
}
});
};
@@ -5,28 +5,23 @@ import { apiRequest } from "@app/config/request";
import { TAuditLogStream } from "./types";
export const auditLogStreamKeys = {
list: (projectSlug: string) => ["audit-log-stream", { projectSlug }],
list: (orgId: string) => ["audit-log-stream", { orgId }],
getById: (id: string) => ["audit-log-stream-details", { id }]
};
const fetchAuditLogStreams = async (projectSlug: string) => {
const fetchAuditLogStreams = async () => {
const { data } = await apiRequest.get<{ auditLogStreams: TAuditLogStream[] }>(
"/api/v1/audit-log-streams",
{
params: {
projectSlug
}
}
"/api/v1/audit-log-streams"
);
return data.auditLogStreams;
};
export const useGetAuditLogStreams = (projectSlug: string) =>
export const useGetAuditLogStreams = (orgId: string) =>
useQuery({
queryKey: auditLogStreamKeys.list(projectSlug),
queryFn: () => fetchAuditLogStreams(projectSlug),
enabled: Boolean(projectSlug)
queryKey: auditLogStreamKeys.list(orgId),
queryFn: () => fetchAuditLogStreams(),
enabled: Boolean(orgId)
});
const fetchAuditLogStreamDetails = async (id: string) => {
@@ -5,19 +5,19 @@ export type TAuditLogStream = {
};
export type TCreateAuditLogStreamDTO = {
projectSlug: string;
url: string;
token?: string;
orgId: string;
};
export type TUpdateAuditLogStreamDTO = {
id: string;
projectSlug: string;
url?: string;
token?: string;
orgId: string;
};
export type TDeleteAuditLogStreamDTO = {
id: string;
projectSlug: string;
orgId: string;
};
@@ -3,7 +3,7 @@ import { z } from "zod";
import { createNotification } from "@app/components/notifications";
import { Button, FormControl, Input, Spinner } from "@app/components/v2";
import { useWorkspace } from "@app/context";
import { useOrganization } from "@app/context";
import {
useCreateAuditLogStream,
useGetAuditLogStreamDetails,
@@ -23,8 +23,8 @@ type TForm = z.infer<typeof formSchema>;
export const AuditLogStreamForm = ({ id = "", onClose }: Props) => {
const isEdit = Boolean(id);
const { currentWorkspace } = useWorkspace();
const projectSlug = currentWorkspace?.slug || "";
const { currentOrg } = useOrganization();
const orgId = currentOrg?.id || "";
const auditLogStream = useGetAuditLogStreamDetails(id);
const createAuditLogStream = useCreateAuditLogStream();
@@ -43,7 +43,7 @@ export const AuditLogStreamForm = ({ id = "", onClose }: Props) => {
try {
await updateAuditLogStream.mutateAsync({
id,
projectSlug,
orgId,
token,
url
});
@@ -69,7 +69,7 @@ export const AuditLogStreamForm = ({ id = "", onClose }: Props) => {
}
try {
await createAuditLogStream.mutateAsync({
projectSlug,
orgId,
token,
url
});
@@ -2,7 +2,7 @@ import { faPlug, faPlus } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { createNotification } from "@app/components/notifications";
import { ProjectPermissionCan } from "@app/components/permissions";
import { OrgPermissionCan } from "@app/components/permissions";
import {
Button,
DeleteActionModal,
@@ -19,21 +19,21 @@ import {
UpgradePlanModal
} from "@app/components/v2";
import {
ProjectPermissionActions,
ProjectPermissionSub,
useSubscription,
useWorkspace
OrgPermissionActions,
OrgPermissionSubjects,
useOrganization,
useSubscription
} from "@app/context";
import { withProjectPermission } from "@app/hoc";
import { withPermission } from "@app/hoc";
import { usePopUp } from "@app/hooks";
import { useDeleteAuditLogStream, useGetAuditLogStreams } from "@app/hooks/api";
import { AuditLogStreamForm } from "./AuditLogStreamForm";
export const AuditLogStreamsTab = withProjectPermission(
export const AuditLogStreamsTab = withPermission(
() => {
const { currentWorkspace } = useWorkspace();
const projectSlug = currentWorkspace?.slug || "";
const { currentOrg } = useOrganization();
const orgId = currentOrg?.id || "";
const { popUp, handlePopUpOpen, handlePopUpToggle, handlePopUpClose } = usePopUp([
"auditLogStreamForm",
"deleteAuditLogStream",
@@ -42,7 +42,7 @@ export const AuditLogStreamsTab = withProjectPermission(
const { subscription } = useSubscription();
const { data: auditLogStreams, isLoading: isAuditLogStreamsLoading } =
useGetAuditLogStreams(projectSlug);
useGetAuditLogStreams(orgId);
// mutation
const { mutateAsync: deleteAuditLogStream } = useDeleteAuditLogStream();
@@ -52,7 +52,7 @@ export const AuditLogStreamsTab = withProjectPermission(
const auditLogStreamId = popUp?.deleteAuditLogStream?.data as string;
await deleteAuditLogStream({
id: auditLogStreamId,
projectSlug
orgId
});
handlePopUpClose("deleteAuditLogStream");
createNotification({
@@ -72,10 +72,7 @@ export const AuditLogStreamsTab = withProjectPermission(
<div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
<div className="flex justify-between">
<p className="text-xl font-semibold text-mineshaft-100">Audit Log Streams</p>
<ProjectPermissionCan
I={ProjectPermissionActions.Create}
a={ProjectPermissionSub.Settings}
>
<OrgPermissionCan I={OrgPermissionActions.Create} a={OrgPermissionSubjects.Settings}>
{(isAllowed) => (
<Button
onClick={() => {
@@ -91,7 +88,7 @@ export const AuditLogStreamsTab = withProjectPermission(
Create
</Button>
)}
</ProjectPermissionCan>
</OrgPermissionCan>
</div>
<p className="mb-8 text-gray-400">
Manage audit log streams to send audit log to any logging providers with syslog support.
@@ -124,9 +121,9 @@ export const AuditLogStreamsTab = withProjectPermission(
</Td>
<Td>
<div className="flex items-center justify-end space-x-2">
<ProjectPermissionCan
I={ProjectPermissionActions.Edit}
a={ProjectPermissionSub.Settings}
<OrgPermissionCan
I={OrgPermissionActions.Edit}
a={OrgPermissionSubjects.Settings}
>
{(isAllowed) => (
<Button
@@ -138,10 +135,10 @@ export const AuditLogStreamsTab = withProjectPermission(
Edit
</Button>
)}
</ProjectPermissionCan>
<ProjectPermissionCan
I={ProjectPermissionActions.Delete}
a={ProjectPermissionSub.Settings}
</OrgPermissionCan>
<OrgPermissionCan
I={OrgPermissionActions.Delete}
a={OrgPermissionSubjects.Settings}
>
{(isAllowed) => (
<Button
@@ -155,7 +152,7 @@ export const AuditLogStreamsTab = withProjectPermission(
Delete
</Button>
)}
</ProjectPermissionCan>
</OrgPermissionCan>
</div>
</Td>
</Tr>
@@ -196,5 +193,5 @@ export const AuditLogStreamsTab = withProjectPermission(
</div>
);
},
{ action: ProjectPermissionActions.Read, subject: ProjectPermissionSub.Settings }
{ action: OrgPermissionActions.Read, subject: OrgPermissionSubjects.Settings }
);
@@ -1,12 +1,14 @@
import { Fragment } from "react";
import { Tab } from "@headlessui/react";
import { AuditLogStreamsTab } from "../AuditLogStreamTab";
import { OrgAuthTab } from "../OrgAuthTab";
import { OrgGeneralTab } from "../OrgGeneralTab";
const tabs = [
{ name: "General", key: "tab-org-general" },
{ name: "Security", key: "tab-org-security" }
{ name: "Security", key: "tab-org-security" },
{ name: "Audit Log Streams", key: "tag-audit-log-streams" }
];
export const OrgTabGroup = () => {
return (
@@ -17,9 +19,8 @@ export const OrgTabGroup = () => {
{({ selected }) => (
<button
type="button"
className={`w-30 mx-2 mr-4 py-2 text-sm font-medium outline-none ${
selected ? "border-b border-white text-white" : "text-mineshaft-400"
}`}
className={`w-30 mx-2 mr-4 py-2 text-sm font-medium outline-none ${selected ? "border-b border-white text-white" : "text-mineshaft-400"
}`}
>
{tab.name}
</button>
@@ -34,6 +35,9 @@ export const OrgTabGroup = () => {
<Tab.Panel>
<OrgAuthTab />
</Tab.Panel>
<Tab.Panel>
<AuditLogStreamsTab />
</Tab.Panel>
</Tab.Panels>
</Tab.Group>
);
@@ -4,12 +4,10 @@ import { Tab } from "@headlessui/react";
import { ProjectGeneralTab } from "./components/ProjectGeneralTab";
import { WebhooksTab } from "./components/WebhooksTab";
import { AuditLogStreamsTab } from "./components";
const tabs = [
{ name: "General", key: "tab-project-general" },
{ name: "Webhooks", key: "tab-project-webhooks" },
{ name: "Audit Log Streams", key: "tab-project-audit-log-stream" }
];
export const ProjectSettingsPage = () => {
@@ -43,9 +41,6 @@ export const ProjectSettingsPage = () => {
<Tab.Panel>
<WebhooksTab />
</Tab.Panel>
<Tab.Panel>
<AuditLogStreamsTab />
</Tab.Panel>
</Tab.Panels>
</Tab.Group>
</div>
@@ -1,4 +1,3 @@
export { AuditLogStreamsTab } from "./AuditLogStreamTab";
export { AutoCapitalizationSection } from "./AutoCapitalizationSection";
export { DeleteProjectSection } from "./DeleteProjectSection";
export { E2EESection } from "./E2EESection";