Add PKI links to docs

frontend/src/pages/cert-manager/AlertingPage/AlertingPage.tsx

@@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next";
 
 import { ProjectPermissionCan } from "@app/components/permissions";
 import { PageHeader, Tab, TabList, TabPanel, Tabs } from "@app/components/v2";
+import { DocumentationLinkBadge } from "@app/components/v3";
 import { ProjectPermissionActions, ProjectPermissionSub, useProject } from "@app/context";
 import { useListWorkspacePkiAlerts } from "@app/hooks/api";
 import { ProjectType } from "@app/hooks/api/projects/types";
@@ -30,7 +31,12 @@ export const AlertingPage = () => {
       <div className="mx-auto mb-6 w-full max-w-8xl">
         <PageHeader
           scope={ProjectType.CertificateManager}
-          title="Alerting"
+          title={
+            <div className="flex items-center gap-x-2">
+              Alerting
+              <DocumentationLinkBadge href="https://infisical.com/docs/documentation/platform/pki/alerting" />
+            </div>
+          }
           description="Configure alerts for expiring certificates and CAs to maintain security and compliance."
         />
         <ProjectPermissionCan

frontend/src/pages/cert-manager/CertificateAuthoritiesPage/components/CaSection.tsx

@@ -4,6 +4,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { createNotification } from "@app/components/notifications";
 import { ProjectPermissionCan } from "@app/components/permissions";
 import { Button, DeleteActionModal } from "@app/components/v2";
+import { DocumentationLinkBadge } from "@app/components/v3";
 import {
   ProjectPermissionCertificateAuthorityActions,
   ProjectPermissionSub,
@@ -59,7 +60,10 @@ export const CaSection = () => {
   return (
     <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
       <div className="mb-4 flex justify-between">
-        <p className="text-xl font-medium text-mineshaft-100">Internal Certificate Authorities</p>
+        <div className="flex items-center gap-x-2">
+          <p className="text-xl font-medium text-mineshaft-100">Internal Certificate Authorities</p>
+          <DocumentationLinkBadge href="https://infisical.com/docs/documentation/platform/pki/private-ca" />
+        </div>
         <ProjectPermissionCan
           I={ProjectPermissionCertificateAuthorityActions.Create}
           a={ProjectPermissionSub.CertificateAuthorities}
@@ -83,9 +87,8 @@ export const CaSection = () => {
       <CaTable handlePopUpOpen={handlePopUpOpen} />
       <DeleteActionModal
         isOpen={popUp.deleteCa.isOpen}
-        title={`Are you sure you want to remove the CA ${
-          (popUp?.deleteCa?.data as { dn: string })?.dn || ""
-        } from the project?`}
+        title={`Are you sure you want to remove the CA ${(popUp?.deleteCa?.data as { dn: string })?.dn || ""
+          } from the project?`}
         subTitle="This action will delete other CAs and certificates below it in your CA hierarchy."
         onChange={(isOpen) => handlePopUpToggle("deleteCa", isOpen)}
         deleteKey="confirm"
@@ -93,11 +96,10 @@ export const CaSection = () => {
       />
       <DeleteActionModal
         isOpen={popUp.caStatus.isOpen}
-        title={`Are you sure you want to ${
-          (popUp?.caStatus?.data as { status: string })?.status === CaStatus.ACTIVE
+        title={`Are you sure you want to ${(popUp?.caStatus?.data as { status: string })?.status === CaStatus.ACTIVE
             ? "enable"
             : "disable"
-        } the CA ${(popUp?.caStatus?.data as { dn: string })?.dn || ""} from the project?`}
+          } the CA ${(popUp?.caStatus?.data as { dn: string })?.dn || ""} from the project?`}
         subTitle={
           (popUp?.caStatus?.data as { status: string })?.status === CaStatus.ACTIVE
             ? "This action will allow the CA to start issuing certificates again."

frontend/src/pages/cert-manager/CertificateAuthoritiesPage/components/ExternalCaSection.tsx

@@ -4,6 +4,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { createNotification } from "@app/components/notifications";
 import { ProjectPermissionCan } from "@app/components/permissions";
 import { Button, DeleteActionModal } from "@app/components/v2";
+import { DocumentationLinkBadge } from "@app/components/v3";
 import {
   ProjectPermissionCertificateAuthorityActions,
   ProjectPermissionSub,
@@ -63,7 +64,10 @@ export const ExternalCaSection = () => {
   return (
     <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
       <div className="mb-4 flex justify-between">
-        <p className="text-xl font-medium text-mineshaft-100">External Certificate Authorities</p>
+        <div className="flex items-center gap-x-2">
+          <p className="text-xl font-medium text-mineshaft-100">External Certificate Authorities</p>
+          <DocumentationLinkBadge href="https://infisical.com/docs/documentation/platform/pki/ca/external-ca" />
+        </div>
         <ProjectPermissionCan
           I={ProjectPermissionCertificateAuthorityActions.Create}
           a={ProjectPermissionSub.CertificateAuthorities}

frontend/src/pages/cert-manager/CertificatesPage/components/CertificatesSection.tsx

@@ -4,6 +4,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { createNotification } from "@app/components/notifications";
 import { ProjectPermissionCan } from "@app/components/permissions";
 import { Button, DeleteActionModal } from "@app/components/v2";
+import { DocumentationLinkBadge } from "@app/components/v3";
 import {
   ProjectPermissionCertificateActions,
   ProjectPermissionCertificateProfileActions,
@@ -104,7 +105,10 @@ export const CertificatesSection = () => {
   return (
     <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
       <div className="mb-4 flex justify-between">
-        <p className="text-xl font-medium text-mineshaft-100">Certificates</p>
+        <div className="flex items-center gap-x-2">
+          <p className="text-xl font-medium text-mineshaft-100">Certificates</p>
+          <DocumentationLinkBadge href="https://infisical.com/docs/documentation/platform/pki/certificates/overview" />
+        </div>
         <div className="flex gap-2">
           <ProjectPermissionCan
             I={ProjectPermissionCertificateActions.Import}
@@ -157,9 +161,8 @@ export const CertificatesSection = () => {
       />
       <DeleteActionModal
         isOpen={popUp.deleteCertificate.isOpen}
-        title={`Are you sure you want to remove the certificate ${
-          (popUp?.deleteCertificate?.data as { commonName: string })?.commonName || ""
-        } from the project?`}
+        title={`Are you sure you want to remove the certificate ${(popUp?.deleteCertificate?.data as { commonName: string })?.commonName || ""
+          } from the project?`}
         onChange={(isOpen) => handlePopUpToggle("deleteCertificate", isOpen)}
         deleteKey="confirm"
         onDeleteApproved={() =>

frontend/src/pages/cert-manager/PoliciesPage/components/CertificateProfilesTab/CertificateProfilesTab.tsx

@@ -6,6 +6,7 @@ import { UpgradePlanModal } from "@app/components/license/UpgradePlanModal";
 import { createNotification } from "@app/components/notifications";
 import { ProjectPermissionCan } from "@app/components/permissions";
 import { Button, DeleteActionModal } from "@app/components/v2";
+import { DocumentationLinkBadge } from "@app/components/v3";
 import {
   ProjectPermissionCertificateProfileActions,
   ProjectPermissionSub
@@ -70,7 +71,10 @@ export const CertificateProfilesTab = () => {
     <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
       <div className="mb-4 flex items-center justify-between">
         <div>
-          <h2 className="text-xl font-semibold text-mineshaft-100">Certificate Profiles</h2>
+          <div className="flex items-center gap-x-2">
+            <h2 className="text-xl font-semibold text-mineshaft-100">Certificate Profiles</h2>
+            <DocumentationLinkBadge href="https://infisical.com/docs/documentation/platform/pki/certificates/profiles" />
+          </div>
           <p className="text-sm text-bunker-300">
             Unified certificate issuance configurations combining CA, template, and enrollment
             method

frontend/src/pages/cert-manager/PoliciesPage/components/CertificateTemplatesV2Tab/CertificateTemplatesV2Tab.tsx

@@ -5,6 +5,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { createNotification } from "@app/components/notifications";
 import { ProjectPermissionCan } from "@app/components/permissions";
 import { Button, DeleteActionModal } from "@app/components/v2";
+import { DocumentationLinkBadge } from "@app/components/v3";
 import {
   ProjectPermissionPkiTemplateActions,
   ProjectPermissionSub
@@ -56,7 +57,10 @@ export const CertificateTemplatesV2Tab = () => {
     <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
       <div className="mb-4 flex items-center justify-between">
         <div>
-          <h2 className="text-xl font-semibold text-mineshaft-100">Certificate Templates</h2>
+          <div className="flex items-center gap-x-2">
+            <h2 className="text-xl font-semibold text-mineshaft-100">Certificate Templates</h2>
+            <DocumentationLinkBadge href="https://infisical.com/docs/documentation/platform/pki/certificates/templates" />
+          </div>
           <p className="text-sm text-bunker-300">
             Define certificate policies, validation rules, and attribute constraints for certificate
             issuance