Add transparent proxy inspection policies

2026-09-23 00:30:43 -07:00 · 2026-04-18 13:13:18 +02:00
45 changed files with 3020 additions and 390 deletions
@@ -58,6 +58,7 @@
        "ip-address": "^10.1.0",
        "ip-cidr": "^3.1.0",
        "js-cookie": "^3.0.5",
+        "js-yaml": "^4.1.1",
        "lodash": "^4.17.23",
        "lucide-react": "^0.566.0",
        "next": "16.1.7",
@@ -85,6 +86,7 @@
        "@faker-js/faker": "^9.5.1",
        "@types/chroma-js": "^3.1.1",
        "@types/js-cookie": "^3.0.6",
+        "@types/js-yaml": "^4.0.9",
        "eslint": "^9.39.1",
        "eslint-config-next": "^16.1.6",
        "postcss": "^8",
@@ -168,7 +170,6 @@
      "integrity": "sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==",
      "dev": true,
      "license": "MIT",
-      "peer": true,
      "dependencies": {
        "@babel/code-frame": "^7.29.0",
        "@babel/generator": "^7.29.0",
@@ -2998,6 +2999,13 @@
      "dev": true,
      "license": "MIT"
    },
+    "node_modules/@types/js-yaml": {
+      "version": "4.0.9",
+      "resolved": "https://registry.npmjs.org/@types/js-yaml/-/js-yaml-4.0.9.tgz",
+      "integrity": "sha512-k4MGaQl5TGo/iipqb2UDG2UwjXziSWkh0uysQelTlJpX1qGlpUZYm8PnO4DxG1qBomtJUdYJ6qR6xdIah10JLg==",
+      "dev": true,
+      "license": "MIT"
+    },
    "node_modules/@types/json-schema": {
      "version": "7.0.15",
      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
@@ -3031,7 +3039,6 @@
      "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.10.tgz",
      "integrity": "sha512-WPigyYuGhgZ/cTPRXB2EwUw+XvsRA3GqHlsP4qteqrnnjDrApbS7MxcGr/hke5iUoeB7E/gQtrs9I37zAJ0Vjw==",
      "license": "MIT",
-      "peer": true,
      "dependencies": {
        "csstype": "^3.2.2"
      }
@@ -3041,7 +3048,6 @@
      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-19.2.3.tgz",
      "integrity": "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==",
      "license": "MIT",
-      "peer": true,
      "peerDependencies": {
        "@types/react": "^19.2.0"
      }
@@ -3100,7 +3106,6 @@
      "integrity": "sha512-BtE0k6cjwjLZoZixN0t5AKP0kSzlGu7FctRXYuPAm//aaiZhmfq1JwdYpYr1brzEspYyFeF+8XF5j2VK6oalrA==",
      "dev": true,
      "license": "MIT",
-      "peer": true,
      "dependencies": {
        "@typescript-eslint/scope-manager": "8.54.0",
        "@typescript-eslint/types": "8.54.0",
@@ -3581,8 +3586,7 @@
      "version": "5.5.0",
      "resolved": "https://registry.npmjs.org/@xterm/xterm/-/xterm-5.5.0.tgz",
      "integrity": "sha512-hqJHYaQb5OptNunnyAnkHyM8aCjZ1MEIDTQu1iIbbTD/xops91NB5yq1ZK/dC2JDbVWtF23zUtl9JE2NqwT87A==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
    },
    "node_modules/@xyflow/react": {
      "version": "12.10.0",
@@ -3621,7 +3625,6 @@
      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
      "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
      "license": "MIT",
-      "peer": true,
      "bin": {
        "acorn": "bin/acorn"
      },
@@ -4044,7 +4047,6 @@
        }
      ],
      "license": "MIT",
-      "peer": true,
      "dependencies": {
        "baseline-browser-mapping": "^2.9.0",
        "caniuse-lite": "^1.0.30001759",
@@ -4667,7 +4669,6 @@
      "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-3.0.0.tgz",
      "integrity": "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==",
      "license": "ISC",
-      "peer": true,
      "engines": {
        "node": ">=12"
      }
@@ -5196,7 +5197,6 @@
      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.39.2.tgz",
      "integrity": "sha512-LEyamqS7W5HB3ujJyvi0HQK/dtVINZvd5mAAp9eT5S/ujByGjiZLCzPcHVzuXbpJDJF/cxwHlfceVUDZ2lnSTw==",
      "license": "MIT",
-      "peer": true,
      "dependencies": {
        "@eslint-community/eslint-utils": "^4.8.0",
        "@eslint-community/regexpp": "^4.12.1",
@@ -5394,7 +5394,6 @@
      "integrity": "sha512-whOE1HFo/qJDyX4SnXzP4N6zOWn79WhnCUY/iDR0mPfQZO8wcYE4JClzI2oZrhBnnMUCBCHZhO6VQyoBU95mZA==",
      "dev": true,
      "license": "MIT",
-      "peer": true,
      "dependencies": {
        "@rtsao/scc": "^1.1.0",
        "array-includes": "^3.1.9",
@@ -6688,7 +6687,6 @@
      "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.7.tgz",
      "integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==",
      "license": "MIT",
-      "peer": true,
      "bin": {
        "jiti": "bin/jiti.js"
      }
@@ -7446,7 +7444,6 @@
        }
      ],
      "license": "MIT",
-      "peer": true,
      "dependencies": {
        "nanoid": "^3.3.11",
        "picocolors": "^1.1.1",
@@ -7654,7 +7651,6 @@
      "resolved": "https://registry.npmjs.org/react/-/react-19.2.4.tgz",
      "integrity": "sha512-9nfp2hYpCwOjAN+8TZFGhtWEwgvWHXqESH8qT89AT/lWklpLON22Lc8pEtnpsZz7VmawabSU0gCjnj8aC0euHQ==",
      "license": "MIT",
-      "peer": true,
      "engines": {
        "node": ">=0.10.0"
      }
@@ -7695,7 +7691,6 @@
      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.4.tgz",
      "integrity": "sha512-AXJdLo8kgMbimY95O2aKQqsz2iWi9jMgKJhRBAxECE4IFxfcazB2LmzloIoibJI3C12IlY20+KFaLv+71bUJeQ==",
      "license": "MIT",
-      "peer": true,
      "dependencies": {
        "scheduler": "^0.27.0"
      },
@@ -8590,7 +8585,6 @@
      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.19.tgz",
      "integrity": "sha512-3ofp+LL8E+pK/JuPLPggVAIaEuhvIz4qNcf3nA1Xn2o/7fb7s/TYpHhwGDv1ZU3PkBluUVaF8PyCHcm48cKLWQ==",
      "license": "MIT",
-      "peer": true,
      "dependencies": {
        "@alloc/quick-lru": "^5.2.0",
        "arg": "^5.0.2",
@@ -8757,7 +8751,6 @@
      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
      "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
      "license": "MIT",
-      "peer": true,
      "engines": {
        "node": ">=12"
      },
@@ -8923,7 +8916,6 @@
      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
      "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
      "license": "Apache-2.0",
-      "peer": true,
      "bin": {
        "tsc": "bin/tsc",
        "tsserver": "bin/tsserver"
@@ -9251,7 +9243,6 @@
      "integrity": "sha512-rftlrkhHZOcjDwkGlnUtZZkvaPHCsDATp4pGpuOOMDaTdDDXF91wuVDJoWoPsKX/3YPQ5fHuF3STjcYyKr+Qhg==",
      "dev": true,
      "license": "MIT",
-      "peer": true,
      "funding": {
        "url": "https://github.com/sponsors/colinhacks"
      }
@@ -66,6 +66,7 @@
    "ip-address": "^10.1.0",
    "ip-cidr": "^3.1.0",
    "js-cookie": "^3.0.5",
+    "js-yaml": "^4.1.1",
    "lodash": "^4.17.23",
    "lucide-react": "^0.566.0",
    "next": "16.1.7",
@@ -96,6 +97,7 @@
    "@faker-js/faker": "^9.5.1",
    "@types/chroma-js": "^3.1.1",
    "@types/js-cookie": "^3.0.6",
+    "@types/js-yaml": "^4.0.9",
    "eslint": "^9.39.1",
    "eslint-config-next": "^16.1.6",
    "postcss": "^8",
@@ -0,0 +1,8 @@
+import { globalMetaTitle } from "@utils/meta";
+import type { Metadata } from "next";
+import BlankLayout from "@/layouts/BlankLayout";
+
+export const metadata: Metadata = {
+  title: `Inspection Policies - ${globalMetaTitle}`,
+};
+export default BlankLayout;
@@ -0,0 +1,61 @@
+"use client";
+
+import Breadcrumbs from "@components/Breadcrumbs";
+import InlineLink from "@components/InlineLink";
+import Paragraph from "@components/Paragraph";
+import SkeletonTable from "@components/skeletons/SkeletonTable";
+import { RestrictedAccess } from "@components/ui/RestrictedAccess";
+import useFetchApi from "@utils/api";
+import { ExternalLinkIcon, ShieldCheck } from "lucide-react";
+import React, { lazy, Suspense } from "react";
+import AccessControlIcon from "@/assets/icons/AccessControlIcon";
+import { usePermissions } from "@/contexts/PermissionsProvider";
+import PoliciesProvider from "@/contexts/PoliciesProvider";
+import { InspectionPolicy } from "@/interfaces/Network";
+import PageContainer from "@/layouts/PageContainer";
+
+const InspectionPoliciesTable = lazy(
+  () =>
+    import(
+      "@/modules/networks/inspection/InspectionPoliciesTable"
+    ),
+);
+
+export default function InspectionPoliciesPage() {
+  const { permission } = usePermissions();
+  const { data: policies, isLoading } =
+    useFetchApi<InspectionPolicy[]>("/inspection-policies");
+
+  return (
+    <PageContainer>
+      <div className={"p-default py-6"}>
+        <Breadcrumbs>
+          <Breadcrumbs.Item
+            href={"/access-control"}
+            label={"Access Control"}
+            icon={<AccessControlIcon size={14} />}
+          />
+          <Breadcrumbs.Item
+            href={"/access-control/inspection-policies"}
+            label={"Inspection Policies"}
+            icon={<ShieldCheck size={15} />}
+          />
+        </Breadcrumbs>
+        <h1>Inspection Policies</h1>
+        <Paragraph>
+          Create reusable inspection rule sets for transparent proxy traffic
+          inspection. Attach them to access control policies to inspect traffic
+          flowing through routing peers.
+        </Paragraph>
+      </div>
+      <PoliciesProvider>
+        <Suspense fallback={<SkeletonTable />}>
+          <InspectionPoliciesTable
+            policies={policies ?? []}
+            isLoading={isLoading}
+          />
+        </Suspense>
+      </PoliciesProvider>
+    </PageContainer>
+  );
+}
@@ -526,7 +526,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
            copyText={"NetBird IP Address"}
            label={
              <>
-                <MapPin size={16} className={"shrink-0"} />
+                <MapPin size={16} />
                NetBird IP Address
              </>
            }
@@ -547,7 +547,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
              copyText={"NetBird IPv6 Address"}
              label={
                <>
-                  <MapPin size={16} className={"shrink-0"} />
+                  <MapPin size={16} />
                  NetBird IPv6 Address
                </>
              }
@@ -567,7 +567,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
            copyText={"Public IP Address"}
            label={
              <>
-                <NetworkIcon size={16} className={"shrink-0"} />
+                <NetworkIcon size={16} />
                Public IP Address
              </>
            }
@@ -579,7 +579,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
            copyText={"DNS label"}
            label={
              <>
-                <Globe size={16} className={"shrink-0"} />
+                <Globe size={16} />
                Domain Name
              </>
            }
@@ -597,7 +597,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
            copyText={"Hostname"}
            label={
              <>
-                <MonitorSmartphoneIcon size={16} className={"shrink-0"} />
+                <MonitorSmartphoneIcon size={16} />
                Hostname
              </>
            }
@@ -607,7 +607,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
          <Card.ListItem
            label={
              <>
-                <FlagIcon size={16} className={"shrink-0"} />
+                <FlagIcon size={16} />
                Region
              </>
            }
@@ -637,7 +637,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
          <Card.ListItem
            label={
              <>
-                <Cpu size={16} className={"shrink-0"} />
+                <Cpu size={16} />
                Operating System
              </>
            }
@@ -648,7 +648,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
            <Card.ListItem
              label={
                <>
-                  <Barcode size={16} className={"shrink-0"} />
+                  <Barcode size={16} />
                  Serial Number
                </>
              }
@@ -660,7 +660,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
            <Card.ListItem
              label={
                <>
-                  <CalendarDays size={16} className={"shrink-0"} />
+                  <CalendarDays size={16} />
                  Registered on
                </>
              }
@@ -676,7 +676,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
          <Card.ListItem
            label={
              <>
-                <History size={16} className={"shrink-0"} />
+                <History size={16} />
                Last seen
              </>
            }
@@ -693,7 +693,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
          <Card.ListItem
            label={
              <>
-                <NetBirdIcon size={16} className={"shrink-0"} />
+                <NetBirdIcon size={16} />
                Agent Version
              </>
            }
@@ -704,7 +704,7 @@ function PeerInformationCard({ peer }: Readonly<{ peer: Peer }>) {
            <Card.ListItem
              label={
                <>
-                  <NetBirdIcon size={16} className={"shrink-0"} />
+                  <NetBirdIcon size={16} />
                  UI Version
                </>
              }
@@ -23,7 +23,6 @@ export const idpIcon = (
    zitadel: <ZitadelIcon size={size} />,
    authentik: <AuthentikIcon size={size} />,
    keycloak: <KeycloakIcon size={size} />,
-    adfs: <MicrosoftIcon size={size} />,
    oidc: <KeyRound size={size} className="text-nb-gray-400" />,
  };

@@ -3,36 +3,103 @@ import { iconProperties, IconProps } from "@/assets/icons/IconProperties";
 export default function LoadingIcon(props: IconProps) {
  return (
    <svg
-      viewBox="0 0 919 669"
-      fill="none"
+      width="135"
+      height="140"
+      viewBox="0 0 135 140"
      xmlns="http://www.w3.org/2000/svg"
+      fillOpacity="0.8"
      {...iconProperties(props)}
    >
-      <style>{`
-        @keyframes nb-loader-pulse {
-          0%, 100% { transform: scale(0.85); opacity: 0.35; }
-          50%      { transform: scale(1);    opacity: 1;    }
-        }
-        .nb-loader-bird {
-          animation: nb-loader-pulse 1.75s ease-in-out infinite;
-          transform-origin: 50% 50%;
-          transform-box: fill-box;
-        }
-      `}</style>
-      <g className={"nb-loader-bird"}>
-        <path
-          d="M653.25 0C542.297 10.255 487.216 74.132 466.346 106.359L456.959 122.609C456.311 123.963 455.886 124.865 455.886 124.865L455.774 124.685L142.056 668.021H533.256L918.947 0H653.25Z"
-          fill="#F68330"
+      <rect y="10" width="15" height="120" rx="6">
+        <animate
+          attributeName="height"
+          begin="0.5s"
+          dur="1s"
+          values="120;110;100;90;80;70;60;50;40;140;120"
+          calcMode="linear"
+          repeatCount="indefinite"
        />
-        <path
-          d="M533.256 668.02L0 102.296C0 102.296 603.149 -59.6172 661.827 445.893L533.256 668.02Z"
-          fill="#F68330"
+        <animate
+          attributeName="y"
+          begin="0.5s"
+          dur="1s"
+          values="10;15;20;25;30;35;40;45;50;0;10"
+          calcMode="linear"
+          repeatCount="indefinite"
        />
-        <path
-          d="M454.3 127.229L290.658 410.664L533.256 668.02L661.757 445.475C641.46 271.63 556.721 176.843 454.3 127.229Z"
-          fill="#F35E32"
+      </rect>
+      <rect x="30" y="10" width="15" height="120" rx="6">
+        <animate
+          attributeName="height"
+          begin="0.25s"
+          dur="1s"
+          values="120;110;100;90;80;70;60;50;40;140;120"
+          calcMode="linear"
+          repeatCount="indefinite"
        />
-      </g>
+        <animate
+          attributeName="y"
+          begin="0.25s"
+          dur="1s"
+          values="10;15;20;25;30;35;40;45;50;0;10"
+          calcMode="linear"
+          repeatCount="indefinite"
+        />
+      </rect>
+      <rect x="60" width="15" height="140" rx="6">
+        <animate
+          attributeName="height"
+          begin="0s"
+          dur="1s"
+          values="120;110;100;90;80;70;60;50;40;140;120"
+          calcMode="linear"
+          repeatCount="indefinite"
+        />
+        <animate
+          attributeName="y"
+          begin="0s"
+          dur="1s"
+          values="10;15;20;25;30;35;40;45;50;0;10"
+          calcMode="linear"
+          repeatCount="indefinite"
+        />
+      </rect>
+      <rect x="90" y="10" width="15" height="120" rx="6">
+        <animate
+          attributeName="height"
+          begin="0.25s"
+          dur="1s"
+          values="120;110;100;90;80;70;60;50;40;140;120"
+          calcMode="linear"
+          repeatCount="indefinite"
+        />
+        <animate
+          attributeName="y"
+          begin="0.25s"
+          dur="1s"
+          values="10;15;20;25;30;35;40;45;50;0;10"
+          calcMode="linear"
+          repeatCount="indefinite"
+        />
+      </rect>
+      <rect x="120" y="10" width="15" height="120" rx="6">
+        <animate
+          attributeName="height"
+          begin="0.5s"
+          dur="1s"
+          values="120;110;100;90;80;70;60;50;40;140;120"
+          calcMode="linear"
+          repeatCount="indefinite"
+        />
+        <animate
+          attributeName="y"
+          begin="0.5s"
+          dur="1s"
+          values="10;15;20;25;30;35;40;45;50;0;10"
+          calcMode="linear"
+          repeatCount="indefinite"
+        />
+      </rect>
    </svg>
  );
-}
+}
@@ -50,11 +50,11 @@ function CardListItem({
  return (
    <li
      className={cn(
-        "flex justify-between px-4 border-b border-nb-gray-900 py-3.5 last:border-b-0 items-center h-full",
+        "flex justify-between px-4 border-b border-nb-gray-900 py-4 last:border-b-0 items-center h-full",
        className,
      )}
    >
-      <div className={"flex gap-2.5 items-center text-[0.84rem]"}>{label}</div>
+      <div className={"flex gap-2.5 items-center text-sm"}>{label}</div>
      <div className={"flex flex-col gap-2"}>
        <CardTextItem
          label={label}
@@ -100,7 +100,7 @@ const CardTextItem = ({
  return (
    <div
      className={cn(
-        "text-right text-nb-gray-400 text-[0.84rem] flex items-center gap-2",
+        "text-right text-nb-gray-400 text-sm flex items-center gap-2",
        copy && "cursor-pointer hover:text-nb-gray-300 transition-all",
      )}
      onClick={() =>
@@ -28,8 +28,13 @@ export const DeviceCard = ({
  const descriptionText = useMemo(() => {
    return description !== undefined
      ? description
-      : address || device?.ip || resource?.address;
-  }, [description, address, device]);
+      : address ||
+        (device?.ip
+          ? device.ipv6
+            ? `${device.ip}, ${device.ipv6}`
+            : device.ip
+          : resource?.address);
+  }, [description, address, device, resource]);

  return (
    <div
@@ -290,7 +290,7 @@ export function PeerGroupSelector({
  const searchPlaceholder = useMemo(() => {
    if (tab === "groups") return placeholderForSearch;
    if (tab === "resources") return "Search resource...";
-    if (tab === "peers") return "Search peer by name or ip...";
+    if (tab === "peers") return "Search peer...";
    return "Search...";
  }, [tab, placeholderForSearch]);

@@ -537,6 +537,9 @@ export function PeerGroupSelector({
                      const isSelected =
                        values.find((group) => group.name == option.name) !=
                        undefined;
+                      const peerCount =
+                        option.peers?.length ?? option?.peers_count ?? 0;
+
                      const isDisabled = disabledGroups
                        ? disabledGroups?.findIndex(
                            (g) => g.id === option.id,
@@ -1057,6 +1060,7 @@ const PeersList = ({
                  }
                >
                  {res.ip}
+                  {res.ipv6 && `, ${res.ipv6}`}
                  <RadioItem value={res.id} />
                </div>
              </div>
@@ -125,7 +125,9 @@ export function PeerSelector({
                    "text-neutral-500 dark:text-nb-gray-300 font-medium flex items-center gap-1 font-mono text-[10px]"
                  }
                >
+                  <MapPinIcon />
                  {value.ip}
+                  {value.ipv6 && `, ${value.ipv6}`}
                </div>
              </div>
            ) : (
@@ -238,7 +240,9 @@ export function PeerSelector({
                        !isSupported && "opacity-50",
                      )}
                    >
+                      <MapPinIcon />
                      {option.ip}
+                      {option.ipv6 && `, ${option.ipv6}`}
                    </div>
                  </FullTooltip>
                );
@@ -12,7 +12,7 @@ export default function FullScreenLoading({ fullScreen = true }: Props) {
        fullScreen && "h-screen",
      )}
    >
-      <LoadingIcon className="fill-netbird" size={68} />
+      <LoadingIcon className="fill-netbird" size={44} />
    </div>
  );
 }
@@ -83,6 +83,9 @@ export default function PoliciesProvider({ children }: Props) {
      source_posture_checks: (policy.source_posture_checks ?? []).map((c) =>
        typeof c === "string" ? c : c.id,
      ),
+      inspection_policies: (policy.inspection_policies ?? []).map((p) =>
+        typeof p === "string" ? p : p.id,
+      ),
      rules: [
        {
          ...rule,
@@ -154,6 +157,10 @@ export default function PoliciesProvider({ children }: Props) {
              toUpdate.source_posture_checks ??
              policy.source_posture_checks ??
              [],
+            inspection_policies:
+              toUpdate.inspection_policies ??
+              policy.inspection_policies ??
+              [],
          },
          `/${policy.id}`,
        )
@@ -44,8 +44,7 @@ export type SSOIdentityProviderType =
  | "pocketid"
  | "microsoft"
  | "authentik"
-  | "keycloak"
-  | "adfs";
+  | "keycloak";

 export const SSOIdentityProviderOptions: {
  value: SSOIdentityProviderType;
@@ -60,7 +59,6 @@ export const SSOIdentityProviderOptions: {
  { value: "pocketid", label: "PocketID" },
  { value: "authentik", label: "Authentik" },
  { value: "keycloak", label: "Keycloak" },
-  { value: "adfs", label: "Microsoft AD FS" },
 ];

 export const getSSOIdentityProviderLabelByType = (
@@ -17,9 +17,90 @@ export interface NetworkRouter {
  metric: number;
  masquerade: boolean;
  enabled: boolean;
+  inspection?: InspectionConfig;
  search?: string;
 }

+export type InspectionAction = "allow" | "block" | "inspect";
+export type InspectionMode = "builtin" | "envoy" | "external";
+
+export interface InspectionEnvoySnippets {
+  http_filters?: string;
+  network_filters?: string;
+  clusters?: string;
+}
+
+export interface InspectionConfig {
+  enabled: boolean;
+  mode?: InspectionMode;
+  external_url?: string;
+  default_action?: InspectionAction;
+  redirect_ports?: number[];
+  rules?: InspectionRule[];
+  icap?: InspectionICAPConfig;
+  ca_cert_pem?: string;
+  ca_key_pem?: string;
+  listen_port?: number;
+}
+
+export interface InspectionRule {
+  id?: string;
+  name: string;
+  enabled: boolean;
+  domains?: string[];
+  networks?: string[];
+  ports?: number[];
+  action: InspectionAction;
+  priority: number;
+}
+
+// Reusable inspection policy referenced from access control policies.
+// Contains both L7 rules and proxy infrastructure config (CA, ICAP, mode).
+export interface InspectionPolicy {
+  id?: string;
+  name: string;
+  description?: string;
+  enabled: boolean;
+  rules: InspectionPolicyRule[];
+
+  // Proxy infrastructure config
+  mode?: InspectionMode;
+  external_url?: string;
+  default_action?: InspectionAction;
+  redirect_ports?: number[];
+  ca_cert_pem?: string;
+  ca_key_pem?: string;
+  icap?: InspectionICAPConfig;
+
+  // Envoy sidecar config (mode "envoy" only)
+  envoy_binary_path?: string;
+  envoy_admin_port?: number;
+  envoy_snippets?: InspectionEnvoySnippets;
+}
+
+export interface InspectionPolicyRule {
+  domains?: string[];
+  networks?: string[];
+  protocols?: InspectionProtocol[];
+  paths?: string[];
+  action: InspectionAction;
+  priority: number;
+}
+
+export type InspectionProtocol =
+  | "http"
+  | "https"
+  | "h2"
+  | "h3"
+  | "websocket"
+  | "other";
+
+export interface InspectionICAPConfig {
+  reqmod_url?: string;
+  respmod_url?: string;
+  max_connections?: number;
+}
+
 export interface NetworkResource {
  id: string;
  name: string;
@@ -1,4 +1,5 @@
 import { Group } from "@/interfaces/Group";
+import { InspectionPolicy } from "@/interfaces/Network";
 import { PostureCheck } from "@/interfaces/PostureCheck";

 export interface Policy {
@@ -9,6 +10,7 @@ export interface Policy {
  query?: string;
  rules: PolicyRule[];
  source_posture_checks: string[] | PostureCheck[];
+  inspection_policies?: string[] | InspectionPolicy[];
 }

 export interface PolicyRule {
@@ -22,20 +22,11 @@ export interface ReverseProxy {
  meta?: ReverseProxyMeta;
 }

-export const CrowdSecMode = {
-  OFF: "off",
-  ENFORCE: "enforce",
-  OBSERVE: "observe",
-} as const;
-
-export type CrowdSecMode = (typeof CrowdSecMode)[keyof typeof CrowdSecMode];
-
 export interface AccessRestrictions {
  allowed_cidrs?: string[];
  blocked_cidrs?: string[];
  allowed_countries?: string[];
  blocked_countries?: string[];
-  crowdsec_mode?: CrowdSecMode;
 }

 export interface ReverseProxyMeta {
@@ -111,7 +102,6 @@ export interface ReverseProxyDomain {
  target_cluster?: string;
  supports_custom_ports?: boolean;
  require_subdomain?: boolean;
-  supports_crowdsec?: boolean;
 }

 export enum ReverseProxyDomainType {
@@ -159,7 +149,6 @@ export interface ReverseProxyEvent {
  bytes_upload: number;
  bytes_download: number;
  protocol?: EventProtocol;
-  metadata?: Record<string, string>;
 }

 export function isL4Event(event: ReverseProxyEvent): boolean {
@@ -121,6 +121,13 @@ export default function Navigation({
                    href={"/groups"}
                    visible={permission.policies.read}
                  />
+                  <SidebarItem
+                    label="Inspection Policies"
+                    isChild
+                    href={"/access-control/inspection-policies"}
+                    exactPathMatch={true}
+                    visible={permission.policies.read}
+                  />
                  <SidebarItem
                    label="Posture Checks"
                    isChild
@@ -50,6 +50,9 @@ import { NetworkResource } from "@/interfaces/Network";
 import { Policy, PolicyRuleResource, Protocol } from "@/interfaces/Policy";
 import { PostureCheck } from "@/interfaces/PostureCheck";
 import { useAccessControl } from "@/modules/access-control/useAccessControl";
+import { InspectionPolicy } from "@/interfaces/Network";
+import { InspectionTab } from "@/modules/networks/inspection/InspectionTab";
+import { InspectionTabTrigger } from "@/modules/networks/inspection/InspectionTabTrigger";
 import { PostureCheckTab } from "@/modules/posture-checks/ui/PostureCheckTab";
 import { PostureCheckTabTrigger } from "@/modules/posture-checks/ui/PostureCheckTabTrigger";
 import { SSHAccessType } from "@/modules/access-control/ssh/SSHAccessType";
@@ -186,6 +189,9 @@ export function AccessControlModalContent({
    setSshAccessType,
    sshAuthorizedGroups,
    setSshAuthorizedGroups,
+    inspectionPolicies,
+    setInspectionPolicies,
+    isInspectionPoliciesLoading,
  } = useAccessControl({
    policy,
    postureCheckTemplates,
@@ -202,6 +208,7 @@ export function AccessControlModalContent({
    if (initialTab && initialTab !== "") return initialTab;
    if (!cell) return "policy";
    if (cell == "posture_checks") return "posture_checks";
+    if (cell == "inspection_policies") return "inspection";
    return "policy";
  });

@@ -252,6 +259,7 @@ export function AccessControlModalContent({
            Policy
          </TabsTrigger>
          <PostureCheckTabTrigger disabled={!canContinueToPostureChecks} />
+          <InspectionTabTrigger disabled={!canContinueToPostureChecks} />
          <TabsTrigger value={"general"} disabled={!canContinueToPostureChecks}>
            <Text
              size={16}
@@ -518,6 +526,11 @@ export function AccessControlModalContent({
          postureChecks={postureChecks}
          setPostureChecks={setPostureChecks}
        />
+        <InspectionTab
+          isLoading={isInspectionPoliciesLoading}
+          inspectionPolicies={inspectionPolicies}
+          setInspectionPolicies={setInspectionPolicies}
+        />
        <TabsContent value={"general"} className={"px-8 pb-6"}>
          <div className={"flex flex-col gap-6"}>
            <div>
@@ -598,6 +611,24 @@ export function AccessControlModalContent({
                  >
                    Back
                  </Button>
+                  <Button
+                    variant={"primary"}
+                    onClick={() => setTab("inspection")}
+                    disabled={!canContinueToPostureChecks}
+                  >
+                    Continue
+                  </Button>
+                </>
+              )}
+
+              {tab == "inspection" && (
+                <>
+                  <Button
+                    variant={"secondary"}
+                    onClick={() => setTab("posture_checks")}
+                  >
+                    Back
+                  </Button>
                  <Button
                    variant={"primary"}
                    onClick={() => setTab("general")}
@@ -612,7 +643,7 @@ export function AccessControlModalContent({
                <>
                  <Button
                    variant={"secondary"}
-                    onClick={() => setTab("posture_checks")}
+                    onClick={() => setTab("inspection")}
                  >
                    Back
                  </Button>