Merge branch 'main' into PAM-79

2026-01-09 15:38:03 -05:00 · 2025-12-10 16:42:38 -05:00
parent 94629124d8 56dd171cf0
commit 0ed0504b90
45 changed files with 1648 additions and 109 deletions
--- a/frontend/src/hooks/api/pam/types/index.ts
+++ b/frontend/src/hooks/api/pam/types/index.ts
@@ -7,18 +7,30 @@ import {
  PamSessionStatus
 } from "../enums";
 import { TAwsIamAccount, TAwsIamResource } from "./aws-iam-resource";
+import { TKubernetesAccount, TKubernetesResource } from "./kubernetes-resource";
 import { TMySQLAccount, TMySQLResource } from "./mysql-resource";
 import { TPostgresAccount, TPostgresResource } from "./postgres-resource";
 import { TSSHAccount, TSSHResource } from "./ssh-resource";

 export * from "./aws-iam-resource";
+export * from "./kubernetes-resource";
 export * from "./mysql-resource";
 export * from "./postgres-resource";
 export * from "./ssh-resource";

-export type TPamResource = TPostgresResource | TMySQLResource | TSSHResource | TAwsIamResource;
+export type TPamResource =
+  | TPostgresResource
+  | TMySQLResource
+  | TSSHResource
+  | TAwsIamResource
+  | TKubernetesResource;

-export type TPamAccount = TPostgresAccount | TMySQLAccount | TSSHAccount | TAwsIamAccount;
+export type TPamAccount =
+  | TPostgresAccount
+  | TMySQLAccount
+  | TSSHAccount
+  | TAwsIamAccount
+  | TKubernetesAccount;

 export type TPamFolder = {
  id: string;
@@ -44,7 +56,28 @@ export type TTerminalEvent = {
  elapsedTime: number; // Seconds since session start (for replay)
 };

-export type TPamSessionLog = TPamCommandLog | TTerminalEvent;
+export type THttpRequestEvent = {
+  timestamp: string;
+  requestId: string;
+  eventType: "request";
+  headers: Record<string, string[]>;
+  method: string;
+  url: string;
+  body?: string;
+};
+
+export type THttpResponseEvent = {
+  timestamp: string;
+  requestId: string;
+  eventType: "response";
+  headers: Record<string, string[]>;
+  status: string;
+  body?: string;
+};
+
+export type THttpEvent = THttpRequestEvent | THttpResponseEvent;
+
+export type TPamSessionLog = TPamCommandLog | TTerminalEvent | THttpEvent;

 export type TPamSession = {
  id: string;
--- a/frontend/src/hooks/api/pam/types/kubernetes-resource.ts
+++ b/frontend/src/hooks/api/pam/types/kubernetes-resource.ts
@@ -0,0 +1,33 @@
+import { PamResourceType } from "../enums";
+import { TBasePamAccount } from "./base-account";
+import { TBasePamResource } from "./base-resource";
+
+export enum KubernetesAuthMethod {
+  ServiceAccountToken = "service-account-token"
+}
+
+export type TKubernetesConnectionDetails = {
+  url: string;
+  sslRejectUnauthorized: boolean;
+  sslCertificate?: string;
+};
+
+export type TKubernetesServiceAccountTokenCredentials = {
+  authMethod: KubernetesAuthMethod.ServiceAccountToken;
+  serviceAccountToken: string;
+};
+
+export type TKubernetesCredentials = TKubernetesServiceAccountTokenCredentials;
+
+// Resources
+export type TKubernetesResource = TBasePamResource & {
+  resourceType: PamResourceType.Kubernetes;
+} & {
+  connectionDetails: TKubernetesConnectionDetails;
+  rotationAccountCredentials?: TKubernetesCredentials | null;
+};
+
+// Accounts
+export type TKubernetesAccount = TBasePamAccount & {
+  credentials: TKubernetesCredentials;
+};
--- a/frontend/src/layouts/OrganizationLayout/components/NavBar/Navbar.tsx
+++ b/frontend/src/layouts/OrganizationLayout/components/NavBar/Navbar.tsx
@@ -170,7 +170,7 @@ export const Navbar = () => {
  const [isOrgSelectOpen, setIsOrgSelectOpen] = useState(false);

  const location = useLocation();
-  const isBillingPage = location.pathname === "/organization/billing";
+  const isBillingPage = location.pathname === `/organizations/${currentOrg.id}/billing`;

  const isModalIntrusive = Boolean(!isBillingPage && isCardDeclinedMoreThan30Days);

--- a/frontend/src/pages/pam/PamAccountsPage/components/PamAccessAccountModal.tsx
+++ b/frontend/src/pages/pam/PamAccountsPage/components/PamAccessAccountModal.tsx
@@ -85,6 +85,8 @@ export const PamAccessAccountModal = ({
        return `infisical pam db access-account ${fullAccountPath} --project-id ${projectId} --duration ${cliDuration} --domain ${siteURL}`;
      case PamResourceType.SSH:
        return `infisical pam ssh access-account ${fullAccountPath} --project-id ${projectId} --duration ${cliDuration} --domain ${siteURL}`;
+      case PamResourceType.Kubernetes:
+        return `infisical pam kubernetes access-account ${fullAccountPath} --project-id ${projectId} --duration ${cliDuration} --domain ${siteURL}`;
      default:
        return "";
    }
--- a/frontend/src/pages/pam/PamAccountsPage/components/PamAccountForm/KubernetesAccountForm.tsx
+++ b/frontend/src/pages/pam/PamAccountsPage/components/PamAccountForm/KubernetesAccountForm.tsx
@@ -0,0 +1,121 @@
+import { Controller, FormProvider, useForm, useFormContext } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+
+import { Button, FormControl, ModalClose, TextArea } from "@app/components/v2";
+import { KubernetesAuthMethod, PamResourceType, TKubernetesAccount } from "@app/hooks/api/pam";
+import { UNCHANGED_PASSWORD_SENTINEL } from "@app/hooks/api/pam/constants";
+
+import { GenericAccountFields, genericAccountFieldsSchema } from "./GenericAccountFields";
+import { rotateAccountFieldsSchema } from "./RotateAccountFields";
+
+type Props = {
+  account?: TKubernetesAccount;
+  resourceId?: string;
+  resourceType?: PamResourceType;
+  onSubmit: (formData: FormData) => Promise<void>;
+};
+
+const KubernetesServiceAccountTokenCredentialsSchema = z.object({
+  authMethod: z.literal(KubernetesAuthMethod.ServiceAccountToken),
+  serviceAccountToken: z.string().trim().min(1, "Service account token is required")
+});
+
+const formSchema = genericAccountFieldsSchema.extend(rotateAccountFieldsSchema.shape).extend({
+  credentials: KubernetesServiceAccountTokenCredentialsSchema
+});
+
+type FormData = z.infer<typeof formSchema>;
+
+const KubernetesAccountFields = ({ isUpdate }: { isUpdate: boolean }) => {
+  const { control } = useFormContext<FormData>();
+
+  return (
+    <div className="mb-4 rounded-sm border border-mineshaft-600 bg-mineshaft-700/70 p-3">
+      <Controller
+        name="credentials.serviceAccountToken"
+        control={control}
+        render={({ field, fieldState: { error } }) => (
+          <FormControl
+            className="mb-0"
+            errorText={error?.message}
+            isError={Boolean(error?.message)}
+            label="Service Account Token"
+            helperText="The bearer token for the service account"
+          >
+            <TextArea
+              {...field}
+              value={field.value === UNCHANGED_PASSWORD_SENTINEL ? "" : field.value || ""}
+              className="min-h-32 resize-y font-mono text-xs"
+              placeholder={
+                isUpdate && field.value === UNCHANGED_PASSWORD_SENTINEL
+                  ? "Token unchanged - click to update"
+                  : "eyJhbGciOiJSUzI1NiIsImtpZCI6..."
+              }
+            />
+          </FormControl>
+        )}
+      />
+    </div>
+  );
+};
+
+export const KubernetesAccountForm = ({ account, onSubmit }: Props) => {
+  const isUpdate = Boolean(account);
+
+  const form = useForm<FormData>({
+    resolver: zodResolver(formSchema),
+    defaultValues: account
+      ? {
+          ...account,
+          credentials: {
+            ...account.credentials,
+            serviceAccountToken: UNCHANGED_PASSWORD_SENTINEL
+          }
+        }
+      : {
+          name: "",
+          description: "",
+          credentials: {
+            authMethod: KubernetesAuthMethod.ServiceAccountToken,
+            serviceAccountToken: ""
+          },
+          rotationEnabled: false
+        }
+  });
+
+  const {
+    handleSubmit,
+    formState: { isSubmitting, isDirty }
+  } = form;
+
+  return (
+    <FormProvider {...form}>
+      <form
+        onSubmit={(e) => {
+          handleSubmit(onSubmit)(e);
+        }}
+      >
+        <GenericAccountFields />
+        <KubernetesAccountFields isUpdate={isUpdate} />
+        <div className="mt-6 flex items-center">
+          <Button
+            className="mr-4"
+            size="sm"
+            type="submit"
+            colorSchema="secondary"
+            isLoading={isSubmitting}
+            isDisabled={isSubmitting || !isDirty}
+          >
+            {isUpdate ? "Update Account" : "Create Account"}
+          </Button>
+          <ModalClose asChild>
+            <Button colorSchema="secondary" variant="plain">
+              Cancel
+            </Button>
+          </ModalClose>
+        </div>
+      </form>
+    </FormProvider>
+  );
+};
--- a/frontend/src/pages/pam/PamAccountsPage/components/PamAccountForm/PamAccountForm.tsx
+++ b/frontend/src/pages/pam/PamAccountsPage/components/PamAccountForm/PamAccountForm.tsx
@@ -9,6 +9,7 @@ import { DiscriminativePick } from "@app/types";

 import { PamAccountHeader } from "../PamAccountHeader";
 import { AwsIamAccountForm } from "./AwsIamAccountForm";
+import { KubernetesAccountForm } from "./KubernetesAccountForm";
 import { MySQLAccountForm } from "./MySQLAccountForm";
 import { PostgresAccountForm } from "./PostgresAccountForm";
 import { SshAccountForm } from "./SshAccountForm";
@@ -71,6 +72,14 @@ const CreateForm = ({
      return (
        <SshAccountForm onSubmit={onSubmit} resourceId={resourceId} resourceType={resourceType} />
      );
+    case PamResourceType.Kubernetes:
+      return (
+        <KubernetesAccountForm
+          onSubmit={onSubmit}
+          resourceId={resourceId}
+          resourceType={resourceType}
+        />
+      );
    case PamResourceType.AwsIam:
      return (
        <AwsIamAccountForm
@@ -109,6 +118,8 @@ const UpdateForm = ({ account, onComplete }: UpdateFormProps) => {
      return <MySQLAccountForm account={account as any} onSubmit={onSubmit} />;
    case PamResourceType.SSH:
      return <SshAccountForm account={account as any} onSubmit={onSubmit} />;
+    case PamResourceType.Kubernetes:
+      return <KubernetesAccountForm account={account as any} onSubmit={onSubmit} />;
    case PamResourceType.AwsIam:
      return <AwsIamAccountForm account={account as any} onSubmit={onSubmit} />;
    default:
--- a/frontend/src/pages/pam/PamResourcesPage/components/PamResourceForm/KubernetesResourceForm.tsx
+++ b/frontend/src/pages/pam/PamResourcesPage/components/PamResourceForm/KubernetesResourceForm.tsx
@@ -0,0 +1,80 @@
+import { FormProvider, useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+
+import { Button, ModalClose } from "@app/components/v2";
+import { KubernetesAuthMethod, PamResourceType, TKubernetesResource } from "@app/hooks/api/pam";
+
+import { KubernetesResourceFields } from "./shared/KubernetesResourceFields";
+import { GenericResourceFields, genericResourceFieldsSchema } from "./GenericResourceFields";
+
+type Props = {
+  resource?: TKubernetesResource;
+  onSubmit: (formData: FormData) => Promise<void>;
+};
+
+const KubernetesConnectionDetailsSchema = z.object({
+  url: z.string().url().trim().max(500),
+  sslRejectUnauthorized: z.boolean(),
+  sslCertificate: z.string().trim().max(10000).optional()
+});
+
+const KubernetesServiceAccountTokenCredentialsSchema = z.object({
+  authMethod: z.literal(KubernetesAuthMethod.ServiceAccountToken),
+  serviceAccountToken: z.string().trim().max(10000)
+});
+
+const formSchema = genericResourceFieldsSchema.extend({
+  resourceType: z.literal(PamResourceType.Kubernetes),
+  connectionDetails: KubernetesConnectionDetailsSchema,
+  rotationAccountCredentials: KubernetesServiceAccountTokenCredentialsSchema.nullable().optional()
+});
+
+type FormData = z.infer<typeof formSchema>;
+
+export const KubernetesResourceForm = ({ resource, onSubmit }: Props) => {
+  const isUpdate = Boolean(resource);
+
+  const form = useForm<FormData>({
+    resolver: zodResolver(formSchema),
+    defaultValues: resource ?? {
+      resourceType: PamResourceType.Kubernetes,
+      connectionDetails: {
+        url: "",
+        sslRejectUnauthorized: true,
+        sslCertificate: undefined
+      }
+    }
+  });
+
+  const {
+    handleSubmit,
+    formState: { isSubmitting, isDirty }
+  } = form;
+
+  return (
+    <FormProvider {...form}>
+      <form onSubmit={handleSubmit(onSubmit)}>
+        <GenericResourceFields />
+        <KubernetesResourceFields />
+        <div className="mt-6 flex items-center">
+          <Button
+            className="mr-4"
+            size="sm"
+            type="submit"
+            colorSchema="secondary"
+            isLoading={isSubmitting}
+            isDisabled={isSubmitting || !isDirty}
+          >
+            {isUpdate ? "Update Details" : "Create Resource"}
+          </Button>
+          <ModalClose asChild>
+            <Button colorSchema="secondary" variant="plain">
+              Cancel
+            </Button>
+          </ModalClose>
+        </div>
+      </form>
+    </FormProvider>
+  );
+};
--- a/frontend/src/pages/pam/PamResourcesPage/components/PamResourceForm/PamResourceForm.tsx
+++ b/frontend/src/pages/pam/PamResourcesPage/components/PamResourceForm/PamResourceForm.tsx
@@ -10,6 +10,7 @@ import { DiscriminativePick } from "@app/types";

 import { PamResourceHeader } from "../PamResourceHeader";
 import { AwsIamResourceForm } from "./AwsIamResourceForm";
+import { KubernetesResourceForm } from "./KubernetesResourceForm";
 import { MySQLResourceForm } from "./MySQLResourceForm";
 import { PostgresResourceForm } from "./PostgresResourceForm";
 import { SSHResourceForm } from "./SSHResourceForm";
@@ -55,6 +56,8 @@ const CreateForm = ({ resourceType, onComplete, projectId }: CreateFormProps) =>
      return <MySQLResourceForm onSubmit={onSubmit} />;
    case PamResourceType.SSH:
      return <SSHResourceForm onSubmit={onSubmit} />;
+    case PamResourceType.Kubernetes:
+      return <KubernetesResourceForm onSubmit={onSubmit} />;
    case PamResourceType.AwsIam:
      return <AwsIamResourceForm onSubmit={onSubmit} />;
    default:
@@ -87,6 +90,8 @@ const UpdateForm = ({ resource, onComplete }: UpdateFormProps) => {
      return <MySQLResourceForm resource={resource} onSubmit={onSubmit} />;
    case PamResourceType.SSH:
      return <SSHResourceForm resource={resource} onSubmit={onSubmit} />;
+    case PamResourceType.Kubernetes:
+      return <KubernetesResourceForm resource={resource} onSubmit={onSubmit} />;
    case PamResourceType.AwsIam:
      return <AwsIamResourceForm resource={resource} onSubmit={onSubmit} />;
    default:
--- a/frontend/src/pages/pam/PamResourcesPage/components/PamResourceForm/shared/KubernetesResourceFields.tsx
+++ b/frontend/src/pages/pam/PamResourcesPage/components/PamResourceForm/shared/KubernetesResourceFields.tsx
@@ -0,0 +1,77 @@
+import { Controller, useFormContext } from "react-hook-form";
+import { faQuestionCircle } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { FormControl, Input, Switch, TextArea, Tooltip } from "@app/components/v2";
+
+export const KubernetesResourceFields = () => {
+  const { control } = useFormContext();
+
+  return (
+    <div className="mb-4 rounded-sm border border-mineshaft-600 bg-mineshaft-700/70 p-3">
+      <div className="mt-[0.675rem] flex flex-col gap-4">
+        <Controller
+          name="connectionDetails.url"
+          control={control}
+          render={({ field, fieldState: { error } }) => (
+            <FormControl
+              errorText={error?.message}
+              isError={Boolean(error?.message)}
+              label="Kubernetes API URL"
+            >
+              <Input placeholder="https://kubernetes.example.com:6443" {...field} />
+            </FormControl>
+          )}
+        />
+        <Controller
+          name="connectionDetails.sslCertificate"
+          control={control}
+          render={({ field, fieldState: { error } }) => (
+            <FormControl
+              errorText={error?.message}
+              isError={Boolean(error?.message)}
+              label="CA Certificate"
+              isOptional
+            >
+              <TextArea
+                className="h-14 resize-none!"
+                {...field}
+                placeholder="-----BEGIN CERTIFICATE-----..."
+              />
+            </FormControl>
+          )}
+        />
+        <Controller
+          name="connectionDetails.sslRejectUnauthorized"
+          control={control}
+          render={({ field: { value, onChange }, fieldState: { error } }) => (
+            <FormControl isError={Boolean(error?.message)} errorText={error?.message}>
+              <Switch
+                className="bg-mineshaft-400/50 shadow-inner data-[state=checked]:bg-green/80"
+                id="ssl-reject-unauthorized"
+                thumbClassName="bg-mineshaft-800"
+                isChecked={value}
+                onCheckedChange={onChange}
+              >
+                <p className="w-38">
+                  Reject Unauthorized
+                  <Tooltip
+                    className="max-w-md"
+                    content={
+                      <p>
+                        If enabled, Infisical will only connect to the server if it has a valid,
+                        trusted SSL certificate.
+                      </p>
+                    }
+                  >
+                    <FontAwesomeIcon icon={faQuestionCircle} size="sm" className="ml-1" />
+                  </Tooltip>
+                </p>
+              </Switch>
+            </FormControl>
+          )}
+        />
+      </div>
+    </div>
+  );
+};
--- a/frontend/src/pages/pam/PamResourcesPage/components/PamResourceHeader.tsx
+++ b/frontend/src/pages/pam/PamResourcesPage/components/PamResourceHeader.tsx
@@ -2,7 +2,8 @@ import { DocumentationLinkBadge } from "@app/components/v3";
 import { PAM_RESOURCE_TYPE_MAP, PamResourceType } from "@app/hooks/api/pam";

 const PAM_RESOURCE_DOCS_MAP: Partial<Record<PamResourceType, string>> = {
-  [PamResourceType.AwsIam]: "aws-iam#create-the-pam-resource"
+  [PamResourceType.AwsIam]: "aws-iam#create-the-pam-resource",
+  [PamResourceType.Kubernetes]: "kubernetes"
 };

 type Props = {
--- a/frontend/src/pages/pam/PamResourcesPage/components/ResourceTypeSelect.tsx
+++ b/frontend/src/pages/pam/PamResourcesPage/components/ResourceTypeSelect.tsx
@@ -38,7 +38,6 @@ export const ResourceTypeSelect = ({ onSelect }: Props) => {
      { name: "Redis", resource: PamResourceType.Redis },
      { name: "RDP", resource: PamResourceType.RDP },
      { name: "SSH", resource: PamResourceType.SSH },
-      { name: "Kubernetes", resource: PamResourceType.Kubernetes },
      { name: "MCP", resource: PamResourceType.MCP },
      { name: "Web Application", resource: PamResourceType.WebApp }
    ];
@@ -78,7 +77,6 @@ export const ResourceTypeSelect = ({ onSelect }: Props) => {
    // We temporarily show a special license modal for these because we will have to write some code to complete the integration
    if (
      resource === PamResourceType.RDP ||
-      resource === PamResourceType.Kubernetes ||
      resource === PamResourceType.MCP ||
      resource === PamResourceType.Redis ||
      resource === PamResourceType.MongoDB ||
--- a/frontend/src/pages/pam/PamSessionsByIDPage/components/HttpEventView.tsx
+++ b/frontend/src/pages/pam/PamSessionsByIDPage/components/HttpEventView.tsx
@@ -0,0 +1,310 @@
+import { useMemo, useState } from "react";
+import { faChevronDown, faChevronUp, faMagnifyingGlass } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { Input } from "@app/components/v2";
+import { HighlightText } from "@app/components/v2/HighlightText";
+import { THttpEvent } from "@app/hooks/api/pam";
+
+type Props = {
+  events: THttpEvent[];
+};
+
+export const HttpEventView = ({ events }: Props) => {
+  const [search, setSearch] = useState("");
+  const [expandedEvents, setExpandedEvents] = useState<Record<string, boolean>>({});
+  const [expandedSections, setExpandedSections] = useState<
+    Record<string, { headers: boolean; body: boolean }>
+  >({});
+
+  const getContentType = (headers: Record<string, string[]>): string | undefined => {
+    const contentTypeKey = Object.keys(headers).find((key) => key.toLowerCase() === "content-type");
+    return contentTypeKey ? headers[contentTypeKey]?.[0] : undefined;
+  };
+
+  const decodeBase64Body = (body: string): string => {
+    try {
+      return atob(body);
+    } catch {
+      // If base64 decoding fails, return original body
+      return body;
+    }
+  };
+
+  const parseBodyForSearch = (
+    body: string | undefined,
+    headers: Record<string, string[]>
+  ): string => {
+    if (!body) return "";
+
+    // Decode base64 first
+    const decodedBody = decodeBase64Body(body);
+
+    const contentType = getContentType(headers);
+    const isJson = contentType?.toLowerCase().includes("application/json");
+
+    if (isJson) {
+      try {
+        const parsed = JSON.parse(decodedBody);
+        return JSON.stringify(parsed);
+      } catch {
+        // If JSON parsing fails, fall back to decoded body
+        return decodedBody;
+      }
+    }
+
+    return decodedBody;
+  };
+
+  const filteredEvents = useMemo(
+    () =>
+      events.filter((event) => {
+        const searchValue = search.trim().toLowerCase();
+        if (!searchValue) return true;
+
+        if (event.eventType === "request") {
+          const bodyForSearch = parseBodyForSearch(event.body, event.headers);
+          return (
+            event.method.toLowerCase().includes(searchValue) ||
+            event.url.toLowerCase().includes(searchValue) ||
+            event.requestId.toLowerCase().includes(searchValue) ||
+            Object.keys(event.headers).some((key) => key.toLowerCase().includes(searchValue)) ||
+            Object.values(event.headers).some((values) =>
+              values.some((value) => value.toLowerCase().includes(searchValue))
+            ) ||
+            bodyForSearch.toLowerCase().includes(searchValue)
+          );
+        }
+        return (
+          event.status.toLowerCase().includes(searchValue) ||
+          event.requestId.toLowerCase().includes(searchValue) ||
+          Object.keys(event.headers).some((key) => key.toLowerCase().includes(searchValue)) ||
+          Object.values(event.headers).some((values) =>
+            values.some((value) => value.toLowerCase().includes(searchValue))
+          )
+        );
+      }),
+    [events, search]
+  );
+
+  const formatHeaders = (headers: Record<string, string[]>) => {
+    return Object.entries(headers)
+      .map(([key, values]) => `${key}: ${values.join(", ")}`)
+      .join("\n");
+  };
+
+  const formatBody = (body: string | undefined, headers: Record<string, string[]>): string => {
+    if (!body) {
+      return "";
+    }
+
+    // Decode base64 first
+    const decodedBody = decodeBase64Body(body);
+
+    const contentType = getContentType(headers);
+    const isJson = contentType?.toLowerCase().includes("application/json");
+
+    if (isJson) {
+      try {
+        const parsed = JSON.parse(decodedBody);
+        return JSON.stringify(parsed, null, 2);
+      } catch {
+        // If JSON parsing fails, return decoded body
+        return decodedBody;
+      }
+    }
+
+    // For non-JSON content, return decoded body
+    return decodedBody;
+  };
+
+  const getKubectlCommand = (headers: Record<string, string[]>) => {
+    const headerKey = Object.keys(headers).find((key) => key.toLowerCase() === "kubectl-command");
+    return headerKey ? headers[headerKey]?.[0] : undefined;
+  };
+
+  const toggleEvent = (eventKey: string) => {
+    const willBeExpanded = !expandedEvents[eventKey];
+    setExpandedEvents((prev) => ({
+      ...prev,
+      [eventKey]: willBeExpanded
+    }));
+    // When expanding, show headers by default (but keep body collapsed)
+    if (willBeExpanded) {
+      setExpandedSections((prev) => ({
+        ...prev,
+        [eventKey]: {
+          headers: true,
+          body: prev[eventKey]?.body ?? false
+        }
+      }));
+    }
+  };
+
+  const toggleSection = (eventKey: string, section: "headers" | "body") => {
+    setExpandedSections((prev) => ({
+      ...prev,
+      [eventKey]: {
+        ...prev[eventKey],
+        [section]: !prev[eventKey]?.[section]
+      }
+    }));
+  };
+
+  const isEventExpanded = (eventKey: string) => {
+    return expandedEvents[eventKey] ?? false;
+  };
+
+  const isSectionExpanded = (eventKey: string, section: "headers" | "body") => {
+    return expandedSections[eventKey]?.[section] ?? false;
+  };
+
+  return (
+    <>
+      <div className="flex gap-2">
+        <Input
+          value={search}
+          onChange={(e) => setSearch(e.target.value)}
+          leftIcon={<FontAwesomeIcon icon={faMagnifyingGlass} />}
+          placeholder="Search HTTP events..."
+          className="flex-1 bg-mineshaft-800"
+          containerClassName="bg-transparent"
+        />
+      </div>
+
+      <div className="flex grow flex-col gap-2 overflow-y-auto text-xs">
+        {filteredEvents.length > 0 ? (
+          filteredEvents.map((event, index) => {
+            const eventKey = `${event.timestamp}-${event.requestId}-${index}`;
+            const isRequest = event.eventType === "request";
+            const kubectlCommand = getKubectlCommand(event.headers);
+
+            const isExpanded = isEventExpanded(eventKey);
+
+            return (
+              <div
+                key={eventKey}
+                className="flex w-full flex-col rounded-md border border-mineshaft-700 bg-mineshaft-800 p-3"
+              >
+                <button
+                  type="button"
+                  onClick={() => toggleEvent(eventKey)}
+                  className="flex items-center justify-between text-bunker-400 transition-colors hover:text-bunker-300"
+                >
+                  <div className="flex items-center gap-2 text-xs">
+                    <FontAwesomeIcon
+                      icon={isExpanded ? faChevronUp : faChevronDown}
+                      className="text-xs"
+                    />
+                    <span
+                      className={`rounded px-2 py-0.5 ${
+                        isRequest
+                          ? "bg-blue-500/20 text-blue-400"
+                          : "bg-green-500/20 text-green-400"
+                      }`}
+                    >
+                      {isRequest ? "REQUEST" : "RESPONSE"}
+                    </span>
+                    {kubectlCommand && (
+                      <span
+                        className="rounded bg-purple-500/20 px-2 py-0.5 text-purple-400"
+                        title="Kubectl Command"
+                      >
+                        kubectl: {kubectlCommand}
+                      </span>
+                    )}
+                    <span>{new Date(event.timestamp).toLocaleString()}</span>
+                    <span className="text-bunker-500">•</span>
+                    <span className="font-mono text-xs">{event.requestId}</span>
+                  </div>
+                </button>
+
+                <div className="mt-2">
+                  {isRequest ? (
+                    <div className="font-mono text-bunker-100">
+                      <span className="font-semibold text-bunker-200">{event.method}</span>{" "}
+                      <HighlightText text={event.url} highlight={search} />
+                    </div>
+                  ) : (
+                    <div className="font-mono text-bunker-100">
+                      <span className="font-semibold text-bunker-200">Status:</span>{" "}
+                      <HighlightText text={event.status} highlight={search} />
+                    </div>
+                  )}
+                </div>
+
+                {isExpanded && (
+                  <div className="mt-2 ml-4 space-y-2 border-l-2 border-mineshaft-600 pl-3">
+                    {Object.keys(event.headers).length > 0 && (
+                      <div className="mt-2 border-t border-mineshaft-700 pt-2">
+                        <button
+                          type="button"
+                          onClick={() => toggleSection(eventKey, "headers")}
+                          className="mb-1 flex w-full items-center gap-2 text-left text-xs text-bunker-400 transition-colors hover:text-bunker-300"
+                        >
+                          <FontAwesomeIcon
+                            icon={
+                              isSectionExpanded(eventKey, "headers") ? faChevronUp : faChevronDown
+                            }
+                            className="text-xs"
+                          />
+                          <span>Headers:</span>
+                        </button>
+                        {isSectionExpanded(eventKey, "headers") && (
+                          <div className="font-mono text-xs whitespace-pre-wrap text-bunker-300">
+                            <HighlightText text={formatHeaders(event.headers)} highlight={search} />
+                          </div>
+                        )}
+                      </div>
+                    )}
+
+                    {event.body && (
+                      <div className="mt-2 border-t border-mineshaft-700 pt-2">
+                        <button
+                          type="button"
+                          onClick={() => toggleSection(eventKey, "body")}
+                          className="mb-1 flex w-full items-center gap-2 text-left text-xs text-bunker-400 transition-colors hover:text-bunker-300"
+                        >
+                          <FontAwesomeIcon
+                            icon={isSectionExpanded(eventKey, "body") ? faChevronUp : faChevronDown}
+                            className="text-xs"
+                          />
+                          <span>Body:</span>
+                        </button>
+                        {isSectionExpanded(eventKey, "body") && (
+                          <div className="font-mono text-xs whitespace-pre-wrap text-bunker-300">
+                            <HighlightText
+                              text={formatBody(event.body, event.headers)}
+                              highlight={search}
+                            />
+                          </div>
+                        )}
+                      </div>
+                    )}
+                  </div>
+                )}
+              </div>
+            );
+          })
+        ) : (
+          <div className="flex grow items-center justify-center text-bunker-300">
+            {search.length ? (
+              <div className="text-center">
+                <div className="mb-2">No HTTP events match search criteria</div>
+              </div>
+            ) : (
+              <div className="text-center">
+                <div className="mb-2">HTTP session logs are not yet available</div>
+                <div className="text-xs text-bunker-400">
+                  Logs will be uploaded after the session duration has elapsed.
+                  <br />
+                  If logs do not appear after some time, please contact your Gateway administrators.
+                </div>
+              </div>
+            )}
+          </div>
+        )}
+      </div>
+    </>
+  );
+};
--- a/frontend/src/pages/pam/PamSessionsByIDPage/components/PamSessionLogsSection.tsx
+++ b/frontend/src/pages/pam/PamSessionsByIDPage/components/PamSessionLogsSection.tsx
@@ -1,9 +1,16 @@
 import { faUpRightFromSquare } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";

-import { PamResourceType, TPamCommandLog, TPamSession, TTerminalEvent } from "@app/hooks/api/pam";
+import {
+  PamResourceType,
+  THttpEvent,
+  TPamCommandLog,
+  TPamSession,
+  TTerminalEvent
+} from "@app/hooks/api/pam";

 import { CommandLogView } from "./CommandLogView";
+import { HttpEventView } from "./HttpEventView";
 import { TerminalEventView } from "./TerminalEventView";

 type Props = {
@@ -16,6 +23,7 @@ export const PamSessionLogsSection = ({ session }: Props) => {
  const isDatabaseSession =
    session.resourceType === PamResourceType.Postgres ||
    session.resourceType === PamResourceType.MySQL;
+  const isHttpSession = session.resourceType === PamResourceType.Kubernetes;
  const isAwsIamSession = session.resourceType === PamResourceType.AwsIam;
  const hasLogs = session.logs.length > 0;

@@ -27,6 +35,7 @@ export const PamSessionLogsSection = ({ session }: Props) => {

      {isDatabaseSession && hasLogs && <CommandLogView logs={session.logs as TPamCommandLog[]} />}
      {isSSHSession && hasLogs && <TerminalEventView events={session.logs as TTerminalEvent[]} />}
+      {isHttpSession && hasLogs && <HttpEventView events={session.logs as THttpEvent[]} />}
      {isAwsIamSession && (
        <div className="flex grow items-center justify-center text-bunker-300">
          <div className="text-center">
--- a/frontend/src/pages/secret-manager/SecretDashboardPage/SecretDashboardPage.tsx
+++ b/frontend/src/pages/secret-manager/SecretDashboardPage/SecretDashboardPage.tsx
@@ -685,12 +685,17 @@ const Page = () => {
    setDebouncedSearchFilter("");
  };

-  const getMergedSecretsWithPending = () => {
+  const getMergedSecretsWithPending = (
+    paramSecrets?: (SecretV3RawSanitized | null)[]
+  ): SecretV3RawSanitized[] => {
+    const sanitizedParamSecrets = paramSecrets?.filter(Boolean) as
+      | SecretV3RawSanitized[]
+      | undefined;
    if (!isBatchMode || pendingChanges.secrets.length === 0) {
-      return secrets;
+      return sanitizedParamSecrets || secrets || [];
    }

-    const mergedSecrets = [...(secrets || [])] as (SecretV3RawSanitized & {
+    const mergedSecrets = [...(sanitizedParamSecrets || secrets || [])] as (SecretV3RawSanitized & {
      originalKey?: string;
    })[];

@@ -1072,7 +1077,17 @@ const Page = () => {
                />
              )}
              {canReadSecretRotations && Boolean(secretRotations?.length) && (
-                <SecretRotationListView secretRotations={secretRotations} />
+                <SecretRotationListView
+                  secretRotations={secretRotations}
+                  colWidth={colWidth}
+                  tags={tags}
+                  projectId={projectId}
+                  secretPath={secretPath}
+                  isProtectedBranch={isProtectedBranch}
+                  importedBy={importedBy}
+                  usedBySecretSyncs={usedBySecretSyncs}
+                  getMergedSecretsWithPending={getMergedSecretsWithPending}
+                />
              )}
              {canReadSecret && Boolean(mergedSecrets?.length) && (
                <SecretListView
--- a/frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretListView/SecretItem.tsx
+++ b/frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretListView/SecretItem.tsx
@@ -733,7 +733,7 @@ export const SecretItem = memo(
                    {(isAllowed) => (
                      <IconButton
                        ariaLabel="override-value"
-                        isDisabled={!isAllowed}
+                        isDisabled={!isAllowed || isRotatedSecret}
                        variant="plain"
                        size="sm"
                        onClick={handleOverrideClick}
@@ -742,7 +742,13 @@ export const SecretItem = memo(
                          isOverridden && "w-5 text-primary"
                        )}
                      >
-                        <Tooltip content={`${isOverridden ? "Remove" : "Add"} Override`}>
+                        <Tooltip
+                          content={
+                            isRotatedSecret
+                              ? "Unavailable for rotated secrets"
+                              : `${isOverridden ? "Remove" : "Add"} Override`
+                          }
+                        >
                          <FontAwesomeSymbol
                            symbolName={FontAwesomeSpriteName.Override}
                            className="h-3.5 w-3.5"
--- a/frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretListView/SecretListView.tsx
+++ b/frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretListView/SecretListView.tsx
@@ -52,6 +52,7 @@ type Props = {
    }[];
  }[];
  colWidth: number;
+  excludePendingCreates?: boolean;
 };

 export const SecretListView = ({
@@ -64,7 +65,8 @@ export const SecretListView = ({
  isProtectedBranch = false,
  usedBySecretSyncs,
  importedBy,
-  colWidth
+  colWidth,
+  excludePendingCreates = false
 }: Props) => {
  const queryClient = useQueryClient();
  const { popUp, handlePopUpToggle, handlePopUpOpen, handlePopUpClose } = usePopUp([
@@ -580,27 +582,32 @@ export const SecretListView = ({
      {FontAwesomeSpriteSymbols.map(({ icon, symbol }) => (
        <FontAwesomeIcon icon={icon} symbol={symbol} key={`font-awesome-svg-spritie-${symbol}`} />
      ))}
-      {secrets.map((secret) => (
-        <SecretItem
-          colWidth={colWidth}
-          environment={environment}
-          secretPath={secretPath}
-          tags={wsTags}
-          isSelected={Boolean(selectedSecrets?.[secret.id])}
-          onToggleSecretSelect={toggleSelectedSecret}
-          isVisible={isVisible}
-          secret={secret}
-          key={secret.id}
-          onSaveSecret={handleSaveSecret}
-          onDeleteSecret={onDeleteSecret}
-          onDetailViewSecret={onDetailViewSecret}
-          importedBy={importedBy}
-          onCreateTag={onCreateTag}
-          onShareSecret={onShareSecret}
-          isPending={secret.isPending}
-          pendingAction={secret.pendingAction}
-        />
-      ))}
+      {secrets
+        .filter((secret) => {
+          if (!excludePendingCreates) return true;
+          return !secret.isPending || secret.pendingAction !== PendingAction.Create;
+        })
+        .map((secret) => (
+          <SecretItem
+            colWidth={colWidth}
+            environment={environment}
+            secretPath={secretPath}
+            tags={wsTags}
+            isSelected={Boolean(selectedSecrets?.[secret.id])}
+            onToggleSecretSelect={toggleSelectedSecret}
+            isVisible={isVisible}
+            secret={secret}
+            key={secret.id}
+            onSaveSecret={handleSaveSecret}
+            onDeleteSecret={onDeleteSecret}
+            onDetailViewSecret={onDetailViewSecret}
+            importedBy={importedBy}
+            onCreateTag={onCreateTag}
+            onShareSecret={onShareSecret}
+            isPending={secret.isPending}
+            pendingAction={secret.pendingAction}
+          />
+        ))}
      <DeleteActionModal
        isOpen={popUp.deleteSecret.isOpen}
        deleteKey={(popUp.deleteSecret?.data as SecretV3RawSanitized)?.key}
--- a/frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretRotationListView/SecretRotationItem.tsx
+++ b/frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretRotationListView/SecretRotationItem.tsx
@@ -18,8 +18,11 @@ import { IconButton, Modal, ModalContent, TableContainer, Tag, Tooltip } from "@
 import { ProjectPermissionSub } from "@app/context";
 import { ProjectPermissionSecretRotationActions } from "@app/context/ProjectPermissionContext/types";
 import { SECRET_ROTATION_MAP } from "@app/helpers/secretRotationsV2";
+import { UsedBySecretSyncs } from "@app/hooks/api/dashboard/types";
 import { TSecretRotationV2 } from "@app/hooks/api/secretRotationsV2";
+import { SecretV3RawSanitized, WsTag } from "@app/hooks/api/types";

+import { SecretListView } from "../SecretListView";
 import { SecretRotationSecretRow } from "./SecretRotationSecretRow";

 type Props = {
@@ -28,6 +31,23 @@ type Props = {
  onRotate: () => void;
  onViewGeneratedCredentials: () => void;
  onDelete: () => void;
+  projectId: string;
+  secretPath?: string;
+  tags?: WsTag[];
+  isProtectedBranch?: boolean;
+  usedBySecretSyncs?: UsedBySecretSyncs[];
+  importedBy?: {
+    environment: { name: string; slug: string };
+    folders: {
+      name: string;
+      secrets?: { secretId: string; referencedSecretKey: string; referencedSecretEnv: string }[];
+      isImported: boolean;
+    }[];
+  }[];
+  colWidth: number;
+  getMergedSecretsWithPending: (
+    paramSecrets?: (SecretV3RawSanitized | null)[]
+  ) => SecretV3RawSanitized[];
 };

 export const SecretRotationItem = ({
@@ -35,16 +55,40 @@ export const SecretRotationItem = ({
  onEdit,
  onRotate,
  onViewGeneratedCredentials,
-  onDelete
+  onDelete,
+  projectId,
+  secretPath = "/",
+  tags = [],
+  isProtectedBranch = false,
+  usedBySecretSyncs,
+  importedBy,
+  colWidth,
+  getMergedSecretsWithPending
 }: Props) => {
  const { name, type, environment, folder, secrets, description } = secretRotation;

  const { name: rotationType, image } = SECRET_ROTATION_MAP[type];
  const [showSecrets, setShowSecrets] = useState(false);
+  const [isExpanded, setIsExpanded] = useState(true);

  return (
    <>
-      <div className={twMerge("group flex border-b border-mineshaft-600 hover:bg-mineshaft-700")}>
+      <div
+        className={twMerge(
+          "group flex cursor-pointer border-b border-mineshaft-600 hover:bg-mineshaft-700"
+        )}
+        onClick={() => setIsExpanded(!isExpanded)}
+        onKeyDown={(e) => {
+          if (e.key === "Enter" || e.key === " ") {
+            e.preventDefault();
+            setIsExpanded(!isExpanded);
+          }
+        }}
+        role="button"
+        tabIndex={0}
+        aria-expanded={isExpanded}
+        aria-label={`${isExpanded ? "Collapse" : "Expand"} rotation secrets for ${name}`}
+      >
        <div className="text- flex w-11 items-center py-2 pl-5 text-mineshaft-400">
          <FontAwesomeIcon icon={faRotate} />
        </div>
@@ -198,6 +242,20 @@ export const SecretRotationItem = ({
          </motion.div>
        </AnimatePresence>
      </div>
+      {isExpanded && (
+        <SecretListView
+          colWidth={colWidth}
+          secrets={getMergedSecretsWithPending(secretRotation.secrets) || []}
+          tags={tags}
+          environment={environment.slug}
+          projectId={projectId}
+          secretPath={secretPath}
+          isProtectedBranch={isProtectedBranch}
+          importedBy={importedBy}
+          usedBySecretSyncs={usedBySecretSyncs}
+          excludePendingCreates
+        />
+      )}
      <Modal onOpenChange={setShowSecrets} isOpen={showSecrets}>
        <ModalContent
          onOpenAutoFocus={(e) => e.preventDefault()}
--- a/frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretRotationListView/SecretRotationListView.tsx
+++ b/frontend/src/pages/secret-manager/SecretDashboardPage/components/SecretRotationListView/SecretRotationListView.tsx
@@ -3,15 +3,44 @@ import { EditSecretRotationV2Modal } from "@app/components/secret-rotations-v2/E
 import { RotateSecretRotationV2Modal } from "@app/components/secret-rotations-v2/RotateSecretRotationV2Modal";
 import { ViewSecretRotationV2GeneratedCredentialsModal } from "@app/components/secret-rotations-v2/ViewSecretRotationV2GeneratedCredentials";
 import { usePopUp } from "@app/hooks";
+import { UsedBySecretSyncs } from "@app/hooks/api/dashboard/types";
 import { TSecretRotationV2 } from "@app/hooks/api/secretRotationsV2";
+import { SecretV3RawSanitized, WsTag } from "@app/hooks/api/types";

 import { SecretRotationItem } from "./SecretRotationItem";

 type Props = {
  secretRotations?: TSecretRotationV2[];
+  projectId: string;
+  secretPath?: string;
+  tags?: WsTag[];
+  isProtectedBranch?: boolean;
+  usedBySecretSyncs?: UsedBySecretSyncs[];
+  importedBy?: {
+    environment: { name: string; slug: string };
+    folders: {
+      name: string;
+      secrets?: { secretId: string; referencedSecretKey: string; referencedSecretEnv: string }[];
+      isImported: boolean;
+    }[];
+  }[];
+  colWidth: number;
+  getMergedSecretsWithPending: (
+    secretParams?: (SecretV3RawSanitized | null)[]
+  ) => SecretV3RawSanitized[];
 };

-export const SecretRotationListView = ({ secretRotations }: Props) => {
+export const SecretRotationListView = ({
+  secretRotations,
+  projectId,
+  secretPath = "/",
+  tags = [],
+  isProtectedBranch = false,
+  usedBySecretSyncs,
+  importedBy,
+  colWidth,
+  getMergedSecretsWithPending
+}: Props) => {
  const { popUp, handlePopUpOpen, handlePopUpToggle } = usePopUp([
    "editSecretRotation",
    "rotateSecretRotation",
@@ -31,6 +60,14 @@ export const SecretRotationListView = ({ secretRotations }: Props) => {
            handlePopUpOpen("viewSecretRotationGeneratedCredentials", secretRotation)
          }
          onDelete={() => handlePopUpOpen("deleteSecretRotation", secretRotation)}
+          colWidth={colWidth}
+          tags={tags}
+          projectId={projectId}
+          secretPath={secretPath}
+          isProtectedBranch={isProtectedBranch}
+          importedBy={importedBy}
+          usedBySecretSyncs={usedBySecretSyncs}
+          getMergedSecretsWithPending={getMergedSecretsWithPending}
        />
      ))}
      <EditSecretRotationV2Modal