rohit/probo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Style

Browse Source 
Signed-off-by: gearnode <bryan@frimin.fr>
This commit is contained in:
gearnode
2025-02-26 12:44:34 +01:00
parent 992410fdde
commit 73247c1ec5
16 changed files with 2183 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/console/src/App.tsx
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"),
);
function App() {

4
apps/console/src/components/NavMain.tsx
View File

@@ -46,7 +46,7 @@ export function NavMain({
// If the item has sub-items, check if any of them match the current path
if (item.items?.length) {
return item.items.some((subItem) =>
location.pathname.startsWith(subItem.url)
location.pathname.startsWith(subItem.url),
);
}
@@ -86,7 +86,7 @@ export function NavMain({
<SidebarMenuSub>
{item.items?.map((subItem) => {
const subItemActive = location.pathname.startsWith(
subItem.url
subItem.url,
);
return (

11
apps/console/src/components/TeamSwitcher.tsx
View File

@@ -40,11 +40,8 @@ export const teamSwitcherFragment = graphql`
}
`;
// Extended type to include plan field until Relay compiler generates the types
type Organization =
TeamSwitcher_organizations$data["organizations"]["edges"][0]["node"] & {
plan?: string;
};
TeamSwitcher_organizations$data["organizations"]["edges"][0]["node"];
export function TeamSwitcher({
organizations,
@@ -60,9 +57,8 @@ export function TeamSwitcher({
useEffect(() => {
if (data.organizations && data.organizations.edges.length > 0) {
// Find the current organization based on the URL parameter
const org = data.organizations.edges.find(
(edge) => edge.node.id === organizationId
(edge) => edge.node.id === organizationId,
);
if (org) {
setCurrentOrganization(org.node);
@@ -70,12 +66,10 @@ export function TeamSwitcher({
}
}, [data.organizations, organizationId]);
// If no organizations or data is still loading
if (!currentOrganization) {
return null;
}
// Convert logoUrl to a React component
const LogoComponent = ({
org,
className,
@@ -90,7 +84,6 @@ export function TeamSwitcher({
};
const handleOrganizationSwitch = (org: Organization) => {
// Navigate to the selected organization
navigate(`/organizations/${org.id}`);
};

10
apps/console/src/layouts/ConsoleLayout.tsx
View File

@@ -57,7 +57,7 @@ function BreadcrumbHome({ children }: { children: React.ReactNode }) {
}
`,
{ organizationId: organizationId! },
{ fetchPolicy: "store-or-network" }
{ fetchPolicy: "store-or-network" },
);
return (
@@ -107,7 +107,7 @@ function BreadcrumbFrameworkOverview() {
}
`,
{ frameworkId: frameworkId! },
{ fetchPolicy: "store-or-network" }
{ fetchPolicy: "store-or-network" },
);
return (
@@ -156,7 +156,7 @@ function BreadcrumbVendorOverview() {
}
`,
{ vendorId: vendorId! },
{ fetchPolicy: "store-or-network" }
{ fetchPolicy: "store-or-network" },
);
return (
@@ -216,7 +216,7 @@ function BreadcrumbPeopleOverview() {
}
`,
{ peopleId: peopleId! },
{ fetchPolicy: "store-or-network" }
{ fetchPolicy: "store-or-network" },
);
return (
@@ -259,7 +259,7 @@ function BreadcrumbControlOverview() {
}
`,
{ frameworkId: frameworkId!, controlId: controlId! },
{ fetchPolicy: "store-or-network" }
{ fetchPolicy: "store-or-network" },
);
return (

6
apps/console/src/pages/CreateOrganizationPage.tsx
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,
"TeamSwitcher_organizations"
"TeamSwitcher_organizations",
),
],
},

12
apps/console/src/pages/CreatePeoplePage.tsx
View File

@@ -89,7 +89,7 @@ function CreatePeoplePageContent() {
e.preventDefault();
const peopleConnectionId = ConnectionHandler.getConnectionID(
organizationId!,
"PeopleListPage_peoples"
"PeopleListPage_peoples",
);
createPeople({
@@ -165,7 +165,7 @@ function CreatePeoplePageContent() {
newEmails[index] = e.target.value;
handleFieldChange(
"additionalEmailAddresses",
newEmails
newEmails,
);
}}
/>
@@ -175,11 +175,11 @@ function CreatePeoplePageContent() {
onClick={() => {
const newEmails =
formData.additionalEmailAddresses.filter(
(_, i) => i !== index
(_, i) => i !== index,
);
handleFieldChange(
"additionalEmailAddresses",
newEmails
newEmails,
);
}}
>
@@ -227,7 +227,7 @@ function CreatePeoplePageContent() {
"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
@@ -239,7 +239,7 @@ function CreatePeoplePageContent() {
"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

4
apps/console/src/pages/FrameworkListPage.tsx
View File

@@ -101,7 +101,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;
@@ -164,7 +164,7 @@ function FrameworkListPageFallback() {
export default function FrameworkListPage() {
const [queryRef, loadQuery] = useQueryLoader<FrameworkListPageQueryType>(
FrameworkListPageQuery
FrameworkListPageQuery,
);
const { organizationId } = useParams();

29
apps/console/src/pages/FrameworkOverviewPage.tsx
View File

@@ -56,14 +56,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]) => ({
@@ -71,11 +74,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 (
@@ -187,7 +190,7 @@ function FrameworkOverviewPageContent({
onClick={() => {
if (control?.id) {
navigate(
`/organizations/${organizationId}/frameworks/${framework.id}/controls/${control.id}`
`/organizations/${organizationId}/frameworks/${framework.id}/controls/${control.id}`,
);
}
}}
@@ -271,7 +274,7 @@ function FrameworkOverviewPageContent({
</div>
</div>
</div>,
document.body
document.body,
)}
</div>
);
@@ -305,7 +308,7 @@ function FrameworkOverviewPageFallback() {
export default function FrameworkOverviewPage() {
const { frameworkId } = useParams();
const [queryRef, loadQuery] = useQueryLoader<FrameworkOverviewPageQueryType>(
FrameworkOverviewPageQuery
FrameworkOverviewPageQuery,
);
useEffect(() => {

4
apps/console/src/pages/OrganizationSelectionPage.tsx
View File

@@ -34,11 +34,11 @@ export default function OrganizationSelectionPage() {
const navigate = useNavigate();
const data = useLazyLoadQuery<OrganizationSelectionPageQuery>(
organizationSelectionQuery,
{}
{},
);
const organizations = data.viewer.organizations.edges.map(
(edge) => edge.node
(edge) => edge.node,
);
useEffect(() => {

8
apps/console/src/pages/PeopleListPage.tsx
View File

@@ -134,7 +134,7 @@ function PeopleListContent({
}) {
const data = usePreloadedQuery<PeopleListPageQueryType>(
peopleListPageQuery,
queryRef
queryRef,
);
const [, setSearchParams] = useSearchParams();
const [, startTransition] = useTransition();
@@ -216,8 +216,8 @@ function PeopleListContent({
{person?.kind === "EMPLOYEE"
? "Employee"
: person?.kind === "CONTRACTOR"
? "Contractor"
: "Vendor"}
? "Contractor"
: "Vendor"}
</Badge>
<Button
variant="ghost"
@@ -227,7 +227,7 @@ function PeopleListContent({
e.preventDefault();
if (
window.confirm(
"Are you sure you want to delete this person?"
"Are you sure you want to delete this person?",
)
) {
deletePeople({

10
apps/console/src/pages/PeopleOverviewPage.tsx
View File

@@ -96,7 +96,7 @@ function PeopleOverviewPageContent({
});
const [commit] = useMutation(updatePeopleMutation);
const [, loadQuery] = useQueryLoader<PeopleOverviewPageQueryType>(
peopleOverviewPageQuery
peopleOverviewPageQuery,
);
const { toast } = useToast();
@@ -198,7 +198,7 @@ function PeopleOverviewPageContent({
onClick={() => {
const newEmails =
formData.additionalEmailAddresses.filter(
(_, i) => i !== index
(_, i) => i !== index,
);
handleFieldChange("additionalEmailAddresses", newEmails);
}}
@@ -243,7 +243,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
@@ -254,7 +254,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
@@ -303,7 +303,7 @@ function PeopleOverviewPageFallback() {
export default function PeopleOverviewPage() {
const { peopleId } = useParams();
const [queryRef, loadQuery] = useQueryLoader<PeopleOverviewPageQueryType>(
peopleOverviewPageQuery
peopleOverviewPageQuery,
);
useEffect(() => {

4
apps/console/src/pages/VendorListPage.tsx
View File

@@ -188,7 +188,7 @@ function VendorListContent({
const { toast } = useToast();
const data = usePreloadedQuery<VendorListPageQueryType>(
vendorListPageQuery,
queryRef
queryRef,
);
const [, setSearchParams] = useSearchParams();
const [, startTransition] = useTransition();
@@ -335,7 +335,7 @@ function VendorListContent({
e.preventDefault(); // Prevent navigation
if (
window.confirm(
"Are you sure you want to delete this vendor?"
"Are you sure you want to delete this vendor?",
)
) {
deleteVendor({

16
apps/console/src/pages/VendorOverviewPage.tsx
View File

@@ -125,7 +125,7 @@ function VendorOverviewPageContent({
});
const [commit] = useMutation(updateVendorMutation);
const [, loadQuery] = useQueryLoader<VendorOverviewPageQueryType>(
vendorOverviewPageQuery
vendorOverviewPageQuery,
);
const { toast } = useToast();
@@ -259,7 +259,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
@@ -272,7 +272,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
@@ -285,7 +285,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
@@ -313,7 +313,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
@@ -326,7 +326,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
@@ -337,7 +337,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
@@ -418,7 +418,7 @@ function VendorOverviewPageFallback() {
export default function VendorOverviewPage() {
const { vendorId } = useParams();
const [queryRef, loadQuery] = useQueryLoader<VendorOverviewPageQueryType>(
vendorOverviewPageQuery
vendorOverviewPageQuery,
);
useEffect(() => {