feat(frontend): watches, webhooks and alerts panels read humanly, with chat picker, url filter, test send and delivery log

frontend/src/lib/components/RightColumn.svelte

@@ -19,6 +19,7 @@
   import Button from "#lib/components/ui/Button.svelte";
   import Icon from "#lib/components/ui/Icon.svelte";
   import WatchesPanel from "#lib/components/watches/WatchesPanel.svelte";
+  import WebhooksPanel from "#lib/components/watches/WebhooksPanel.svelte";
   import { t } from "#lib/i18n/locale.svelte.js";
   import { accounts } from "#lib/stores/accounts.svelte.js";
   import { chats } from "#lib/stores/chats.svelte.js";
@@ -27,7 +28,7 @@
   import { type RightPanel, ui } from "#lib/stores/ui.svelte.js";
 
   const titles: Record<RightPanel, string> = $derived({
-    alerts: "Алерты",
+    alerts: t("settings.alerts"),
     annotations: "Заметки",
     bots: "Боты",
     callbacks: "Callback-данные",
@@ -46,12 +47,14 @@
     stories: "Сторис",
     "stories-all": "Все сторис",
     versions: "Версии",
-    watches: "Отслеживания",
+    watches: t("settings.watches"),
+    webhooks: t("watches.webhooks"),
   });
 
   const parents: Partial<Record<RightPanel, RightPanel>> = {
     "storage-chat": "storage",
     "storage-trash": "storage",
+    webhooks: "watches",
   };
 
   const parent = $derived(ui.rightPanel ? parents[ui.rightPanel] : undefined);
@@ -118,7 +121,13 @@
   {:else if ui.rightPanel === "stories-all"}
     <AllStoriesArchive />
   {:else if ui.rightPanel === "watches"}
-    <WatchesPanel />
+    {#key accounts.selectedId}
+      <WatchesPanel />
+    {/key}
+  {:else if ui.rightPanel === "webhooks"}
+    {#key accounts.selectedId}
+      <WebhooksPanel />
+    {/key}
   {:else if ui.rightPanel === "alerts"}
     <AlertsPanel />
   {:else if ui.rightPanel === "annotations"}