feat(ipsec): enhance IPsec management with peer and certificate handling

- Added support for managing IPsec peers, including editing and deleting functionality.
- Introduced a new UI component for displaying peers and their details within the IPsec server grid.
- Updated the IPsec user creation form to allow binding identities to specific peers.
- Enhanced backend routes and services to handle peer patching and deletion requests.
- Improved data structures to accommodate multiple peers and certificates for each server.
- Added tests to ensure proper functionality of new peer management features.

components/ipsec/ipsec-peer-sheet.tsx

@@ -0,0 +1,149 @@
+"use client"
+
+import { useEffect, useMemo, useState } from "react"
+import type { IpsecPeerDto } from "@mmapp/contracts/ipsec"
+import { FormField, FormToggle, SectionTitle } from "@/components/form-kit"
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import {
+  Sheet, SheetContent, SheetHeader, SheetTitle,
+  SheetDescription, SheetFooter, SheetClose,
+} from "@/components/ui/sheet"
+
+export type IpsecPeerFormState = {
+  name: string
+  address: string
+  exchangeMode: string
+  passive: boolean
+  certificate: string
+  profile: string
+  disabled: boolean
+}
+
+export const defaultIpsecPeerForm = (): IpsecPeerFormState => ({
+  name: "",
+  address: "0.0.0.0/0",
+  exchangeMode: "ike2",
+  passive: true,
+  certificate: "",
+  profile: "",
+  disabled: false,
+})
+
+const EXCHANGE_MODES = ["ike2", "main", "aggressive", "base"]
+
+/** Редактирование существующего peer (сервера) RouterOS. */
+function IpsecPeerSheet({
+  open,
+  onOpenChange,
+  busy,
+  editing,
+  certificates,
+  onSubmit,
+}: {
+  open: boolean
+  onOpenChange: (v: boolean) => void
+  busy?: boolean
+  editing: IpsecPeerDto | null
+  certificates: string[]
+  onSubmit: (form: IpsecPeerFormState) => void | Promise<void>
+}) {
+  const [form, setForm] = useState<IpsecPeerFormState>(defaultIpsecPeerForm)
+  const set = <K extends keyof IpsecPeerFormState>(k: K, v: IpsecPeerFormState[K]) =>
+    setForm((f) => ({ ...f, [k]: v }))
+
+  useEffect(() => {
+    if (!open || !editing) return
+    queueMicrotask(() => setForm({
+      name: editing.name,
+      address: editing.address ?? "",
+      exchangeMode: editing.exchangeMode ?? "ike2",
+      passive: editing.passive ?? false,
+      certificate: editing.certificate ?? "",
+      profile: editing.profile ?? "",
+      disabled: editing.disabled,
+    }))
+  }, [open, editing])
+
+  const canSubmit = useMemo(() => form.name.trim().length > 0, [form.name])
+
+  return (
+    <Sheet open={open} onOpenChange={onOpenChange}>
+      <SheetContent side="right" className="w-full sm:max-w-md flex flex-col gap-0 p-0">
+        <SheetHeader className="px-6 pt-6 pb-4 border-b shrink-0">
+          <SheetTitle>{editing ? `Peer «${editing.name}»` : "Peer"}</SheetTitle>
+          <SheetDescription>
+            {editing?.managed
+              ? "Managed peer: изменения применяются напрямую на роутере"
+              : "Существующий peer RouterOS: изменения применяются напрямую"}
+          </SheetDescription>
+        </SheetHeader>
+
+        <div className="flex-1 overflow-y-auto px-6 py-5 flex flex-col gap-5">
+          <div className="flex flex-col gap-4">
+            <SectionTitle>Основные</SectionTitle>
+            <FormField label="Имя" required>
+              <Input value={form.name} onChange={(e) => set("name", e.target.value)} />
+            </FormField>
+            <FormField label="Адрес" hint="Обычно 0.0.0.0/0 для road-warrior">
+              <Input className="font-mono" value={form.address} onChange={(e) => set("address", e.target.value)} />
+            </FormField>
+            <FormField label="Exchange mode">
+              <select
+                className="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]"
+                value={form.exchangeMode}
+                onChange={(e) => set("exchangeMode", e.target.value)}
+              >
+                {EXCHANGE_MODES.map((m) => (
+                  <option key={m} value={m}>{m}</option>
+                ))}
+              </select>
+            </FormField>
+            <FormField label="Сертификат" hint="Серверный сертификат роутера">
+              <Input
+                className="font-mono"
+                list="ipsec-peer-certs"
+                placeholder="ipsec-server"
+                value={form.certificate}
+                onChange={(e) => set("certificate", e.target.value)}
+              />
+              <datalist id="ipsec-peer-certs">
+                {certificates.map((c) => <option key={c} value={c} />)}
+              </datalist>
+            </FormField>
+            <FormField label="Profile" hint="Пусто — не менять">
+              <Input className="font-mono" value={form.profile} onChange={(e) => set("profile", e.target.value)} />
+            </FormField>
+          </div>
+
+          <div className="flex flex-col gap-4">
+            <SectionTitle>Состояние</SectionTitle>
+            <div className="flex items-center justify-between">
+              <p className="text-sm font-medium">Passive</p>
+              <FormToggle checked={form.passive} onChange={(v) => set("passive", v)} />
+            </div>
+            <div className="flex items-center justify-between">
+              <p className="text-sm font-medium">Отключён</p>
+              <FormToggle checked={form.disabled} onChange={(v) => set("disabled", v)} />
+            </div>
+          </div>
+        </div>
+
+        <SheetFooter className="px-6 py-4 border-t shrink-0 flex-row gap-2">
+          <SheetClose render={<Button variant="outline" className="flex-1" disabled={busy} />}>
+            Отмена
+          </SheetClose>
+          <Button
+            className="flex-1"
+            disabled={!canSubmit || busy}
+            onClick={() => void onSubmit(form)}
+          >
+            {busy ? "Сохранение…" : "Сохранить"}
+          </Button>
+        </SheetFooter>
+      </SheetContent>
+    </Sheet>
+  )
+}
+
+export { IpsecPeerSheet }

components/ipsec/ipsec-server-grid.tsx

@@ -1,12 +1,14 @@
 "use client"
 
-import type { IpsecServerSummaryDto } from "@mmapp/contracts/ipsec"
+import type { IpsecCertInfoDto, IpsecPeerDto, IpsecServerSummaryDto } from "@mmapp/contracts/ipsec"
 import { Badge } from "@/components/ui/badge"
 import { Button } from "@/components/ui/button"
 import { cn } from "@/lib/utils"
 import {
   GlobeIcon,
+  KeyRoundIcon,
   NetworkIcon,
+  PencilIcon,
   ShieldCheckIcon,
   Trash2Icon,
 } from "lucide-react"
@@ -22,70 +24,223 @@ function Row({ label, value, mono = true }: { label: string; value: string; mono
   )
 }
 
+function OriginBadge({ managed }: { managed: boolean }) {
+  return managed ? null : (
+    <Badge variant="outline" className="text-[10px]">RouterOS</Badge>
+  )
+}
+
+function PeerRow({
+  peer,
+  onEdit,
+  onDelete,
+}: {
+  peer: IpsecPeerDto
+  onEdit?: (peer: IpsecPeerDto) => void
+  onDelete?: (peer: IpsecPeerDto) => void
+}) {
+  const summary = [
+    peer.exchangeMode,
+    peer.address,
+    peer.passive ? "passive" : undefined,
+    peer.certificate,
+    peer.profile,
+  ].filter(Boolean).join(" · ")
+  return (
+    <div className="flex items-center justify-between gap-2 rounded-md border border-border/60 px-2.5 py-1.5">
+      <div className="min-w-0">
+        <div className="flex items-center gap-1.5">
+          <span className="truncate text-xs font-medium">{peer.name}</span>
+          <OriginBadge managed={peer.managed} />
+          {peer.disabled ? <Badge variant="outline" className="text-[10px]">выкл</Badge> : null}
+        </div>
+        <p className="truncate font-mono text-[10px] text-muted-foreground">{summary || "—"}</p>
+      </div>
+      <div className="flex shrink-0 gap-0.5">
+        {onEdit ? (
+          <Button
+            type="button"
+            size="icon"
+            variant="ghost"
+            className="size-7"
+            aria-label="Изменить peer"
+            title="Изменить peer"
+            onClick={() => onEdit(peer)}
+          >
+            <PencilIcon className="size-3.5" />
+          </Button>
+        ) : null}
+        {onDelete ? (
+          <Button
+            type="button"
+            size="icon"
+            variant="ghost"
+            className="size-7 text-destructive"
+            aria-label="Удалить peer"
+            title="Удалить peer"
+            onClick={() => onDelete(peer)}
+          >
+            <Trash2Icon className="size-3.5" />
+          </Button>
+        ) : null}
+      </div>
+    </div>
+  )
+}
+
+function CertRow({
+  cert,
+  onDelete,
+}: {
+  cert: IpsecCertInfoDto
+  onDelete?: (cert: IpsecCertInfoDto) => void
+}) {
+  const roleLabel = cert.role === "ca" ? "CA" : cert.role === "server" ? "сервер" : cert.role === "client" ? "клиент" : "прочий"
+  return (
+    <div className="flex items-center justify-between gap-2 rounded-md border border-border/60 px-2.5 py-1.5">
+      <div className="min-w-0">
+        <div className="flex items-center gap-1.5">
+          <KeyRoundIcon className="size-3.5 shrink-0 text-muted-foreground" />
+          <span className="truncate text-xs font-medium">{cert.name}</span>
+          <Badge variant="outline" className="text-[10px]">{roleLabel}</Badge>
+          <OriginBadge managed={cert.managed} />
+          {cert.trusted === false ? <Badge variant="outline" className="text-[10px]">не trusted</Badge> : null}
+        </div>
+        <p className="truncate font-mono text-[10px] text-muted-foreground">
+          {[cert.commonName, cert.expiresAt ? `до ${cert.expiresAt}` : undefined].filter(Boolean).join(" · ") || "—"}
+        </p>
+      </div>
+      {onDelete ? (
+        <Button
+          type="button"
+          size="icon"
+          variant="ghost"
+          className="size-7 shrink-0 text-destructive"
+          aria-label="Удалить сертификат"
+          title="Удалить сертификат"
+          onClick={() => onDelete(cert)}
+        >
+          <Trash2Icon className="size-3.5" />
+        </Button>
+      ) : null}
+    </div>
+  )
+}
+
 export interface IpsecServerGridProps {
   servers: IpsecServerSummaryDto[]
   onInit?: (row: IpsecServerSummaryDto) => void
   onRemove?: (row: IpsecServerSummaryDto) => void
+  onEditPeer?: (serverId: string, peer: IpsecPeerDto) => void
+  onDeletePeer?: (serverId: string, peer: IpsecPeerDto) => void
+  onDeleteCert?: (serverId: string, cert: IpsecCertInfoDto) => void
 }
 
-function IpsecServerGrid({ servers, onInit, onRemove }: IpsecServerGridProps) {
+function IpsecServerGrid({
+  servers,
+  onInit,
+  onRemove,
+  onEditPeer,
+  onDeletePeer,
+  onDeleteCert,
+}: IpsecServerGridProps) {
   return (
     <div className="grid gap-3 md:grid-cols-2 xl:grid-cols-3">
-      {servers.map((s) => (
-        <div key={s.serverId} className="rounded-lg border border-border bg-card p-4 flex flex-col gap-3">
-          <div className="flex items-start justify-between gap-2">
-            <div className="min-w-0">
-              <p className="truncate text-sm font-medium">{s.serverName}</p>
-              <p className="truncate font-mono text-[11px] text-muted-foreground">
-                {s.serverEndpoint ?? "не инициализирован"}
-              </p>
+      {servers.map((s) => {
+        const certs = s.certs ?? []
+        return (
+          <div key={s.serverId} className="rounded-lg border border-border bg-card p-4 flex flex-col gap-3">
+            <div className="flex items-start justify-between gap-2">
+              <div className="min-w-0">
+                <p className="truncate text-sm font-medium">{s.serverName}</p>
+                <p className="truncate font-mono text-[11px] text-muted-foreground">
+                  {s.serverEndpoint ?? "endpoint не определён"}
+                </p>
+              </div>
+              {s.peers.length > 0 ? (
+                <Badge className="gap-1">
+                  <ShieldCheckIcon className="size-3" />
+                  {s.peers.length} peer
+                </Badge>
+              ) : (
+                <Badge variant="outline">нет peer</Badge>
+              )}
             </div>
-            {s.initialized ? (
-              <Badge className="gap-1">
-                <ShieldCheckIcon className="size-3" />
-                IKEv2
-              </Badge>
-            ) : (
-              <Badge variant="outline">нет</Badge>
-            )}
-          </div>
 
-          <div className="flex flex-col divide-y divide-border/60">
-            <Row label="Клиенты" value={`${s.clientsOnline} онлайн / ${s.clientsTotal}`} />
-            <Row label="Пул адресов" value={s.pool ? `${s.pool.name}: ${s.pool.ranges}` : "—"} />
-            <Row label="Peer" value={s.peer ? `${s.peer.name} (${s.peer.exchangeMode ?? "ike2"}${s.peer.passive ? ", passive" : ""})` : "—"} />
-            <Row label="CA-сертификат" value={s.caCert ? `${s.caCert.commonName ?? s.caCert.name}${s.caCert.expiresAt ? ` · до ${s.caCert.expiresAt}` : ""}` : "—"} />
-            <Row label="Серверный серт." value={s.serverCert ? `${s.serverCert.commonName ?? s.serverCert.name}${s.serverCert.expiresAt ? ` · до ${s.serverCert.expiresAt}` : ""}` : "—"} />
-            <Row label="NAT (интернет)" value={s.natRuleManaged ? "managed masquerade" : "нет правила"} mono={false} />
-          </div>
+            <div className="flex flex-col gap-1.5">
+              <p className="text-[11px] font-semibold uppercase tracking-wide text-muted-foreground">
+                Peer / серверы
+              </p>
+              {s.peers.length > 0 ? (
+                <div className="flex flex-col gap-1.5">
+                  {s.peers.map((p) => (
+                    <PeerRow
+                      key={p.rosId}
+                      peer={p}
+                      onEdit={onEditPeer ? (peer) => onEditPeer(s.serverId, peer) : undefined}
+                      onDelete={onDeletePeer ? (peer) => onDeletePeer(s.serverId, peer) : undefined}
+                    />
+                  ))}
+                </div>
+              ) : (
+                <p className="text-xs text-muted-foreground">Peers не найдены</p>
+              )}
+            </div>
 
-          <div className="mt-auto flex justify-end gap-1.5">
-            <Button
-              type="button"
-              size="sm"
-              variant="outline"
-              onClick={() => onInit?.(s)}
-              title={s.initialized ? "Обновить managed-конфиг сервера" : "Инициализировать IKEv2-сервер"}
-            >
-              <GlobeIcon className="size-3.5" />
-              {s.initialized ? "Переинициализировать" : "Инициализировать"}
-            </Button>
-            {s.initialized && onRemove ? (
+            <div className="flex flex-col gap-1.5">
+              <p className="text-[11px] font-semibold uppercase tracking-wide text-muted-foreground">
+                Сертификаты
+              </p>
+              {certs.length > 0 ? (
+                <div className="flex flex-col gap-1.5">
+                  {certs.map((c) => (
+                    <CertRow
+                      key={c.name}
+                      cert={c}
+                      onDelete={onDeleteCert ? (cert) => onDeleteCert(s.serverId, cert) : undefined}
+                    />
+                  ))}
+                </div>
+              ) : (
+                <p className="text-xs text-muted-foreground">Сертификаты не найдены</p>
+              )}
+            </div>
+
+            <div className="mt-auto flex flex-col divide-y divide-border/60">
+              <Row label="Клиенты" value={`${s.clientsOnline} онлайн / ${s.clientsTotal}`} />
+              <Row label="Пул адресов" value={s.pool ? `${s.pool.name}: ${s.pool.ranges}` : "—"} />
+              <Row label="NAT (интернет)" value={s.natRuleManaged ? "managed masquerade" : "нет правила"} mono={false} />
+              <Row label="Managed IKEv2" value={s.initialized ? "инициализирован" : "не инициализирован"} mono={false} />
+            </div>
+
+            <div className="flex justify-end gap-1.5">
               <Button
                 type="button"
-                size="icon"
-                variant="ghost"
-                className="size-8 text-destructive"
-                aria-label="Удалить IKEv2-сервер"
-                title="Удалить managed-объекты IKEv2 (identity/mode-config/peer/pool/NAT + сертификаты)"
-                onClick={() => onRemove(s)}
+                size="sm"
+                variant="outline"
+                onClick={() => onInit?.(s)}
+                title={s.initialized ? "Обновить managed-конфиг сервера" : "Инициализировать IKEv2-сервер"}
               >
-                <Trash2Icon className="size-3.5" />
+                <GlobeIcon className="size-3.5" />
+                {s.initialized ? "Переинициализировать" : "Инициализировать"}
               </Button>
-            ) : null}
+              {s.initialized && onRemove ? (
+                <Button
+                  type="button"
+                  size="icon"
+                  variant="ghost"
+                  className="size-8 text-destructive"
+                  aria-label="Удалить IKEv2-сервер"
+                  title="Удалить managed-объекты IKEv2 (identity/mode-config/peer/pool/NAT + сертификаты)"
+                  onClick={() => onRemove(s)}
+                >
+                  <Trash2Icon className="size-3.5" />
+                </Button>
+              ) : null}
+            </div>
           </div>
-        </div>
-      ))}
+        )
+      })}
       {servers.length === 0 ? (
         <div className="col-span-full flex items-center justify-center gap-2 py-16 text-sm text-muted-foreground">
           <NetworkIcon className="size-4" />

components/ipsec/ipsec-user-sheet.tsx

@@ -15,6 +15,7 @@ export type IpsecAuthKind = "certificate" | "pre-shared-key"
 export type IpsecUserFormState = {
   serverId: string
   name: string
+  peerName: string
   authMethod: IpsecAuthKind
   psk: string
   remoteId: string
@@ -26,6 +27,7 @@ export type IpsecUserFormState = {
 export const defaultIpsecUserForm = (): IpsecUserFormState => ({
   serverId: "",
   name: "",
+  peerName: "",
   authMethod: "certificate",
   psk: "",
   remoteId: "",
@@ -35,11 +37,13 @@ export const defaultIpsecUserForm = (): IpsecUserFormState => ({
 })
 
 type ServerOption = { id: string; name: string; host: string }
+export type PeerOption = { serverId: string; name: string; managed: boolean }
 
 function IpsecUserSheet({
   open,
   onOpenChange,
   servers,
+  peers,
   busy,
   defaultServerId,
   editing,
@@ -49,6 +53,8 @@ function IpsecUserSheet({
   open: boolean
   onOpenChange: (v: boolean) => void
   servers: ServerOption[]
+  /** Доступные peers (серверы) для привязки identity при создании. */
+  peers?: PeerOption[]
   busy?: boolean
   defaultServerId?: string
   /** Режим редактирования: сервер и метод аутентификации не меняются. */
@@ -67,6 +73,7 @@ function IpsecUserSheet({
       queueMicrotask(() => setForm({
         serverId: edit.serverId,
         name: edit.name,
+        peerName: edit.peerName ?? "",
         authMethod: edit.authMethod,
         psk: "",
         remoteId: edit.remoteId ?? "",
@@ -118,6 +125,24 @@ function IpsecUserSheet({
                 </select>
               </FormField>
             ) : null}
+            {!editing && (peers ?? []).some((p) => p.serverId === form.serverId) ? (
+              <FormField label="Peer (сервер)" hint="К какому peer привязать identity">
+                <select
+                  className="flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-xs outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]"
+                  value={form.peerName}
+                  onChange={(e) => set("peerName", e.target.value)}
+                >
+                  <option value="">Автоматически (managed/первый)</option>
+                  {(peers ?? [])
+                    .filter((p) => p.serverId === form.serverId)
+                    .map((p) => (
+                      <option key={`${p.serverId}:${p.name}`} value={p.name}>
+                        {p.name}{p.managed ? "" : " (RouterOS)"}
+                      </option>
+                    ))}
+                </select>
+              </FormField>
+            ) : null}
             <FormField label="Имя клиента" required hint={editing ? undefined : "CN сертификата и отображаемое имя"}>
               <Input
                 placeholder="alice"

components/ipsec/ipsec-users-grid.tsx

@@ -67,6 +67,9 @@ function IpsecUsersGrid({
               {c.disabled ? (
                 <Badge variant="outline" className="ml-1 text-[10px]">выкл</Badge>
               ) : null}
+              {!c.managed ? (
+                <Badge variant="outline" className="ml-1 text-[10px]">RouterOS</Badge>
+              ) : null}
             </div>
           )
         },