Add measure listing page
Signed-off-by: Bryan Frimin <bryan@getprobo.com> Signed-off-by: Sacha Al Himdani <sacha@getprobo.com>
This commit is contained in:
Jonathan
committed by
Sacha Al Himdani
Sacha Al Himdani
parent
f9d1f033e0
commit
7903bd3a77
36
apps/console2/src/hooks/graph/MeasureGraph.ts
Normal file
36
apps/console2/src/hooks/graph/MeasureGraph.ts
Normal file
@@ -0,0 +1,36 @@
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import { graphql } from "relay-runtime";
|
||||
import { useMutationWithToasts } from "../useMutationWithToasts";
|
||||
import type { MeasureGraphDeleteMutation } from "./__generated__/MeasureGraphDeleteMutation.graphql";
|
||||
|
||||
export const measuresQuery = graphql`
|
||||
query MeasureGraphListQuery($organizationId: ID!) {
|
||||
organization: node(id: $organizationId) {
|
||||
id
|
||||
...MeasuresPageFragment
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const deleteMeasureMutation = graphql`
|
||||
mutation MeasureGraphDeleteMutation(
|
||||
$input: DeleteMeasureInput!
|
||||
$connections: [ID!]!
|
||||
) {
|
||||
deleteMeasure(input: $input) {
|
||||
deletedMeasureId @deleteEdge(connections: $connections)
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export function useDeleteMeasureMutation() {
|
||||
const { __ } = useTranslate();
|
||||
|
||||
return useMutationWithToasts<MeasureGraphDeleteMutation>(
|
||||
deleteMeasureMutation,
|
||||
{
|
||||
successMessage: __("Measure deleted successfully."),
|
||||
errorMessage: __("Failed to delete measure. Please try again."),
|
||||
}
|
||||
);
|
||||
}
|
||||
132
apps/console2/src/hooks/graph/__generated__/MeasureGraphDeleteMutation.graphql.ts
generated
Normal file
132
apps/console2/src/hooks/graph/__generated__/MeasureGraphDeleteMutation.graphql.ts
generated
Normal file
@@ -0,0 +1,132 @@
|
||||
/**
|
||||
* @generated SignedSource<<caf1a99300d26a5163d5b46577734f90>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
|
||||
/* tslint:disable */
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck
|
||||
|
||||
import { ConcreteRequest } from 'relay-runtime';
|
||||
export type DeleteMeasureInput = {
|
||||
measureId: string;
|
||||
};
|
||||
export type MeasureGraphDeleteMutation$variables = {
|
||||
connections: ReadonlyArray<string>;
|
||||
input: DeleteMeasureInput;
|
||||
};
|
||||
export type MeasureGraphDeleteMutation$data = {
|
||||
readonly deleteMeasure: {
|
||||
readonly deletedMeasureId: string;
|
||||
};
|
||||
};
|
||||
export type MeasureGraphDeleteMutation = {
|
||||
response: MeasureGraphDeleteMutation$data;
|
||||
variables: MeasureGraphDeleteMutation$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,
|
||||
"kind": "ScalarField",
|
||||
"name": "deletedMeasureId",
|
||||
"storageKey": null
|
||||
};
|
||||
return {
|
||||
"fragment": {
|
||||
"argumentDefinitions": [
|
||||
(v0/*: any*/),
|
||||
(v1/*: any*/)
|
||||
],
|
||||
"kind": "Fragment",
|
||||
"metadata": null,
|
||||
"name": "MeasureGraphDeleteMutation",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v2/*: any*/),
|
||||
"concreteType": "DeleteMeasurePayload",
|
||||
"kind": "LinkedField",
|
||||
"name": "deleteMeasure",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"type": "Mutation",
|
||||
"abstractKey": null
|
||||
},
|
||||
"kind": "Request",
|
||||
"operation": {
|
||||
"argumentDefinitions": [
|
||||
(v1/*: any*/),
|
||||
(v0/*: any*/)
|
||||
],
|
||||
"kind": "Operation",
|
||||
"name": "MeasureGraphDeleteMutation",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v2/*: any*/),
|
||||
"concreteType": "DeleteMeasurePayload",
|
||||
"kind": "LinkedField",
|
||||
"name": "deleteMeasure",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"filters": null,
|
||||
"handle": "deleteEdge",
|
||||
"key": "",
|
||||
"kind": "ScalarHandle",
|
||||
"name": "deletedMeasureId",
|
||||
"handleArgs": [
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "connections",
|
||||
"variableName": "connections"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
]
|
||||
},
|
||||
"params": {
|
||||
"cacheID": "415f19e622fe431330deca8d3d10f121",
|
||||
"id": null,
|
||||
"metadata": {},
|
||||
"name": "MeasureGraphDeleteMutation",
|
||||
"operationKind": "mutation",
|
||||
"text": "mutation MeasureGraphDeleteMutation(\n $input: DeleteMeasureInput!\n) {\n deleteMeasure(input: $input) {\n deletedMeasureId\n }\n}\n"
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "867f5fe6142e2900147cb2f7492b22d3";
|
||||
|
||||
export default node;
|
||||
241
apps/console2/src/hooks/graph/__generated__/MeasureGraphListQuery.graphql.ts
generated
Normal file
241
apps/console2/src/hooks/graph/__generated__/MeasureGraphListQuery.graphql.ts
generated
Normal file
@@ -0,0 +1,241 @@
|
||||
/**
|
||||
* @generated SignedSource<<4d7510366af238f19e3bff7949776f0a>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
|
||||
/* tslint:disable */
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck
|
||||
|
||||
import { ConcreteRequest } from 'relay-runtime';
|
||||
import { FragmentRefs } from "relay-runtime";
|
||||
export type MeasureGraphListQuery$variables = {
|
||||
organizationId: string;
|
||||
};
|
||||
export type MeasureGraphListQuery$data = {
|
||||
readonly organization: {
|
||||
readonly id: string;
|
||||
readonly " $fragmentSpreads": FragmentRefs<"MeasuresPageFragment">;
|
||||
};
|
||||
};
|
||||
export type MeasureGraphListQuery = {
|
||||
response: MeasureGraphListQuery$data;
|
||||
variables: MeasureGraphListQuery$variables;
|
||||
};
|
||||
|
||||
const node: ConcreteRequest = (function(){
|
||||
var v0 = [
|
||||
{
|
||||
"defaultValue": null,
|
||||
"kind": "LocalArgument",
|
||||
"name": "organizationId"
|
||||
}
|
||||
],
|
||||
v1 = [
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "id",
|
||||
"variableName": "organizationId"
|
||||
}
|
||||
],
|
||||
v2 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "id",
|
||||
"storageKey": null
|
||||
},
|
||||
v3 = {
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "__typename",
|
||||
"storageKey": null
|
||||
},
|
||||
v4 = [
|
||||
{
|
||||
"kind": "Literal",
|
||||
"name": "first",
|
||||
"value": 100
|
||||
}
|
||||
];
|
||||
return {
|
||||
"fragment": {
|
||||
"argumentDefinitions": (v0/*: any*/),
|
||||
"kind": "Fragment",
|
||||
"metadata": null,
|
||||
"name": "MeasureGraphListQuery",
|
||||
"selections": [
|
||||
{
|
||||
"alias": "organization",
|
||||
"args": (v1/*: any*/),
|
||||
"concreteType": null,
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v2/*: any*/),
|
||||
{
|
||||
"args": null,
|
||||
"kind": "FragmentSpread",
|
||||
"name": "MeasuresPageFragment"
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"type": "Query",
|
||||
"abstractKey": null
|
||||
},
|
||||
"kind": "Request",
|
||||
"operation": {
|
||||
"argumentDefinitions": (v0/*: any*/),
|
||||
"kind": "Operation",
|
||||
"name": "MeasureGraphListQuery",
|
||||
"selections": [
|
||||
{
|
||||
"alias": "organization",
|
||||
"args": (v1/*: any*/),
|
||||
"concreteType": null,
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/),
|
||||
(v2/*: any*/),
|
||||
{
|
||||
"kind": "InlineFragment",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v4/*: any*/),
|
||||
"concreteType": "MeasureConnection",
|
||||
"kind": "LinkedField",
|
||||
"name": "measures",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "MeasureEdge",
|
||||
"kind": "LinkedField",
|
||||
"name": "edges",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Measure",
|
||||
"kind": "LinkedField",
|
||||
"name": "node",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v2/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "name",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "category",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "state",
|
||||
"storageKey": null
|
||||
},
|
||||
(v3/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "cursor",
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "PageInfo",
|
||||
"kind": "LinkedField",
|
||||
"name": "pageInfo",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "endCursor",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "hasNextPage",
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"kind": "ClientExtension",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "__id",
|
||||
"storageKey": null
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"storageKey": "measures(first:100)"
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v4/*: any*/),
|
||||
"filters": null,
|
||||
"handle": "connection",
|
||||
"key": "MeasuresGraphListQuery__measures",
|
||||
"kind": "LinkedHandle",
|
||||
"name": "measures"
|
||||
}
|
||||
],
|
||||
"type": "Organization",
|
||||
"abstractKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
]
|
||||
},
|
||||
"params": {
|
||||
"cacheID": "876c92c41e08247a4900883b56ac6762",
|
||||
"id": null,
|
||||
"metadata": {},
|
||||
"name": "MeasureGraphListQuery",
|
||||
"operationKind": "query",
|
||||
"text": "query MeasureGraphListQuery(\n $organizationId: ID!\n) {\n organization: node(id: $organizationId) {\n __typename\n id\n ...MeasuresPageFragment\n }\n}\n\nfragment MeasuresPageFragment on Organization {\n measures(first: 100) {\n edges {\n node {\n id\n name\n category\n state\n __typename\n }\n cursor\n }\n pageInfo {\n endCursor\n hasNextPage\n }\n }\n}\n"
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "3014f5724257c0819ba6ef15d2b72d07";
|
||||
|
||||
export default node;
|
||||
280
apps/console2/src/pages/organizations/measures/MeasuresPage.tsx
Normal file
280
apps/console2/src/pages/organizations/measures/MeasuresPage.tsx
Normal file
@@ -0,0 +1,280 @@
|
||||
import type { MeasureGraphListQuery } from "/hooks/graph/__generated__/MeasureGraphListQuery.graphql";
|
||||
import {
|
||||
useFragment,
|
||||
usePreloadedQuery,
|
||||
type PreloadedQuery,
|
||||
} from "react-relay";
|
||||
import { useTranslate } from "@probo/i18n";
|
||||
import {
|
||||
ActionDropdown,
|
||||
Button,
|
||||
Card,
|
||||
ConfirmDialog,
|
||||
DropdownItem,
|
||||
FileButton,
|
||||
IconChevronDown,
|
||||
IconChevronUp,
|
||||
IconFolderUpload,
|
||||
IconPencil,
|
||||
IconPlusLarge,
|
||||
IconTrashCan,
|
||||
MeasureBadge,
|
||||
MeasureImplementation,
|
||||
PageHeader,
|
||||
Table,
|
||||
Tbody,
|
||||
Td,
|
||||
Th,
|
||||
Thead,
|
||||
Tr,
|
||||
} from "@probo/ui";
|
||||
import {
|
||||
measuresQuery,
|
||||
useDeleteMeasureMutation,
|
||||
} from "/hooks/graph/MeasureGraph";
|
||||
import { graphql } from "relay-runtime";
|
||||
import type {
|
||||
MeasuresPageFragment$data,
|
||||
MeasuresPageFragment$key,
|
||||
} from "./__generated__/MeasuresPageFragment.graphql";
|
||||
import { groupBy, objectKeys, sprintf } from "@probo/helpers";
|
||||
import { useMemo, useRef, useState, type ChangeEventHandler } from "react";
|
||||
import type { NodeOf } from "/types";
|
||||
import type { MeasuresPageImportMutation } from "./__generated__/MeasuresPageImportMutation.graphql";
|
||||
import { useMutationWithToasts } from "/hooks/useMutationWithToasts";
|
||||
import { useToggle } from "@probo/hooks";
|
||||
|
||||
type Props = {
|
||||
queryRef: PreloadedQuery<MeasureGraphListQuery>;
|
||||
};
|
||||
|
||||
const measuresFragment = graphql`
|
||||
fragment MeasuresPageFragment on Organization {
|
||||
measures(first: 100) @connection(key: "MeasuresGraphListQuery__measures") {
|
||||
__id
|
||||
edges {
|
||||
node {
|
||||
id
|
||||
name
|
||||
category
|
||||
state
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const importMeasuresMutation = graphql`
|
||||
mutation MeasuresPageImportMutation(
|
||||
$input: ImportMeasureInput!
|
||||
$connections: [ID!]!
|
||||
) {
|
||||
importMeasure(input: $input) {
|
||||
measureEdges @appendEdge(connections: $connections) {
|
||||
node {
|
||||
id
|
||||
name
|
||||
category
|
||||
state
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export default function MeasuresPage(props: Props) {
|
||||
const { __ } = useTranslate();
|
||||
const organization = usePreloadedQuery(
|
||||
measuresQuery,
|
||||
props.queryRef
|
||||
).organization;
|
||||
const data = useFragment<MeasuresPageFragment$key>(
|
||||
measuresFragment,
|
||||
organization
|
||||
);
|
||||
const connectionId = data.measures.__id;
|
||||
const measures = data.measures.edges.map((edge) => edge.node);
|
||||
const measuresPerCategory = useMemo(() => {
|
||||
return groupBy(measures, (measure) => measure.category);
|
||||
}, [measures]);
|
||||
const [importMeasures] = useMutationWithToasts<MeasuresPageImportMutation>(
|
||||
importMeasuresMutation,
|
||||
{
|
||||
successMessage: __("Measures imported successfully."),
|
||||
errorMessage: __("Failed to import measures. Please try again."),
|
||||
}
|
||||
);
|
||||
const importFileRef = useRef<HTMLInputElement>(null);
|
||||
|
||||
const handleImport: ChangeEventHandler<HTMLInputElement> = (event) => {
|
||||
const file = event.target.files?.[0];
|
||||
if (!file) {
|
||||
return;
|
||||
}
|
||||
importMeasures({
|
||||
variables: {
|
||||
input: {
|
||||
organizationId: organization.id,
|
||||
file: null,
|
||||
},
|
||||
connections: [connectionId],
|
||||
},
|
||||
uploadables: {
|
||||
"input.file": file,
|
||||
},
|
||||
onCompleted() {
|
||||
importFileRef.current!.value = "";
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<PageHeader
|
||||
title={__("Measures")}
|
||||
description={__(
|
||||
"Measures are actions taken to reduce the risk. Add them to track their implementation status."
|
||||
)}
|
||||
>
|
||||
<FileButton
|
||||
ref={importFileRef}
|
||||
variant="secondary"
|
||||
icon={IconFolderUpload}
|
||||
onChange={handleImport}
|
||||
>
|
||||
{__("Import")}
|
||||
</FileButton>
|
||||
<Button variant="primary" icon={IconPlusLarge}>
|
||||
{__("New measure")}
|
||||
</Button>
|
||||
</PageHeader>
|
||||
<MeasureImplementation measures={measures} className="my-10" />
|
||||
{objectKeys(measuresPerCategory)
|
||||
.sort((a, b) => a.localeCompare(b))
|
||||
.map((category) => (
|
||||
<Category
|
||||
key={category}
|
||||
category={category}
|
||||
measures={measuresPerCategory[category]}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
type CategoryProps = {
|
||||
category: string;
|
||||
measures: NodeOf<MeasuresPageFragment$data["measures"]>[];
|
||||
};
|
||||
|
||||
function Category(props: CategoryProps) {
|
||||
const { __ } = useTranslate();
|
||||
const [limit, setLimit] = useState<number | null>(4);
|
||||
const measures = useMemo(() => {
|
||||
return limit ? props.measures.slice(0, limit) : props.measures;
|
||||
}, [props.measures, limit]);
|
||||
const showMoreButton = limit !== null && props.measures.length > limit;
|
||||
const [isExpanded, toggleExpanded] = useToggle(false);
|
||||
const ExpandComponent = isExpanded ? IconChevronUp : IconChevronDown;
|
||||
const completedMeasures = props.measures.filter(
|
||||
(m) => m.state === "IMPLEMENTED"
|
||||
);
|
||||
|
||||
return (
|
||||
<Card className="py-3 px-5">
|
||||
<div
|
||||
className="flex items-center justify-between cursor-pointer"
|
||||
onClick={toggleExpanded}
|
||||
>
|
||||
<h2 className="text-base font-medium">{props.category}</h2>
|
||||
<div className="flex items-center gap-3 text-sm text-txt-secondary">
|
||||
<span>
|
||||
{__("Completion")}:{" "}
|
||||
<span className="text-txt-primary font-medium">
|
||||
{completedMeasures.length}/{props.measures.length}
|
||||
</span>
|
||||
</span>
|
||||
<span className="text-border-low">|</span>
|
||||
<ExpandComponent size={16} className="text-txt-secondary" />
|
||||
</div>
|
||||
</div>
|
||||
{isExpanded && (
|
||||
<div className="mt-3">
|
||||
<Table className="bg-invert">
|
||||
<Thead>
|
||||
<Tr>
|
||||
<Th>{__("Measure")}</Th>
|
||||
<Th>{__("State")}</Th>
|
||||
<Th></Th>
|
||||
</Tr>
|
||||
</Thead>
|
||||
<Tbody>
|
||||
{measures.map((measure) => (
|
||||
<MeasureRow key={measure.id} measure={measure} />
|
||||
))}
|
||||
</Tbody>
|
||||
</Table>
|
||||
{showMoreButton && (
|
||||
<Button
|
||||
variant="tertiary"
|
||||
onClick={() => setLimit(null)}
|
||||
className="mt-3 mx-auto"
|
||||
icon={IconChevronDown}
|
||||
>
|
||||
{sprintf(__("Show %s more"), props.measures.length - limit)}
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
type MeasureRowProps = {
|
||||
measure: NodeOf<MeasuresPageFragment$data["measures"]>;
|
||||
};
|
||||
|
||||
function MeasureRow(props: MeasureRowProps) {
|
||||
const { __ } = useTranslate();
|
||||
const [deleteMeasure, isDeleting] = useDeleteMeasureMutation();
|
||||
|
||||
const onDelete = () => {
|
||||
deleteMeasure({
|
||||
variables: {
|
||||
input: { measureId: props.measure.id },
|
||||
connections: ["MeasuresListQuery_measures"],
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<Tr>
|
||||
<Td>{props.measure.name}</Td>
|
||||
<Td width={120}>
|
||||
<MeasureBadge state={props.measure.state} />
|
||||
</Td>
|
||||
<Td width={50} className="text-end">
|
||||
<ActionDropdown>
|
||||
<DropdownItem icon={IconPencil}>{__("Edit")}</DropdownItem>
|
||||
<ConfirmDialog
|
||||
message={sprintf(
|
||||
__(
|
||||
'This will permanently delete the measure "%s". This action cannot be undone.'
|
||||
),
|
||||
props.measure.name
|
||||
)}
|
||||
onConfirm={() => onDelete()}
|
||||
>
|
||||
<DropdownItem
|
||||
disabled={isDeleting}
|
||||
variant="danger"
|
||||
icon={IconTrashCan}
|
||||
>
|
||||
{__("Delete")}
|
||||
</DropdownItem>
|
||||
</ConfirmDialog>
|
||||
</ActionDropdown>
|
||||
</Td>
|
||||
</Tr>
|
||||
);
|
||||
}
|
||||
171
apps/console2/src/pages/organizations/measures/__generated__/MeasuresPageFragment.graphql.ts
generated
Normal file
171
apps/console2/src/pages/organizations/measures/__generated__/MeasuresPageFragment.graphql.ts
generated
Normal file
@@ -0,0 +1,171 @@
|
||||
/**
|
||||
* @generated SignedSource<<a35e945926fc7614549d452b1edd92f9>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
|
||||
/* tslint:disable */
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck
|
||||
|
||||
import { ReaderFragment } from "relay-runtime";
|
||||
export type MeasureState =
|
||||
| "IMPLEMENTED"
|
||||
| "IN_PROGRESS"
|
||||
| "NOT_APPLICABLE"
|
||||
| "NOT_STARTED";
|
||||
import { FragmentRefs } from "relay-runtime";
|
||||
export type MeasuresPageFragment$data = {
|
||||
readonly measures: {
|
||||
readonly __id: string;
|
||||
readonly edges: ReadonlyArray<{
|
||||
readonly node: {
|
||||
readonly category: string;
|
||||
readonly id: string;
|
||||
readonly name: string;
|
||||
readonly state: MeasureState;
|
||||
};
|
||||
}>;
|
||||
};
|
||||
readonly " $fragmentType": "MeasuresPageFragment";
|
||||
};
|
||||
export type MeasuresPageFragment$key = {
|
||||
readonly " $data"?: MeasuresPageFragment$data;
|
||||
readonly " $fragmentSpreads": FragmentRefs<"MeasuresPageFragment">;
|
||||
};
|
||||
|
||||
const node: ReaderFragment = {
|
||||
argumentDefinitions: [],
|
||||
kind: "Fragment",
|
||||
metadata: {
|
||||
connection: [
|
||||
{
|
||||
count: null,
|
||||
cursor: null,
|
||||
direction: "forward",
|
||||
path: ["measures"],
|
||||
},
|
||||
],
|
||||
},
|
||||
name: "MeasuresPageFragment",
|
||||
selections: [
|
||||
{
|
||||
alias: "measures",
|
||||
args: null,
|
||||
concreteType: "MeasureConnection",
|
||||
kind: "LinkedField",
|
||||
name: "__MeasuresGraphListQuery__measures_connection",
|
||||
plural: false,
|
||||
selections: [
|
||||
{
|
||||
alias: null,
|
||||
args: null,
|
||||
concreteType: "MeasureEdge",
|
||||
kind: "LinkedField",
|
||||
name: "edges",
|
||||
plural: true,
|
||||
selections: [
|
||||
{
|
||||
alias: null,
|
||||
args: null,
|
||||
concreteType: "Measure",
|
||||
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: "category",
|
||||
storageKey: null,
|
||||
},
|
||||
{
|
||||
alias: null,
|
||||
args: null,
|
||||
kind: "ScalarField",
|
||||
name: "state",
|
||||
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 = "6a45bee844bf79dc4540e20edf10ad78";
|
||||
|
||||
export default node;
|
||||
184
apps/console2/src/pages/organizations/measures/__generated__/MeasuresPageImportMutation.graphql.ts
generated
Normal file
184
apps/console2/src/pages/organizations/measures/__generated__/MeasuresPageImportMutation.graphql.ts
generated
Normal file
@@ -0,0 +1,184 @@
|
||||
/**
|
||||
* @generated SignedSource<<5a6e0e680ef636cf776a56f490733aee>>
|
||||
* @lightSyntaxTransform
|
||||
* @nogrep
|
||||
*/
|
||||
|
||||
/* tslint:disable */
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck
|
||||
|
||||
import { ConcreteRequest } from 'relay-runtime';
|
||||
export type MeasureState = "IMPLEMENTED" | "IN_PROGRESS" | "NOT_APPLICABLE" | "NOT_STARTED" | "%future added value";
|
||||
export type ImportMeasureInput = {
|
||||
file: any;
|
||||
organizationId: string;
|
||||
};
|
||||
export type MeasuresPageImportMutation$variables = {
|
||||
connections: ReadonlyArray<string>;
|
||||
input: ImportMeasureInput;
|
||||
};
|
||||
export type MeasuresPageImportMutation$data = {
|
||||
readonly importMeasure: {
|
||||
readonly measureEdges: ReadonlyArray<{
|
||||
readonly node: {
|
||||
readonly category: string;
|
||||
readonly id: string;
|
||||
readonly name: string;
|
||||
readonly state: MeasureState;
|
||||
};
|
||||
}>;
|
||||
};
|
||||
};
|
||||
export type MeasuresPageImportMutation = {
|
||||
response: MeasuresPageImportMutation$data;
|
||||
variables: MeasuresPageImportMutation$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": "MeasureEdge",
|
||||
"kind": "LinkedField",
|
||||
"name": "measureEdges",
|
||||
"plural": true,
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"concreteType": "Measure",
|
||||
"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": "category",
|
||||
"storageKey": null
|
||||
},
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"kind": "ScalarField",
|
||||
"name": "state",
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
};
|
||||
return {
|
||||
"fragment": {
|
||||
"argumentDefinitions": [
|
||||
(v0/*: any*/),
|
||||
(v1/*: any*/)
|
||||
],
|
||||
"kind": "Fragment",
|
||||
"metadata": null,
|
||||
"name": "MeasuresPageImportMutation",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v2/*: any*/),
|
||||
"concreteType": "ImportMeasurePayload",
|
||||
"kind": "LinkedField",
|
||||
"name": "importMeasure",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/)
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
],
|
||||
"type": "Mutation",
|
||||
"abstractKey": null
|
||||
},
|
||||
"kind": "Request",
|
||||
"operation": {
|
||||
"argumentDefinitions": [
|
||||
(v1/*: any*/),
|
||||
(v0/*: any*/)
|
||||
],
|
||||
"kind": "Operation",
|
||||
"name": "MeasuresPageImportMutation",
|
||||
"selections": [
|
||||
{
|
||||
"alias": null,
|
||||
"args": (v2/*: any*/),
|
||||
"concreteType": "ImportMeasurePayload",
|
||||
"kind": "LinkedField",
|
||||
"name": "importMeasure",
|
||||
"plural": false,
|
||||
"selections": [
|
||||
(v3/*: any*/),
|
||||
{
|
||||
"alias": null,
|
||||
"args": null,
|
||||
"filters": null,
|
||||
"handle": "appendEdge",
|
||||
"key": "",
|
||||
"kind": "LinkedHandle",
|
||||
"name": "measureEdges",
|
||||
"handleArgs": [
|
||||
{
|
||||
"kind": "Variable",
|
||||
"name": "connections",
|
||||
"variableName": "connections"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"storageKey": null
|
||||
}
|
||||
]
|
||||
},
|
||||
"params": {
|
||||
"cacheID": "13a5799ca6febcfb85294f75456deffb",
|
||||
"id": null,
|
||||
"metadata": {},
|
||||
"name": "MeasuresPageImportMutation",
|
||||
"operationKind": "mutation",
|
||||
"text": "mutation MeasuresPageImportMutation(\n $input: ImportMeasureInput!\n) {\n importMeasure(input: $input) {\n measureEdges {\n node {\n id\n name\n category\n state\n }\n }\n }\n}\n"
|
||||
}
|
||||
};
|
||||
})();
|
||||
|
||||
(node as any).hash = "6419f51d00f273c824038e7f2d4c65ba";
|
||||
|
||||
export default node;
|
||||
@@ -12,6 +12,7 @@ import { PageSkeleton } from "./components/skeletons/PageSkeleton.tsx";
|
||||
import { type PreloadedQuery } from "react-relay";
|
||||
import { useCleanup } from "./hooks/useDelayedEffect.ts";
|
||||
import { riskRoutes } from "./routes/riskRoutes.ts";
|
||||
import { measureRoutes } from "./routes/measureRoutes.ts";
|
||||
|
||||
function ErrorBoundary() {
|
||||
const error = useRouteError();
|
||||
@@ -70,6 +71,7 @@ const routes = [
|
||||
),
|
||||
},
|
||||
...riskRoutes,
|
||||
...measureRoutes,
|
||||
],
|
||||
},
|
||||
] satisfies AppRoute[];
|
||||
|
||||
16
apps/console2/src/routes/measureRoutes.ts
Normal file
16
apps/console2/src/routes/measureRoutes.ts
Normal file
@@ -0,0 +1,16 @@
|
||||
import { lazy } from "react";
|
||||
import { loadQuery } from "react-relay";
|
||||
import { RisksPageSkeleton } from "/components/skeletons/RisksPageSkeleton.tsx";
|
||||
import type { AppRoute } from "/routes.tsx";
|
||||
import { relayEnvironment } from "/providers/RelayProviders";
|
||||
import { measuresQuery } from "/hooks/graph/MeasureGraph";
|
||||
|
||||
export const measureRoutes = [
|
||||
{
|
||||
path: "measures",
|
||||
fallback: RisksPageSkeleton,
|
||||
queryLoader: ({ organizationId }) =>
|
||||
loadQuery(relayEnvironment, measuresQuery, { organizationId }),
|
||||
Component: lazy(() => import("/pages/organizations/measures/MeasuresPage")),
|
||||
},
|
||||
] satisfies AppRoute[];
|
||||
Reference in New Issue
Block a user