Sacha Al Himdani
@@ -21,6 +21,7 @@ import {
|
||||
usePreloadedQuery,
|
||||
type PreloadedQuery,
|
||||
} from "react-relay";
|
||||
import { useParams } from "react-router";
|
||||
import { useOrganizationId } from "/hooks/useOrganizationId";
|
||||
import { CreateDatumDialog } from "./dialogs/CreateDatumDialog";
|
||||
import { useDeleteDatum, dataQuery } from "../../../hooks/graph/DatumGraph";
|
||||
@@ -28,27 +29,31 @@ import type { DatumGraphListQuery } from "/hooks/graph/__generated__/DatumGraphL
|
||||
import { faviconUrl } from "@probo/helpers";
|
||||
import type { NodeOf } from "/types";
|
||||
import type {
|
||||
DataPageFragment$data,
|
||||
DataPageFragment$key,
|
||||
DataPageFragment$data
|
||||
} from "./__generated__/DataPageFragment.graphql";
|
||||
import type { DataListQuery } from "./__generated__/DataListQuery.graphql";
|
||||
import { SortableTable } from "/components/SortableTable";
|
||||
import { SnapshotBanner } from "/components/SnapshotBanner";
|
||||
|
||||
const paginatedDataFragment = graphql`
|
||||
fragment DataPageFragment on Organization
|
||||
@refetchable(queryName: "DataListQuery")
|
||||
@argumentDefinitions(
|
||||
first: { type: "Int", defaultValue: 10 }
|
||||
orderBy: { type: "DatumOrder", defaultValue: null }
|
||||
order: { type: "DatumOrder", defaultValue: null }
|
||||
after: { type: "CursorKey", defaultValue: null }
|
||||
before: { type: "CursorKey", defaultValue: null }
|
||||
last: { type: "Int", defaultValue: null }
|
||||
snapshotId: { type: "ID", defaultValue: null }
|
||||
) {
|
||||
data(
|
||||
first: $first
|
||||
after: $after
|
||||
last: $last
|
||||
before: $before
|
||||
orderBy: $orderBy
|
||||
orderBy: $order
|
||||
filter: { snapshotId: $snapshotId }
|
||||
) @connection(key: "DataPage_data") {
|
||||
__id
|
||||
edges {
|
||||
@@ -84,34 +89,61 @@ type Props = {
|
||||
export default function DataPage(props: Props) {
|
||||
const { __ } = useTranslate();
|
||||
const organizationId = useOrganizationId();
|
||||
const { snapshotId } = useParams<{ snapshotId?: string }>();
|
||||
const isSnapshotMode = Boolean(snapshotId);
|
||||
|
||||
const data = usePreloadedQuery(dataQuery, props.queryRef);
|
||||
const pagination = usePaginationFragment(
|
||||
const queryData = usePreloadedQuery<DatumGraphListQuery>(
|
||||
dataQuery,
|
||||
props.queryRef
|
||||
);
|
||||
|
||||
const data = queryData.node;
|
||||
|
||||
const pagination = usePaginationFragment<DataListQuery, DataPageFragment$key>(
|
||||
paginatedDataFragment,
|
||||
data.node as DataPageFragment$key
|
||||
data
|
||||
);
|
||||
|
||||
const dataEntries = pagination.data.data.edges.map((edge) => edge.node);
|
||||
const connectionId = pagination.data.data.__id;
|
||||
|
||||
const refetch = ({ order }: { order: { direction: string; field: string } }) => {
|
||||
pagination.refetch({
|
||||
snapshotId,
|
||||
order: {
|
||||
direction: order.direction as "ASC" | "DESC",
|
||||
field: order.field as "CREATED_AT" | "DATA_CLASSIFICATION" | "NAME"
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
usePageTitle(__("Data"));
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
{isSnapshotMode && snapshotId && (
|
||||
<SnapshotBanner snapshotId={snapshotId} />
|
||||
)}
|
||||
<PageHeader
|
||||
title={__("Data")}
|
||||
description={__(
|
||||
"Manage your organization's data assets and their classifications."
|
||||
)}
|
||||
>
|
||||
<CreateDatumDialog
|
||||
connection={connectionId}
|
||||
organizationId={organizationId}
|
||||
>
|
||||
<Button icon={IconPlusLarge}>{__("Add data")}</Button>
|
||||
</CreateDatumDialog>
|
||||
{!snapshotId && (
|
||||
<CreateDatumDialog
|
||||
connection={connectionId}
|
||||
organizationId={organizationId}
|
||||
onCreated={() => pagination.refetch({ snapshotId })}
|
||||
>
|
||||
<Button icon={IconPlusLarge}>{__("Add data")}</Button>
|
||||
</CreateDatumDialog>
|
||||
)}
|
||||
</PageHeader>
|
||||
<SortableTable {...pagination}>
|
||||
<SortableTable
|
||||
{...pagination}
|
||||
refetch={refetch}
|
||||
>
|
||||
<Thead>
|
||||
<Tr>
|
||||
<Th>{__("Name")}</Th>
|
||||
@@ -123,7 +155,7 @@ export default function DataPage(props: Props) {
|
||||
</Thead>
|
||||
<Tbody>
|
||||
{dataEntries.map((entry) => (
|
||||
<DataRow key={entry.id} entry={entry} connectionId={connectionId} />
|
||||
<DataRow key={entry.id} entry={entry} connectionId={connectionId} snapshotId={snapshotId} />
|
||||
))}
|
||||
</Tbody>
|
||||
</SortableTable>
|
||||
@@ -134,17 +166,23 @@ export default function DataPage(props: Props) {
|
||||
function DataRow({
|
||||
entry,
|
||||
connectionId,
|
||||
snapshotId,
|
||||
}: {
|
||||
entry: DataEntry;
|
||||
connectionId: string;
|
||||
snapshotId?: string;
|
||||
}) {
|
||||
const organizationId = useOrganizationId();
|
||||
const { __ } = useTranslate();
|
||||
const deleteDatum = useDeleteDatum(entry, connectionId);
|
||||
const vendors = entry.vendors?.edges.map((edge) => edge.node) ?? [];
|
||||
|
||||
const detailUrl = snapshotId
|
||||
? `/organizations/${organizationId}/snapshots/${snapshotId}/data/${entry.id}`
|
||||
: `/organizations/${organizationId}/data/${entry.id}`;
|
||||
|
||||
return (
|
||||
<Tr to={`/organizations/${organizationId}/data/${entry.id}`}>
|
||||
<Tr to={detailUrl}>
|
||||
<Td>{entry.name}</Td>
|
||||
<Td>
|
||||
<Badge variant="info">{entry.dataClassification}</Badge>
|
||||
@@ -178,15 +216,16 @@ function DataRow({
|
||||
)}
|
||||
</Td>
|
||||
<Td noLink width={50} className="text-end">
|
||||
<ActionDropdown>
|
||||
<DropdownItem
|
||||
onClick={deleteDatum}
|
||||
variant="danger"
|
||||
icon={IconTrashCan}
|
||||
>
|
||||
{__("Delete")}
|
||||
</DropdownItem>
|
||||
</ActionDropdown>
|
||||
{!snapshotId && (<ActionDropdown>
|
||||
<DropdownItem
|
||||
onClick={deleteDatum}
|
||||
variant="danger"
|
||||
icon={IconTrashCan}
|
||||
>
|
||||
{__("Delete")}
|
||||
</DropdownItem>
|
||||
</ActionDropdown>
|
||||
)}
|
||||
</Td>
|
||||
</Tr>
|
||||
);
|
||||
|
||||
@@ -3,6 +3,7 @@ import {
|
||||
type PreloadedQuery,
|
||||
usePreloadedQuery,
|
||||
} from "react-relay";
|
||||
import { useParams } from "react-router";
|
||||
import {
|
||||
datumNodeQuery,
|
||||
useDeleteDatum,
|
||||
@@ -25,7 +26,8 @@ import { PeopleSelectField } from "/components/form/PeopleSelectField";
|
||||
import { VendorsMultiSelectField } from "/components/form/VendorsMultiSelectField";
|
||||
import { useFormWithSchema } from "/hooks/useFormWithSchema";
|
||||
import z from "zod";
|
||||
import type { DatumGraphNodeQuery } from "/hooks/graph/__generated__/DatumGraphNodeQuery.graphql.ts";
|
||||
import { SnapshotBanner } from "/components/SnapshotBanner";
|
||||
import type { DatumGraphNodeQuery } from "/hooks/graph/__generated__/DatumGraphNodeQuery.graphql";
|
||||
|
||||
const updateDatumSchema = z.object({
|
||||
name: z.string().min(1, "Name is required"),
|
||||
@@ -39,17 +41,26 @@ type Props = {
|
||||
};
|
||||
|
||||
export default function DatumDetailsPage(props: Props) {
|
||||
const datum = usePreloadedQuery(datumNodeQuery, props.queryRef);
|
||||
const datumEntry = datum.node;
|
||||
const { snapshotId } = useParams<{ snapshotId?: string }>();
|
||||
const isSnapshotMode = Boolean(snapshotId);
|
||||
|
||||
const queryData = usePreloadedQuery<DatumGraphNodeQuery>(
|
||||
datumNodeQuery,
|
||||
props.queryRef
|
||||
);
|
||||
|
||||
const datumEntry = queryData.node;
|
||||
|
||||
const { __ } = useTranslate();
|
||||
const organizationId = useOrganizationId();
|
||||
|
||||
const deleteDatum = useDeleteDatum(
|
||||
datumEntry,
|
||||
ConnectionHandler.getConnectionID(organizationId, "DataPage_data"),
|
||||
);
|
||||
|
||||
const vendors = datumEntry?.vendors?.edges.map((edge) => edge.node) ?? [];
|
||||
const vendorIds = vendors.map((vendor) => vendor.id);
|
||||
const vendors = datumEntry?.vendors?.edges.map(edge => edge.node) ?? [];
|
||||
const vendorIds = vendors.map(vendor => vendor.id);
|
||||
|
||||
const { control, formState, handleSubmit, register, reset } =
|
||||
useFormWithSchema(updateDatumSchema, {
|
||||
@@ -64,7 +75,7 @@ export default function DatumDetailsPage(props: Props) {
|
||||
const updateDatum = useUpdateDatum();
|
||||
|
||||
const onSubmit = handleSubmit(async (formData) => {
|
||||
if (!datumEntry.id) {
|
||||
if (!datumEntry?.id) {
|
||||
alert("id is missing from data");
|
||||
return;
|
||||
}
|
||||
@@ -79,44 +90,59 @@ export default function DatumDetailsPage(props: Props) {
|
||||
}
|
||||
});
|
||||
|
||||
const breadcrumbDataUrl = isSnapshotMode
|
||||
? `/organizations/${organizationId}/snapshots/${snapshotId}/data`
|
||||
: `/organizations/${organizationId}/data`;
|
||||
|
||||
const breadcrumbItems = [
|
||||
{
|
||||
label: __("Data"),
|
||||
to: breadcrumbDataUrl,
|
||||
},
|
||||
{
|
||||
label: datumEntry?.name || "",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<Breadcrumb
|
||||
items={[
|
||||
{
|
||||
label: __("Data"),
|
||||
to: `/organizations/${organizationId}/data`,
|
||||
},
|
||||
{
|
||||
label: datumEntry?.name ?? "",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
{isSnapshotMode && snapshotId && (
|
||||
<SnapshotBanner snapshotId={snapshotId} />
|
||||
)}
|
||||
<Breadcrumb items={breadcrumbItems} />
|
||||
|
||||
<div className="flex justify-between items-start">
|
||||
<div className="flex items-center gap-4">
|
||||
<div className="text-2xl">{datumEntry?.name}</div>
|
||||
<Badge variant="info">{datumEntry?.dataClassification}</Badge>
|
||||
</div>
|
||||
<ActionDropdown variant="secondary">
|
||||
<DropdownItem
|
||||
variant="danger"
|
||||
icon={IconTrashCan}
|
||||
onClick={deleteDatum}
|
||||
>
|
||||
{__("Delete")}
|
||||
</DropdownItem>
|
||||
</ActionDropdown>
|
||||
{!isSnapshotMode && (
|
||||
<ActionDropdown variant="secondary">
|
||||
<DropdownItem
|
||||
variant="danger"
|
||||
icon={IconTrashCan}
|
||||
onClick={deleteDatum}
|
||||
>
|
||||
{__("Delete")}
|
||||
</DropdownItem>
|
||||
</ActionDropdown>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<form onSubmit={onSubmit} className="space-y-6 max-w-2xl">
|
||||
<Field label={__("Name")} {...register("name")} type="text" />
|
||||
<Field
|
||||
label={__("Name")}
|
||||
{...register("name")}
|
||||
type="text"
|
||||
disabled={isSnapshotMode}
|
||||
/>
|
||||
|
||||
<ControlledField
|
||||
control={control}
|
||||
name="dataClassification"
|
||||
type="select"
|
||||
label={__("Classification")}
|
||||
disabled={isSnapshotMode}
|
||||
>
|
||||
<Option value="PUBLIC">{__("Public")}</Option>
|
||||
<Option value="INTERNAL">{__("Internal")}</Option>
|
||||
@@ -129,6 +155,7 @@ export default function DatumDetailsPage(props: Props) {
|
||||
control={control}
|
||||
name="ownerId"
|
||||
label={__("Owner")}
|
||||
disabled={isSnapshotMode}
|
||||
/>
|
||||
|
||||
<VendorsMultiSelectField
|
||||
@@ -136,15 +163,19 @@ export default function DatumDetailsPage(props: Props) {
|
||||
control={control}
|
||||
name="vendorIds"
|
||||
label={__("Vendors")}
|
||||
disabled={isSnapshotMode}
|
||||
selectedVendors={vendors}
|
||||
/>
|
||||
|
||||
<div className="flex justify-end">
|
||||
{formState.isDirty && (
|
||||
<Button type="submit" disabled={formState.isSubmitting}>
|
||||
{formState.isSubmitting ? __("Updating...") : __("Update")}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
{!isSnapshotMode && (
|
||||
<div className="flex justify-end">
|
||||
{formState.isDirty && (
|
||||
<Button type="submit" disabled={formState.isSubmitting}>
|
||||
{formState.isSubmitting ? __("Updating...") : __("Update")}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/**
|
||||
* @generated SignedSource<<4894c4387072fb7ac2f379ab04b4168a>>
|
||||
* @generated SignedSource<<8364d9457b59a3ef50b508ab55991638>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
@@ -22,7 +22,8 @@ export type DataListQuery$variables = {
|
||||
first?: number | null | undefined;
|
||||
id: string;
|
||||
last?: number | null | undefined;
|
||||
orderBy?: DatumOrder | null | undefined;
|
||||
order?: DatumOrder | null | undefined;
|
||||
snapshotId?: string | null | undefined;
|
||||
};
|
||||
export type DataListQuery$data = {
|
||||
readonly node: {
|
||||
@@ -63,57 +64,78 @@ v4 = {
|
||||
v5 = {
|
||||
"defaultValue": null,
|
||||
"kind": "LocalArgument",
|
||||
"name": "orderBy"
|
||||
"name": "order"
|
||||
},
|
||||
v6 = [
|
||||
v6 = {
|
||||
"defaultValue": null,
|
||||
"kind": "LocalArgument",
|
||||
"name": "snapshotId"
|
||||
},
|
||||
v7 = [
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "id",
|
||||
"variableName": "id"
|
||||
}
|
||||
],
|
||||
v7 = [
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "after",
|
||||
"variableName": "after"
|
||||
},
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "before",
|
||||
"variableName": "before"
|
||||
},
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "first",
|
||||
"variableName": "first"
|
||||
},
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "last",
|
||||
"variableName": "last"
|
||||
},
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "orderBy",
|
||||
"variableName": "orderBy"
|
||||
}
|
||||
],
|
||||
v8 = {
|
||||
"kind": "Variable",
|
||||
"name": "after",
|
||||
"variableName": "after"
|
||||
},
|
||||
v9 = {
|
||||
"kind": "Variable",
|
||||
"name": "before",
|
||||
"variableName": "before"
|
||||
},
|
||||
v10 = {
|
||||
"kind": "Variable",
|
||||
"name": "first",
|
||||
"variableName": "first"
|
||||
},
|
||||
v11 = {
|
||||
"kind": "Variable",
|
||||
"name": "last",
|
||||
"variableName": "last"
|
||||
},
|
||||
v12 = {
|
||||
"kind": "Variable",
|
||||
"name": "snapshotId",
|
||||
"variableName": "snapshotId"
|
||||
},
|
||||
v13 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "__typename",
|
||||
"storageKey": null
|
||||
},
|
||||
v9 = {
|
||||
v14 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "id",
|
||||
"storageKey": null
|
||||
},
|
||||
v10 = {
|
||||
v15 = [
|
||||
(v8/*: any*/),
|
||||
(v9/*: any*/),
|
||||
{
|
||||
"fields": [
|
||||
(v12/*: any*/)
|
||||
],
|
||||
"kind": "ObjectValue",
|
||||
"name": "filter"
|
||||
},
|
||||
(v10/*: any*/),
|
||||
(v11/*: any*/),
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "orderBy",
|
||||
"variableName": "order"
|
||||
}
|
||||
],
|
||||
v16 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
@@ -128,7 +150,8 @@ return {
|
||||
(v2/*: any*/),
|
||||
(v3/*: any*/),
|
||||
(v4/*: any*/),
|
||||
(v5/*: any*/)
|
||||
(v5/*: any*/),
|
||||
(v6/*: any*/)
|
||||
],
|
||||
"kind": "Fragment",
|
||||
"metadata": null,
|
||||
@@ -136,14 +159,25 @@ return {
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v6/*: any*/),
|
||||
"args": (v7/*: any*/),
|
||||
"concreteType": null,
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"args": (v7/*: any*/),
|
||||
"args": [
|
||||
(v8/*: any*/),
|
||||
(v9/*: any*/),
|
||||
(v10/*: any*/),
|
||||
(v11/*: any*/),
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "order",
|
||||
"variableName": "order"
|
||||
},
|
||||
(v12/*: any*/)
|
||||
],
|
||||
"kind": "FragmentSpread",
|
||||
"name": "DataPageFragment"
|
||||
}
|
||||
@@ -162,6 +196,7 @@ return {
|
||||
(v2/*: any*/),
|
||||
(v4/*: any*/),
|
||||
(v5/*: any*/),
|
||||
(v6/*: any*/),
|
||||
(v3/*: any*/)
|
||||
],
|
||||
"kind": "Operation",
|
||||
@@ -169,20 +204,20 @@ return {
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v6/*: any*/),
|
||||
"args": (v7/*: any*/),
|
||||
"concreteType": null,
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v8/*: any*/),
|
||||
(v9/*: any*/),
|
||||
(v13/*: any*/),
|
||||
(v14/*: any*/),
|
||||
{
|
||||
"kind": "InlineFragment",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v7/*: any*/),
|
||||
"args": (v15/*: any*/),
|
||||
"concreteType": "DatumConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "data",
|
||||
@@ -204,8 +239,8 @@ return {
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v9/*: any*/),
|
||||
(v10/*: any*/),
|
||||
(v14/*: any*/),
|
||||
(v16/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
@@ -228,7 +263,7 @@ return {
|
||||
"name": "fullName",
|
||||
"storageKey": null
|
||||
},
|
||||
(v9/*: any*/)
|
||||
(v14/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
@@ -262,8 +297,8 @@ return {
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v9/*: any*/),
|
||||
(v10/*: any*/),
|
||||
(v14/*: any*/),
|
||||
(v16/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
@@ -287,7 +322,7 @@ return {
|
||||
"name": "createdAt",
|
||||
"storageKey": null
|
||||
},
|
||||
(v8/*: any*/)
|
||||
(v13/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
@@ -357,9 +392,10 @@ return {
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v7/*: any*/),
|
||||
"args": (v15/*: any*/),
|
||||
"filters": [
|
||||
"orderBy"
|
||||
"orderBy",
|
||||
"filter"
|
||||
],
|
||||
"handle": "connection",
|
||||
"key": "DataPage_data",
|
||||
@@ -376,16 +412,16 @@ return {
|
||||
]
|
||||
},
|
||||
"params": {
|
||||
"cacheID": "d6742fb1de534407018aeb39ca1438d5",
|
||||
"cacheID": "dbca2ff147e8b1e367a266fcf016b184",
|
||||
"id": null,
|
||||
"metadata": {},
|
||||
"name": "DataListQuery",
|
||||
"operationKind": "query",
|
||||
"text": "query DataListQuery(\n $after: CursorKey = null\n $before: CursorKey = null\n $first: Int = 10\n $last: Int = null\n $orderBy: DatumOrder = null\n $id: ID!\n) {\n node(id: $id) {\n __typename\n ...DataPageFragment_sdb03\n id\n }\n}\n\nfragment DataPageFragment_sdb03 on Organization {\n data(first: $first, after: $after, last: $last, before: $before, orderBy: $orderBy) {\n edges {\n node {\n id\n name\n dataClassification\n owner {\n fullName\n id\n }\n vendors(first: 50) {\n edges {\n node {\n id\n name\n websiteUrl\n }\n }\n }\n createdAt\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n }\n id\n}\n"
|
||||
"text": "query DataListQuery(\n $after: CursorKey = null\n $before: CursorKey = null\n $first: Int = 10\n $last: Int = null\n $order: DatumOrder = null\n $snapshotId: ID = null\n $id: ID!\n) {\n node(id: $id) {\n __typename\n ...DataPageFragment_25MC8O\n id\n }\n}\n\nfragment DataPageFragment_25MC8O on Organization {\n data(first: $first, after: $after, last: $last, before: $before, orderBy: $order, filter: {snapshotId: $snapshotId}) {\n edges {\n node {\n id\n name\n dataClassification\n owner {\n fullName\n id\n }\n vendors(first: 50) {\n edges {\n node {\n id\n name\n websiteUrl\n }\n }\n }\n createdAt\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n hasPreviousPage\n startCursor\n }\n }\n id\n}\n"
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "a797d00b7f2cac2876322b23aa781efa";
|
||||
(node as any).hash = "a60d9b34a83df89eb59ffcd359903ce8";
|
||||
|
||||
export default node;
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
/**
|
||||
* @generated SignedSource<<0eb94f0da29f50445248a3d133714be2>>
|
||||
* @generated SignedSource<<17f6d8607b6d2a1b575e1251019b8375>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
@@ -88,7 +88,12 @@ return {
|
||||
{
|
||||
"defaultValue": null,
|
||||
"kind": "LocalArgument",
|
||||
"name": "orderBy"
|
||||
"name": "order"
|
||||
},
|
||||
{
|
||||
"defaultValue": null,
|
||||
"kind": "LocalArgument",
|
||||
"name": "snapshotId"
|
||||
}
|
||||
],
|
||||
"kind": "Fragment",
|
||||
@@ -128,10 +133,21 @@ return {
|
||||
{
|
||||
"alias": "data",
|
||||
"args": [
|
||||
{
|
||||
"fields": [
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "snapshotId",
|
||||
"variableName": "snapshotId"
|
||||
}
|
||||
],
|
||||
"kind": "ObjectValue",
|
||||
"name": "filter"
|
||||
},
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "orderBy",
|
||||
"variableName": "orderBy"
|
||||
"variableName": "order"
|
||||
}
|
||||
],
|
||||
"concreteType": "DatumConnection",
|
||||
@@ -318,6 +334,6 @@ return {
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "a797d00b7f2cac2876322b23aa781efa";
|
||||
(node as any).hash = "a60d9b34a83df89eb59ffcd359903ce8";
|
||||
|
||||
export default node;
|
||||
|
||||
@@ -27,12 +27,14 @@ type Props = {
|
||||
children: React.ReactNode;
|
||||
connection: string;
|
||||
organizationId: string;
|
||||
onCreated?: () => void;
|
||||
};
|
||||
|
||||
export function CreateDatumDialog({
|
||||
children,
|
||||
connection,
|
||||
organizationId,
|
||||
onCreated,
|
||||
}: Props) {
|
||||
const { __ } = useTranslate();
|
||||
const { control, handleSubmit, register, formState, reset } =
|
||||
@@ -55,6 +57,7 @@ export function CreateDatumDialog({
|
||||
});
|
||||
ref.current?.close();
|
||||
reset();
|
||||
onCreated?.();
|
||||
} catch (error) {
|
||||
console.error("Failed to create datum:", error);
|
||||
}
|
||||
|
||||
176
apps/console/src/pages/organizations/snapshots/SnapshotsPage.tsx
Normal file
176
apps/console/src/pages/organizations/snapshots/SnapshotsPage.tsx
Normal file
@@ -0,0 +1,176 @@
|
||||
import type { SnapshotGraphListQuery } from "/hooks/graph/__generated__/SnapshotGraphListQuery.graphql";
|
||||
import {
|
||||
useFragment,
|
||||
usePreloadedQuery,
|
||||
type PreloadedQuery,
|
||||
} from "react-relay";
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { getSnapshotTypeLabel } from "@probo/helpers";
|
||||
import {
|
||||
ActionDropdown,
|
||||
Button,
|
||||
DropdownItem,
|
||||
IconPlusLarge,
|
||||
IconTrashCan,
|
||||
PageHeader,
|
||||
Table,
|
||||
Tbody,
|
||||
Td,
|
||||
Th,
|
||||
Thead,
|
||||
Tr,
|
||||
} from "@probo/ui";
|
||||
import {
|
||||
snapshotsQuery,
|
||||
useDeleteSnapshot,
|
||||
} from "/hooks/graph/SnapshotGraph";
|
||||
import { graphql } from "relay-runtime";
|
||||
import type {
|
||||
SnapshotsPageFragment$data,
|
||||
SnapshotsPageFragment$key,
|
||||
} from "./__generated__/SnapshotsPageFragment.graphql";
|
||||
import type { NodeOf } from "/types";
|
||||
import SnapshotFormDialog from "./dialog/SnapshotFormDialog";
|
||||
import { usePageTitle } from "@probo/hooks";
|
||||
import { useOrganizationId } from "/hooks/useOrganizationId";
|
||||
|
||||
type Props = {
|
||||
queryRef: PreloadedQuery<SnapshotGraphListQuery>;
|
||||
};
|
||||
|
||||
const snapshotsFragment = graphql`
|
||||
fragment SnapshotsPageFragment on Organization {
|
||||
snapshots(first: 100) @connection(key: "SnapshotsGraphListQuery__snapshots") {
|
||||
__id
|
||||
edges {
|
||||
node {
|
||||
id
|
||||
name
|
||||
description
|
||||
type
|
||||
createdAt
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export default function SnapshotsPage(props: Props) {
|
||||
const { __ } = useTranslate();
|
||||
const organizationId = useOrganizationId();
|
||||
const organization = usePreloadedQuery(
|
||||
snapshotsQuery,
|
||||
props.queryRef
|
||||
).organization;
|
||||
const data = useFragment<SnapshotsPageFragment$key>(
|
||||
snapshotsFragment,
|
||||
organization
|
||||
);
|
||||
const connectionId = data.snapshots.__id;
|
||||
const snapshots = data.snapshots.edges.map((edge) => edge.node);
|
||||
usePageTitle(__("Snapshots"));
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<PageHeader
|
||||
title={__("Snapshots")}
|
||||
description={__(
|
||||
"Snapshots capture point-in-time views of your organization's compliance state. Create snapshots to track progress over time."
|
||||
)}
|
||||
>
|
||||
<SnapshotFormDialog connection={connectionId}>
|
||||
<Button variant="primary" icon={IconPlusLarge}>
|
||||
{__("New snapshot")}
|
||||
</Button>
|
||||
</SnapshotFormDialog>
|
||||
</PageHeader>
|
||||
|
||||
{snapshots.length > 0 ? (
|
||||
<Table>
|
||||
<Thead>
|
||||
<Tr>
|
||||
<Th>{__("Name")}</Th>
|
||||
<Th>{__("Type")}</Th>
|
||||
<Th>{__("Description")}</Th>
|
||||
<Th>{__("Created")}</Th>
|
||||
<Th></Th>
|
||||
</Tr>
|
||||
</Thead>
|
||||
<Tbody>
|
||||
{snapshots.map((snapshot) => (
|
||||
<SnapshotRow
|
||||
key={snapshot.id}
|
||||
snapshot={snapshot}
|
||||
connectionId={connectionId}
|
||||
organizationId={organizationId}
|
||||
/>
|
||||
))}
|
||||
</Tbody>
|
||||
</Table>
|
||||
) : (
|
||||
<div className="text-center py-12">
|
||||
<h3 className="text-lg font-medium text-txt-secondary mb-2">
|
||||
{__("No snapshots yet")}
|
||||
</h3>
|
||||
<p className="text-txt-tertiary mb-6">
|
||||
{__("Create your first snapshot to get started")}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
type SnapshotRowProps = {
|
||||
snapshot: NodeOf<SnapshotsPageFragment$data["snapshots"]>;
|
||||
connectionId: string;
|
||||
organizationId: string;
|
||||
};
|
||||
|
||||
function SnapshotRow(props: SnapshotRowProps) {
|
||||
const { __, dateFormat } = useTranslate();
|
||||
const deleteSnapshot = useDeleteSnapshot(props.snapshot, props.connectionId);
|
||||
|
||||
const getSnapshotUrl = (snapshot: SnapshotRowProps["snapshot"]) => {
|
||||
const baseUrl = `/organizations/${props.organizationId}/snapshots/${snapshot.id}`;
|
||||
|
||||
switch (snapshot.type) {
|
||||
case "DATA":
|
||||
return `${baseUrl}/data`;
|
||||
case "VENDORS":
|
||||
return `${baseUrl}/vendors`;
|
||||
case "RISKS":
|
||||
return `${baseUrl}/risks`;
|
||||
case "ASSETS":
|
||||
return `${baseUrl}/assets`;
|
||||
default:
|
||||
return baseUrl;
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Tr to={getSnapshotUrl(props.snapshot)}>
|
||||
<Td className="font-medium">{props.snapshot.name}</Td>
|
||||
<Td className="text-txt-secondary">
|
||||
{getSnapshotTypeLabel(__, props.snapshot.type)}
|
||||
</Td>
|
||||
<Td className="text-txt-secondary">
|
||||
{props.snapshot.description || __("No description")}
|
||||
</Td>
|
||||
<Td className="text-txt-tertiary">
|
||||
{dateFormat(props.snapshot.createdAt, { year: "numeric", month: "short", day: "numeric" })}
|
||||
</Td>
|
||||
<Td noLink width={50} className="text-end">
|
||||
<ActionDropdown>
|
||||
<DropdownItem
|
||||
onClick={deleteSnapshot}
|
||||
variant="danger"
|
||||
icon={IconTrashCan}
|
||||
>
|
||||
{__("Delete")}
|
||||
</DropdownItem>
|
||||
</ActionDropdown>
|
||||
</Td>
|
||||
</Tr>
|
||||
);
|
||||
}
|
||||
177
apps/console/src/pages/organizations/snapshots/__generated__/SnapshotsPageFragment.graphql.ts
generated
Normal file
177
apps/console/src/pages/organizations/snapshots/__generated__/SnapshotsPageFragment.graphql.ts
generated
Normal file
@@ -0,0 +1,177 @@
|
||||
/**
|
||||
* @generated SignedSource<<05658205222e432a115cecc9c8f34d05>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
|
||||
/* tslint:disable */
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck
|
||||
|
||||
import { ReaderFragment } from 'relay-runtime';
|
||||
export type SnapshotsType = "ASSETS" | "COMPLIANCE_REGISTRIES" | "DATA" | "NON_CONFORMITY_REGISTRIES" | "RISKS" | "VENDORS";
|
||||
import { FragmentRefs } from "relay-runtime";
|
||||
export type SnapshotsPageFragment$data = {
|
||||
readonly snapshots: {
|
||||
readonly __id: string;
|
||||
readonly edges: ReadonlyArray<{
|
||||
readonly node: {
|
||||
readonly createdAt: any;
|
||||
readonly description: string | null | undefined;
|
||||
readonly id: string;
|
||||
readonly name: string;
|
||||
readonly type: SnapshotsType;
|
||||
};
|
||||
}>;
|
||||
};
|
||||
readonly " $fragmentType": "SnapshotsPageFragment";
|
||||
};
|
||||
export type SnapshotsPageFragment$key = {
|
||||
readonly " $data"?: SnapshotsPageFragment$data;
|
||||
readonly " $fragmentSpreads": FragmentRefs<"SnapshotsPageFragment">;
|
||||
};
|
||||
|
||||
const node: ReaderFragment = {
|
||||
"argumentDefinitions": [],
|
||||
"kind": "Fragment",
|
||||
"metadata": {
|
||||
"connection": [
|
||||
{
|
||||
"count": null,
|
||||
"cursor": null,
|
||||
"direction": "forward",
|
||||
"path": [
|
||||
"snapshots"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "SnapshotsPageFragment",
|
||||
"selections": [
|
||||
{
|
||||
"alias": "snapshots",
|
||||
"args": null,
|
||||
"concreteType": "SnapshotConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "__SnapshotsGraphListQuery__snapshots_connection",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "SnapshotEdge",
|
||||
"kind": "LinkedField",
|
||||
"name": "edges",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Snapshot",
|
||||
"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": "description",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "type",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "createdAt",
|
||||
"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": "endCursor",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "hasNextPage",
|
||||
"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 = "700dede55fd00f2b57dbbb6ed2e2613d";
|
||||
|
||||
export default node;
|
||||
@@ -0,0 +1,145 @@
|
||||
import {
|
||||
Button,
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogFooter,
|
||||
Input,
|
||||
Label,
|
||||
PropertyRow,
|
||||
Textarea,
|
||||
useDialogRef,
|
||||
} from "@probo/ui";
|
||||
import type { ReactNode } from "react";
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { Breadcrumb } from "@probo/ui";
|
||||
import { graphql } from "relay-runtime";
|
||||
import { z } from "zod";
|
||||
import { useFormWithSchema } from "/hooks/useFormWithSchema";
|
||||
import { useMutationWithToasts } from "/hooks/useMutationWithToasts";
|
||||
import { useOrganizationId } from "/hooks/useOrganizationId";
|
||||
import { ControlledField } from "/components/form/ControlledField";
|
||||
import { SnapshotTypeOptions } from "/components/form/SnapshotTypeOptions";
|
||||
|
||||
const snapshotCreateMutation = graphql`
|
||||
mutation SnapshotFormDialogCreateMutation(
|
||||
$input: CreateSnapshotInput!
|
||||
$connections: [ID!]!
|
||||
) {
|
||||
createSnapshot(input: $input) {
|
||||
snapshotEdge @prependEdge(connections: $connections) {
|
||||
node {
|
||||
id
|
||||
name
|
||||
description
|
||||
type
|
||||
createdAt
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const snapshotSchema = z.object({
|
||||
name: z.string().min(2, { message: "Name is required" }),
|
||||
description: z.string().optional(),
|
||||
type: z.enum(["RISKS", "VENDORS", "ASSETS", "DATA", "NON_CONFORMITY_REGISTRIES", "COMPLIANCE_REGISTRIES"]),
|
||||
});
|
||||
|
||||
type Props = {
|
||||
children?: ReactNode;
|
||||
connection?: string;
|
||||
};
|
||||
|
||||
export default function SnapshotFormDialog(props: Props) {
|
||||
const { __ } = useTranslate();
|
||||
const dialogRef = useDialogRef();
|
||||
const organizationId = useOrganizationId();
|
||||
const [mutate] = useMutationWithToasts(snapshotCreateMutation, {
|
||||
successMessage: __("Snapshot created successfully."),
|
||||
errorMessage: __("Failed to create snapshot. Please try again."),
|
||||
});
|
||||
|
||||
const { handleSubmit, register, reset, control, formState: { errors } } =
|
||||
useFormWithSchema(snapshotSchema, {
|
||||
defaultValues: {
|
||||
name: "",
|
||||
description: "",
|
||||
type: "RISKS",
|
||||
},
|
||||
});
|
||||
|
||||
const onSubmit = handleSubmit(async (data) => {
|
||||
await mutate({
|
||||
variables: {
|
||||
input: {
|
||||
organizationId,
|
||||
name: data.name,
|
||||
description: data.description || undefined,
|
||||
type: data.type,
|
||||
},
|
||||
connections: props.connection ? [props.connection] : [],
|
||||
},
|
||||
});
|
||||
reset();
|
||||
dialogRef.current?.close();
|
||||
});
|
||||
|
||||
return (
|
||||
<Dialog
|
||||
ref={dialogRef}
|
||||
trigger={props.children}
|
||||
title={
|
||||
<Breadcrumb
|
||||
items={[
|
||||
__("Snapshots"),
|
||||
__("New Snapshot"),
|
||||
]}
|
||||
/>
|
||||
}
|
||||
>
|
||||
<form onSubmit={onSubmit}>
|
||||
<DialogContent className="grid grid-cols-[1fr_420px]">
|
||||
<div className="py-8 px-10 space-y-4">
|
||||
<Input
|
||||
id="name"
|
||||
required
|
||||
variant="title"
|
||||
placeholder={__("Snapshot name")}
|
||||
{...register("name")}
|
||||
/>
|
||||
<Textarea
|
||||
id="description"
|
||||
variant="ghost"
|
||||
autogrow
|
||||
placeholder={__("Add description (optional)")}
|
||||
{...register("description")}
|
||||
/>
|
||||
</div>
|
||||
{/* Properties form */}
|
||||
<div className="py-5 px-6 bg-subtle">
|
||||
<Label>{__("Properties")}</Label>
|
||||
|
||||
<PropertyRow
|
||||
id="type"
|
||||
label={__("Type")}
|
||||
error={errors.type?.message}
|
||||
>
|
||||
<ControlledField
|
||||
control={control}
|
||||
name="type"
|
||||
type="select"
|
||||
>
|
||||
<SnapshotTypeOptions />
|
||||
</ControlledField>
|
||||
</PropertyRow>
|
||||
</div>
|
||||
</DialogContent>
|
||||
<DialogFooter>
|
||||
<Button type="submit">
|
||||
{__("Create snapshot")}
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</form>
|
||||
</Dialog>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,194 @@
|
||||
/**
|
||||
* @generated SignedSource<<22c84eaaec91c3555b99f0e067bea54f>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
|
||||
/* tslint:disable */
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck
|
||||
|
||||
import { ConcreteRequest } from 'relay-runtime';
|
||||
export type SnapshotsType = "ASSETS" | "COMPLIANCE_REGISTRIES" | "DATA" | "NON_CONFORMITY_REGISTRIES" | "RISKS" | "VENDORS";
|
||||
export type CreateSnapshotInput = {
|
||||
description?: string | null | undefined;
|
||||
name: string;
|
||||
organizationId: string;
|
||||
type: SnapshotsType;
|
||||
};
|
||||
export type SnapshotFormDialogCreateMutation$variables = {
|
||||
connections: ReadonlyArray<string>;
|
||||
input: CreateSnapshotInput;
|
||||
};
|
||||
export type SnapshotFormDialogCreateMutation$data = {
|
||||
readonly createSnapshot: {
|
||||
readonly snapshotEdge: {
|
||||
readonly node: {
|
||||
readonly createdAt: any;
|
||||
readonly description: string | null | undefined;
|
||||
readonly id: string;
|
||||
readonly name: string;
|
||||
readonly type: SnapshotsType;
|
||||
};
|
||||
};
|
||||
};
|
||||
};
|
||||
export type SnapshotFormDialogCreateMutation = {
|
||||
response: SnapshotFormDialogCreateMutation$data;
|
||||
variables: SnapshotFormDialogCreateMutation$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": "SnapshotEdge",
|
||||
"kind": "LinkedField",
|
||||
"name": "snapshotEdge",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Snapshot",
|
||||
"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": "description",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "type",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "createdAt",
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
};
|
||||
return {
|
||||
"fragment": {
|
||||
"argumentDefinitions": [
|
||||
(v0/*: any*/),
|
||||
(v1/*: any*/)
|
||||
],
|
||||
"kind": "Fragment",
|
||||
"metadata": null,
|
||||
"name": "SnapshotFormDialogCreateMutation",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v2/*: any*/),
|
||||
"concreteType": "CreateSnapshotPayload",
|
||||
"kind": "LinkedField",
|
||||
"name": "createSnapshot",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"type": "Mutation",
|
||||
"abstractKey": null
|
||||
},
|
||||
"kind": "Request",
|
||||
"operation": {
|
||||
"argumentDefinitions": [
|
||||
(v1/*: any*/),
|
||||
(v0/*: any*/)
|
||||
],
|
||||
"kind": "Operation",
|
||||
"name": "SnapshotFormDialogCreateMutation",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v2/*: any*/),
|
||||
"concreteType": "CreateSnapshotPayload",
|
||||
"kind": "LinkedField",
|
||||
"name": "createSnapshot",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"filters": null,
|
||||
"handle": "prependEdge",
|
||||
"key": "",
|
||||
"kind": "LinkedHandle",
|
||||
"name": "snapshotEdge",
|
||||
"handleArgs": [
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "connections",
|
||||
"variableName": "connections"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
]
|
||||
},
|
||||
"params": {
|
||||
"cacheID": "e60d598bc7f5c4958168405725664334",
|
||||
"id": null,
|
||||
"metadata": {},
|
||||
"name": "SnapshotFormDialogCreateMutation",
|
||||
"operationKind": "mutation",
|
||||
"text": "mutation SnapshotFormDialogCreateMutation(\n $input: CreateSnapshotInput!\n) {\n createSnapshot(input: $input) {\n snapshotEdge {\n node {\n id\n name\n description\n type\n createdAt\n }\n }\n }\n}\n"
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "b03087e1699a90953aad7cdedaeee1a4";
|
||||
|
||||
export default node;
|
||||
Reference in New Issue
Block a user