Add policies

Signed-off-by: gearnode <bryan@frimin.fr>

apps/console/src/layouts/ConsoleLayout.tsx

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

apps/console/src/layouts/__generated__/ConsoleLayoutBreadcrumbPolicyOverviewQuery.graphql.ts

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

apps/console/src/layouts/__generated__/ConsoleLayoutBreadcrumbUpdatePolicyQuery.graphql.ts

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