Send mailing list emails
Signed-off-by: Sacha Al Himdani <sacha@getprobo.com>
This commit is contained in:
Sacha Al Himdani
@@ -1,5 +1,5 @@
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { Button, Card, Field, IconPlusLarge, Spinner, useDialogRef } from "@probo/ui";
|
||||
import { Button, Card, Field, IconPlusLarge, Spinner, TabItem, Tabs, useDialogRef } from "@probo/ui";
|
||||
import { useState } from "react";
|
||||
import { type PreloadedQuery, usePreloadedQuery } from "react-relay";
|
||||
import { ConnectionHandler, graphql } from "relay-runtime";
|
||||
@@ -9,7 +9,10 @@ import type { CompliancePageMailingListPageQuery } from "#/__generated__/core/Co
|
||||
import { useMutationWithToasts } from "#/hooks/useMutationWithToasts";
|
||||
|
||||
import { CompliancePageMailingList } from "./_components/CompliancePageMailingList";
|
||||
import { CompliancePageUpdatesList, type UpdateNode } from "./_components/CompliancePageUpdatesList";
|
||||
import { EditComplianceUpdateDialog } from "./_components/EditComplianceUpdateDialog";
|
||||
import { NewCompliancePageSubscriberDialog } from "./_components/NewCompliancePageSubscriberDialog";
|
||||
import { NewComplianceUpdateDialog } from "./_components/NewComplianceUpdateDialog";
|
||||
|
||||
export const compliancePageMailingListPageQuery = graphql`
|
||||
query CompliancePageMailingListPageQuery($organizationId: ID!) {
|
||||
@@ -21,6 +24,7 @@ export const compliancePageMailingListPageQuery = graphql`
|
||||
mailingList {
|
||||
id
|
||||
replyTo
|
||||
...CompliancePageUpdatesListFragment
|
||||
}
|
||||
...CompliancePageMailingListFragment
|
||||
}
|
||||
@@ -40,12 +44,19 @@ const updateMailingListMutation = graphql`
|
||||
}
|
||||
`;
|
||||
|
||||
type Tab = "updates" | "subscribers";
|
||||
|
||||
export function CompliancePageMailingListPage(props: {
|
||||
queryRef: PreloadedQuery<CompliancePageMailingListPageQuery>;
|
||||
}) {
|
||||
const { queryRef } = props;
|
||||
const { __ } = useTranslate();
|
||||
const dialogRef = useDialogRef();
|
||||
const subscriberDialogRef = useDialogRef();
|
||||
const newUpdateDialogRef = useDialogRef();
|
||||
const editUpdateDialogRef = useDialogRef();
|
||||
|
||||
const [activeTab, setActiveTab] = useState<Tab>("updates");
|
||||
const [selectedUpdate, setSelectedUpdate] = useState<UpdateNode | null>(null);
|
||||
|
||||
const { organization } = usePreloadedQuery<CompliancePageMailingListPageQuery>(
|
||||
compliancePageMailingListPageQuery,
|
||||
@@ -56,13 +67,18 @@ export function CompliancePageMailingListPage(props: {
|
||||
throw new Error("invalid type for node");
|
||||
}
|
||||
|
||||
const mailingList = organization.compliancePage.mailingList;
|
||||
const { compliancePage } = organization;
|
||||
const mailingList = compliancePage.mailingList;
|
||||
const mailingListId = mailingList?.id;
|
||||
|
||||
const connectionId = mailingListId
|
||||
const subscriberConnectionId = mailingListId
|
||||
? ConnectionHandler.getConnectionID(mailingListId, "CompliancePageMailingList_subscribers")
|
||||
: null;
|
||||
|
||||
const updatesConnectionId = mailingListId
|
||||
? ConnectionHandler.getConnectionID(mailingListId, "CompliancePageUpdatesList_updates")
|
||||
: null;
|
||||
|
||||
const [replyTo, setReplyTo] = useState(mailingList?.replyTo ?? "");
|
||||
|
||||
const [updateMailingList, isUpdating] = useMutationWithToasts<CompliancePageMailingListPage_updateMailingListMutation>(
|
||||
@@ -85,6 +101,11 @@ export function CompliancePageMailingListPage(props: {
|
||||
});
|
||||
};
|
||||
|
||||
const handleEditUpdate = (update: UpdateNode) => {
|
||||
setSelectedUpdate({ ...update });
|
||||
editUpdateDialogRef.current?.open();
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{mailingListId && (
|
||||
@@ -119,27 +140,57 @@ export function CompliancePageMailingListPage(props: {
|
||||
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center justify-between">
|
||||
<div>
|
||||
<h3 className="text-base font-medium">{__("Subscribers")}</h3>
|
||||
<p className="text-sm text-txt-tertiary">
|
||||
{__("People subscribed to receive security and compliance updates")}
|
||||
</p>
|
||||
</div>
|
||||
{mailingListId && (
|
||||
<Button icon={IconPlusLarge} onClick={() => dialogRef.current?.open()}>
|
||||
<Tabs>
|
||||
<TabItem active={activeTab === "updates"} onClick={() => setActiveTab("updates")}>
|
||||
{__("Updates")}
|
||||
</TabItem>
|
||||
<TabItem active={activeTab === "subscribers"} onClick={() => setActiveTab("subscribers")}>
|
||||
{__("Subscribers")}
|
||||
</TabItem>
|
||||
</Tabs>
|
||||
|
||||
{activeTab === "updates" && mailingListId && (
|
||||
<Button icon={IconPlusLarge} onClick={() => newUpdateDialogRef.current?.open()}>
|
||||
{__("Add Update")}
|
||||
</Button>
|
||||
)}
|
||||
{activeTab === "subscribers" && mailingListId && (
|
||||
<Button icon={IconPlusLarge} onClick={() => subscriberDialogRef.current?.open()}>
|
||||
{__("Add Subscriber")}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<CompliancePageMailingList fragmentRef={organization.compliancePage} />
|
||||
{activeTab === "updates" && mailingList && (
|
||||
<CompliancePageUpdatesList
|
||||
fragmentRef={mailingList}
|
||||
onEdit={handleEditUpdate}
|
||||
/>
|
||||
)}
|
||||
|
||||
{activeTab === "subscribers" && (
|
||||
<CompliancePageMailingList fragmentRef={compliancePage} />
|
||||
)}
|
||||
</div>
|
||||
|
||||
{mailingListId && connectionId && (
|
||||
<NewCompliancePageSubscriberDialog
|
||||
ref={dialogRef}
|
||||
{mailingListId && updatesConnectionId && (
|
||||
<NewComplianceUpdateDialog
|
||||
ref={newUpdateDialogRef}
|
||||
mailingListId={mailingListId}
|
||||
connectionId={connectionId}
|
||||
connectionId={updatesConnectionId}
|
||||
/>
|
||||
)}
|
||||
|
||||
<EditComplianceUpdateDialog
|
||||
ref={editUpdateDialogRef}
|
||||
update={selectedUpdate}
|
||||
/>
|
||||
|
||||
{mailingListId && subscriberConnectionId && (
|
||||
<NewCompliancePageSubscriberDialog
|
||||
ref={subscriberDialogRef}
|
||||
mailingListId={mailingListId}
|
||||
connectionId={subscriberConnectionId}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,209 @@
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { Badge, Button, IconChevronDown, IconPencil, IconSend, IconTrashCan, Spinner, Table, Tbody, Td, Th, Thead, Tr, useConfirm } from "@probo/ui";
|
||||
import { usePaginationFragment } from "react-relay";
|
||||
import { graphql } from "relay-runtime";
|
||||
|
||||
import type { CompliancePageUpdatesListDeleteMutation } from "#/__generated__/core/CompliancePageUpdatesListDeleteMutation.graphql";
|
||||
import type { CompliancePageUpdatesListFragment$data, CompliancePageUpdatesListFragment$key } from "#/__generated__/core/CompliancePageUpdatesListFragment.graphql";
|
||||
import type { CompliancePageUpdatesListQuery } from "#/__generated__/core/CompliancePageUpdatesListQuery.graphql";
|
||||
import type { CompliancePageUpdatesListSendMutation } from "#/__generated__/core/CompliancePageUpdatesListSendMutation.graphql";
|
||||
import { useMutationWithToasts } from "#/hooks/useMutationWithToasts";
|
||||
|
||||
const deleteMutation = graphql`
|
||||
mutation CompliancePageUpdatesListDeleteMutation(
|
||||
$input: DeleteMailingListUpdateInput!
|
||||
$connections: [ID!]!
|
||||
) {
|
||||
deleteMailingListUpdate(input: $input) {
|
||||
deletedMailingListUpdateId @deleteEdge(connections: $connections)
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const sendMutation = graphql`
|
||||
mutation CompliancePageUpdatesListSendMutation($input: SendMailingListUpdateInput!) {
|
||||
sendMailingListUpdate(input: $input) {
|
||||
mailingListUpdate {
|
||||
id
|
||||
title
|
||||
body
|
||||
status
|
||||
updatedAt
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const fragment = graphql`
|
||||
fragment CompliancePageUpdatesListFragment on MailingList
|
||||
@argumentDefinitions(
|
||||
first: { type: Int, defaultValue: 20 }
|
||||
after: { type: CursorKey, defaultValue: null }
|
||||
)
|
||||
@refetchable(queryName: "CompliancePageUpdatesListQuery") {
|
||||
updates(
|
||||
first: $first
|
||||
after: $after
|
||||
) @connection(key: "CompliancePageUpdatesList_updates") {
|
||||
__id
|
||||
pageInfo {
|
||||
hasNextPage
|
||||
endCursor
|
||||
}
|
||||
edges {
|
||||
node {
|
||||
id
|
||||
title
|
||||
body
|
||||
status
|
||||
createdAt
|
||||
updatedAt
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export type UpdateNode = CompliancePageUpdatesListFragment$data["updates"]["edges"][number]["node"];
|
||||
|
||||
export function CompliancePageUpdatesList(props: {
|
||||
fragmentRef: CompliancePageUpdatesListFragment$key;
|
||||
onEdit: (update: UpdateNode) => void;
|
||||
}) {
|
||||
const { fragmentRef, onEdit } = props;
|
||||
const { __ } = useTranslate();
|
||||
const confirm = useConfirm();
|
||||
|
||||
const { data, hasNext, loadNext, isLoadingNext } = usePaginationFragment<
|
||||
CompliancePageUpdatesListQuery,
|
||||
CompliancePageUpdatesListFragment$key
|
||||
>(fragment, fragmentRef);
|
||||
|
||||
const connection = data.updates;
|
||||
|
||||
const [deleteUpdate, isDeleting]
|
||||
= useMutationWithToasts<CompliancePageUpdatesListDeleteMutation>(deleteMutation, {
|
||||
successMessage: __("Update deleted successfully"),
|
||||
errorMessage: __("Failed to delete update"),
|
||||
});
|
||||
|
||||
const [sendUpdate, isSending]
|
||||
= useMutationWithToasts<CompliancePageUpdatesListSendMutation>(sendMutation, {
|
||||
successMessage: __("Update enqueued for delivery"),
|
||||
errorMessage: __("Failed to enqueue update for delivery"),
|
||||
});
|
||||
|
||||
const handleDelete = (id: string) => {
|
||||
void deleteUpdate({
|
||||
variables: {
|
||||
input: { id },
|
||||
connections: [connection.__id],
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handleSend = (node: UpdateNode) => {
|
||||
confirm(
|
||||
() =>
|
||||
sendUpdate({
|
||||
variables: {
|
||||
input: {
|
||||
id: node.id,
|
||||
},
|
||||
},
|
||||
}),
|
||||
{
|
||||
title: __("Send this update to all subscribers?"),
|
||||
message: `"${node.title}" — ${node.body.length > 120 ? node.body.slice(0, 120) + "…" : node.body}`,
|
||||
label: __("Send"),
|
||||
variant: "primary",
|
||||
},
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
{connection.edges.length === 0
|
||||
? (
|
||||
<Table>
|
||||
<Tbody>
|
||||
<Tr>
|
||||
<Td className="text-center text-txt-tertiary py-8">
|
||||
{__("No updates yet")}
|
||||
</Td>
|
||||
</Tr>
|
||||
</Tbody>
|
||||
</Table>
|
||||
)
|
||||
: (
|
||||
<>
|
||||
<Table>
|
||||
<Thead>
|
||||
<Tr>
|
||||
<Th>{__("Title")}</Th>
|
||||
<Th>{__("Status")}</Th>
|
||||
<Th>{__("Created")}</Th>
|
||||
<Th />
|
||||
</Tr>
|
||||
</Thead>
|
||||
<Tbody>
|
||||
{connection.edges.map(({ node }) => (
|
||||
<Tr key={node.id}>
|
||||
<Td>{node.title}</Td>
|
||||
<Td>
|
||||
<Badge variant={node.status === "SENT" ? "success" : node.status === "DRAFT" ? "warning" : "info"}>
|
||||
{node.status === "SENT" ? __("Sent") : node.status === "ENQUEUED" ? __("Queued") : node.status === "PROCESSING" ? __("Processing…") : __("Draft")}
|
||||
</Badge>
|
||||
</Td>
|
||||
<Td className="text-txt-tertiary text-sm">
|
||||
{new Date(node.createdAt).toLocaleDateString()}
|
||||
</Td>
|
||||
<Td className="w-auto">
|
||||
<div className="flex gap-1 justify-end">
|
||||
{node.status === "DRAFT" && (
|
||||
<Button
|
||||
icon={IconSend}
|
||||
disabled={isSending}
|
||||
onClick={() => handleSend(node)}
|
||||
className="bg-green-600 text-white hover:bg-green-700 active:bg-green-800 shadow-none"
|
||||
aria-label={__("Send")}
|
||||
>
|
||||
{__("Send")}
|
||||
</Button>
|
||||
)}
|
||||
<Button
|
||||
variant="tertiary"
|
||||
icon={IconPencil}
|
||||
onClick={() => onEdit(node)}
|
||||
aria-label={__("Edit update")}
|
||||
/>
|
||||
<Button
|
||||
variant="tertiary"
|
||||
icon={IconTrashCan}
|
||||
disabled={isDeleting}
|
||||
onClick={() => handleDelete(node.id)}
|
||||
aria-label={__("Delete update")}
|
||||
/>
|
||||
</div>
|
||||
</Td>
|
||||
</Tr>
|
||||
))}
|
||||
</Tbody>
|
||||
</Table>
|
||||
{hasNext && (
|
||||
<Button
|
||||
variant="tertiary"
|
||||
onClick={() => loadNext(10)}
|
||||
disabled={isLoadingNext}
|
||||
className="mt-3 mx-auto"
|
||||
icon={IconChevronDown}
|
||||
>
|
||||
{isLoadingNext && <Spinner />}
|
||||
{__("Show More")}
|
||||
</Button>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,118 @@
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { Button, Dialog, DialogContent, DialogFooter, type DialogRef, Field, IconCircleInfo, Spinner, Textarea } from "@probo/ui";
|
||||
import { useEffect } from "react";
|
||||
import { graphql } from "relay-runtime";
|
||||
import { z } from "zod";
|
||||
|
||||
import type { EditComplianceUpdateDialogMutation } from "#/__generated__/core/EditComplianceUpdateDialogMutation.graphql";
|
||||
import { useFormWithSchema } from "#/hooks/useFormWithSchema";
|
||||
import { useMutationWithToasts } from "#/hooks/useMutationWithToasts";
|
||||
|
||||
import type { UpdateNode } from "./CompliancePageUpdatesList";
|
||||
|
||||
const updateMutation = graphql`
|
||||
mutation EditComplianceUpdateDialogMutation($input: UpdateMailingListUpdateInput!) {
|
||||
updateMailingListUpdate(input: $input) {
|
||||
mailingListUpdate {
|
||||
id
|
||||
title
|
||||
body
|
||||
status
|
||||
updatedAt
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export function EditComplianceUpdateDialog(props: {
|
||||
update: UpdateNode | null;
|
||||
ref: DialogRef;
|
||||
}) {
|
||||
const { update, ref } = props;
|
||||
const { __ } = useTranslate();
|
||||
|
||||
const isSent = update?.status !== "DRAFT";
|
||||
|
||||
const schema = z.object({
|
||||
title: z.string().trim().min(1, __("Title is required")),
|
||||
body: z.string().trim().min(1, __("Body is required")),
|
||||
});
|
||||
|
||||
const form = useFormWithSchema(schema, {
|
||||
defaultValues: { title: "", body: "" },
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (update) {
|
||||
form.reset({ title: update.title, body: update.body });
|
||||
}
|
||||
}, [update, form]);
|
||||
|
||||
const [saveUpdate, isSaving] = useMutationWithToasts<EditComplianceUpdateDialogMutation>(
|
||||
updateMutation,
|
||||
{
|
||||
successMessage: __("Update saved successfully"),
|
||||
errorMessage: __("Failed to save update"),
|
||||
},
|
||||
);
|
||||
|
||||
const handleSubmit = async (data: { title: string; body: string }) => {
|
||||
if (!update) return;
|
||||
await saveUpdate({
|
||||
variables: {
|
||||
input: {
|
||||
id: update.id,
|
||||
title: data.title.trim(),
|
||||
body: data.body.trim(),
|
||||
},
|
||||
},
|
||||
onCompleted: (_, errors) => {
|
||||
if (!errors?.length) {
|
||||
ref.current?.close();
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog ref={ref} title={__("Edit Update")}>
|
||||
<form onSubmit={e => void form.handleSubmit(handleSubmit)(e)}>
|
||||
<DialogContent padded className="space-y-6">
|
||||
<div className="flex gap-2.5 rounded-lg bg-surface-secondary p-3 text-sm text-txt-secondary">
|
||||
<IconCircleInfo size={16} className="mt-0.5 shrink-0 text-txt-tertiary" />
|
||||
<p>
|
||||
{__("Do not include confidential or sensitive information in this update. Any content that requires protection should be placed behind your NDA-gated documents instead.")}
|
||||
</p>
|
||||
</div>
|
||||
<Field
|
||||
label={__("Title")}
|
||||
required
|
||||
disabled={isSent}
|
||||
error={form.formState.errors.title?.message}
|
||||
{...form.register("title")}
|
||||
/>
|
||||
<Field
|
||||
label={__("Body")}
|
||||
required
|
||||
error={form.formState.errors.body?.message}
|
||||
>
|
||||
<Textarea rows={6} disabled={isSent} {...form.register("body")} />
|
||||
</Field>
|
||||
{isSent && (
|
||||
<p className="text-sm text-txt-tertiary">
|
||||
{__("This update has been sent and can no longer be edited.")}
|
||||
</p>
|
||||
)}
|
||||
</DialogContent>
|
||||
<DialogFooter>
|
||||
{!isSent && (
|
||||
<Button type="submit" disabled={isSaving}>
|
||||
{isSaving && <Spinner />}
|
||||
{__("Save")}
|
||||
</Button>
|
||||
)}
|
||||
</DialogFooter>
|
||||
</form>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
@@ -36,7 +36,7 @@ export function NewCompliancePageSubscriberDialog(props: {
|
||||
const { __ } = useTranslate();
|
||||
|
||||
const schema = z.object({
|
||||
fullName: z.string().min(1, __("Full name is required")).trim(),
|
||||
fullName: z.string().trim().min(1, __("Full name is required")),
|
||||
email: z
|
||||
.string()
|
||||
.min(1, __("Email is required"))
|
||||
@@ -90,6 +90,7 @@ export function NewCompliancePageSubscriberDialog(props: {
|
||||
label={__("Full Name")}
|
||||
required
|
||||
error={form.formState.errors.fullName?.message}
|
||||
type="text"
|
||||
{...form.register("fullName")}
|
||||
placeholder={__("John Doe")}
|
||||
/>
|
||||
|
||||
@@ -0,0 +1,102 @@
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { Button, Dialog, DialogContent, DialogFooter, type DialogRef, Field, Spinner, Textarea } from "@probo/ui";
|
||||
import { graphql } from "relay-runtime";
|
||||
import { z } from "zod";
|
||||
|
||||
import type { NewComplianceUpdateDialogMutation } from "#/__generated__/core/NewComplianceUpdateDialogMutation.graphql";
|
||||
import { useFormWithSchema } from "#/hooks/useFormWithSchema";
|
||||
import { useMutationWithToasts } from "#/hooks/useMutationWithToasts";
|
||||
|
||||
const createMutation = graphql`
|
||||
mutation NewComplianceUpdateDialogMutation(
|
||||
$input: CreateMailingListUpdateInput!
|
||||
$connections: [ID!]!
|
||||
) {
|
||||
createMailingListUpdate(input: $input) {
|
||||
mailingListUpdate
|
||||
@prependNode(connections: $connections, edgeTypeName: "MailingListUpdateEdge") {
|
||||
id
|
||||
title
|
||||
body
|
||||
status
|
||||
createdAt
|
||||
updatedAt
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export function NewComplianceUpdateDialog(props: {
|
||||
mailingListId: string;
|
||||
connectionId: string;
|
||||
ref: DialogRef;
|
||||
onCreated?: () => void;
|
||||
}) {
|
||||
const { mailingListId, connectionId, ref, onCreated } = props;
|
||||
const { __ } = useTranslate();
|
||||
|
||||
const schema = z.object({
|
||||
title: z.string().trim().min(1, __("Title is required")),
|
||||
body: z.string().trim().min(1, __("Body is required")),
|
||||
});
|
||||
|
||||
const form = useFormWithSchema(schema, {
|
||||
defaultValues: { title: "", body: "" },
|
||||
});
|
||||
|
||||
const [createUpdate, isCreating] = useMutationWithToasts<NewComplianceUpdateDialogMutation>(
|
||||
createMutation,
|
||||
{
|
||||
successMessage: __("Update created successfully"),
|
||||
errorMessage: __("Failed to create update"),
|
||||
},
|
||||
);
|
||||
|
||||
const handleSubmit = async (data: { title: string; body: string }) => {
|
||||
await createUpdate({
|
||||
variables: {
|
||||
input: {
|
||||
mailingListId,
|
||||
title: data.title.trim(),
|
||||
body: data.body.trim(),
|
||||
},
|
||||
connections: [connectionId],
|
||||
},
|
||||
onCompleted: (_, errors) => {
|
||||
if (!errors?.length) {
|
||||
form.reset();
|
||||
ref.current?.close();
|
||||
onCreated?.();
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<Dialog ref={ref} title={__("Add Update")}>
|
||||
<form onSubmit={e => void form.handleSubmit(handleSubmit)(e)}>
|
||||
<DialogContent padded className="space-y-6">
|
||||
<Field
|
||||
label={__("Title")}
|
||||
required
|
||||
error={form.formState.errors.title?.message}
|
||||
{...form.register("title")}
|
||||
/>
|
||||
<Field
|
||||
label={__("Body")}
|
||||
required
|
||||
error={form.formState.errors.body?.message}
|
||||
>
|
||||
<Textarea rows={6} {...form.register("body")} />
|
||||
</Field>
|
||||
</DialogContent>
|
||||
<DialogFooter>
|
||||
<Button type="submit" disabled={isCreating}>
|
||||
{isCreating && <Spinner />}
|
||||
{__("Create")}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</form>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
@@ -4,8 +4,7 @@ import { useCallback, useState, useTransition } from "react";
|
||||
import { useRefetchableFragment } from "react-relay";
|
||||
import { ConnectionHandler, graphql } from "relay-runtime";
|
||||
|
||||
import type { CompliancePageFrameworkList_compliancePageFragment$key } from "#/__generated__/core/CompliancePageFrameworkList_compliancePageFragment.graphql";
|
||||
import type { CompliancePageFrameworkList_compliancePageFragment$data } from "#/__generated__/core/CompliancePageFrameworkList_compliancePageFragment.graphql";
|
||||
import type { CompliancePageFrameworkList_compliancePageFragment$data, CompliancePageFrameworkList_compliancePageFragment$key } from "#/__generated__/core/CompliancePageFrameworkList_compliancePageFragment.graphql";
|
||||
import type { CompliancePageFrameworkList_compliancePageRefetchQuery } from "#/__generated__/core/CompliancePageFrameworkList_compliancePageRefetchQuery.graphql";
|
||||
import type { CompliancePageFrameworkList_createMutation } from "#/__generated__/core/CompliancePageFrameworkList_createMutation.graphql";
|
||||
import type { CompliancePageFrameworkList_deleteMutation } from "#/__generated__/core/CompliancePageFrameworkList_deleteMutation.graphql";
|
||||
|
||||
Reference in New Issue
Block a user