Add processing activity registries
Signed-off-by: Sacha Al Himdani <sacha@getprobo.com>
This commit is contained in:
Sacha Al Himdani
@@ -0,0 +1,262 @@
|
||||
import {
|
||||
Button,
|
||||
IconPlusLarge,
|
||||
PageHeader,
|
||||
Card,
|
||||
Thead,
|
||||
Tbody,
|
||||
Tr,
|
||||
Th,
|
||||
Td,
|
||||
Badge,
|
||||
ActionDropdown,
|
||||
DropdownItem,
|
||||
IconTrashCan,
|
||||
Table,
|
||||
useConfirm,
|
||||
} from "@probo/ui";
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { usePageTitle } from "@probo/hooks";
|
||||
import { getLawfulBasisLabel } from "../../../components/form/ProcessingActivityRegistryEnumOptions";
|
||||
import {
|
||||
ConnectionHandler,
|
||||
graphql,
|
||||
usePaginationFragment,
|
||||
usePreloadedQuery,
|
||||
useMutation,
|
||||
type PreloadedQuery,
|
||||
} from "react-relay";
|
||||
import { useOrganizationId } from "/hooks/useOrganizationId";
|
||||
import { CreateProcessingActivityRegistryDialog } from "./dialogs/CreateProcessingActivityRegistryDialog";
|
||||
import { deleteProcessingActivityRegistryMutation, ProcessingActivityRegistriesConnectionKey } from "../../../hooks/graph/ProcessingActivityRegistryGraph";
|
||||
import { sprintf, promisifyMutation } from "@probo/helpers";
|
||||
import type { NodeOf } from "/types";
|
||||
import type { ProcessingActivityRegistriesPageQuery } from "./__generated__/ProcessingActivityRegistriesPageQuery.graphql";
|
||||
import type {
|
||||
ProcessingActivityRegistriesPageFragment$key,
|
||||
ProcessingActivityRegistriesPageFragment$data,
|
||||
} from "./__generated__/ProcessingActivityRegistriesPageFragment.graphql";
|
||||
|
||||
interface ProcessingActivityRegistriesPageProps {
|
||||
queryRef: PreloadedQuery<ProcessingActivityRegistriesPageQuery>;
|
||||
}
|
||||
|
||||
const processingActivityRegistriesPageFragment = graphql`
|
||||
fragment ProcessingActivityRegistriesPageFragment on Organization
|
||||
@refetchable(queryName: "ProcessingActivityRegistriesPageRefetchQuery")
|
||||
@argumentDefinitions(
|
||||
first: { type: "Int", defaultValue: 10 }
|
||||
after: { type: "CursorKey" }
|
||||
) {
|
||||
id
|
||||
processingActivityRegistries(first: $first, after: $after)
|
||||
@connection(key: "ProcessingActivityRegistriesPage_processingActivityRegistries") {
|
||||
__id
|
||||
totalCount
|
||||
edges {
|
||||
node {
|
||||
id
|
||||
name
|
||||
purpose
|
||||
dataSubjectCategory
|
||||
personalDataCategory
|
||||
lawfulBasis
|
||||
location
|
||||
internationalTransfers
|
||||
audit {
|
||||
id
|
||||
name
|
||||
framework {
|
||||
id
|
||||
name
|
||||
}
|
||||
}
|
||||
createdAt
|
||||
updatedAt
|
||||
}
|
||||
}
|
||||
pageInfo {
|
||||
hasNextPage
|
||||
endCursor
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export default function ProcessingActivityRegistriesPage({ queryRef }: ProcessingActivityRegistriesPageProps) {
|
||||
const { __ } = useTranslate();
|
||||
const organizationId = useOrganizationId();
|
||||
|
||||
usePageTitle(__("Processing Activity Registries"));
|
||||
|
||||
const organization = usePreloadedQuery(
|
||||
graphql`
|
||||
query ProcessingActivityRegistriesPageQuery($organizationId: ID!) {
|
||||
node(id: $organizationId) {
|
||||
... on Organization {
|
||||
...ProcessingActivityRegistriesPageFragment
|
||||
}
|
||||
}
|
||||
}
|
||||
`,
|
||||
queryRef
|
||||
);
|
||||
|
||||
const {
|
||||
data,
|
||||
loadNext,
|
||||
hasNext,
|
||||
isLoadingNext,
|
||||
} = usePaginationFragment<
|
||||
ProcessingActivityRegistriesPageQuery,
|
||||
ProcessingActivityRegistriesPageFragment$key
|
||||
>(processingActivityRegistriesPageFragment, organization.node);
|
||||
if (!data) {
|
||||
return <div>{__("Organization not found")}</div>;
|
||||
}
|
||||
|
||||
const connectionId = ConnectionHandler.getConnectionID(
|
||||
organizationId,
|
||||
ProcessingActivityRegistriesConnectionKey
|
||||
);
|
||||
const registries = data?.processingActivityRegistries?.edges?.map((edge) => edge.node) ?? [];
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<PageHeader title={__("Processing Activity Registries")} description={__("Manage your processing activity registry entries under GDPR")}>
|
||||
<CreateProcessingActivityRegistryDialog
|
||||
organizationId={organizationId}
|
||||
connectionId={connectionId}
|
||||
>
|
||||
<Button icon={IconPlusLarge}>
|
||||
{__("Add processing activity registry")}
|
||||
</Button>
|
||||
</CreateProcessingActivityRegistryDialog>
|
||||
</PageHeader>
|
||||
|
||||
{registries.length > 0 ? (
|
||||
<Card>
|
||||
<Table>
|
||||
<Thead>
|
||||
<Tr>
|
||||
<Th>{__("Name")}</Th>
|
||||
<Th>{__("Purpose")}</Th>
|
||||
<Th>{__("Data Subject")}</Th>
|
||||
<Th>{__("Lawful Basis")}</Th>
|
||||
<Th>{__("Location")}</Th>
|
||||
<Th>{__("International Transfers")}</Th>
|
||||
<Th>{__("Audit")}</Th>
|
||||
<Th>{__("Actions")}</Th>
|
||||
</Tr>
|
||||
</Thead>
|
||||
<Tbody>
|
||||
{registries.map((registry) => (
|
||||
<RegistryRow
|
||||
key={registry.id}
|
||||
registry={registry}
|
||||
connectionId={connectionId}
|
||||
/>
|
||||
))}
|
||||
</Tbody>
|
||||
</Table>
|
||||
|
||||
{hasNext && (
|
||||
<div className="p-4 border-t">
|
||||
<Button
|
||||
variant="secondary"
|
||||
onClick={() => loadNext(10)}
|
||||
disabled={isLoadingNext}
|
||||
>
|
||||
{isLoadingNext ? __("Loading...") : __("Load more")}
|
||||
</Button>
|
||||
</div>
|
||||
)}
|
||||
</Card>
|
||||
) : (
|
||||
<Card padded>
|
||||
<div className="text-center py-12">
|
||||
<h3 className="text-lg font-semibold mb-2">
|
||||
{__("No processing activity registry entries yet")}
|
||||
</h3>
|
||||
<p className="text-txt-tertiary mb-4">
|
||||
{__("Create your first processing activity registry entry to get started with GDPR compliance.")}
|
||||
</p>
|
||||
</div>
|
||||
</Card>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function RegistryRow({
|
||||
registry,
|
||||
connectionId,
|
||||
}: {
|
||||
registry: NodeOf<NonNullable<ProcessingActivityRegistriesPageFragment$data['processingActivityRegistries']>>;
|
||||
connectionId: string;
|
||||
}) {
|
||||
const organizationId = useOrganizationId();
|
||||
const { __ } = useTranslate();
|
||||
const [deleteRegistry] = useMutation(deleteProcessingActivityRegistryMutation);
|
||||
const confirm = useConfirm();
|
||||
|
||||
const handleDelete = () => {
|
||||
confirm(
|
||||
() =>
|
||||
promisifyMutation(deleteRegistry)({
|
||||
variables: {
|
||||
input: {
|
||||
processingActivityRegistryId: registry.id,
|
||||
},
|
||||
connections: [connectionId],
|
||||
},
|
||||
}),
|
||||
{
|
||||
message: sprintf(
|
||||
__(
|
||||
"This will permanently delete the processing activity registry entry %s. This action cannot be undone."
|
||||
),
|
||||
registry.name
|
||||
),
|
||||
}
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<Tr to={`/organizations/${organizationId}/processing-activity-registries/${registry.id}`}>
|
||||
<Td>
|
||||
<span className="font-semibold">{registry.name}</span>
|
||||
</Td>
|
||||
<Td>
|
||||
<span className="text-sm text-txt-secondary">
|
||||
{registry.purpose || "-"}
|
||||
</span>
|
||||
</Td>
|
||||
<Td>{registry.dataSubjectCategory || "-"}</Td>
|
||||
<Td>{getLawfulBasisLabel(registry.lawfulBasis, __)}</Td>
|
||||
<Td>{registry.location || "-"}</Td>
|
||||
<Td>
|
||||
<Badge variant={registry.internationalTransfers ? "warning" : "success"}>
|
||||
{registry.internationalTransfers ? __("Yes") : __("No")}
|
||||
</Badge>
|
||||
</Td>
|
||||
<Td>
|
||||
{registry.audit.name
|
||||
? `${registry.audit.framework.name} - ${registry.audit.name}`
|
||||
: registry.audit.framework.name
|
||||
}
|
||||
</Td>
|
||||
<Td noLink width={50} className="text-end">
|
||||
<ActionDropdown>
|
||||
<DropdownItem
|
||||
icon={IconTrashCan}
|
||||
variant="danger"
|
||||
onSelect={handleDelete}
|
||||
>
|
||||
{__("Delete")}
|
||||
</DropdownItem>
|
||||
</ActionDropdown>
|
||||
</Td>
|
||||
</Tr>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,386 @@
|
||||
import {
|
||||
ConnectionHandler,
|
||||
usePreloadedQuery,
|
||||
type PreloadedQuery,
|
||||
} from "react-relay";
|
||||
import {
|
||||
processingActivityRegistryNodeQuery,
|
||||
useDeleteProcessingActivityRegistry,
|
||||
useUpdateProcessingActivityRegistry,
|
||||
ProcessingActivityRegistriesConnectionKey,
|
||||
} from "../../../hooks/graph/ProcessingActivityRegistryGraph";
|
||||
import {
|
||||
ActionDropdown,
|
||||
Breadcrumb,
|
||||
Button,
|
||||
DropdownItem,
|
||||
Field,
|
||||
Card,
|
||||
Textarea,
|
||||
useToast,
|
||||
Label,
|
||||
Checkbox,
|
||||
Select,
|
||||
} from "@probo/ui";
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { useOrganizationId } from "/hooks/useOrganizationId";
|
||||
import { AuditSelectField } from "/components/form/AuditSelectField";
|
||||
import { useFormWithSchema } from "/hooks/useFormWithSchema";
|
||||
import { Controller } from "react-hook-form";
|
||||
import z from "zod";
|
||||
import {
|
||||
SpecialOrCriminalDataOptions,
|
||||
LawfulBasisOptions,
|
||||
TransferSafeguardsOptions,
|
||||
DataProtectionImpactAssessmentOptions,
|
||||
TransferImpactAssessmentOptions,
|
||||
} from "../../../components/form/ProcessingActivityRegistryEnumOptions";
|
||||
|
||||
import type { ProcessingActivityRegistryGraphNodeQuery } from "/hooks/graph/__generated__/ProcessingActivityRegistryGraphNodeQuery.graphql";
|
||||
|
||||
const updateRegistrySchema = z.object({
|
||||
name: z.string().min(1, "Name is required"),
|
||||
purpose: z.string().optional(),
|
||||
dataSubjectCategory: z.string().optional(),
|
||||
personalDataCategory: z.string().optional(),
|
||||
specialOrCriminalData: z.enum(["YES", "NO", "POSSIBLE"] as const),
|
||||
consentEvidenceLink: z.string().optional(),
|
||||
lawfulBasis: z.enum(["CONSENT", "CONTRACTUAL_NECESSITY", "LEGAL_OBLIGATION", "LEGITIMATE_INTEREST", "PUBLIC_TASK", "VITAL_INTERESTS"] as const),
|
||||
recipients: z.string().optional(),
|
||||
location: z.string().optional(),
|
||||
internationalTransfers: z.boolean(),
|
||||
transferSafeguards: z.string(),
|
||||
retentionPeriod: z.string().optional(),
|
||||
securityMeasures: z.string().optional(),
|
||||
dataProtectionImpactAssessment: z.enum(["NEEDED", "NOT_NEEDED"] as const),
|
||||
transferImpactAssessment: z.enum(["NEEDED", "NOT_NEEDED"] as const),
|
||||
auditId: z.string().min(1, "Audit is required"),
|
||||
});
|
||||
|
||||
type Props = {
|
||||
queryRef: PreloadedQuery<ProcessingActivityRegistryGraphNodeQuery>;
|
||||
};
|
||||
|
||||
export default function ProcessingActivityRegistryDetailsPage(props: Props) {
|
||||
const data = usePreloadedQuery<ProcessingActivityRegistryGraphNodeQuery>(processingActivityRegistryNodeQuery, props.queryRef);
|
||||
const registry = data.node;
|
||||
const { __ } = useTranslate();
|
||||
const { toast } = useToast();
|
||||
const organizationId = useOrganizationId();
|
||||
|
||||
if (!registry) {
|
||||
return <div>{__("Processing activity registry entry not found")}</div>;
|
||||
}
|
||||
|
||||
const updateRegistry = useUpdateProcessingActivityRegistry();
|
||||
|
||||
const connectionId = ConnectionHandler.getConnectionID(
|
||||
organizationId,
|
||||
ProcessingActivityRegistriesConnectionKey
|
||||
);
|
||||
|
||||
const deleteRegistry = useDeleteProcessingActivityRegistry({ id: registry.id!, name: registry.name! }, connectionId);
|
||||
|
||||
const { register, handleSubmit, formState, control } = useFormWithSchema(
|
||||
updateRegistrySchema,
|
||||
{
|
||||
defaultValues: {
|
||||
name: registry.name || "",
|
||||
purpose: registry.purpose || "",
|
||||
dataSubjectCategory: registry.dataSubjectCategory || "",
|
||||
personalDataCategory: registry.personalDataCategory || "",
|
||||
specialOrCriminalData: registry.specialOrCriminalData || "NO" as const,
|
||||
consentEvidenceLink: registry.consentEvidenceLink || "",
|
||||
lawfulBasis: registry.lawfulBasis || "LEGITIMATE_INTEREST" as const,
|
||||
recipients: registry.recipients || "",
|
||||
location: registry.location || "",
|
||||
internationalTransfers: registry.internationalTransfers || false,
|
||||
transferSafeguards: registry.transferSafeguards || "__NONE__",
|
||||
retentionPeriod: registry.retentionPeriod || "",
|
||||
securityMeasures: registry.securityMeasures || "",
|
||||
dataProtectionImpactAssessment: registry.dataProtectionImpactAssessment || "NOT_NEEDED" as const,
|
||||
transferImpactAssessment: registry.transferImpactAssessment || "NOT_NEEDED" as const,
|
||||
auditId: registry.audit?.id || "",
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
const onSubmit = handleSubmit(async (formData) => {
|
||||
try {
|
||||
await updateRegistry({
|
||||
id: registry.id!,
|
||||
auditId: formData.auditId || undefined,
|
||||
name: formData.name,
|
||||
purpose: formData.purpose || undefined,
|
||||
dataSubjectCategory: formData.dataSubjectCategory || undefined,
|
||||
personalDataCategory: formData.personalDataCategory || undefined,
|
||||
specialOrCriminalData: formData.specialOrCriminalData || undefined,
|
||||
consentEvidenceLink: formData.consentEvidenceLink || undefined,
|
||||
lawfulBasis: formData.lawfulBasis || undefined,
|
||||
recipients: formData.recipients || undefined,
|
||||
location: formData.location || undefined,
|
||||
internationalTransfers: formData.internationalTransfers,
|
||||
transferSafeguards: formData.transferSafeguards === "__NONE__" ? undefined : formData.transferSafeguards || undefined,
|
||||
retentionPeriod: formData.retentionPeriod || undefined,
|
||||
securityMeasures: formData.securityMeasures || undefined,
|
||||
dataProtectionImpactAssessment: formData.dataProtectionImpactAssessment || undefined,
|
||||
transferImpactAssessment: formData.transferImpactAssessment || undefined,
|
||||
});
|
||||
|
||||
toast({
|
||||
title: __("Success"),
|
||||
description: __("Processing activity registry entry updated successfully"),
|
||||
variant: "success",
|
||||
});
|
||||
} catch (error) {
|
||||
toast({
|
||||
title: __("Error"),
|
||||
description: __("Failed to update processing activity registry entry"),
|
||||
variant: "error",
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<Breadcrumb
|
||||
items={[
|
||||
{ label: __("Processing Activity Registries"), to: "../processing-activity-registries" },
|
||||
{ label: registry.name! },
|
||||
]}
|
||||
/>
|
||||
<ActionDropdown>
|
||||
<DropdownItem onClick={deleteRegistry} variant="danger">
|
||||
{__("Delete")}
|
||||
</DropdownItem>
|
||||
</ActionDropdown>
|
||||
</div>
|
||||
|
||||
<Card>
|
||||
<div className="p-6">
|
||||
<div className="mb-6">
|
||||
<div className="flex items-center gap-4">
|
||||
<h1 className="text-2xl font-bold">{registry.name}</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form onSubmit={onSubmit} className="space-y-6">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||||
<div className="space-y-4">
|
||||
<Field
|
||||
label={__("Name")}
|
||||
{...register("name")}
|
||||
error={formState.errors.name?.message}
|
||||
required
|
||||
/>
|
||||
|
||||
<AuditSelectField
|
||||
organizationId={organizationId}
|
||||
control={control}
|
||||
name="auditId"
|
||||
label={__("Audit")}
|
||||
error={formState.errors.auditId?.message}
|
||||
required
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Label>{__("Purpose")}</Label>
|
||||
<Textarea
|
||||
{...register("purpose")}
|
||||
placeholder={__("Describe the purpose of processing")}
|
||||
rows={3}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Field
|
||||
label={__("Data Subject Category")}
|
||||
{...register("dataSubjectCategory")}
|
||||
placeholder={__("e.g., employees, customers, prospects")}
|
||||
/>
|
||||
|
||||
<Field
|
||||
label={__("Personal Data Category")}
|
||||
{...register("personalDataCategory")}
|
||||
placeholder={__("e.g., contact details, financial data")}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="specialOrCriminalData">{__("Special or Criminal Data")} *</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="specialOrCriminalData"
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
id="specialOrCriminalData"
|
||||
placeholder={__("Select special or criminal data status")}
|
||||
onValueChange={field.onChange}
|
||||
value={field.value}
|
||||
className="w-full"
|
||||
>
|
||||
<SpecialOrCriminalDataOptions />
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
{formState.errors.specialOrCriminalData && (
|
||||
<p className="text-sm text-txt-danger mt-1">{formState.errors.specialOrCriminalData.message}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<Field
|
||||
label={__("Consent Evidence Link")}
|
||||
{...register("consentEvidenceLink")}
|
||||
placeholder={__("Link to consent evidence if applicable")}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="lawfulBasis">{__("Lawful Basis")} *</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="lawfulBasis"
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
id="lawfulBasis"
|
||||
placeholder={__("Select lawful basis for processing")}
|
||||
onValueChange={field.onChange}
|
||||
value={field.value}
|
||||
className="w-full"
|
||||
>
|
||||
<LawfulBasisOptions />
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
{formState.errors.lawfulBasis && (
|
||||
<p className="text-sm text-txt-danger mt-1">{formState.errors.lawfulBasis.message}</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
<Field
|
||||
label={__("Recipients")}
|
||||
{...register("recipients")}
|
||||
placeholder={__("Who receives the data")}
|
||||
/>
|
||||
|
||||
<Field
|
||||
label={__("Location")}
|
||||
{...register("location")}
|
||||
placeholder={__("Where is the data processed")}
|
||||
/>
|
||||
|
||||
<Controller
|
||||
control={control}
|
||||
name="internationalTransfers"
|
||||
render={({ field }) => (
|
||||
<div>
|
||||
<Label>{__("International Transfers")}</Label>
|
||||
<div className="mt-2 flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={field.value}
|
||||
onChange={field.onChange}
|
||||
/>
|
||||
<span>{__("Data is transferred internationally")}</span>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="transferSafeguards">{__("Transfer Safeguards")}</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="transferSafeguards"
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
id="transferSafeguards"
|
||||
placeholder={__("Select transfer safeguards")}
|
||||
onValueChange={field.onChange}
|
||||
value={field.value}
|
||||
className="w-full"
|
||||
>
|
||||
<TransferSafeguardsOptions />
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
{formState.errors.transferSafeguards && (
|
||||
<p className="text-sm text-txt-danger mt-1">{formState.errors.transferSafeguards.message}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<Field
|
||||
label={__("Retention Period")}
|
||||
{...register("retentionPeriod")}
|
||||
placeholder={__("How long is data retained")}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Label>{__("Security Measures")}</Label>
|
||||
<Textarea
|
||||
{...register("securityMeasures")}
|
||||
placeholder={__("Technical and organizational measures")}
|
||||
rows={3}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="dataProtectionImpactAssessment">{__("Data Protection Impact Assessment")} *</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="dataProtectionImpactAssessment"
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
id="dataProtectionImpactAssessment"
|
||||
placeholder={__("Is DPIA needed?")}
|
||||
onValueChange={field.onChange}
|
||||
value={field.value}
|
||||
className="w-full"
|
||||
>
|
||||
<DataProtectionImpactAssessmentOptions />
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
{formState.errors.dataProtectionImpactAssessment && (
|
||||
<p className="text-sm text-txt-danger mt-1">{formState.errors.dataProtectionImpactAssessment.message}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="transferImpactAssessment">{__("Transfer Impact Assessment")} *</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="transferImpactAssessment"
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
id="transferImpactAssessment"
|
||||
placeholder={__("Is TIA needed?")}
|
||||
onValueChange={field.onChange}
|
||||
value={field.value}
|
||||
className="w-full"
|
||||
>
|
||||
<TransferImpactAssessmentOptions />
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
{formState.errors.transferImpactAssessment && (
|
||||
<p className="text-sm text-txt-danger mt-1">{formState.errors.transferImpactAssessment.message}</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end pt-4">
|
||||
<Button
|
||||
type="submit"
|
||||
variant="primary"
|
||||
disabled={formState.isSubmitting}
|
||||
>
|
||||
{formState.isSubmitting ? __("Saving...") : __("Save Changes")}
|
||||
</Button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</Card>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,301 @@
|
||||
/**
|
||||
* @generated SignedSource<<a05ed8b664f858ac30c3bf5d71ba20ea>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
|
||||
/* tslint:disable */
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck
|
||||
|
||||
import { ReaderFragment } from 'relay-runtime';
|
||||
export type ProcessingActivityRegistryLawfulBasis = "CONSENT" | "CONTRACTUAL_NECESSITY" | "LEGAL_OBLIGATION" | "LEGITIMATE_INTEREST" | "PUBLIC_TASK" | "VITAL_INTERESTS";
|
||||
import { FragmentRefs } from "relay-runtime";
|
||||
export type ProcessingActivityRegistriesPageFragment$data = {
|
||||
readonly id: string;
|
||||
readonly processingActivityRegistries: {
|
||||
readonly __id: string;
|
||||
readonly edges: ReadonlyArray<{
|
||||
readonly node: {
|
||||
readonly audit: {
|
||||
readonly framework: {
|
||||
readonly id: string;
|
||||
readonly name: string;
|
||||
};
|
||||
readonly id: string;
|
||||
readonly name: string | null | undefined;
|
||||
};
|
||||
readonly createdAt: any;
|
||||
readonly dataSubjectCategory: string | null | undefined;
|
||||
readonly id: string;
|
||||
readonly internationalTransfers: boolean;
|
||||
readonly lawfulBasis: ProcessingActivityRegistryLawfulBasis;
|
||||
readonly location: string | null | undefined;
|
||||
readonly name: string;
|
||||
readonly personalDataCategory: string | null | undefined;
|
||||
readonly purpose: string | null | undefined;
|
||||
readonly updatedAt: any;
|
||||
};
|
||||
}>;
|
||||
readonly pageInfo: {
|
||||
readonly endCursor: any | null | undefined;
|
||||
readonly hasNextPage: boolean;
|
||||
};
|
||||
readonly totalCount: number;
|
||||
};
|
||||
readonly " $fragmentType": "ProcessingActivityRegistriesPageFragment";
|
||||
};
|
||||
export type ProcessingActivityRegistriesPageFragment$key = {
|
||||
readonly " $data"?: ProcessingActivityRegistriesPageFragment$data;
|
||||
readonly " $fragmentSpreads": FragmentRefs<"ProcessingActivityRegistriesPageFragment">;
|
||||
};
|
||||
|
||||
import ProcessingActivityRegistriesPageRefetchQuery_graphql from './ProcessingActivityRegistriesPageRefetchQuery.graphql';
|
||||
|
||||
const node: ReaderFragment = (function(){
|
||||
var v0 = [
|
||||
"processingActivityRegistries"
|
||||
],
|
||||
v1 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "id",
|
||||
"storageKey": null
|
||||
},
|
||||
v2 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "name",
|
||||
"storageKey": null
|
||||
};
|
||||
return {
|
||||
"argumentDefinitions": [
|
||||
{
|
||||
"defaultValue": null,
|
||||
"kind": "LocalArgument",
|
||||
"name": "after"
|
||||
},
|
||||
{
|
||||
"defaultValue": 10,
|
||||
"kind": "LocalArgument",
|
||||
"name": "first"
|
||||
}
|
||||
],
|
||||
"kind": "Fragment",
|
||||
"metadata": {
|
||||
"connection": [
|
||||
{
|
||||
"count": "first",
|
||||
"cursor": "after",
|
||||
"direction": "forward",
|
||||
"path": (v0/*: any*/)
|
||||
}
|
||||
],
|
||||
"refetch": {
|
||||
"connection": {
|
||||
"forward": {
|
||||
"count": "first",
|
||||
"cursor": "after"
|
||||
},
|
||||
"backward": null,
|
||||
"path": (v0/*: any*/)
|
||||
},
|
||||
"fragmentPathInResult": [
|
||||
"node"
|
||||
],
|
||||
"operation": ProcessingActivityRegistriesPageRefetchQuery_graphql,
|
||||
"identifierInfo": {
|
||||
"identifierField": "id",
|
||||
"identifierQueryVariableName": "id"
|
||||
}
|
||||
}
|
||||
},
|
||||
"name": "ProcessingActivityRegistriesPageFragment",
|
||||
"selections": [
|
||||
(v1/*: any*/),
|
||||
{
|
||||
"alias": "processingActivityRegistries",
|
||||
"args": null,
|
||||
"concreteType": "ProcessingActivityRegistryConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "__ProcessingActivityRegistriesPage_processingActivityRegistries_connection",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "totalCount",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "ProcessingActivityRegistryEdge",
|
||||
"kind": "LinkedField",
|
||||
"name": "edges",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "ProcessingActivityRegistry",
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v1/*: any*/),
|
||||
(v2/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "purpose",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "dataSubjectCategory",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "personalDataCategory",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "lawfulBasis",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "location",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "internationalTransfers",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Audit",
|
||||
"kind": "LinkedField",
|
||||
"name": "audit",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v1/*: any*/),
|
||||
(v2/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Framework",
|
||||
"kind": "LinkedField",
|
||||
"name": "framework",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v1/*: any*/),
|
||||
(v2/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"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": "__typename",
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"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": "hasNextPage",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "endCursor",
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"kind": "ClientExtension",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "__id",
|
||||
"storageKey": null
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"type": "Organization",
|
||||
"abstractKey": null
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "7e63a0911396373ab39811be65844b89";
|
||||
|
||||
export default node;
|
||||
@@ -0,0 +1,322 @@
|
||||
/**
|
||||
* @generated SignedSource<<4af375f7d8057aa29a6fcfe47854e707>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
|
||||
/* tslint:disable */
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck
|
||||
|
||||
import { ConcreteRequest } from 'relay-runtime';
|
||||
import { FragmentRefs } from "relay-runtime";
|
||||
export type ProcessingActivityRegistriesPageQuery$variables = {
|
||||
organizationId: string;
|
||||
};
|
||||
export type ProcessingActivityRegistriesPageQuery$data = {
|
||||
readonly node: {
|
||||
readonly " $fragmentSpreads": FragmentRefs<"ProcessingActivityRegistriesPageFragment">;
|
||||
};
|
||||
};
|
||||
export type ProcessingActivityRegistriesPageQuery = {
|
||||
response: ProcessingActivityRegistriesPageQuery$data;
|
||||
variables: ProcessingActivityRegistriesPageQuery$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": "__typename",
|
||||
"storageKey": null
|
||||
},
|
||||
v3 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "id",
|
||||
"storageKey": null
|
||||
},
|
||||
v4 = [
|
||||
{
|
||||
"kind": "Literal",
|
||||
"name": "first",
|
||||
"value": 10
|
||||
}
|
||||
],
|
||||
v5 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "name",
|
||||
"storageKey": null
|
||||
};
|
||||
return {
|
||||
"fragment": {
|
||||
"argumentDefinitions": (v0/*: any*/),
|
||||
"kind": "Fragment",
|
||||
"metadata": null,
|
||||
"name": "ProcessingActivityRegistriesPageQuery",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v1/*: any*/),
|
||||
"concreteType": null,
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"kind": "InlineFragment",
|
||||
"selections": [
|
||||
{
|
||||
"args": null,
|
||||
"kind": "FragmentSpread",
|
||||
"name": "ProcessingActivityRegistriesPageFragment"
|
||||
}
|
||||
],
|
||||
"type": "Organization",
|
||||
"abstractKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"type": "Query",
|
||||
"abstractKey": null
|
||||
},
|
||||
"kind": "Request",
|
||||
"operation": {
|
||||
"argumentDefinitions": (v0/*: any*/),
|
||||
"kind": "Operation",
|
||||
"name": "ProcessingActivityRegistriesPageQuery",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v1/*: any*/),
|
||||
"concreteType": null,
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v2/*: any*/),
|
||||
(v3/*: any*/),
|
||||
{
|
||||
"kind": "InlineFragment",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v4/*: any*/),
|
||||
"concreteType": "ProcessingActivityRegistryConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "processingActivityRegistries",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "totalCount",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "ProcessingActivityRegistryEdge",
|
||||
"kind": "LinkedField",
|
||||
"name": "edges",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "ProcessingActivityRegistry",
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/),
|
||||
(v5/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "purpose",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "dataSubjectCategory",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "personalDataCategory",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "lawfulBasis",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "location",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "internationalTransfers",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Audit",
|
||||
"kind": "LinkedField",
|
||||
"name": "audit",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/),
|
||||
(v5/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Framework",
|
||||
"kind": "LinkedField",
|
||||
"name": "framework",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/),
|
||||
(v5/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "createdAt",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "updatedAt",
|
||||
"storageKey": null
|
||||
},
|
||||
(v2/*: 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": "hasNextPage",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "endCursor",
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"kind": "ClientExtension",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "__id",
|
||||
"storageKey": null
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"storageKey": "processingActivityRegistries(first:10)"
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v4/*: any*/),
|
||||
"filters": null,
|
||||
"handle": "connection",
|
||||
"key": "ProcessingActivityRegistriesPage_processingActivityRegistries",
|
||||
"kind": "LinkedHandle",
|
||||
"name": "processingActivityRegistries"
|
||||
}
|
||||
],
|
||||
"type": "Organization",
|
||||
"abstractKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
]
|
||||
},
|
||||
"params": {
|
||||
"cacheID": "9fe4ad1f3cd0dbd50f63b9dd93a95df8",
|
||||
"id": null,
|
||||
"metadata": {},
|
||||
"name": "ProcessingActivityRegistriesPageQuery",
|
||||
"operationKind": "query",
|
||||
"text": "query ProcessingActivityRegistriesPageQuery(\n $organizationId: ID!\n) {\n node(id: $organizationId) {\n __typename\n ... on Organization {\n ...ProcessingActivityRegistriesPageFragment\n }\n id\n }\n}\n\nfragment ProcessingActivityRegistriesPageFragment on Organization {\n id\n processingActivityRegistries(first: 10) {\n totalCount\n edges {\n node {\n id\n name\n purpose\n dataSubjectCategory\n personalDataCategory\n lawfulBasis\n location\n internationalTransfers\n audit {\n id\n name\n framework {\n id\n name\n }\n }\n createdAt\n updatedAt\n __typename\n }\n cursor\n }\n pageInfo {\n hasNextPage\n endCursor\n }\n }\n}\n"
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "2d99b77d24e6583cb93580fdbf47ffb3";
|
||||
|
||||
export default node;
|
||||
@@ -0,0 +1,332 @@
|
||||
/**
|
||||
* @generated SignedSource<<eae0517caf3cfcc45963a0cc7bcd4dca>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
|
||||
/* tslint:disable */
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck
|
||||
|
||||
import { ConcreteRequest } from 'relay-runtime';
|
||||
import { FragmentRefs } from "relay-runtime";
|
||||
export type ProcessingActivityRegistriesPageRefetchQuery$variables = {
|
||||
after?: any | null | undefined;
|
||||
first?: number | null | undefined;
|
||||
id: string;
|
||||
};
|
||||
export type ProcessingActivityRegistriesPageRefetchQuery$data = {
|
||||
readonly node: {
|
||||
readonly " $fragmentSpreads": FragmentRefs<"ProcessingActivityRegistriesPageFragment">;
|
||||
};
|
||||
};
|
||||
export type ProcessingActivityRegistriesPageRefetchQuery = {
|
||||
response: ProcessingActivityRegistriesPageRefetchQuery$data;
|
||||
variables: ProcessingActivityRegistriesPageRefetchQuery$variables;
|
||||
};
|
||||
|
||||
const node: ConcreteRequest = (function(){
|
||||
var v0 = [
|
||||
{
|
||||
"defaultValue": null,
|
||||
"kind": "LocalArgument",
|
||||
"name": "after"
|
||||
},
|
||||
{
|
||||
"defaultValue": 10,
|
||||
"kind": "LocalArgument",
|
||||
"name": "first"
|
||||
},
|
||||
{
|
||||
"defaultValue": null,
|
||||
"kind": "LocalArgument",
|
||||
"name": "id"
|
||||
}
|
||||
],
|
||||
v1 = [
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "id",
|
||||
"variableName": "id"
|
||||
}
|
||||
],
|
||||
v2 = [
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "after",
|
||||
"variableName": "after"
|
||||
},
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "first",
|
||||
"variableName": "first"
|
||||
}
|
||||
],
|
||||
v3 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "__typename",
|
||||
"storageKey": null
|
||||
},
|
||||
v4 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "id",
|
||||
"storageKey": null
|
||||
},
|
||||
v5 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "name",
|
||||
"storageKey": null
|
||||
};
|
||||
return {
|
||||
"fragment": {
|
||||
"argumentDefinitions": (v0/*: any*/),
|
||||
"kind": "Fragment",
|
||||
"metadata": null,
|
||||
"name": "ProcessingActivityRegistriesPageRefetchQuery",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v1/*: any*/),
|
||||
"concreteType": null,
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"args": (v2/*: any*/),
|
||||
"kind": "FragmentSpread",
|
||||
"name": "ProcessingActivityRegistriesPageFragment"
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"type": "Query",
|
||||
"abstractKey": null
|
||||
},
|
||||
"kind": "Request",
|
||||
"operation": {
|
||||
"argumentDefinitions": (v0/*: any*/),
|
||||
"kind": "Operation",
|
||||
"name": "ProcessingActivityRegistriesPageRefetchQuery",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v1/*: any*/),
|
||||
"concreteType": null,
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/),
|
||||
(v4/*: any*/),
|
||||
{
|
||||
"kind": "InlineFragment",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v2/*: any*/),
|
||||
"concreteType": "ProcessingActivityRegistryConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "processingActivityRegistries",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "totalCount",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "ProcessingActivityRegistryEdge",
|
||||
"kind": "LinkedField",
|
||||
"name": "edges",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "ProcessingActivityRegistry",
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v4/*: any*/),
|
||||
(v5/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "purpose",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "dataSubjectCategory",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "personalDataCategory",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "lawfulBasis",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "location",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "internationalTransfers",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Audit",
|
||||
"kind": "LinkedField",
|
||||
"name": "audit",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v4/*: any*/),
|
||||
(v5/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Framework",
|
||||
"kind": "LinkedField",
|
||||
"name": "framework",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v4/*: any*/),
|
||||
(v5/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "createdAt",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "updatedAt",
|
||||
"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": "hasNextPage",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "endCursor",
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"kind": "ClientExtension",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "__id",
|
||||
"storageKey": null
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v2/*: any*/),
|
||||
"filters": null,
|
||||
"handle": "connection",
|
||||
"key": "ProcessingActivityRegistriesPage_processingActivityRegistries",
|
||||
"kind": "LinkedHandle",
|
||||
"name": "processingActivityRegistries"
|
||||
}
|
||||
],
|
||||
"type": "Organization",
|
||||
"abstractKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
]
|
||||
},
|
||||
"params": {
|
||||
"cacheID": "352606982d18141d1e790715a3554f8c",
|
||||
"id": null,
|
||||
"metadata": {},
|
||||
"name": "ProcessingActivityRegistriesPageRefetchQuery",
|
||||
"operationKind": "query",
|
||||
"text": "query ProcessingActivityRegistriesPageRefetchQuery(\n $after: CursorKey\n $first: Int = 10\n $id: ID!\n) {\n node(id: $id) {\n __typename\n ...ProcessingActivityRegistriesPageFragment_2HEEH6\n id\n }\n}\n\nfragment ProcessingActivityRegistriesPageFragment_2HEEH6 on Organization {\n id\n processingActivityRegistries(first: $first, after: $after) {\n totalCount\n edges {\n node {\n id\n name\n purpose\n dataSubjectCategory\n personalDataCategory\n lawfulBasis\n location\n internationalTransfers\n audit {\n id\n name\n framework {\n id\n name\n }\n }\n createdAt\n updatedAt\n __typename\n }\n cursor\n }\n pageInfo {\n hasNextPage\n endCursor\n }\n }\n}\n"
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "7e63a0911396373ab39811be65844b89";
|
||||
|
||||
export default node;
|
||||
@@ -0,0 +1,360 @@
|
||||
import { type ReactNode } from "react";
|
||||
import {
|
||||
Button,
|
||||
Field,
|
||||
useToast,
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogFooter,
|
||||
useDialogRef,
|
||||
Textarea,
|
||||
Breadcrumb,
|
||||
Label,
|
||||
Checkbox,
|
||||
Select,
|
||||
} from "@probo/ui";
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { z } from "zod";
|
||||
import { useFormWithSchema } from "/hooks/useFormWithSchema";
|
||||
import { useCreateProcessingActivityRegistry } from "../../../../hooks/graph/ProcessingActivityRegistryGraph";
|
||||
import { AuditSelectField } from "/components/form/AuditSelectField";
|
||||
import { Controller } from "react-hook-form";
|
||||
import {
|
||||
SpecialOrCriminalDataOptions,
|
||||
LawfulBasisOptions,
|
||||
TransferSafeguardsOptions,
|
||||
DataProtectionImpactAssessmentOptions,
|
||||
TransferImpactAssessmentOptions,
|
||||
} from "../../../../components/form/ProcessingActivityRegistryEnumOptions";
|
||||
|
||||
const schema = z.object({
|
||||
name: z.string().min(1, "Name is required"),
|
||||
purpose: z.string().optional(),
|
||||
dataSubjectCategory: z.string().optional(),
|
||||
personalDataCategory: z.string().optional(),
|
||||
specialOrCriminalData: z.enum(["YES", "NO", "POSSIBLE"] as const),
|
||||
consentEvidenceLink: z.string().optional(),
|
||||
lawfulBasis: z.enum(["CONSENT", "CONTRACTUAL_NECESSITY", "LEGAL_OBLIGATION", "LEGITIMATE_INTEREST", "PUBLIC_TASK", "VITAL_INTERESTS"] as const),
|
||||
recipients: z.string().optional(),
|
||||
location: z.string().optional(),
|
||||
internationalTransfers: z.boolean(),
|
||||
transferSafeguards: z.string(),
|
||||
retentionPeriod: z.string().optional(),
|
||||
securityMeasures: z.string().optional(),
|
||||
dataProtectionImpactAssessment: z.enum(["NEEDED", "NOT_NEEDED"] as const),
|
||||
transferImpactAssessment: z.enum(["NEEDED", "NOT_NEEDED"] as const),
|
||||
auditId: z.string().min(1, "Audit is required"),
|
||||
});
|
||||
|
||||
type FormData = z.infer<typeof schema>;
|
||||
|
||||
interface CreateProcessingActivityRegistryDialogProps {
|
||||
children: ReactNode;
|
||||
organizationId: string;
|
||||
connectionId?: string;
|
||||
}
|
||||
|
||||
export function CreateProcessingActivityRegistryDialog({
|
||||
children,
|
||||
organizationId,
|
||||
connectionId,
|
||||
}: CreateProcessingActivityRegistryDialogProps) {
|
||||
const { __ } = useTranslate();
|
||||
const { toast } = useToast();
|
||||
const dialogRef = useDialogRef();
|
||||
|
||||
const createRegistry = useCreateProcessingActivityRegistry(connectionId);
|
||||
|
||||
const { register, handleSubmit, formState, reset, control } = useFormWithSchema(schema, {
|
||||
defaultValues: {
|
||||
name: "",
|
||||
purpose: "",
|
||||
dataSubjectCategory: "",
|
||||
personalDataCategory: "",
|
||||
specialOrCriminalData: "NO" as const,
|
||||
consentEvidenceLink: "",
|
||||
lawfulBasis: "LEGITIMATE_INTEREST" as const,
|
||||
recipients: "",
|
||||
location: "",
|
||||
internationalTransfers: false,
|
||||
transferSafeguards: "__NONE__",
|
||||
retentionPeriod: "",
|
||||
securityMeasures: "",
|
||||
dataProtectionImpactAssessment: "NOT_NEEDED" as const,
|
||||
transferImpactAssessment: "NOT_NEEDED" as const,
|
||||
auditId: "",
|
||||
},
|
||||
});
|
||||
|
||||
const onSubmit = handleSubmit(async (formData: FormData) => {
|
||||
try {
|
||||
await createRegistry({
|
||||
organizationId,
|
||||
name: formData.name,
|
||||
purpose: formData.purpose || undefined,
|
||||
dataSubjectCategory: formData.dataSubjectCategory || undefined,
|
||||
personalDataCategory: formData.personalDataCategory || undefined,
|
||||
specialOrCriminalData: formData.specialOrCriminalData || undefined,
|
||||
consentEvidenceLink: formData.consentEvidenceLink || undefined,
|
||||
lawfulBasis: formData.lawfulBasis || undefined,
|
||||
recipients: formData.recipients || undefined,
|
||||
location: formData.location || undefined,
|
||||
internationalTransfers: formData.internationalTransfers,
|
||||
transferSafeguards: formData.transferSafeguards === "__NONE__" ? undefined : formData.transferSafeguards || undefined,
|
||||
retentionPeriod: formData.retentionPeriod || undefined,
|
||||
securityMeasures: formData.securityMeasures || undefined,
|
||||
dataProtectionImpactAssessment: formData.dataProtectionImpactAssessment || undefined,
|
||||
transferImpactAssessment: formData.transferImpactAssessment || undefined,
|
||||
auditId: formData.auditId,
|
||||
});
|
||||
|
||||
toast({
|
||||
title: __("Success"),
|
||||
description: __("Processing activity registry entry created successfully"),
|
||||
variant: "success",
|
||||
});
|
||||
|
||||
reset();
|
||||
dialogRef.current?.close();
|
||||
} catch (error) {
|
||||
toast({
|
||||
title: __("Error"),
|
||||
description: __("Failed to create processing activity registry entry"),
|
||||
variant: "error",
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
ref={dialogRef}
|
||||
trigger={children}
|
||||
title={<Breadcrumb items={[__("Registries"), __("Create Processing Activity Entry")]} />}
|
||||
className="max-w-4xl"
|
||||
>
|
||||
<form onSubmit={onSubmit}>
|
||||
<DialogContent padded className="space-y-6">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
|
||||
<div className="space-y-4">
|
||||
<Field
|
||||
label={__("Name")}
|
||||
{...register("name")}
|
||||
placeholder={__("Processing activity name")}
|
||||
error={formState.errors.name?.message}
|
||||
required
|
||||
/>
|
||||
|
||||
<AuditSelectField
|
||||
organizationId={organizationId}
|
||||
control={control}
|
||||
name="auditId"
|
||||
label={__("Audit")}
|
||||
error={formState.errors.auditId?.message}
|
||||
required
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Label>{__("Purpose")}</Label>
|
||||
<Textarea
|
||||
{...register("purpose")}
|
||||
placeholder={__("Describe the purpose of processing")}
|
||||
rows={3}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Field
|
||||
label={__("Data Subject Category")}
|
||||
{...register("dataSubjectCategory")}
|
||||
placeholder={__("e.g., employees, customers, prospects")}
|
||||
error={formState.errors.dataSubjectCategory?.message}
|
||||
/>
|
||||
|
||||
<Field
|
||||
label={__("Personal Data Category")}
|
||||
{...register("personalDataCategory")}
|
||||
placeholder={__("e.g., contact details, financial data")}
|
||||
error={formState.errors.personalDataCategory?.message}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="specialOrCriminalData">{__("Special or Criminal Data")} *</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="specialOrCriminalData"
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
id="specialOrCriminalData"
|
||||
placeholder={__("Select special or criminal data status")}
|
||||
onValueChange={field.onChange}
|
||||
value={field.value}
|
||||
className="w-full"
|
||||
>
|
||||
<SpecialOrCriminalDataOptions />
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
{formState.errors.specialOrCriminalData && (
|
||||
<p className="text-sm text-txt-danger mt-1">{formState.errors.specialOrCriminalData.message}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<Field
|
||||
label={__("Consent Evidence Link")}
|
||||
{...register("consentEvidenceLink")}
|
||||
placeholder={__("Link to consent evidence if applicable")}
|
||||
error={formState.errors.consentEvidenceLink?.message}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="lawfulBasis">{__("Lawful Basis")} *</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="lawfulBasis"
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
id="lawfulBasis"
|
||||
placeholder={__("Select lawful basis for processing")}
|
||||
onValueChange={field.onChange}
|
||||
value={field.value}
|
||||
className="w-full"
|
||||
>
|
||||
<LawfulBasisOptions />
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
{formState.errors.lawfulBasis && (
|
||||
<p className="text-sm text-txt-danger mt-1">{formState.errors.lawfulBasis.message}</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
<Field
|
||||
label={__("Recipients")}
|
||||
{...register("recipients")}
|
||||
placeholder={__("Who receives the data")}
|
||||
error={formState.errors.recipients?.message}
|
||||
/>
|
||||
|
||||
<Field
|
||||
label={__("Location")}
|
||||
{...register("location")}
|
||||
placeholder={__("Where is the data processed")}
|
||||
error={formState.errors.location?.message}
|
||||
/>
|
||||
|
||||
<Controller
|
||||
control={control}
|
||||
name="internationalTransfers"
|
||||
render={({ field }) => (
|
||||
<div>
|
||||
<Label>{__("International Transfers")}</Label>
|
||||
<div className="mt-2 flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={field.value}
|
||||
onChange={field.onChange}
|
||||
/>
|
||||
<span>{__("Data is transferred internationally")}</span>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="transferSafeguards">{__("Transfer Safeguards")}</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="transferSafeguards"
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
id="transferSafeguards"
|
||||
placeholder={__("Select transfer safeguards")}
|
||||
onValueChange={field.onChange}
|
||||
value={field.value}
|
||||
className="w-full"
|
||||
>
|
||||
<TransferSafeguardsOptions />
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
{formState.errors.transferSafeguards && (
|
||||
<p className="text-sm text-txt-danger mt-1">{formState.errors.transferSafeguards.message}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<Field
|
||||
label={__("Retention Period")}
|
||||
{...register("retentionPeriod")}
|
||||
placeholder={__("How long is data retained")}
|
||||
error={formState.errors.retentionPeriod?.message}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Label>{__("Security Measures")}</Label>
|
||||
<Textarea
|
||||
{...register("securityMeasures")}
|
||||
placeholder={__("Technical and organizational measures")}
|
||||
rows={2}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="dataProtectionImpactAssessment">{__("Data Protection Impact Assessment")} *</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="dataProtectionImpactAssessment"
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
id="dataProtectionImpactAssessment"
|
||||
placeholder={__("Is DPIA needed?")}
|
||||
onValueChange={field.onChange}
|
||||
value={field.value}
|
||||
className="w-full"
|
||||
>
|
||||
<DataProtectionImpactAssessmentOptions />
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
{formState.errors.dataProtectionImpactAssessment && (
|
||||
<p className="text-sm text-txt-danger mt-1">{formState.errors.dataProtectionImpactAssessment.message}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Label htmlFor="transferImpactAssessment">{__("Transfer Impact Assessment")} *</Label>
|
||||
<Controller
|
||||
control={control}
|
||||
name="transferImpactAssessment"
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
id="transferImpactAssessment"
|
||||
placeholder={__("Is TIA needed?")}
|
||||
onValueChange={field.onChange}
|
||||
value={field.value}
|
||||
className="w-full"
|
||||
>
|
||||
<TransferImpactAssessmentOptions />
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
{formState.errors.transferImpactAssessment && (
|
||||
<p className="text-sm text-txt-danger mt-1">{formState.errors.transferImpactAssessment.message}</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</DialogContent>
|
||||
|
||||
<DialogFooter>
|
||||
<Button
|
||||
type="submit"
|
||||
variant="primary"
|
||||
disabled={formState.isSubmitting}
|
||||
>
|
||||
{formState.isSubmitting ? __("Creating...") : __("Create Entry")}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</form>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user