Signed-off-by: gearnode <bryan@frimin.fr>
This commit is contained in:
gearnode
2025-02-27 14:48:38 +01:00
parent 4bb7c116b9
commit 52de0387fa
14 changed files with 65 additions and 62 deletions

View File

@@ -24,7 +24,7 @@ posthog.init(process.env.POSTHOG_KEY!, {
});
const OrganizationSelectionPage = lazy(
() => import("./pages/OrganizationSelectionPage")
() => import("./pages/OrganizationSelectionPage"),
);
const HomePage = lazy(() => import("./pages/HomePage"));
const NotFoundPage = lazy(() => import("./pages/NotFoundPage"));
@@ -35,14 +35,14 @@ const VendorOverviewPage = lazy(() => import("./pages/VendorOverviewPage"));
const SettingsPage = lazy(() => import("./pages/SettingsPage"));
const CreatePeoplePage = lazy(() => import("./pages/CreatePeoplePage"));
const FrameworkOverviewPage = lazy(
() => import("./pages/FrameworkOverviewPage")
() => import("./pages/FrameworkOverviewPage"),
);
const ControlOverviewPage = lazy(() => import("./pages/ControlOverviewPage"));
const PeopleOverviewPage = lazy(() => import("./pages/PeopleOverviewPage"));
const LoginPage = lazy(() => import("./pages/LoginPage"));
const RegisterPage = lazy(() => import("./pages/RegisterPage"));
const CreateOrganizationPage = lazy(
() => import("./pages/CreateOrganizationPage")
() => import("./pages/CreateOrganizationPage"),
);
const CreateFrameworkPage = lazy(() => import("./pages/CreateFrameworkPage"));
const CreateControlPage = lazy(() => import("./pages/CreateControlPage"));

View File

@@ -74,7 +74,7 @@ export function OrganizationSwitcher({
useEffect(() => {
if (hasOrganizations) {
const org = data.organizations.edges.find(
(edge) => edge.node.id === organizationId
(edge) => edge.node.id === organizationId,
);
if (org) {
setCurrentOrganization(org.node);

View File

@@ -19,7 +19,7 @@ const DialogOverlay = React.forwardRef<
ref={ref}
className={cn(
"fixed inset-0 z-50 bg-black/50 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
className
className,
)}
{...props}
/>
@@ -36,7 +36,7 @@ const DialogContent = React.forwardRef<
ref={ref}
className={cn(
"fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-gray-200 bg-white p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
className
className,
)}
{...props}
>
@@ -57,7 +57,7 @@ const DialogHeader = ({
<div
className={cn(
"flex flex-col space-y-1.5 text-center sm:text-left",
className
className,
)}
{...props}
/>
@@ -71,7 +71,7 @@ const DialogFooter = ({
<div
className={cn(
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
className
className,
)}
{...props}
/>
@@ -86,7 +86,7 @@ const DialogTitle = React.forwardRef<
ref={ref}
className={cn(
"text-lg font-semibold leading-none tracking-tight",
className
className,
)}
{...props}
/>

View File

@@ -10,7 +10,7 @@ const Textarea = React.forwardRef<
<textarea
className={cn(
"flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
className
className,
)}
ref={ref}
{...props}

View File

@@ -57,7 +57,7 @@ function BreadcrumbHome({ children }: { children: React.ReactNode }) {
}
`,
{ organizationId: organizationId! },
{ fetchPolicy: "store-or-network" }
{ fetchPolicy: "store-or-network" },
);
return (
@@ -117,7 +117,7 @@ function BreadcrumbFrameworkOverview() {
}
}
`,
{ frameworkId: frameworkId! }
{ frameworkId: frameworkId! },
);
return (
@@ -151,7 +151,7 @@ function BreadcrumbUpdateFramework() {
}
`,
{ frameworkId: frameworkId! },
{ fetchPolicy: "store-or-network" }
{ fetchPolicy: "store-or-network" },
);
return (
@@ -208,7 +208,7 @@ function BreadcrumbVendorOverview() {
}
`,
{ vendorId: vendorId! },
{ fetchPolicy: "store-or-network" }
{ fetchPolicy: "store-or-network" },
);
return (
@@ -268,7 +268,7 @@ function BreadcrumbPeopleOverview() {
}
`,
{ peopleId: peopleId! },
{ fetchPolicy: "store-or-network" }
{ fetchPolicy: "store-or-network" },
);
return (
@@ -310,7 +310,7 @@ function BreadcrumbControlOverview() {
}
}
`,
{ frameworkId: frameworkId!, controlId: controlId! }
{ frameworkId: frameworkId!, controlId: controlId! },
);
return (
@@ -351,7 +351,7 @@ function BreadcrumbCreateControl() {
}
}
`,
{ frameworkId: frameworkId! }
{ frameworkId: frameworkId! },
);
return (

View File

@@ -102,12 +102,12 @@ function ControlOverviewPageContent({
}) {
const data = usePreloadedQuery<ControlOverviewPageQueryType>(
controlOverviewPageQuery,
queryRef
queryRef,
);
const { toast } = useToast();
const [updateTaskState] =
useMutation<ControlOverviewPageUpdateTaskStateMutationType>(
updateTaskStateMutation
updateTaskStateMutation,
);
const [createTask] =
useMutation<ControlOverviewPageCreateTaskMutationType>(createTaskMutation);
@@ -466,7 +466,7 @@ function ControlOverviewPageFallback() {
export default function ControlOverviewPage() {
const { controlId } = useParams();
const [queryRef, loadQuery] = useQueryLoader<ControlOverviewPageQueryType>(
controlOverviewPageQuery
controlOverviewPageQuery,
);
useEffect(() => {

View File

@@ -71,7 +71,7 @@ function EditableField({
}
className={cn(
"w-full resize-none",
required && !value && "border-red-500"
required && !value && "border-red-500",
)}
placeholder={`Enter ${label.toLowerCase()}`}
rows={4}
@@ -126,7 +126,7 @@ function CreateControlPageContent() {
const connectionId = ConnectionHandler.getConnectionID(
frameworkId!,
"FrameworkOverviewPage_controls"
"FrameworkOverviewPage_controls",
);
commit({
@@ -155,7 +155,7 @@ function CreateControlPageContent() {
});
navigate(
`/organizations/${organizationId}/frameworks/${frameworkId}/controls/${data.createControl.controlEdge.node.id}`
`/organizations/${organizationId}/frameworks/${frameworkId}/controls/${data.createControl.controlEdge.node.id}`,
);
},
onError(error) {
@@ -215,7 +215,7 @@ function CreateControlPageContent() {
navigate(
`/organizations/${
frameworkId?.split(":")[1]
}/frameworks/${frameworkId}`
}/frameworks/${frameworkId}`,
)
}
>

View File

@@ -69,7 +69,7 @@ function EditableField({
}
className={cn(
"w-full resize-none",
required && !value && "border-red-500"
required && !value && "border-red-500",
)}
placeholder={`Enter ${label.toLowerCase()}`}
rows={4}
@@ -101,7 +101,7 @@ function CreateFrameworkPageContent() {
const [commit, isInFlight] =
useMutation<CreateFrameworkPageCreateFrameworkMutation>(
createFrameworkMutation
createFrameworkMutation,
);
const handleFieldChange = (field: keyof typeof formData, value: unknown) => {
@@ -125,7 +125,7 @@ function CreateFrameworkPageContent() {
const connectionId = ConnectionHandler.getConnectionID(
organizationId!,
"FrameworkListPage_frameworks"
"FrameworkListPage_frameworks",
);
commit({
@@ -153,7 +153,7 @@ function CreateFrameworkPageContent() {
});
navigate(
`/organizations/${organizationId}/frameworks/${data.createFramework.frameworkEdge.node.id}`
`/organizations/${organizationId}/frameworks/${data.createFramework.frameworkEdge.node.id}`,
);
},
onError(error) {

View File

@@ -86,11 +86,11 @@ export default function CreateOrganizationPage() {
const { toast } = useToast();
const data = useLazyLoadQuery<CreateOrganizationPageViewerQuery>(
viewerQuery,
{}
{},
);
const [createOrganization] =
useMutation<CreateOrganizationPageCreateOrganizationMutation>(
createOrganizationMutation
createOrganizationMutation,
);
const [formData, setFormData] = useState({
name: "",
@@ -114,7 +114,7 @@ export default function CreateOrganizationPage() {
connections: [
ConnectionHandler.getConnectionID(
data.viewer.id,
"OrganizationSwitcher_organizations"
"OrganizationSwitcher_organizations",
),
],
},

View File

@@ -88,7 +88,7 @@ function FrameworkListPageContent({
}) {
const data = usePreloadedQuery<FrameworkListPageQueryType>(
FrameworkListPageQuery,
queryRef
queryRef,
);
const { organizationId } = useParams();
const frameworks =
@@ -118,7 +118,7 @@ function FrameworkListPageContent({
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-2">
{frameworks.map((framework) => {
const validatedControls = framework.controls.edges.filter(
(edge) => edge?.node?.state === "IMPLEMENTED"
(edge) => edge?.node?.state === "IMPLEMENTED",
).length;
const totalControls = framework.controls.edges.length;
@@ -185,7 +185,7 @@ function FrameworkListPageFallback() {
export default function FrameworkListPage() {
const [queryRef, loadQuery] = useQueryLoader<FrameworkListPageQueryType>(
FrameworkListPageQuery
FrameworkListPageQuery,
);
const { organizationId } = useParams();

View File

@@ -57,14 +57,17 @@ function FrameworkOverviewPageContent({
const { organizationId } = useParams();
// Group controls by their category
const controlsByCategory = controls.reduce((acc, control) => {
if (!control?.category) return acc;
if (!acc[control.category]) {
acc[control.category] = [];
}
acc[control.category].push(control);
return acc;
}, {} as Record<string, typeof controls>);
const controlsByCategory = controls.reduce(
(acc, control) => {
if (!control?.category) return acc;
if (!acc[control.category]) {
acc[control.category] = [];
}
acc[control.category].push(control);
return acc;
},
{} as Record<string, typeof controls>,
);
const controlCards = Object.entries(controlsByCategory).map(
([category, controls]) => ({
@@ -72,11 +75,11 @@ function FrameworkOverviewPageContent({
controls,
completed: controls.filter((c) => c?.state === "IMPLEMENTED").length,
total: controls.length,
})
}),
);
const totalImplemented = controls.filter(
(c) => c?.state === "IMPLEMENTED"
(c) => c?.state === "IMPLEMENTED",
).length;
return (
@@ -207,7 +210,7 @@ function FrameworkOverviewPageContent({
onClick={() => {
if (control?.id) {
navigate(
`/organizations/${organizationId}/frameworks/${framework.id}/controls/${control.id}`
`/organizations/${organizationId}/frameworks/${framework.id}/controls/${control.id}`,
);
}
}}
@@ -291,7 +294,7 @@ function FrameworkOverviewPageContent({
</div>
</div>
</div>,
document.body
document.body,
)}
</div>
);
@@ -325,7 +328,7 @@ function FrameworkOverviewPageFallback() {
export default function FrameworkOverviewPage() {
const { frameworkId } = useParams();
const [queryRef, loadQuery] = useQueryLoader<FrameworkOverviewPageQueryType>(
FrameworkOverviewPageQuery
FrameworkOverviewPageQuery,
);
useEffect(() => {

View File

@@ -98,7 +98,7 @@ function PeopleOverviewPageContent({
});
const [commit] = useMutation(updatePeopleMutation);
const [, loadQuery] = useQueryLoader<PeopleOverviewPageQueryType>(
peopleOverviewPageQuery
peopleOverviewPageQuery,
);
const { toast } = useToast();
@@ -200,7 +200,7 @@ function PeopleOverviewPageContent({
onClick={() => {
const newEmails =
formData.additionalEmailAddresses.filter(
(_, i) => i !== index
(_, i) => i !== index,
);
handleFieldChange("additionalEmailAddresses", newEmails);
}}
@@ -245,7 +245,7 @@ function PeopleOverviewPageContent({
"rounded-full px-4 py-1 text-sm transition-colors",
formData.kind === "EMPLOYEE"
? "bg-blue-100 text-blue-900 ring-2 ring-blue-600 ring-offset-2"
: "bg-gray-100 text-gray-900 hover:bg-gray-200"
: "bg-gray-100 text-gray-900 hover:bg-gray-200",
)}
>
Employee
@@ -256,7 +256,7 @@ function PeopleOverviewPageContent({
"rounded-full px-4 py-1 text-sm transition-colors",
formData.kind === "CONTRACTOR"
? "bg-purple-100 text-purple-900 ring-2 ring-purple-600 ring-offset-2"
: "bg-gray-100 text-gray-900 hover:bg-gray-200"
: "bg-gray-100 text-gray-900 hover:bg-gray-200",
)}
>
Contractor
@@ -305,7 +305,7 @@ function PeopleOverviewPageFallback() {
export default function PeopleOverviewPage() {
const { peopleId } = useParams();
const [queryRef, loadQuery] = useQueryLoader<PeopleOverviewPageQueryType>(
peopleOverviewPageQuery
peopleOverviewPageQuery,
);
useEffect(() => {

View File

@@ -87,7 +87,7 @@ function EditableField({
}
className={cn(
"w-full resize-none",
required && !value && "border-red-500"
required && !value && "border-red-500",
)}
placeholder={`Enter ${label.toLowerCase()}`}
rows={4}
@@ -134,7 +134,7 @@ function UpdateFrameworkPageContent({
const [commit, isInFlight] =
useMutation<UpdateFrameworkPageUpdateFrameworkMutation>(
updateFrameworkMutation
updateFrameworkMutation,
);
const handleFieldChange = (field: keyof typeof formData, value: unknown) => {

View File

@@ -127,7 +127,7 @@ function VendorOverviewPageContent({
});
const [commit] = useMutation(updateVendorMutation);
const [, loadQuery] = useQueryLoader<VendorOverviewPageQueryType>(
vendorOverviewPageQuery
vendorOverviewPageQuery,
);
const { toast } = useToast();
@@ -261,7 +261,7 @@ function VendorOverviewPageContent({
"rounded-full px-4 py-1 text-sm transition-colors",
formData.serviceCriticality === "LOW"
? "bg-green-100 text-green-900 ring-2 ring-green-600 ring-offset-2"
: "bg-gray-100 text-gray-900 hover:bg-gray-200"
: "bg-gray-100 text-gray-900 hover:bg-gray-200",
)}
>
Low
@@ -274,7 +274,7 @@ function VendorOverviewPageContent({
"rounded-full px-4 py-1 text-sm transition-colors",
formData.serviceCriticality === "MEDIUM"
? "bg-yellow-100 text-yellow-900 ring-2 ring-yellow-600 ring-offset-2"
: "bg-gray-100 text-gray-900 hover:bg-gray-200"
: "bg-gray-100 text-gray-900 hover:bg-gray-200",
)}
>
Medium
@@ -287,7 +287,7 @@ function VendorOverviewPageContent({
"rounded-full px-4 py-1 text-sm transition-colors",
formData.serviceCriticality === "HIGH"
? "bg-red-100 text-red-900 ring-2 ring-red-600 ring-offset-2"
: "bg-gray-100 text-gray-900 hover:bg-gray-200"
: "bg-gray-100 text-gray-900 hover:bg-gray-200",
)}
>
High
@@ -315,7 +315,7 @@ function VendorOverviewPageContent({
"rounded-full px-4 py-1 text-sm transition-colors",
formData.riskTier === "CRITICAL"
? "bg-red-100 text-red-900 ring-2 ring-red-600 ring-offset-2"
: "bg-gray-100 text-gray-900 hover:bg-gray-200"
: "bg-gray-100 text-gray-900 hover:bg-gray-200",
)}
>
Critical
@@ -328,7 +328,7 @@ function VendorOverviewPageContent({
"rounded-full px-4 py-1 text-sm transition-colors",
formData.riskTier === "SIGNIFICANT"
? "bg-yellow-100 text-yellow-900 ring-2 ring-yellow-600 ring-offset-2"
: "bg-gray-100 text-gray-900 hover:bg-gray-200"
: "bg-gray-100 text-gray-900 hover:bg-gray-200",
)}
>
Significant
@@ -339,7 +339,7 @@ function VendorOverviewPageContent({
"rounded-full px-4 py-1 text-sm transition-colors",
formData.riskTier === "GENERAL"
? "bg-green-100 text-green-900 ring-2 ring-green-600 ring-offset-2"
: "bg-gray-100 text-gray-900 hover:bg-gray-200"
: "bg-gray-100 text-gray-900 hover:bg-gray-200",
)}
>
General
@@ -420,7 +420,7 @@ function VendorOverviewPageFallback() {
export default function VendorOverviewPage() {
const { vendorId } = useParams();
const [queryRef, loadQuery] = useQueryLoader<VendorOverviewPageQueryType>(
vendorOverviewPageQuery
vendorOverviewPageQuery,
);
useEffect(() => {