Add policies

Signed-off-by: gearnode <bryan@frimin.fr>
This commit is contained in:
gearnode
2025-03-04 12:09:22 +01:00
parent eda7044ab7
commit 312474354c
27 changed files with 4882 additions and 27 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,19 +35,24 @@ 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"));
const UpdateFrameworkPage = lazy(() => import("./pages/UpdateFrameworkPage"));
const UpdateControlPage = lazy(() => import("./pages/UpdateControlPage"));
// Policy pages
const PolicyListPage = lazy(() => import("./pages/PolicyListPage"));
const PolicyOverviewPage = lazy(() => import("./pages/PolicyOverviewPage"));
const CreatePolicyPage = lazy(() => import("./pages/CreatePolicyPage"));
const UpdatePolicyPage = lazy(() => import("./pages/UpdatePolicyPage"));
function App() {
return (
@@ -282,6 +287,47 @@ function App() {
</Suspense>
}
/>
{/* Policy Routes */}
<Route
path="policies"
element={
<Suspense>
<ErrorBoundaryWithLocation>
<PolicyListPage />
</ErrorBoundaryWithLocation>
</Suspense>
}
/>
<Route
path="policies/create"
element={
<Suspense>
<ErrorBoundaryWithLocation>
<CreatePolicyPage />
</ErrorBoundaryWithLocation>
</Suspense>
}
/>
<Route
path="policies/:policyId"
element={
<Suspense>
<ErrorBoundaryWithLocation>
<PolicyOverviewPage />
</ErrorBoundaryWithLocation>
</Suspense>
}
/>
<Route
path="policies/:policyId/update"
element={
<Suspense>
<ErrorBoundaryWithLocation>
<UpdatePolicyPage />
</ErrorBoundaryWithLocation>
</Suspense>
}
/>
<Route
path="settings"
element={

View File

@@ -9,6 +9,7 @@ import {
Send,
Settings,
Building,
FileText,
} from "lucide-react";
import {
graphql,
@@ -64,6 +65,13 @@ function getNavItems(organizationId?: string) {
]
: [],
},
{
title: "Policies",
url: organizationId
? `/organizations/${organizationId}/policies`
: undefined,
icon: FileText,
},
{
title: "Settings",
url: organizationId

View File

@@ -24,6 +24,8 @@ import { ConsoleLayoutBreadcrumbControlOverviewQuery } from "./__generated__/Con
import { ConsoleLayoutOrganizationQuery } from "./__generated__/ConsoleLayoutOrganizationQuery.graphql";
import { ConsoleLayoutBreadcrumbCreateControlQuery } from "./__generated__/ConsoleLayoutBreadcrumbCreateControlQuery.graphql";
import { ConsoleLayoutBreadcrumbUpdateFrameworkQuery } from "./__generated__/ConsoleLayoutBreadcrumbUpdateFrameworkQuery.graphql";
import { ConsoleLayoutBreadcrumbPolicyOverviewQuery } from "./__generated__/ConsoleLayoutBreadcrumbPolicyOverviewQuery.graphql";
import { ConsoleLayoutBreadcrumbUpdatePolicyQuery } from "./__generated__/ConsoleLayoutBreadcrumbUpdatePolicyQuery.graphql";
function BreadcrumbHome({ children }: { children: React.ReactNode }) {
const { organizationId } = useParams();
@@ -58,7 +60,7 @@ function BreadcrumbHome({ children }: { children: React.ReactNode }) {
}
`,
{ organizationId: organizationId! },
{ fetchPolicy: "store-or-network" },
{ fetchPolicy: "store-or-network" }
);
return (
@@ -118,7 +120,7 @@ function BreadcrumbFrameworkOverview() {
}
}
`,
{ frameworkId: frameworkId! },
{ frameworkId: frameworkId! }
);
return (
@@ -152,7 +154,7 @@ function BreadcrumbUpdateFramework() {
}
`,
{ frameworkId: frameworkId! },
{ fetchPolicy: "store-or-network" },
{ fetchPolicy: "store-or-network" }
);
return (
@@ -209,7 +211,7 @@ function BreadcrumbVendorOverview() {
}
`,
{ vendorId: vendorId! },
{ fetchPolicy: "store-or-network" },
{ fetchPolicy: "store-or-network" }
);
return (
@@ -269,7 +271,7 @@ function BreadcrumbPeopleOverview() {
}
`,
{ peopleId: peopleId! },
{ fetchPolicy: "store-or-network" },
{ fetchPolicy: "store-or-network" }
);
return (
@@ -302,7 +304,7 @@ function BreadcrumbControlOverview() {
}
}
`,
{ controlId: controlId! },
{ controlId: controlId! }
);
return (
@@ -333,7 +335,7 @@ function BreadcrumbCreateControl() {
}
}
`,
{ frameworkId: frameworkId! },
{ frameworkId: frameworkId! }
);
return (
@@ -356,6 +358,104 @@ function BreadcrumbCreateControl() {
);
}
function BreadcrumbPolicyList() {
const { organizationId } = useParams();
return (
<>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbLink asChild>
<Link to={`/organizations/${organizationId}/policies`}>Policies</Link>
</BreadcrumbLink>
</BreadcrumbItem>
<Outlet />
</>
);
}
function BreadcrumbCreatePolicy() {
return (
<>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbPage>Create Policy</BreadcrumbPage>
</BreadcrumbItem>
</>
);
}
function BreadcrumbPolicyOverview() {
const { organizationId, policyId } = useParams();
const data = useLazyLoadQuery<ConsoleLayoutBreadcrumbPolicyOverviewQuery>(
graphql`
query ConsoleLayoutBreadcrumbPolicyOverviewQuery($policyId: ID!) {
policy: node(id: $policyId) {
id
... on Policy {
name
}
}
}
`,
{ policyId: policyId! },
{ fetchPolicy: "store-or-network" }
);
return (
<>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbLink asChild>
<Link to={`/organizations/${organizationId}/policies/${policyId}`}>
{data.policy?.name}
</Link>
</BreadcrumbLink>
</BreadcrumbItem>
<Outlet />
</>
);
}
function BreadcrumbUpdatePolicy() {
const { organizationId, policyId } = useParams();
const data = useLazyLoadQuery<ConsoleLayoutBreadcrumbUpdatePolicyQuery>(
graphql`
query ConsoleLayoutBreadcrumbUpdatePolicyQuery($policyId: ID!) {
policy: node(id: $policyId) {
id
... on Policy {
name
}
}
}
`,
{ policyId: policyId! },
{ fetchPolicy: "store-or-network" }
);
return (
<>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbLink
asChild
className="max-w-[160px] truncate"
aria-label={data.policy?.name}
>
<Link to={`/organizations/${organizationId}/policies/${policyId}`}>
{data.policy?.name}
</Link>
</BreadcrumbLink>
</BreadcrumbItem>
<BreadcrumbSeparator />
<BreadcrumbItem>
<BreadcrumbPage>Update</BreadcrumbPage>
</BreadcrumbItem>
<Outlet />
</>
);
}
export default function ConsoleLayout() {
const { organizationId } = useParams();
const showBreadcrumb = !!organizationId;
@@ -410,6 +510,17 @@ export default function ConsoleLayout() {
element={<BreadcrumbVendorOverview />}
/>
</Route>
<Route path="policies" element={<BreadcrumbPolicyList />}>
<Route
path=":policyId"
element={<BreadcrumbPolicyOverview />}
/>
<Route
path=":policyId/update"
element={<BreadcrumbUpdatePolicy />}
/>
<Route path="create" element={<BreadcrumbCreatePolicy />} />
</Route>
</Routes>
)}
</BreadcrumbHome>

View File

@@ -0,0 +1,127 @@
/**
* @generated SignedSource<<03812f2d66d34ef3636bc7890059f4cf>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type ConsoleLayoutBreadcrumbPolicyOverviewQuery$variables = {
policyId: string;
};
export type ConsoleLayoutBreadcrumbPolicyOverviewQuery$data = {
readonly policy: {
readonly id: string;
readonly name?: string;
};
};
export type ConsoleLayoutBreadcrumbPolicyOverviewQuery = {
response: ConsoleLayoutBreadcrumbPolicyOverviewQuery$data;
variables: ConsoleLayoutBreadcrumbPolicyOverviewQuery$variables;
};
const node: ConcreteRequest = (function(){
var v0 = [
{
"defaultValue": null,
"kind": "LocalArgument",
"name": "policyId"
}
],
v1 = [
{
"kind": "Variable",
"name": "id",
"variableName": "policyId"
}
],
v2 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
},
v3 = {
"kind": "InlineFragment",
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "name",
"storageKey": null
}
],
"type": "Policy",
"abstractKey": null
};
return {
"fragment": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Fragment",
"metadata": null,
"name": "ConsoleLayoutBreadcrumbPolicyOverviewQuery",
"selections": [
{
"alias": "policy",
"args": (v1/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
(v2/*: any*/),
(v3/*: any*/)
],
"storageKey": null
}
],
"type": "Query",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Operation",
"name": "ConsoleLayoutBreadcrumbPolicyOverviewQuery",
"selections": [
{
"alias": "policy",
"args": (v1/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "__typename",
"storageKey": null
},
(v2/*: any*/),
(v3/*: any*/)
],
"storageKey": null
}
]
},
"params": {
"cacheID": "2c38760f04efaf9b41d6b2abb17c2074",
"id": null,
"metadata": {},
"name": "ConsoleLayoutBreadcrumbPolicyOverviewQuery",
"operationKind": "query",
"text": "query ConsoleLayoutBreadcrumbPolicyOverviewQuery(\n $policyId: ID!\n) {\n policy: node(id: $policyId) {\n __typename\n id\n ... on Policy {\n name\n }\n }\n}\n"
}
};
})();
(node as any).hash = "f2a356a6aa9b98ca13dde3b82e2e868a";
export default node;

View File

@@ -0,0 +1,127 @@
/**
* @generated SignedSource<<7fd05943b12b7927bddcb4ee8a1cdd76>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type ConsoleLayoutBreadcrumbUpdatePolicyQuery$variables = {
policyId: string;
};
export type ConsoleLayoutBreadcrumbUpdatePolicyQuery$data = {
readonly policy: {
readonly id: string;
readonly name?: string;
};
};
export type ConsoleLayoutBreadcrumbUpdatePolicyQuery = {
response: ConsoleLayoutBreadcrumbUpdatePolicyQuery$data;
variables: ConsoleLayoutBreadcrumbUpdatePolicyQuery$variables;
};
const node: ConcreteRequest = (function(){
var v0 = [
{
"defaultValue": null,
"kind": "LocalArgument",
"name": "policyId"
}
],
v1 = [
{
"kind": "Variable",
"name": "id",
"variableName": "policyId"
}
],
v2 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
},
v3 = {
"kind": "InlineFragment",
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "name",
"storageKey": null
}
],
"type": "Policy",
"abstractKey": null
};
return {
"fragment": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Fragment",
"metadata": null,
"name": "ConsoleLayoutBreadcrumbUpdatePolicyQuery",
"selections": [
{
"alias": "policy",
"args": (v1/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
(v2/*: any*/),
(v3/*: any*/)
],
"storageKey": null
}
],
"type": "Query",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Operation",
"name": "ConsoleLayoutBreadcrumbUpdatePolicyQuery",
"selections": [
{
"alias": "policy",
"args": (v1/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "__typename",
"storageKey": null
},
(v2/*: any*/),
(v3/*: any*/)
],
"storageKey": null
}
]
},
"params": {
"cacheID": "6b895165c1104f2caf67bf4ded9a795d",
"id": null,
"metadata": {},
"name": "ConsoleLayoutBreadcrumbUpdatePolicyQuery",
"operationKind": "query",
"text": "query ConsoleLayoutBreadcrumbUpdatePolicyQuery(\n $policyId: ID!\n) {\n policy: node(id: $policyId) {\n __typename\n id\n ... on Policy {\n name\n }\n }\n}\n"
}
};
})();
(node as any).hash = "ee8e83ba02f1545ad73fe5d9742136ff";
export default node;

View File

@@ -186,7 +186,7 @@ function ControlOverviewPageContent({
}) {
const data = usePreloadedQuery<ControlOverviewPageQueryType>(
controlOverviewPageQuery,
queryRef,
queryRef
);
const { toast } = useToast();
const { organizationId, frameworkId, controlId } = useParams();
@@ -194,7 +194,7 @@ function ControlOverviewPageContent({
const environment = useRelayEnvironment();
const [updateTaskState] =
useMutation<ControlOverviewPageUpdateTaskStateMutationType>(
updateTaskStateMutation,
updateTaskStateMutation
);
const [createTask] =
useMutation<ControlOverviewPageCreateTaskMutationType>(createTaskMutation);
@@ -202,11 +202,11 @@ function ControlOverviewPageContent({
useMutation<ControlOverviewPageDeleteTaskMutationType>(deleteTaskMutation);
const [uploadEvidence] =
useMutation<ControlOverviewPageUploadEvidenceMutationType>(
uploadEvidenceMutation,
uploadEvidenceMutation
);
const [deleteEvidence] =
useMutation<ControlOverviewPageDeleteEvidenceMutationType>(
deleteEvidenceMutation,
deleteEvidenceMutation
);
const [isCreateTaskOpen, setIsCreateTaskOpen] = useState(false);
@@ -228,7 +228,7 @@ function ControlOverviewPageContent({
const fileInputRef = useRef<HTMLInputElement>(null);
const [draggedOverTaskId, setDraggedOverTaskId] = useState<string | null>(
null,
null
);
const [uploadingTaskId, setUploadingTaskId] = useState<string | null>(null);
const [isDraggingFile, setIsDraggingFile] = useState(false);
@@ -265,7 +265,7 @@ function ControlOverviewPageContent({
}
return null;
},
[tasks],
[tasks]
);
useEffect(() => {
@@ -424,7 +424,7 @@ function ControlOverviewPageContent({
const handleEditControl = () => {
navigate(
`/organizations/${organizationId}/frameworks/${frameworkId}/controls/${controlId}/update`,
`/organizations/${organizationId}/frameworks/${frameworkId}/controls/${controlId}/update`
);
};
@@ -630,7 +630,7 @@ function ControlOverviewPageContent({
const handleDeleteEvidence = (
evidenceId: string,
filename: string,
taskId: string,
taskId: string
) => {
setEvidenceToDelete({ id: evidenceId, filename, taskId });
setIsDeleteEvidenceOpen(true);
@@ -640,7 +640,7 @@ function ControlOverviewPageContent({
if (!evidenceToDelete) return;
const evidenceConnectionId = getEvidenceConnectionId(
evidenceToDelete.taskId,
evidenceToDelete.taskId
);
deleteEvidence({
@@ -998,10 +998,10 @@ function ControlOverviewPageContent({
handleDeleteEvidence(
evidence.id,
evidence.filename,
task.id,
task.id
);
}}
className="p-1 rounded-full hover:bg-gray-100 hover:bg-red-50 hover:text-red-600"
className="p-1 rounded-full hover:bg-gray-10 hover:text-red-600"
title="Delete Evidence"
>
<Trash2 className="w-4 h-4 text-gray-600 hover:text-red-600" />
@@ -1238,7 +1238,7 @@ function ControlOverviewPageFallback() {
export default function ControlOverviewPage() {
const { controlId } = useParams();
const [queryRef, loadQuery] = useQueryLoader<ControlOverviewPageQueryType>(
controlOverviewPageQuery,
controlOverviewPageQuery
);
useEffect(() => {

View File

@@ -0,0 +1,194 @@
import { useState } from "react";
import { useNavigate, useParams } from "react-router";
import { ConnectionHandler, graphql, useMutation } from "react-relay";
import { Helmet } from "react-helmet-async";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Textarea } from "@/components/ui/textarea";
import { useToast } from "@/hooks/use-toast";
import { FileText } from "lucide-react";
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
import type { CreatePolicyPageMutation } from "./__generated__/CreatePolicyPageMutation.graphql";
const CreatePolicyMutation = graphql`
mutation CreatePolicyPageMutation(
$input: CreatePolicyInput!
$connections: [ID!]!
) {
createPolicy(input: $input) {
policyEdge @prependEdge(connections: $connections) {
node {
id
name
content
status
}
}
}
}
`;
export default function CreatePolicyPage() {
const navigate = useNavigate();
const { organizationId } = useParams();
const [name, setName] = useState("");
const [content, setContent] = useState("");
const [status, setStatus] = useState<"DRAFT" | "ACTIVE">("DRAFT");
const [isSubmitting, setIsSubmitting] = useState(false);
const { toast } = useToast();
const [commitMutation] =
useMutation<CreatePolicyPageMutation>(CreatePolicyMutation);
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
setIsSubmitting(true);
const input = {
organizationId: organizationId!,
name,
content,
status,
};
commitMutation({
variables: {
input,
connections: [
ConnectionHandler.getConnectionID(
organizationId!,
"PolicyListPage_policies"
),
],
},
onCompleted: (response, errors) => {
setIsSubmitting(false);
if (errors) {
console.error("Error creating policy:", errors);
toast({
title: "Error",
description: "Failed to create policy. Please try again.",
variant: "destructive",
});
return;
}
toast({
title: "Success",
description: "Policy created successfully!",
});
navigate(
`/organizations/${organizationId}/policies/${response.createPolicy.policyEdge.node.id}`
);
},
onError: (error) => {
setIsSubmitting(false);
console.error("Error creating policy:", error);
toast({
title: "Error",
description: "Failed to create policy. Please try again.",
variant: "destructive",
});
},
});
};
return (
<>
<Helmet>
<title>Create Policy - Probo Console</title>
</Helmet>
<div className="container mx-auto py-6">
<div className="flex items-center mb-6">
<div className="mr-4">
<div className="flex h-12 w-12 items-center justify-center rounded-lg bg-primary/10">
<FileText className="h-6 w-6 text-primary" />
</div>
</div>
<div>
<h1 className="text-2xl font-bold">Create Policy</h1>
<p className="text-muted-foreground">
Create a new policy for your organization
</p>
</div>
</div>
<form onSubmit={handleSubmit}>
<div className="grid gap-6">
<Card>
<CardHeader>
<CardTitle>Policy Information</CardTitle>
</CardHeader>
<CardContent className="space-y-4">
<div className="space-y-2">
<Label htmlFor="name">Policy Name</Label>
<Input
id="name"
placeholder="Enter policy name"
value={name}
onChange={(e) => setName(e.target.value)}
required
/>
</div>
<div className="space-y-2">
<Label htmlFor="content">Policy Content</Label>
<Textarea
id="content"
placeholder="Enter policy content"
value={content}
onChange={(e) => setContent(e.target.value)}
className="min-h-[200px]"
required
/>
</div>
<div className="space-y-2">
<Label>Status</Label>
<RadioGroup
value={status}
onValueChange={(value: "DRAFT" | "ACTIVE") =>
setStatus(value)
}
className="flex space-x-4"
>
<div className="flex items-center space-x-2">
<RadioGroupItem value="DRAFT" id="draft" />
<Label htmlFor="draft" className="cursor-pointer">
Draft
</Label>
</div>
<div className="flex items-center space-x-2">
<RadioGroupItem value="ACTIVE" id="active" />
<Label htmlFor="active" className="cursor-pointer">
Active
</Label>
</div>
</RadioGroup>
</div>
</CardContent>
</Card>
<div className="flex justify-end gap-4">
<Button
type="button"
variant="outline"
onClick={() =>
navigate(`/organizations/${organizationId}/policies`)
}
>
Cancel
</Button>
<Button type="submit" disabled={isSubmitting}>
{isSubmitting ? "Creating..." : "Create Policy"}
</Button>
</div>
</div>
</form>
</div>
</>
);
}

View File

@@ -0,0 +1,179 @@
import { Suspense, useEffect } from "react";
import {
graphql,
PreloadedQuery,
usePreloadedQuery,
useQueryLoader,
} from "react-relay";
import { Card, CardContent } from "@/components/ui/card";
import { Link, useParams } from "react-router";
import { Helmet } from "react-helmet-async";
import { Button } from "@/components/ui/button";
import { Plus, FileText } from "lucide-react";
import type { PolicyListPageQuery as PolicyListPageQueryType } from "./__generated__/PolicyListPageQuery.graphql";
const PolicyListPageQuery = graphql`
query PolicyListPageQuery($organizationId: ID!) {
organization: node(id: $organizationId) {
... on Organization {
policies(first: 25) @connection(key: "PolicyListPage_policies") {
edges {
node {
id
name
createdAt
updatedAt
status
}
}
}
}
}
}
`;
function PolicyCard({
title,
icon,
status,
}: {
title: string;
icon: React.ReactNode;
status?: string;
}) {
return (
<Card className="relative overflow-hidden border bg-card p-6">
<div className="flex flex-col gap-4">
<div className="size-16">{icon}</div>
<div className="space-y-2">
<div className="flex items-center gap-2">
<h3 className="font-semibold">{title}</h3>
{status && (
<span
className={`rounded-full px-2 py-0.5 text-xs ${
status === "ACTIVE"
? "bg-green-100 text-green-700"
: status === "DRAFT"
? "bg-yellow-100 text-yellow-700"
: "bg-gray-100 text-gray-700"
}`}
>
{status === "ACTIVE"
? "Active"
: status === "DRAFT"
? "Draft"
: status}
</span>
)}
</div>
</div>
</div>
</Card>
);
}
function PolicyListPageContent({
queryRef,
}: {
queryRef: PreloadedQuery<PolicyListPageQueryType>;
}) {
const data = usePreloadedQuery<PolicyListPageQueryType>(
PolicyListPageQuery,
queryRef
);
const { organizationId } = useParams();
const policies =
data.organization.policies?.edges.map((edge) => edge?.node) ?? [];
return (
<>
<Helmet>
<title>Policies - Probo</title>
</Helmet>
<div className="container mx-auto py-6">
<div className="flex justify-between items-center mb-6">
<div>
<h1 className="text-2xl font-bold">Policies</h1>
<p className="text-muted-foreground">
Manage your organization{"'"}s policies
</p>
</div>
<Button asChild>
<Link to={`/organizations/${organizationId}/policies/create`}>
<Plus className="mr-2 h-4 w-4" />
Create Policy
</Link>
</Button>
</div>
<div className="space-y-6">
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
{policies.map((policy) => (
<Link
key={policy.id}
to={`/organizations/${organizationId}/policies/${policy.id}`}
>
<PolicyCard
title={policy.name}
icon={
<div className="flex size-full items-center justify-center rounded-full bg-blue-100">
<FileText className="h-8 w-8 text-blue-900" />
</div>
}
status={policy.status}
/>
</Link>
))}
</div>
</div>
</div>
</>
);
}
function PolicyListPageFallback() {
return (
<div className="space-y-6">
<div>
<div className="h-8 w-48 bg-muted animate-pulse rounded" />
<div className="h-4 w-96 bg-muted animate-pulse rounded mt-1" />
</div>
<div className="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
{[1, 2, 3].map((i) => (
<Card key={i} className="bg-card/50">
<CardContent className="p-6">
<div className="relative mb-6">
<div className="bg-muted w-24 h-24 rounded-full animate-pulse mb-4" />
<div className="h-6 w-48 bg-muted animate-pulse rounded mb-2" />
<div className="h-20 w-full bg-muted animate-pulse rounded" />
</div>
<div className="h-4 w-32 bg-muted animate-pulse rounded" />
</CardContent>
</Card>
))}
</div>
</div>
);
}
export default function PolicyListPage() {
const [queryRef, loadQuery] =
useQueryLoader<PolicyListPageQueryType>(PolicyListPageQuery);
const { organizationId } = useParams();
useEffect(() => {
loadQuery({ organizationId: organizationId! });
}, [loadQuery, organizationId]);
return (
<>
<Helmet>
<title>Policies - Probo Console</title>
</Helmet>
<Suspense fallback={<PolicyListPageFallback />}>
{queryRef && <PolicyListPageContent queryRef={queryRef} />}
</Suspense>
</>
);
}

View File

@@ -0,0 +1,230 @@
import { Suspense, useEffect } from "react";
import { useParams, Link } from "react-router";
import {
graphql,
PreloadedQuery,
usePreloadedQuery,
useQueryLoader,
} from "react-relay";
import { Edit } from "lucide-react";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Badge } from "@/components/ui/badge";
import type { PolicyOverviewPageQuery as PolicyOverviewPageQueryType } from "./__generated__/PolicyOverviewPageQuery.graphql";
import { Helmet } from "react-helmet-async";
const PolicyOverviewPageQuery = graphql`
query PolicyOverviewPageQuery($policyId: ID!) {
node(id: $policyId) {
id
... on Policy {
name
content
createdAt
updatedAt
status
}
}
}
`;
function PolicyOverviewPageContent({
queryRef,
}: {
queryRef: PreloadedQuery<PolicyOverviewPageQueryType>;
}) {
const data = usePreloadedQuery(PolicyOverviewPageQuery, queryRef);
const policy = data.node;
const { organizationId } = useParams();
const getStatusBadge = (status: string | undefined) => {
if (!status) return null;
switch (status) {
case "ACTIVE":
return (
<Badge className="bg-green-100 text-green-700 hover:bg-green-200">
Active
</Badge>
);
case "DRAFT":
return (
<Badge className="bg-yellow-100 text-yellow-700 hover:bg-yellow-200">
Draft
</Badge>
);
default:
return (
<Badge className="bg-gray-100 text-gray-700 hover:bg-gray-200">
{status}
</Badge>
);
}
};
const formatDate = (dateString: string | undefined) => {
if (!dateString) return "N/A";
const date = new Date(dateString);
return new Intl.DateTimeFormat("en-US", {
year: "numeric",
month: "long",
day: "numeric",
hour: "2-digit",
minute: "2-digit",
}).format(date);
};
return (
<div className="min-h-screen bg-background p-6 space-y-6">
<div className="space-y-4 mb-8">
<div className="flex justify-between items-center">
<div>
<h2 className="text-2xl font-semibold mb-1">{policy.name}</h2>
</div>
<div className="flex gap-2">
<Button variant="outline" asChild>
<Link
to={`/organizations/${organizationId}/policies/${policy.id}/update`}
>
<Edit className="mr-2 h-4 w-4" />
Edit Policy
</Link>
</Button>
</div>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
<div className="md:col-span-2">
<Card>
<CardHeader>
<CardTitle>Policy Content</CardTitle>
</CardHeader>
<CardContent>
<div className="prose max-w-none">
<div
dangerouslySetInnerHTML={{ __html: policy.content || "" }}
/>
</div>
</CardContent>
</Card>
</div>
<div>
<Card>
<CardHeader>
<CardTitle>Policy Details</CardTitle>
</CardHeader>
<CardContent>
<div className="space-y-4">
<div>
<h4 className="text-sm font-medium text-muted-foreground mb-1">
Status
</h4>
<div>{getStatusBadge(policy.status)}</div>
</div>
<div>
<h4 className="text-sm font-medium text-muted-foreground mb-1">
Created
</h4>
<p>{formatDate(policy.createdAt)}</p>
</div>
<div>
<h4 className="text-sm font-medium text-muted-foreground mb-1">
Last Updated
</h4>
<p>{formatDate(policy.updatedAt)}</p>
</div>
</div>
</CardContent>
</Card>
</div>
</div>
</div>
);
}
function PolicyOverviewPageFallback() {
return (
<div className="min-h-screen bg-background p-6 space-y-6">
<div className="space-y-4 mb-8">
<div className="flex justify-between items-center">
<div>
<div className="h-8 w-48 bg-muted animate-pulse rounded mb-2" />
<div className="h-4 w-96 bg-muted animate-pulse rounded" />
</div>
<div>
<div className="h-10 w-32 bg-muted animate-pulse rounded" />
</div>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-3 gap-6">
<div className="md:col-span-2">
<Card>
<CardHeader>
<div className="h-6 w-32 bg-muted animate-pulse rounded" />
</CardHeader>
<CardContent>
<div className="space-y-4">
<div className="h-4 w-full bg-muted animate-pulse rounded" />
<div className="h-4 w-full bg-muted animate-pulse rounded" />
<div className="h-4 w-3/4 bg-muted animate-pulse rounded" />
<div className="h-4 w-full bg-muted animate-pulse rounded" />
<div className="h-4 w-5/6 bg-muted animate-pulse rounded" />
</div>
</CardContent>
</Card>
</div>
<div>
<Card>
<CardHeader>
<div className="h-6 w-32 bg-muted animate-pulse rounded" />
</CardHeader>
<CardContent>
<div className="space-y-4">
<div>
<div className="h-4 w-16 bg-muted animate-pulse rounded mb-2" />
<div className="h-6 w-24 bg-muted animate-pulse rounded" />
</div>
<div>
<div className="h-4 w-16 bg-muted animate-pulse rounded mb-2" />
<div className="h-6 w-48 bg-muted animate-pulse rounded" />
</div>
<div>
<div className="h-4 w-24 bg-muted animate-pulse rounded mb-2" />
<div className="h-6 w-48 bg-muted animate-pulse rounded" />
</div>
</div>
</CardContent>
</Card>
</div>
</div>
</div>
);
}
export default function PolicyOverviewPage() {
const [queryRef, loadQuery] = useQueryLoader<PolicyOverviewPageQueryType>(
PolicyOverviewPageQuery
);
const { policyId } = useParams();
useEffect(() => {
loadQuery({ policyId: policyId! });
}, [loadQuery, policyId]);
return (
<>
<Helmet>
<title>Policy Details - Probo Console</title>
</Helmet>
<Suspense fallback={<PolicyOverviewPageFallback />}>
{queryRef && <PolicyOverviewPageContent queryRef={queryRef} />}
</Suspense>
</>
);
}

View File

@@ -0,0 +1,270 @@
import { useState, useEffect } from "react";
import { useNavigate, useParams } from "react-router";
import {
graphql,
useMutation,
usePreloadedQuery,
useQueryLoader,
PreloadedQuery,
} from "react-relay";
import { Helmet } from "react-helmet-async";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import { Textarea } from "@/components/ui/textarea";
import { toast } from "@/hooks/use-toast";
import { FileText } from "lucide-react";
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
import { Suspense } from "react";
import type { UpdatePolicyPageQuery as UpdatePolicyPageQueryType } from "./__generated__/UpdatePolicyPageQuery.graphql";
import type { UpdatePolicyPageMutation as UpdatePolicyPageMutationType } from "./__generated__/UpdatePolicyPageMutation.graphql";
const UpdatePolicyPageQuery = graphql`
query UpdatePolicyPageQuery($policyId: ID!) {
node(id: $policyId) {
id
... on Policy {
name
content
status
version
}
}
}
`;
const UpdatePolicyMutation = graphql`
mutation UpdatePolicyPageMutation($input: UpdatePolicyInput!) {
updatePolicy(input: $input) {
policy {
id
name
content
status
}
}
}
`;
function UpdatePolicyPageContent({
queryRef,
}: {
queryRef: PreloadedQuery<UpdatePolicyPageQueryType>;
}) {
const navigate = useNavigate();
const { organizationId, policyId } = useParams();
const data = usePreloadedQuery<UpdatePolicyPageQueryType>(
UpdatePolicyPageQuery,
queryRef
);
const [name, setName] = useState(data.node.name);
const [content, setContent] = useState(data.node.content);
const [status, setStatus] = useState(data.node.status);
const [isSubmitting, setIsSubmitting] = useState(false);
const [commitMutation] =
useMutation<UpdatePolicyPageMutationType>(UpdatePolicyMutation);
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
setIsSubmitting(true);
commitMutation({
variables: {
input: {
id: data.node.id,
name,
content,
status,
expectedVersion: data.node.version!,
},
},
onCompleted: (response, errors) => {
setIsSubmitting(false);
if (errors) {
console.error("Error updating policy:", errors);
toast({
title: "Error",
description: "Failed to update policy. Please try again.",
variant: "destructive",
});
return;
}
toast({
title: "Success",
description: "Policy updated successfully!",
});
navigate(
`/organizations/${organizationId}/policies/${response.updatePolicy.policy.id}`
);
},
onError: (error) => {
setIsSubmitting(false);
console.error("Error updating policy:", error);
toast({
title: "Error",
description: "Failed to update policy. Please try again.",
variant: "destructive",
});
},
});
};
return (
<>
<Helmet>
<title>Update Policy - Probo Console</title>
</Helmet>
<div className="container mx-auto py-6">
<div className="flex items-center mb-6">
<div className="mr-4">
<div className="flex h-12 w-12 items-center justify-center rounded-lg bg-primary/10">
<FileText className="h-6 w-6 text-primary" />
</div>
</div>
<div>
<h1 className="text-2xl font-bold">Update Policy</h1>
<p className="text-muted-foreground">Update an existing policy</p>
</div>
</div>
<form onSubmit={handleSubmit}>
<div className="grid gap-6">
<Card>
<CardHeader>
<CardTitle>Policy Information</CardTitle>
</CardHeader>
<CardContent className="space-y-4">
<div className="space-y-2">
<Label htmlFor="name">Policy Name</Label>
<Input
id="name"
placeholder="Enter policy name"
value={name}
onChange={(e) => setName(e.target.value)}
required
/>
</div>
<div className="space-y-2">
<Label htmlFor="content">Policy Content</Label>
<Textarea
id="content"
placeholder="Enter policy content"
value={content}
onChange={(e) => setContent(e.target.value)}
className="min-h-[200px]"
required
/>
</div>
<div className="space-y-2">
<Label>Status</Label>
<RadioGroup
value={status}
onValueChange={(value) =>
setStatus(value as "DRAFT" | "ACTIVE")
}
className="flex space-x-4"
>
<div className="flex items-center space-x-2">
<RadioGroupItem value="DRAFT" id="draft" />
<Label htmlFor="draft" className="cursor-pointer">
Draft
</Label>
</div>
<div className="flex items-center space-x-2">
<RadioGroupItem value="ACTIVE" id="active" />
<Label htmlFor="active" className="cursor-pointer">
Active
</Label>
</div>
</RadioGroup>
</div>
</CardContent>
</Card>
<div className="flex justify-end gap-4">
<Button
type="button"
variant="outline"
onClick={() =>
navigate(
`/organizations/${organizationId}/policies/${policyId}`
)
}
>
Cancel
</Button>
<Button type="submit" disabled={isSubmitting}>
{isSubmitting ? "Updating..." : "Update Policy"}
</Button>
</div>
</div>
</form>
</div>
</>
);
}
function UpdatePolicyPageFallback() {
return (
<div className="container mx-auto py-6">
<div className="flex items-center mb-6">
<div className="mr-4">
<div className="h-12 w-12 bg-muted animate-pulse rounded-lg" />
</div>
<div>
<div className="h-8 w-48 bg-muted animate-pulse rounded mb-2" />
<div className="h-4 w-64 bg-muted animate-pulse rounded" />
</div>
</div>
<div className="grid gap-6">
<Card>
<CardHeader>
<div className="h-6 w-32 bg-muted animate-pulse rounded" />
</CardHeader>
<CardContent className="space-y-4">
{[1, 2, 3, 4].map((i) => (
<div key={i} className="space-y-2">
<div className="h-4 w-24 bg-muted animate-pulse rounded" />
<div className="h-10 w-full bg-muted animate-pulse rounded" />
</div>
))}
</CardContent>
</Card>
</div>
</div>
);
}
export default function UpdatePolicyPage() {
const [queryRef, loadQuery] = useQueryLoader<UpdatePolicyPageQueryType>(
UpdatePolicyPageQuery
);
const { policyId } = useParams();
useEffect(() => {
loadQuery({ policyId: policyId! });
}, [loadQuery, policyId]);
if (!queryRef) {
return <UpdatePolicyPageFallback />;
}
return (
<>
<Helmet>
<title>Update Policy - Probo Console</title>
</Helmet>
<Suspense fallback={<UpdatePolicyPageFallback />}>
<UpdatePolicyPageContent queryRef={queryRef} />
</Suspense>
</>
);
}

View File

@@ -0,0 +1,186 @@
/**
* @generated SignedSource<<c20ef485780e9d9544f536609ae060af>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type PolicyStatus = "ACTIVE" | "DRAFT";
export type CreatePolicyInput = {
content: string;
name: string;
organizationId: string;
status: PolicyStatus;
};
export type CreatePolicyPageMutation$variables = {
connections: ReadonlyArray<string>;
input: CreatePolicyInput;
};
export type CreatePolicyPageMutation$data = {
readonly createPolicy: {
readonly policyEdge: {
readonly node: {
readonly content: string;
readonly id: string;
readonly name: string;
readonly status: PolicyStatus;
};
};
};
};
export type CreatePolicyPageMutation = {
response: CreatePolicyPageMutation$data;
variables: CreatePolicyPageMutation$variables;
};
const node: ConcreteRequest = (function(){
var v0 = {
"defaultValue": null,
"kind": "LocalArgument",
"name": "connections"
},
v1 = {
"defaultValue": null,
"kind": "LocalArgument",
"name": "input"
},
v2 = [
{
"kind": "Variable",
"name": "input",
"variableName": "input"
}
],
v3 = {
"alias": null,
"args": null,
"concreteType": "PolicyEdge",
"kind": "LinkedField",
"name": "policyEdge",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"concreteType": "Policy",
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "name",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "content",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "status",
"storageKey": null
}
],
"storageKey": null
}
],
"storageKey": null
};
return {
"fragment": {
"argumentDefinitions": [
(v0/*: any*/),
(v1/*: any*/)
],
"kind": "Fragment",
"metadata": null,
"name": "CreatePolicyPageMutation",
"selections": [
{
"alias": null,
"args": (v2/*: any*/),
"concreteType": "CreatePolicyPayload",
"kind": "LinkedField",
"name": "createPolicy",
"plural": false,
"selections": [
(v3/*: any*/)
],
"storageKey": null
}
],
"type": "Mutation",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": [
(v1/*: any*/),
(v0/*: any*/)
],
"kind": "Operation",
"name": "CreatePolicyPageMutation",
"selections": [
{
"alias": null,
"args": (v2/*: any*/),
"concreteType": "CreatePolicyPayload",
"kind": "LinkedField",
"name": "createPolicy",
"plural": false,
"selections": [
(v3/*: any*/),
{
"alias": null,
"args": null,
"filters": null,
"handle": "prependEdge",
"key": "",
"kind": "LinkedHandle",
"name": "policyEdge",
"handleArgs": [
{
"kind": "Variable",
"name": "connections",
"variableName": "connections"
}
]
}
],
"storageKey": null
}
]
},
"params": {
"cacheID": "f9d97eecb99b47365557e372c724af41",
"id": null,
"metadata": {},
"name": "CreatePolicyPageMutation",
"operationKind": "mutation",
"text": "mutation CreatePolicyPageMutation(\n $input: CreatePolicyInput!\n) {\n createPolicy(input: $input) {\n policyEdge {\n node {\n id\n name\n content\n status\n }\n }\n }\n}\n"
}
};
})();
(node as any).hash = "dca08dd146693bcf614e7d02785e57b5";
export default node;

View File

@@ -0,0 +1,269 @@
/**
* @generated SignedSource<<4225a13c40221ef783ffebcfda157db9>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type PolicyStatus = "ACTIVE" | "DRAFT";
export type PolicyListPageQuery$variables = {
organizationId: string;
};
export type PolicyListPageQuery$data = {
readonly organization: {
readonly policies?: {
readonly edges: ReadonlyArray<{
readonly node: {
readonly createdAt: string;
readonly id: string;
readonly name: string;
readonly status: PolicyStatus;
readonly updatedAt: string;
};
}>;
};
};
};
export type PolicyListPageQuery = {
response: PolicyListPageQuery$data;
variables: PolicyListPageQuery$variables;
};
const node: ConcreteRequest = (function(){
var v0 = [
{
"defaultValue": null,
"kind": "LocalArgument",
"name": "organizationId"
}
],
v1 = [
{
"kind": "Variable",
"name": "id",
"variableName": "organizationId"
}
],
v2 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
},
v3 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "__typename",
"storageKey": null
},
v4 = [
{
"alias": null,
"args": null,
"concreteType": "PolicyEdge",
"kind": "LinkedField",
"name": "edges",
"plural": true,
"selections": [
{
"alias": null,
"args": null,
"concreteType": "Policy",
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
(v2/*: any*/),
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "name",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "createdAt",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "updatedAt",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "status",
"storageKey": null
},
(v3/*: any*/)
],
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "cursor",
"storageKey": null
}
],
"storageKey": null
},
{
"alias": null,
"args": null,
"concreteType": "PageInfo",
"kind": "LinkedField",
"name": "pageInfo",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "endCursor",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "hasNextPage",
"storageKey": null
}
],
"storageKey": null
}
],
v5 = [
{
"kind": "Literal",
"name": "first",
"value": 25
}
];
return {
"fragment": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Fragment",
"metadata": null,
"name": "PolicyListPageQuery",
"selections": [
{
"alias": "organization",
"args": (v1/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
{
"kind": "InlineFragment",
"selections": [
{
"alias": "policies",
"args": null,
"concreteType": "PolicyConnection",
"kind": "LinkedField",
"name": "__PolicyListPage_policies_connection",
"plural": false,
"selections": (v4/*: any*/),
"storageKey": null
}
],
"type": "Organization",
"abstractKey": null
}
],
"storageKey": null
}
],
"type": "Query",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Operation",
"name": "PolicyListPageQuery",
"selections": [
{
"alias": "organization",
"args": (v1/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
(v3/*: any*/),
{
"kind": "InlineFragment",
"selections": [
{
"alias": null,
"args": (v5/*: any*/),
"concreteType": "PolicyConnection",
"kind": "LinkedField",
"name": "policies",
"plural": false,
"selections": (v4/*: any*/),
"storageKey": "policies(first:25)"
},
{
"alias": null,
"args": (v5/*: any*/),
"filters": null,
"handle": "connection",
"key": "PolicyListPage_policies",
"kind": "LinkedHandle",
"name": "policies"
}
],
"type": "Organization",
"abstractKey": null
},
(v2/*: any*/)
],
"storageKey": null
}
]
},
"params": {
"cacheID": "abc2b7659c3b58aa3df934d4ee3aa78a",
"id": null,
"metadata": {
"connection": [
{
"count": null,
"cursor": null,
"direction": "forward",
"path": [
"organization",
"policies"
]
}
]
},
"name": "PolicyListPageQuery",
"operationKind": "query",
"text": "query PolicyListPageQuery(\n $organizationId: ID!\n) {\n organization: node(id: $organizationId) {\n __typename\n ... on Organization {\n policies(first: 25) {\n edges {\n node {\n id\n name\n createdAt\n updatedAt\n status\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n }\n }\n }\n id\n }\n}\n"
}
};
})();
(node as any).hash = "75262b569185ae2e6bfda8c19fd7ac9d";
export default node;

View File

@@ -0,0 +1,160 @@
/**
* @generated SignedSource<<be4844f007d260c332082a01fe125a57>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type PolicyStatus = "ACTIVE" | "DRAFT";
export type PolicyOverviewPageQuery$variables = {
policyId: string;
};
export type PolicyOverviewPageQuery$data = {
readonly node: {
readonly content?: string;
readonly createdAt?: string;
readonly id: string;
readonly name?: string;
readonly status?: PolicyStatus;
readonly updatedAt?: string;
};
};
export type PolicyOverviewPageQuery = {
response: PolicyOverviewPageQuery$data;
variables: PolicyOverviewPageQuery$variables;
};
const node: ConcreteRequest = (function(){
var v0 = [
{
"defaultValue": null,
"kind": "LocalArgument",
"name": "policyId"
}
],
v1 = [
{
"kind": "Variable",
"name": "id",
"variableName": "policyId"
}
],
v2 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
},
v3 = {
"kind": "InlineFragment",
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "name",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "content",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "createdAt",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "updatedAt",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "status",
"storageKey": null
}
],
"type": "Policy",
"abstractKey": null
};
return {
"fragment": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Fragment",
"metadata": null,
"name": "PolicyOverviewPageQuery",
"selections": [
{
"alias": null,
"args": (v1/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
(v2/*: any*/),
(v3/*: any*/)
],
"storageKey": null
}
],
"type": "Query",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Operation",
"name": "PolicyOverviewPageQuery",
"selections": [
{
"alias": null,
"args": (v1/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "__typename",
"storageKey": null
},
(v2/*: any*/),
(v3/*: any*/)
],
"storageKey": null
}
]
},
"params": {
"cacheID": "07fedea13b4dbbe58e15dfaa644b24fa",
"id": null,
"metadata": {},
"name": "PolicyOverviewPageQuery",
"operationKind": "query",
"text": "query PolicyOverviewPageQuery(\n $policyId: ID!\n) {\n node(id: $policyId) {\n __typename\n id\n ... on Policy {\n name\n content\n createdAt\n updatedAt\n status\n }\n }\n}\n"
}
};
})();
(node as any).hash = "17389d925f3f3ffa3ed5eb8ed9051ae9";
export default node;

View File

@@ -0,0 +1,134 @@
/**
* @generated SignedSource<<beb534549abc2d40828f7a5d0aaa96e6>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type PolicyStatus = "ACTIVE" | "DRAFT";
export type UpdatePolicyInput = {
content?: string | null | undefined;
expectedVersion: number;
id: string;
name?: string | null | undefined;
status?: PolicyStatus | null | undefined;
};
export type UpdatePolicyPageMutation$variables = {
input: UpdatePolicyInput;
};
export type UpdatePolicyPageMutation$data = {
readonly updatePolicy: {
readonly policy: {
readonly content: string;
readonly id: string;
readonly name: string;
readonly status: PolicyStatus;
};
};
};
export type UpdatePolicyPageMutation = {
response: UpdatePolicyPageMutation$data;
variables: UpdatePolicyPageMutation$variables;
};
const node: ConcreteRequest = (function(){
var v0 = [
{
"defaultValue": null,
"kind": "LocalArgument",
"name": "input"
}
],
v1 = [
{
"alias": null,
"args": [
{
"kind": "Variable",
"name": "input",
"variableName": "input"
}
],
"concreteType": "UpdatePolicyPayload",
"kind": "LinkedField",
"name": "updatePolicy",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"concreteType": "Policy",
"kind": "LinkedField",
"name": "policy",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "name",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "content",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "status",
"storageKey": null
}
],
"storageKey": null
}
],
"storageKey": null
}
];
return {
"fragment": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Fragment",
"metadata": null,
"name": "UpdatePolicyPageMutation",
"selections": (v1/*: any*/),
"type": "Mutation",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Operation",
"name": "UpdatePolicyPageMutation",
"selections": (v1/*: any*/)
},
"params": {
"cacheID": "712914b4586e7c5f722f908c8d64bbc1",
"id": null,
"metadata": {},
"name": "UpdatePolicyPageMutation",
"operationKind": "mutation",
"text": "mutation UpdatePolicyPageMutation(\n $input: UpdatePolicyInput!\n) {\n updatePolicy(input: $input) {\n policy {\n id\n name\n content\n status\n }\n }\n}\n"
}
};
})();
(node as any).hash = "25a2ddb0078d821584c5497227a6d364";
export default node;

View File

@@ -0,0 +1,152 @@
/**
* @generated SignedSource<<b7ecab3dac17a6d1b23ec639484a4322>>
* @lightSyntaxTransform
* @nogrep
*/
/* tslint:disable */
/* eslint-disable */
// @ts-nocheck
import { ConcreteRequest } from 'relay-runtime';
export type PolicyStatus = "ACTIVE" | "DRAFT";
export type UpdatePolicyPageQuery$variables = {
policyId: string;
};
export type UpdatePolicyPageQuery$data = {
readonly node: {
readonly content?: string;
readonly id: string;
readonly name?: string;
readonly status?: PolicyStatus;
readonly version?: number;
};
};
export type UpdatePolicyPageQuery = {
response: UpdatePolicyPageQuery$data;
variables: UpdatePolicyPageQuery$variables;
};
const node: ConcreteRequest = (function(){
var v0 = [
{
"defaultValue": null,
"kind": "LocalArgument",
"name": "policyId"
}
],
v1 = [
{
"kind": "Variable",
"name": "id",
"variableName": "policyId"
}
],
v2 = {
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "id",
"storageKey": null
},
v3 = {
"kind": "InlineFragment",
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "name",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "content",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "status",
"storageKey": null
},
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "version",
"storageKey": null
}
],
"type": "Policy",
"abstractKey": null
};
return {
"fragment": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Fragment",
"metadata": null,
"name": "UpdatePolicyPageQuery",
"selections": [
{
"alias": null,
"args": (v1/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
(v2/*: any*/),
(v3/*: any*/)
],
"storageKey": null
}
],
"type": "Query",
"abstractKey": null
},
"kind": "Request",
"operation": {
"argumentDefinitions": (v0/*: any*/),
"kind": "Operation",
"name": "UpdatePolicyPageQuery",
"selections": [
{
"alias": null,
"args": (v1/*: any*/),
"concreteType": null,
"kind": "LinkedField",
"name": "node",
"plural": false,
"selections": [
{
"alias": null,
"args": null,
"kind": "ScalarField",
"name": "__typename",
"storageKey": null
},
(v2/*: any*/),
(v3/*: any*/)
],
"storageKey": null
}
]
},
"params": {
"cacheID": "ed70bb0199119ba5b9080ed86081ac79",
"id": null,
"metadata": {},
"name": "UpdatePolicyPageQuery",
"operationKind": "query",
"text": "query UpdatePolicyPageQuery(\n $policyId: ID!\n) {\n node(id: $policyId) {\n __typename\n id\n ... on Policy {\n name\n content\n status\n version\n }\n }\n}\n"
}
};
})();
(node as any).hash = "303abaec54b66ef4f5c886d1cd606f12";
export default node;