@activecollab/components 2.0.345 → 2.0.347

package/dist/esm/presentation/shared/WebhookLogsDialog.js

@@ -0,0 +1,537 @@
+import React, { useMemo, useState } from "react";
+import styled from "styled-components";
+import { Button } from "../../components/Button";
+import { Chip } from "../../components/Chip";
+import { Dialog } from "../../components/Dialog";
+import { Filter } from "../../components/Filter";
+import { IconButton } from "../../components/IconButton";
+import { CancelCrossIcon, CollapseExpandSingleIcon, GitHubIcon, GitIcon, GitLabIcon } from "../../components/Icons";
+import { Body2, Caption1, Caption2, Header3 } from "../../components/Typography";
+
+/**
+ * "Webhook Logs" — the VCS webhook delivery log, shown as a wide dialog with a
+ * filterable, expandable list. Extracted into `shared/` so it can be opened
+ * from more than one surface (the Apps & Integrations Repositories page and the
+ * project "..." menu on the Project Repos story).
+ *
+ * Mirrors the app's webhook log model:
+ *   `vcs_webhook_logs`    → connection_id, event_type, processing_status
+ *                           (received / unhandled / skipped / processed /
+ *                           failed / duplicate), delivery_identifier, payload,
+ *                           created_on
+ *   `vcs_webhook_outcomes` → one row per outcome, each with a localized summary
+ *
+ * The status is derived from the outcomes server-side; here we render the
+ * stored value and map it to a palette colour. The connection glyph is the
+ * provider icon (GitHub / GitLab, Git for anything else).
+ */
+
+/**
+ * Normalized event kind. The processor layer maps each provider's raw event
+ * header (GitHub `issues`, GitLab `Issue Hook`, …) onto one provider-agnostic
+ * kind, so the same logical event reads — and filters — identically across
+ * connections instead of appearing once per provider.
+ */
+
+export const WEBHOOK_CONNECTIONS = [{
+  id: "gh-activecollab",
+  name: "ActiveCollab",
+  service: "github"
+}, {
+  id: "gh-abstergo",
+  name: "Abstergo Ltd.",
+  service: "github"
+}, {
+  id: "gh-binford",
+  name: "Binford & Co.",
+  service: "github"
+}, {
+  id: "gl-platform",
+  name: "Platform",
+  service: "gitlab"
+}, {
+  id: "gl-content",
+  name: "Content",
+  service: "gitlab"
+}, {
+  id: "gl-acme-ce",
+  name: "Acme Community",
+  service: "gitlab"
+}];
+const EVENT_KIND_LABELS = {
+  issue: "Issue",
+  push: "Push",
+  merge_request: "Merge request",
+  repository: "Repository",
+  ping: "Ping"
+};
+const STATUS_LABELS = {
+  received: "Received",
+  unhandled: "Unhandled",
+  skipped: "Skipped",
+  processed: "Processed",
+  failed: "Failed",
+  duplicate: "Duplicate"
+};
+
+/**
+ * Status → palette colour, chosen so the colour matches the meaning:
+ *   processed → green (success), failed → coral (error),
+ *   skipped → orange (warning), received → sky-blue (in progress),
+ *   unhandled → silver (neutral / no handler matched),
+ *   duplicate → purple (replayed delivery, dropped before processing).
+ */
+const STATUS_COLORS = {
+  processed: {
+    bg: "var(--color-green-pale)",
+    fg: "var(--color-green-pale-darker)"
+  },
+  failed: {
+    bg: "var(--color-coral)",
+    fg: "var(--color-coral-darker)"
+  },
+  skipped: {
+    bg: "var(--color-orange)",
+    fg: "var(--color-orange-darker)"
+  },
+  received: {
+    bg: "var(--color-blue-sky)",
+    fg: "var(--color-blue-sky-darker)"
+  },
+  unhandled: {
+    bg: "var(--color-gray-silver)",
+    fg: "var(--color-gray-silver-darker)"
+  },
+  duplicate: {
+    bg: "var(--color-purple)",
+    fg: "var(--color-purple-darker)"
+  }
+};
+
+/** Provider glyph for a connection: GitHub / GitLab, Git for anything else. */
+const connectionIcon = service => {
+  if (service === "github") {
+    return GitHubIcon;
+  }
+  if (service === "gitlab") {
+    return GitLabIcon;
+  }
+  return GitIcon;
+};
+const StatusChip = _ref => {
+  let status = _ref.status;
+  const _STATUS_COLORS$status = STATUS_COLORS[status],
+    bg = _STATUS_COLORS$status.bg,
+    fg = _STATUS_COLORS$status.fg;
+  return /*#__PURE__*/React.createElement(Chip, {
+    label: STATUS_LABELS[status],
+    backgroundColor: bg,
+    color: fg,
+    typographyProps: {
+      variant: "Caption 1",
+      weight: "medium"
+    },
+    style: {
+      borderRadius: 6
+    }
+  });
+};
+
+/* --- Mock log data (newest first is enforced by sorting on receivedAt) --- */
+
+const PAYLOAD_ISSUE_OPENED = JSON.stringify({
+  action: "opened",
+  issue: {
+    id: 2002934201,
+    number: 42,
+    title: "Webhook delivery retries are not logged",
+    state: "open",
+    html_url: "https://github.com/activecollab/feather/issues/42",
+    labels: [{
+      name: "bug"
+    }, {
+      name: "vcs"
+    }],
+    user: {
+      login: "octocat",
+      id: 583231
+    }
+  },
+  repository: {
+    id: 776611234,
+    full_name: "activecollab/feather",
+    private: true
+  },
+  sender: {
+    login: "octocat",
+    id: 583231
+  }
+}, null, 2);
+const PAYLOAD_MERGE_REQUEST = JSON.stringify({
+  object_kind: "merge_request",
+  event_type: "merge_request",
+  user: {
+    id: 41,
+    name: "Jane Doe",
+    username: "jdoe"
+  },
+  project: {
+    id: 1801,
+    path_with_namespace: "content/handbook"
+  },
+  object_attributes: {
+    iid: 318,
+    title: "Add changelog for 8.2",
+    state: "merged",
+    action: "merge",
+    source_branch: "changelog-8-2",
+    target_branch: "main"
+  }
+}, null, 2);
+const PAYLOAD_PUSH = JSON.stringify({
+  ref: "refs/heads/main",
+  before: "9b2c1f0e",
+  after: "f4a7d3c1",
+  commits: [{
+    id: "f4a7d3c1",
+    message: "Fix typo in webhook log repository",
+    author: {
+      name: "Marko",
+      email: "marko@example.com"
+    }
+  }],
+  repository: {
+    full_name: "activecollab/feather"
+  }
+}, null, 2);
+const WEBHOOK_LOGS = [{
+  id: "log-7",
+  connectionId: "gh-activecollab",
+  eventKind: "issue",
+  status: "processed",
+  deliveryIdentifier: "d3b07384-d9a0-4c9b-8f1e-2a6f1b9c4e21",
+  outcomes: ["Created task #1842 from issue #42"],
+  payload: PAYLOAD_ISSUE_OPENED,
+  receivedOn: "Jun 29, 2026 · 14:32",
+  receivedAt: 1751207520
+}, {
+  id: "log-6",
+  connectionId: "gl-content",
+  eventKind: "merge_request",
+  status: "skipped",
+  deliveryIdentifier: "b1946ac9-2f3a-4c0d-9b7e-1d2c3e4f5a6b",
+  outcomes: ["Skipped: merge request has no linked issue"],
+  payload: PAYLOAD_MERGE_REQUEST,
+  receivedOn: "Jun 29, 2026 · 11:08",
+  receivedAt: 1751195280
+}, {
+  id: "log-5",
+  connectionId: "gh-activecollab",
+  eventKind: "issue",
+  status: "failed",
+  deliveryIdentifier: "9c1185a5-c5e9-4e3f-8a1b-7d6e5f4c3b2a",
+  outcomes: ["Failed at task creation: project not found"],
+  payload: PAYLOAD_ISSUE_OPENED,
+  receivedOn: "Jun 28, 2026 · 18:54",
+  receivedAt: 1751136840
+}, {
+  id: "log-4",
+  connectionId: "gl-content",
+  eventKind: "push",
+  status: "processed",
+  deliveryIdentifier: "f7c3bc1d-8c5a-4b2e-9f0a-1b2c3d4e5f60",
+  outcomes: ["Created task #1839 from issue #311", "Created task #1840 from issue #312"],
+  payload: PAYLOAD_PUSH,
+  receivedOn: "Jun 28, 2026 · 09:21",
+  receivedAt: 1751102460
+}, {
+  id: "log-3",
+  connectionId: "gh-activecollab",
+  eventKind: "ping",
+  status: "unhandled",
+  deliveryIdentifier: "1574bddb-75c3-4b1e-8a9c-0d1e2f3a4b5c",
+  outcomes: [],
+  payload: JSON.stringify({
+    zen: "Keep it logically awesome.",
+    hook_id: 552012
+  }, null, 2),
+  receivedOn: "Jun 27, 2026 · 16:05",
+  receivedAt: 1751040300
+}, {
+  id: "log-2",
+  connectionId: "gl-content",
+  eventKind: "issue",
+  status: "received",
+  deliveryIdentifier: "0716d970-2b9e-4a1d-9c3f-5e6a7b8c9d01",
+  outcomes: [],
+  receivedOn: "Jun 27, 2026 · 08:47",
+  receivedAt: 1751013420
+}, {
+  id: "log-1",
+  connectionId: "gh-activecollab",
+  eventKind: "issue",
+  status: "processed",
+  deliveryIdentifier: "fa3ebd6742c360b2d9652b7f78d9bd7d",
+  outcomes: ["Created task #1804 from issue #29"],
+  payload: PAYLOAD_ISSUE_OPENED,
+  receivedOn: "Jun 26, 2026 · 13:12",
+  receivedAt: 1750943520
+}, {
+  id: "log-1-replay",
+  connectionId: "gh-activecollab",
+  eventKind: "issue",
+  status: "duplicate",
+  deliveryIdentifier: "fa3ebd6742c360b2d9652b7f78d9bd7d",
+  outcomes: [],
+  payload: PAYLOAD_ISSUE_OPENED,
+  receivedOn: "Jun 26, 2026 · 13:18",
+  receivedAt: 1750943880
+}];
+
+/* --- Lightweight, Prism-style JSON syntax highlighter -------------------- */
+/* design-system has no `prismjs` dependency (it's an app dependency), so for  */
+/* this throwaway mock we tokenize JSON ourselves and colour the tokens with   */
+/* the same token classes Prism uses, styled via PayloadPre below.             */
+
+const escapeHtml = value => value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+const highlightJson = json => escapeHtml(json).replace(/("(?:\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(?:true|false)\b|\bnull\b|-?\d+(?:\.\d*)?(?:[eE][+-]?\d+)?)/g, match => {
+  let cls = "tok-number";
+  if (/^"/.test(match)) {
+    cls = /:$/.test(match) ? "tok-key" : "tok-string";
+  } else if (/true|false/.test(match)) {
+    cls = "tok-boolean";
+  } else if (/null/.test(match)) {
+    cls = "tok-null";
+  }
+  return "<span class=\"" + cls + "\">" + match + "</span>";
+});
+const PAYLOAD_COLLAPSED_LINES = 6;
+const PayloadPre = styled.pre.withConfig({
+  displayName: "WebhookLogsDialog__PayloadPre",
+  componentId: "sc-6ol7f6-0"
+})(["margin:0;padding:12px 14px;border:1px solid var(--color-theme-400);border-radius:6px;background-color:var(--color-theme-200);color:var(--color-theme-800);font-family:\"SFMono-Regular\",Consolas,\"Liberation Mono\",Menlo,monospace;font-size:12px;line-height:18px;overflow-x:auto;white-space:pre;position:relative;", " .tok-key{color:var(--color-coral-lighter);}.tok-string{color:var(--color-green-pale-lighter);}.tok-number{color:var(--color-orange-lighter);}.tok-boolean{color:var(--color-blue-sky-lighter);}.tok-null{color:var(--color-purple-lighter);}"], _ref2 => {
+  let $collapsed = _ref2.$collapsed;
+  return $collapsed ? "max-height: " + (PAYLOAD_COLLAPSED_LINES * 18 + 24) + "px;\n         overflow-y: hidden;" : "";
+});
+const PayloadWrap = styled.div.withConfig({
+  displayName: "WebhookLogsDialog__PayloadWrap",
+  componentId: "sc-6ol7f6-1"
+})([".payload-toggle{display:flex;justify-content:flex-end;min-height:24px;margin-bottom:4px;}"]);
+const PayloadBlock = _ref3 => {
+  let payload = _ref3.payload;
+  const _useState = useState(true),
+    collapsed = _useState[0],
+    setCollapsed = _useState[1];
+  const lineCount = useMemo(() => payload.split("\n").length, [payload]);
+  const html = useMemo(() => highlightJson(payload), [payload]);
+  const canToggle = lineCount > PAYLOAD_COLLAPSED_LINES;
+  return /*#__PURE__*/React.createElement(PayloadWrap, null, canToggle ? /*#__PURE__*/React.createElement("div", {
+    className: "payload-toggle"
+  }, /*#__PURE__*/React.createElement(Button, {
+    variant: "text colored",
+    size: "small",
+    onClick: () => setCollapsed(value => !value)
+  }, collapsed ? "Show More" : "Show Less")) : null, /*#__PURE__*/React.createElement(PayloadPre, {
+    $collapsed: collapsed && canToggle,
+    dangerouslySetInnerHTML: {
+      __html: html
+    }
+  }));
+};
+
+/* --- A single, expandable log row ---------------------------------------- */
+
+const LogRowWrap = styled.div.withConfig({
+  displayName: "WebhookLogsDialog__LogRowWrap",
+  componentId: "sc-6ol7f6-2"
+})(["border-top:1px solid var(--color-theme-300);.lr-summary{box-sizing:border-box;display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:8px 8px 8px 12px;background:none;border:0;text-align:left;cursor:pointer;font-family:inherit;&:hover{background-color:var(--color-theme-200);}}.lr-expand{flex-shrink:0;color:var(--color-theme-600);transform:rotate(90deg);transition:transform 150ms ease;}.lr-expand.open{transform:rotate(180deg);}.lr-conn{display:flex;align-items:center;gap:8px;width:180px;min-width:0;flex-shrink:0;}.lr-conn svg{width:20px;height:20px;flex-shrink:0;}.lr-conn .lr-conn-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.lr-event{flex:1 1 0%;min-width:0;}.lr-status{flex-shrink:0;}.lr-outcomes{width:96px;flex-shrink:0;text-align:right;}.lr-detail{padding:4px 16px 20px 44px;display:flex;flex-direction:column;gap:16px;}.lr-field-label{display:block;margin-bottom:4px;}.lr-id{font-family:\"SFMono-Regular\",Consolas,\"Liberation Mono\",Menlo,monospace;word-break:break-all;}.lr-outcome-list{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px;}"]);
+const LogRow = _ref4 => {
+  var _connection$name;
+  let log = _ref4.log,
+    connection = _ref4.connection;
+  const _useState2 = useState(false),
+    open = _useState2[0],
+    setOpen = _useState2[1];
+  const ConnIcon = connectionIcon(connection == null ? void 0 : connection.service);
+  return /*#__PURE__*/React.createElement(LogRowWrap, null, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: "lr-summary",
+    "aria-expanded": open,
+    onClick: () => setOpen(value => !value)
+  }, /*#__PURE__*/React.createElement(CollapseExpandSingleIcon, {
+    className: open ? "lr-expand open" : "lr-expand"
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "lr-conn"
+  }, /*#__PURE__*/React.createElement(ConnIcon, null), /*#__PURE__*/React.createElement(Body2, {
+    className: "lr-conn-name",
+    weight: "bold"
+  }, (_connection$name = connection == null ? void 0 : connection.name) != null ? _connection$name : "Unknown")), /*#__PURE__*/React.createElement(Body2, {
+    className: "lr-event",
+    color: "tertiary"
+  }, EVENT_KIND_LABELS[log.eventKind]), /*#__PURE__*/React.createElement("span", {
+    className: "lr-status"
+  }, /*#__PURE__*/React.createElement(StatusChip, {
+    status: log.status
+  })), /*#__PURE__*/React.createElement(Caption1, {
+    className: "lr-outcomes",
+    color: "tertiary"
+  }, log.outcomes.length > 0 ? log.outcomes.length + " " + (log.outcomes.length === 1 ? "outcome" : "outcomes") : "")), open ? /*#__PURE__*/React.createElement("div", {
+    className: "lr-detail"
+  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Caption1, {
+    className: "lr-field-label",
+    color: "secondary",
+    weight: "bold"
+  }, "Webhook identifier"), /*#__PURE__*/React.createElement(Body2, {
+    className: "lr-id",
+    color: "tertiary"
+  }, log.deliveryIdentifier)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Caption1, {
+    className: "lr-field-label",
+    color: "secondary",
+    weight: "bold"
+  }, "Outcomes"), log.outcomes.length > 0 ? /*#__PURE__*/React.createElement("ul", {
+    className: "lr-outcome-list"
+  }, log.outcomes.map((outcome, index) => /*#__PURE__*/React.createElement("li", {
+    key: index
+  }, /*#__PURE__*/React.createElement(Body2, {
+    color: "tertiary"
+  }, outcome)))) : /*#__PURE__*/React.createElement(Body2, {
+    color: "tertiary"
+  }, "No outcomes were recorded for this webhook.")), log.payload ? /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Caption1, {
+    className: "lr-field-label",
+    color: "secondary",
+    weight: "bold"
+  }, "Payload"), /*#__PURE__*/React.createElement(PayloadBlock, {
+    payload: log.payload
+  })) : null) : null);
+};
+
+/* --- The dialog ---------------------------------------------------------- */
+
+/** Wider than the default 540px dialog so the log columns have room. */
+const WebhookLogsDialogStyled = styled(Dialog).withConfig({
+  displayName: "WebhookLogsDialog__WebhookLogsDialogStyled",
+  componentId: "sc-6ol7f6-3"
+})(["&&{width:calc(100vw - 64px);max-width:760px;}"]);
+const DialogTitleBar = styled.div.withConfig({
+  displayName: "WebhookLogsDialog__DialogTitleBar",
+  componentId: "sc-6ol7f6-4"
+})(["display:flex;align-items:center;justify-content:space-between;gap:16px;.title-actions{display:flex;align-items:center;gap:8px;flex-shrink:0;}"]);
+const LogListHeader = styled.div.withConfig({
+  displayName: "WebhookLogsDialog__LogListHeader",
+  componentId: "sc-6ol7f6-5"
+})(["box-sizing:border-box;display:flex;align-items:center;gap:12px;padding:0 8px 8px 44px;.lh-conn{width:180px;flex-shrink:0;}.lh-event{flex:1 1 0%;min-width:0;}.lh-status{width:96px;flex-shrink:0;}.lh-outcomes{width:96px;flex-shrink:0;text-align:right;}"]);
+const EmptyLogs = styled.div.withConfig({
+  displayName: "WebhookLogsDialog__EmptyLogs",
+  componentId: "sc-6ol7f6-6"
+})(["padding:40px 0;text-align:center;"]);
+export const WebhookLogsDialog = _ref5 => {
+  let open = _ref5.open,
+    onClose = _ref5.onClose,
+    initialConnectionId = _ref5.initialConnectionId,
+    connectionIds = _ref5.connectionIds;
+  const _useState3 = useState(() => {
+      if (connectionIds && connectionIds.length > 0) {
+        return {
+          connection: connectionIds
+        };
+      }
+      if (initialConnectionId) {
+        return {
+          connection: [initialConnectionId]
+        };
+      }
+      return {};
+    }),
+    filters = _useState3[0],
+    setFilters = _useState3[1];
+  const connectionsById = useMemo(() => {
+    const map = {};
+    WEBHOOK_CONNECTIONS.forEach(connection => {
+      map[connection.id] = connection;
+    });
+    return map;
+  }, []);
+  const filterData = useMemo(() => [{
+    id: "connection",
+    title: "Connection",
+    submenu: WEBHOOK_CONNECTIONS.map(connection => ({
+      id: connection.id,
+      name: connection.name
+    }))
+  }, {
+    id: "event_type",
+    title: "Event Type",
+    submenu: Array.from(new Set(WEBHOOK_LOGS.map(log => log.eventKind))).map(eventKind => ({
+      id: eventKind,
+      name: EVENT_KIND_LABELS[eventKind]
+    }))
+  }, {
+    id: "status",
+    title: "Processing Status",
+    submenu: Object.keys(STATUS_LABELS).map(status => ({
+      id: status,
+      name: STATUS_LABELS[status]
+    }))
+  }], []);
+  const visibleLogs = useMemo(() => {
+    var _filters$connection, _filters$event_type, _filters$status;
+    const byConnection = (_filters$connection = filters.connection) != null ? _filters$connection : [];
+    const byEvent = (_filters$event_type = filters.event_type) != null ? _filters$event_type : [];
+    const byStatus = (_filters$status = filters.status) != null ? _filters$status : [];
+    return WEBHOOK_LOGS.filter(log => {
+      if (byConnection.length && !byConnection.includes(log.connectionId)) {
+        return false;
+      }
+      if (byEvent.length && !byEvent.includes(log.eventKind)) {
+        return false;
+      }
+      if (byStatus.length && !byStatus.includes(log.status)) {
+        return false;
+      }
+      return true;
+    }).sort((a, b) => b.receivedAt - a.receivedAt);
+  }, [filters]);
+  return /*#__PURE__*/React.createElement(WebhookLogsDialogStyled, {
+    open: open,
+    onClose: onClose,
+    enableBackgroundClick: true
+  }, /*#__PURE__*/React.createElement(Dialog.Title, {
+    disableDefaultHeading: true
+  }, /*#__PURE__*/React.createElement(DialogTitleBar, null, /*#__PURE__*/React.createElement(Header3, null, "Webhook Logs"), /*#__PURE__*/React.createElement("div", {
+    className: "title-actions"
+  }, /*#__PURE__*/React.createElement(Filter, {
+    data: filterData,
+    selected: filters,
+    label: "Filter",
+    clearAllText: "Clear All",
+    noResultText: "No results",
+    emptyFilterText: "No filters to show",
+    onChange: setFilters
+  }), /*#__PURE__*/React.createElement(IconButton, {
+    variant: "text gray",
+    onClick: onClose
+  }, /*#__PURE__*/React.createElement(CancelCrossIcon, null))))), /*#__PURE__*/React.createElement(Dialog.ContentDivider, null), /*#__PURE__*/React.createElement(Dialog.Content, null, visibleLogs.length > 0 ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LogListHeader, null, /*#__PURE__*/React.createElement(Caption2, {
+    className: "lh-conn",
+    color: "secondary",
+    weight: "bold"
+  }, "CONNECTION"), /*#__PURE__*/React.createElement(Caption2, {
+    className: "lh-event",
+    color: "secondary",
+    weight: "bold"
+  }, "EVENT TYPE"), /*#__PURE__*/React.createElement(Caption2, {
+    className: "lh-status",
+    color: "secondary",
+    weight: "bold"
+  }, "STATUS"), /*#__PURE__*/React.createElement(Caption2, {
+    className: "lh-outcomes",
+    color: "secondary",
+    weight: "bold"
+  }, "OUTCOMES")), visibleLogs.map(log => /*#__PURE__*/React.createElement(LogRow, {
+    key: log.id,
+    log: log,
+    connection: connectionsById[log.connectionId]
+  }))) : /*#__PURE__*/React.createElement(EmptyLogs, null, /*#__PURE__*/React.createElement(Body2, {
+    color: "tertiary"
+  }, "No webhook logs match the selected filters."))));
+};
+//# sourceMappingURL=WebhookLogsDialog.js.map

package/dist/esm/presentation/shared/WebhookLogsDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WebhookLogsDialog.js","names":["React","useMemo","useState","styled","Button","Chip","Dialog","Filter","IconButton","CancelCrossIcon","CollapseExpandSingleIcon","GitHubIcon","GitIcon","GitLabIcon","Body2","Caption1","Caption2","Header3","WEBHOOK_CONNECTIONS","id","name","service","EVENT_KIND_LABELS","issue","push","merge_request","repository","ping","STATUS_LABELS","received","unhandled","skipped","processed","failed","duplicate","STATUS_COLORS","bg","fg","connectionIcon","StatusChip","_ref","status","_STATUS_COLORS$status","createElement","label","backgroundColor","color","typographyProps","variant","weight","style","borderRadius","PAYLOAD_ISSUE_OPENED","JSON","stringify","action","number","title","state","html_url","labels","user","login","full_name","private","sender","PAYLOAD_MERGE_REQUEST","object_kind","event_type","username","project","path_with_namespace","object_attributes","iid","source_branch","target_branch","PAYLOAD_PUSH","ref","before","after","commits","message","author","email","WEBHOOK_LOGS","connectionId","eventKind","deliveryIdentifier","outcomes","payload","receivedOn","receivedAt","zen","hook_id","escapeHtml","value","replace","highlightJson","json","match","cls","test","PAYLOAD_COLLAPSED_LINES","PayloadPre","pre","withConfig","displayName","componentId","_ref2","$collapsed","PayloadWrap","div","PayloadBlock","_ref3","_useState","collapsed","setCollapsed","lineCount","split","length","html","canToggle","className","size","onClick","dangerouslySetInnerHTML","__html","LogRowWrap","LogRow","_ref4","_connection$name","log","connection","_useState2","open","setOpen","ConnIcon","type","map","outcome","index","key","WebhookLogsDialogStyled","DialogTitleBar","LogListHeader","EmptyLogs","WebhookLogsDialog","_ref5","onClose","initialConnectionId","connectionIds","_useState3","filters","setFilters","connectionsById","forEach","filterData","submenu","Array","from","Set","Object","keys","visibleLogs","_filters$connection","_filters$event_type","_filters$status","byConnection","byEvent","byStatus","filter","includes","sort","a","b","enableBackgroundClick","Title","disableDefaultHeading","data","selected","clearAllText","noResultText","emptyFilterText","onChange","ContentDivider","Content","Fragment"],"sources":["../../../../src/presentation/shared/WebhookLogsDialog.tsx"],"sourcesContent":["import React, { ElementType, ReactElement, useMemo, useState } from \"react\";\n\nimport styled from \"styled-components\";\n\nimport { Button } from \"../../components/Button\";\nimport { Chip } from \"../../components/Chip\";\nimport { Dialog } from \"../../components/Dialog\";\nimport { Filter, SelectedType } from \"../../components/Filter\";\nimport { IconButton } from \"../../components/IconButton\";\nimport {\n  CancelCrossIcon,\n  CollapseExpandSingleIcon,\n  GitHubIcon,\n  GitIcon,\n  GitLabIcon,\n} from \"../../components/Icons\";\nimport {\n  Body2,\n  Caption1,\n  Caption2,\n  Header3,\n} from \"../../components/Typography\";\n\n/**\n * \"Webhook Logs\" — the VCS webhook delivery log, shown as a wide dialog with a\n * filterable, expandable list. Extracted into `shared/` so it can be opened\n * from more than one surface (the Apps & Integrations Repositories page and the\n * project \"...\" menu on the Project Repos story).\n *\n * Mirrors the app's webhook log model:\n *   `vcs_webhook_logs`    → connection_id, event_type, processing_status\n *                           (received / unhandled / skipped / processed /\n *                           failed / duplicate), delivery_identifier, payload,\n *                           created_on\n *   `vcs_webhook_outcomes` → one row per outcome, each with a localized summary\n *\n * The status is derived from the outcomes server-side; here we render the\n * stored value and map it to a palette colour. The connection glyph is the\n * provider icon (GitHub / GitLab, Git for anything else).\n */\n\ntype WebhookStatus =\n  | \"received\"\n  | \"unhandled\"\n  | \"skipped\"\n  | \"processed\"\n  | \"failed\"\n  | \"duplicate\";\n\nexport interface WebhookConnection {\n  id: string;\n  name: string;\n  service: \"github\" | \"gitlab\";\n}\n\n/**\n * Normalized event kind. The processor layer maps each provider's raw event\n * header (GitHub `issues`, GitLab `Issue Hook`, …) onto one provider-agnostic\n * kind, so the same logical event reads — and filters — identically across\n * connections instead of appearing once per provider.\n */\ntype WebhookEventKind =\n  | \"issue\"\n  | \"push\"\n  | \"merge_request\"\n  | \"repository\"\n  | \"ping\";\n\nexport interface WebhookLog {\n  id: string;\n  connectionId: string;\n  eventKind: WebhookEventKind;\n  status: WebhookStatus;\n  /** X-GitHub-Delivery GUID / X-Gitlab-Event-UUID. */\n  deliveryIdentifier: string;\n  /** Localized outcome summaries; empty when we never reached that stage. */\n  outcomes: string[];\n  /** Pretty-printed JSON payload; absent when no JSON body was logged. */\n  payload?: string;\n  /** Display timestamp. */\n  receivedOn: string;\n  /** Sort key — newest logs render at the top. */\n  receivedAt: number;\n}\n\nexport const WEBHOOK_CONNECTIONS: WebhookConnection[] = [\n  { id: \"gh-activecollab\", name: \"ActiveCollab\", service: \"github\" },\n  { id: \"gh-abstergo\", name: \"Abstergo Ltd.\", service: \"github\" },\n  { id: \"gh-binford\", name: \"Binford & Co.\", service: \"github\" },\n  { id: \"gl-platform\", name: \"Platform\", service: \"gitlab\" },\n  { id: \"gl-content\", name: \"Content\", service: \"gitlab\" },\n  { id: \"gl-acme-ce\", name: \"Acme Community\", service: \"gitlab\" },\n];\n\nconst EVENT_KIND_LABELS: Record<WebhookEventKind, string> = {\n  issue: \"Issue\",\n  push: \"Push\",\n  merge_request: \"Merge request\",\n  repository: \"Repository\",\n  ping: \"Ping\",\n};\n\nconst STATUS_LABELS: Record<WebhookStatus, string> = {\n  received: \"Received\",\n  unhandled: \"Unhandled\",\n  skipped: \"Skipped\",\n  processed: \"Processed\",\n  failed: \"Failed\",\n  duplicate: \"Duplicate\",\n};\n\n/**\n * Status → palette colour, chosen so the colour matches the meaning:\n *   processed → green (success), failed → coral (error),\n *   skipped → orange (warning), received → sky-blue (in progress),\n *   unhandled → silver (neutral / no handler matched),\n *   duplicate → purple (replayed delivery, dropped before processing).\n */\nconst STATUS_COLORS: Record<WebhookStatus, { bg: string; fg: string }> = {\n  processed: {\n    bg: \"var(--color-green-pale)\",\n    fg: \"var(--color-green-pale-darker)\",\n  },\n  failed: { bg: \"var(--color-coral)\", fg: \"var(--color-coral-darker)\" },\n  skipped: { bg: \"var(--color-orange)\", fg: \"var(--color-orange-darker)\" },\n  received: {\n    bg: \"var(--color-blue-sky)\",\n    fg: \"var(--color-blue-sky-darker)\",\n  },\n  unhandled: {\n    bg: \"var(--color-gray-silver)\",\n    fg: \"var(--color-gray-silver-darker)\",\n  },\n  duplicate: {\n    bg: \"var(--color-purple)\",\n    fg: \"var(--color-purple-darker)\",\n  },\n};\n\n/** Provider glyph for a connection: GitHub / GitLab, Git for anything else. */\nconst connectionIcon = (\n  service?: WebhookConnection[\"service\"]\n): ElementType => {\n  if (service === \"github\") {\n    return GitHubIcon;\n  }\n  if (service === \"gitlab\") {\n    return GitLabIcon;\n  }\n  return GitIcon;\n};\n\nconst StatusChip = ({ status }: { status: WebhookStatus }): ReactElement => {\n  const { bg, fg } = STATUS_COLORS[status];\n\n  return (\n    <Chip\n      label={STATUS_LABELS[status]}\n      backgroundColor={bg}\n      color={fg}\n      typographyProps={{ variant: \"Caption 1\", weight: \"medium\" }}\n      style={{ borderRadius: 6 }}\n    />\n  );\n};\n\n/* --- Mock log data (newest first is enforced by sorting on receivedAt) --- */\n\nconst PAYLOAD_ISSUE_OPENED = JSON.stringify(\n  {\n    action: \"opened\",\n    issue: {\n      id: 2002934201,\n      number: 42,\n      title: \"Webhook delivery retries are not logged\",\n      state: \"open\",\n      html_url: \"https://github.com/activecollab/feather/issues/42\",\n      labels: [{ name: \"bug\" }, { name: \"vcs\" }],\n      user: { login: \"octocat\", id: 583231 },\n    },\n    repository: {\n      id: 776611234,\n      full_name: \"activecollab/feather\",\n      private: true,\n    },\n    sender: { login: \"octocat\", id: 583231 },\n  },\n  null,\n  2\n);\n\nconst PAYLOAD_MERGE_REQUEST = JSON.stringify(\n  {\n    object_kind: \"merge_request\",\n    event_type: \"merge_request\",\n    user: { id: 41, name: \"Jane Doe\", username: \"jdoe\" },\n    project: { id: 1801, path_with_namespace: \"content/handbook\" },\n    object_attributes: {\n      iid: 318,\n      title: \"Add changelog for 8.2\",\n      state: \"merged\",\n      action: \"merge\",\n      source_branch: \"changelog-8-2\",\n      target_branch: \"main\",\n    },\n  },\n  null,\n  2\n);\n\nconst PAYLOAD_PUSH = JSON.stringify(\n  {\n    ref: \"refs/heads/main\",\n    before: \"9b2c1f0e\",\n    after: \"f4a7d3c1\",\n    commits: [\n      {\n        id: \"f4a7d3c1\",\n        message: \"Fix typo in webhook log repository\",\n        author: { name: \"Marko\", email: \"marko@example.com\" },\n      },\n    ],\n    repository: { full_name: \"activecollab/feather\" },\n  },\n  null,\n  2\n);\n\nconst WEBHOOK_LOGS: WebhookLog[] = [\n  {\n    id: \"log-7\",\n    connectionId: \"gh-activecollab\",\n    eventKind: \"issue\",\n    status: \"processed\",\n    deliveryIdentifier: \"d3b07384-d9a0-4c9b-8f1e-2a6f1b9c4e21\",\n    outcomes: [\"Created task #1842 from issue #42\"],\n    payload: PAYLOAD_ISSUE_OPENED,\n    receivedOn: \"Jun 29, 2026 · 14:32\",\n    receivedAt: 1751207520,\n  },\n  {\n    id: \"log-6\",\n    connectionId: \"gl-content\",\n    eventKind: \"merge_request\",\n    status: \"skipped\",\n    deliveryIdentifier: \"b1946ac9-2f3a-4c0d-9b7e-1d2c3e4f5a6b\",\n    outcomes: [\"Skipped: merge request has no linked issue\"],\n    payload: PAYLOAD_MERGE_REQUEST,\n    receivedOn: \"Jun 29, 2026 · 11:08\",\n    receivedAt: 1751195280,\n  },\n  {\n    id: \"log-5\",\n    connectionId: \"gh-activecollab\",\n    eventKind: \"issue\",\n    status: \"failed\",\n    deliveryIdentifier: \"9c1185a5-c5e9-4e3f-8a1b-7d6e5f4c3b2a\",\n    outcomes: [\"Failed at task creation: project not found\"],\n    payload: PAYLOAD_ISSUE_OPENED,\n    receivedOn: \"Jun 28, 2026 · 18:54\",\n    receivedAt: 1751136840,\n  },\n  {\n    id: \"log-4\",\n    connectionId: \"gl-content\",\n    eventKind: \"push\",\n    status: \"processed\",\n    deliveryIdentifier: \"f7c3bc1d-8c5a-4b2e-9f0a-1b2c3d4e5f60\",\n    outcomes: [\n      \"Created task #1839 from issue #311\",\n      \"Created task #1840 from issue #312\",\n    ],\n    payload: PAYLOAD_PUSH,\n    receivedOn: \"Jun 28, 2026 · 09:21\",\n    receivedAt: 1751102460,\n  },\n  {\n    id: \"log-3\",\n    connectionId: \"gh-activecollab\",\n    eventKind: \"ping\",\n    status: \"unhandled\",\n    deliveryIdentifier: \"1574bddb-75c3-4b1e-8a9c-0d1e2f3a4b5c\",\n    outcomes: [],\n    payload: JSON.stringify(\n      { zen: \"Keep it logically awesome.\", hook_id: 552012 },\n      null,\n      2\n    ),\n    receivedOn: \"Jun 27, 2026 · 16:05\",\n    receivedAt: 1751040300,\n  },\n  {\n    id: \"log-2\",\n    connectionId: \"gl-content\",\n    eventKind: \"issue\",\n    status: \"received\",\n    deliveryIdentifier: \"0716d970-2b9e-4a1d-9c3f-5e6a7b8c9d01\",\n    outcomes: [],\n    receivedOn: \"Jun 27, 2026 · 08:47\",\n    receivedAt: 1751013420,\n  },\n  {\n    id: \"log-1\",\n    connectionId: \"gh-activecollab\",\n    eventKind: \"issue\",\n    status: \"processed\",\n    deliveryIdentifier: \"fa3ebd6742c360b2d9652b7f78d9bd7d\",\n    outcomes: [\"Created task #1804 from issue #29\"],\n    payload: PAYLOAD_ISSUE_OPENED,\n    receivedOn: \"Jun 26, 2026 · 13:12\",\n    receivedAt: 1750943520,\n  },\n  {\n    id: \"log-1-replay\",\n    connectionId: \"gh-activecollab\",\n    eventKind: \"issue\",\n    status: \"duplicate\",\n    deliveryIdentifier: \"fa3ebd6742c360b2d9652b7f78d9bd7d\",\n    outcomes: [],\n    payload: PAYLOAD_ISSUE_OPENED,\n    receivedOn: \"Jun 26, 2026 · 13:18\",\n    receivedAt: 1750943880,\n  },\n];\n\n/* --- Lightweight, Prism-style JSON syntax highlighter -------------------- */\n/* design-system has no `prismjs` dependency (it's an app dependency), so for  */\n/* this throwaway mock we tokenize JSON ourselves and colour the tokens with   */\n/* the same token classes Prism uses, styled via PayloadPre below.             */\n\nconst escapeHtml = (value: string): string =>\n  value.replace(/&/g, \"&amp;\").replace(/</g, \"&lt;\").replace(/>/g, \"&gt;\");\n\nconst highlightJson = (json: string): string =>\n  escapeHtml(json).replace(\n    /(\"(?:\\\\u[a-zA-Z0-9]{4}|\\\\[^u]|[^\\\\\"])*\"(\\s*:)?|\\b(?:true|false)\\b|\\bnull\\b|-?\\d+(?:\\.\\d*)?(?:[eE][+-]?\\d+)?)/g,\n    (match) => {\n      let cls = \"tok-number\";\n\n      if (/^\"/.test(match)) {\n        cls = /:$/.test(match) ? \"tok-key\" : \"tok-string\";\n      } else if (/true|false/.test(match)) {\n        cls = \"tok-boolean\";\n      } else if (/null/.test(match)) {\n        cls = \"tok-null\";\n      }\n\n      return `<span class=\"${cls}\">${match}</span>`;\n    }\n  );\n\nconst PAYLOAD_COLLAPSED_LINES = 6;\n\nconst PayloadPre = styled.pre<{ $collapsed: boolean }>`\n  margin: 0;\n  padding: 12px 14px;\n  border: 1px solid var(--color-theme-400);\n  border-radius: 6px;\n  background-color: var(--color-theme-200);\n  color: var(--color-theme-800);\n  font-family: \"SFMono-Regular\", Consolas, \"Liberation Mono\", Menlo, monospace;\n  font-size: 12px;\n  line-height: 18px;\n  overflow-x: auto;\n  white-space: pre;\n  position: relative;\n\n  ${({ $collapsed }) =>\n    $collapsed\n      ? `max-height: ${PAYLOAD_COLLAPSED_LINES * 18 + 24}px;\n         overflow-y: hidden;`\n      : \"\"}\n\n  .tok-key {\n    color: var(--color-coral-lighter);\n  }\n  .tok-string {\n    color: var(--color-green-pale-lighter);\n  }\n  .tok-number {\n    color: var(--color-orange-lighter);\n  }\n  .tok-boolean {\n    color: var(--color-blue-sky-lighter);\n  }\n  .tok-null {\n    color: var(--color-purple-lighter);\n  }\n`;\n\nconst PayloadWrap = styled.div`\n  .payload-toggle {\n    display: flex;\n    justify-content: flex-end;\n    min-height: 24px;\n    margin-bottom: 4px;\n  }\n`;\n\nconst PayloadBlock = ({ payload }: { payload: string }): ReactElement => {\n  const [collapsed, setCollapsed] = useState(true);\n\n  const lineCount = useMemo(() => payload.split(\"\\n\").length, [payload]);\n  const html = useMemo(() => highlightJson(payload), [payload]);\n  const canToggle = lineCount > PAYLOAD_COLLAPSED_LINES;\n\n  return (\n    <PayloadWrap>\n      {canToggle ? (\n        <div className=\"payload-toggle\">\n          <Button\n            variant=\"text colored\"\n            size=\"small\"\n            onClick={() => setCollapsed((value) => !value)}\n          >\n            {collapsed ? \"Show More\" : \"Show Less\"}\n          </Button>\n        </div>\n      ) : null}\n      <PayloadPre\n        $collapsed={collapsed && canToggle}\n        dangerouslySetInnerHTML={{ __html: html }}\n      />\n    </PayloadWrap>\n  );\n};\n\n/* --- A single, expandable log row ---------------------------------------- */\n\nconst LogRowWrap = styled.div`\n  border-top: 1px solid var(--color-theme-300);\n\n  .lr-summary {\n    box-sizing: border-box;\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    width: 100%;\n    min-height: 56px;\n    padding: 8px 8px 8px 12px;\n    background: none;\n    border: 0;\n    text-align: left;\n    cursor: pointer;\n    font-family: inherit;\n\n    &:hover {\n      background-color: var(--color-theme-200);\n    }\n  }\n\n  /* Default icon points up; collapsed → point right, expanded → point down. */\n  .lr-expand {\n    flex-shrink: 0;\n    color: var(--color-theme-600);\n    transform: rotate(90deg);\n    transition: transform 150ms ease;\n  }\n\n  .lr-expand.open {\n    transform: rotate(180deg);\n  }\n\n  .lr-conn {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    width: 180px;\n    min-width: 0;\n    flex-shrink: 0;\n  }\n\n  .lr-conn svg {\n    width: 20px;\n    height: 20px;\n    flex-shrink: 0;\n  }\n\n  .lr-conn .lr-conn-name {\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .lr-event {\n    flex: 1 1 0%;\n    min-width: 0;\n  }\n\n  .lr-status {\n    flex-shrink: 0;\n  }\n\n  .lr-outcomes {\n    width: 96px;\n    flex-shrink: 0;\n    text-align: right;\n  }\n\n  .lr-detail {\n    padding: 4px 16px 20px 44px;\n    display: flex;\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  .lr-field-label {\n    display: block;\n    margin-bottom: 4px;\n  }\n\n  .lr-id {\n    font-family: \"SFMono-Regular\", Consolas, \"Liberation Mono\", Menlo, monospace;\n    word-break: break-all;\n  }\n\n  .lr-outcome-list {\n    margin: 0;\n    padding-left: 18px;\n    display: flex;\n    flex-direction: column;\n    gap: 4px;\n  }\n`;\n\ninterface LogRowProps {\n  log: WebhookLog;\n  connection?: WebhookConnection;\n}\n\nconst LogRow = ({ log, connection }: LogRowProps): ReactElement => {\n  const [open, setOpen] = useState(false);\n  const ConnIcon = connectionIcon(connection?.service);\n\n  return (\n    <LogRowWrap>\n      <button\n        type=\"button\"\n        className=\"lr-summary\"\n        aria-expanded={open}\n        onClick={() => setOpen((value) => !value)}\n      >\n        <CollapseExpandSingleIcon\n          className={open ? \"lr-expand open\" : \"lr-expand\"}\n        />\n        <span className=\"lr-conn\">\n          <ConnIcon />\n          <Body2 className=\"lr-conn-name\" weight=\"bold\">\n            {connection?.name ?? \"Unknown\"}\n          </Body2>\n        </span>\n        <Body2 className=\"lr-event\" color=\"tertiary\">\n          {EVENT_KIND_LABELS[log.eventKind]}\n        </Body2>\n        <span className=\"lr-status\">\n          <StatusChip status={log.status} />\n        </span>\n        <Caption1 className=\"lr-outcomes\" color=\"tertiary\">\n          {log.outcomes.length > 0\n            ? `${log.outcomes.length} ${\n                log.outcomes.length === 1 ? \"outcome\" : \"outcomes\"\n              }`\n            : \"\"}\n        </Caption1>\n      </button>\n\n      {open ? (\n        <div className=\"lr-detail\">\n          <div>\n            <Caption1\n              className=\"lr-field-label\"\n              color=\"secondary\"\n              weight=\"bold\"\n            >\n              Webhook identifier\n            </Caption1>\n            <Body2 className=\"lr-id\" color=\"tertiary\">\n              {log.deliveryIdentifier}\n            </Body2>\n          </div>\n\n          <div>\n            <Caption1\n              className=\"lr-field-label\"\n              color=\"secondary\"\n              weight=\"bold\"\n            >\n              Outcomes\n            </Caption1>\n            {log.outcomes.length > 0 ? (\n              <ul className=\"lr-outcome-list\">\n                {log.outcomes.map((outcome, index) => (\n                  <li key={index}>\n                    <Body2 color=\"tertiary\">{outcome}</Body2>\n                  </li>\n                ))}\n              </ul>\n            ) : (\n              <Body2 color=\"tertiary\">\n                No outcomes were recorded for this webhook.\n              </Body2>\n            )}\n          </div>\n\n          {log.payload ? (\n            <div>\n              <Caption1\n                className=\"lr-field-label\"\n                color=\"secondary\"\n                weight=\"bold\"\n              >\n                Payload\n              </Caption1>\n              <PayloadBlock payload={log.payload} />\n            </div>\n          ) : null}\n        </div>\n      ) : null}\n    </LogRowWrap>\n  );\n};\n\n/* --- The dialog ---------------------------------------------------------- */\n\n/** Wider than the default 540px dialog so the log columns have room. */\nconst WebhookLogsDialogStyled = styled(Dialog)`\n  && {\n    width: calc(100vw - 64px);\n    max-width: 760px;\n  }\n`;\n\nconst DialogTitleBar = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 16px;\n\n  .title-actions {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    flex-shrink: 0;\n  }\n`;\n\nconst LogListHeader = styled.div`\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 0 8px 8px 44px;\n\n  .lh-conn {\n    width: 180px;\n    flex-shrink: 0;\n  }\n  .lh-event {\n    flex: 1 1 0%;\n    min-width: 0;\n  }\n  .lh-status {\n    width: 96px;\n    flex-shrink: 0;\n  }\n  .lh-outcomes {\n    width: 96px;\n    flex-shrink: 0;\n    text-align: right;\n  }\n`;\n\nconst EmptyLogs = styled.div`\n  padding: 40px 0;\n  text-align: center;\n`;\n\nexport interface WebhookLogsDialogProps {\n  open: boolean;\n  onClose: () => void;\n  /** Pre-filter to a single connection (used when opened from its row menu). */\n  initialConnectionId?: string;\n  /**\n   * Pre-filter to a set of connections (e.g. the connections a project's\n   * repositories belong to). Takes precedence over `initialConnectionId`.\n   */\n  connectionIds?: string[];\n}\n\nexport const WebhookLogsDialog = ({\n  open,\n  onClose,\n  initialConnectionId,\n  connectionIds,\n}: WebhookLogsDialogProps): ReactElement => {\n  const [filters, setFilters] = useState<SelectedType>((): SelectedType => {\n    if (connectionIds && connectionIds.length > 0) {\n      return { connection: connectionIds };\n    }\n    if (initialConnectionId) {\n      return { connection: [initialConnectionId] };\n    }\n    return {};\n  });\n\n  const connectionsById = useMemo(() => {\n    const map: Record<string, WebhookConnection> = {};\n    WEBHOOK_CONNECTIONS.forEach((connection) => {\n      map[connection.id] = connection;\n    });\n    return map;\n  }, []);\n\n  const filterData = useMemo(\n    () => [\n      {\n        id: \"connection\",\n        title: \"Connection\",\n        submenu: WEBHOOK_CONNECTIONS.map((connection) => ({\n          id: connection.id,\n          name: connection.name,\n        })),\n      },\n      {\n        id: \"event_type\",\n        title: \"Event Type\",\n        submenu: Array.from(\n          new Set(WEBHOOK_LOGS.map((log) => log.eventKind))\n        ).map((eventKind) => ({\n          id: eventKind,\n          name: EVENT_KIND_LABELS[eventKind],\n        })),\n      },\n      {\n        id: \"status\",\n        title: \"Processing Status\",\n        submenu: (Object.keys(STATUS_LABELS) as WebhookStatus[]).map(\n          (status) => ({ id: status, name: STATUS_LABELS[status] })\n        ),\n      },\n    ],\n    []\n  );\n\n  const visibleLogs = useMemo(() => {\n    const byConnection = filters.connection ?? [];\n    const byEvent = filters.event_type ?? [];\n    const byStatus = filters.status ?? [];\n\n    return WEBHOOK_LOGS.filter((log) => {\n      if (byConnection.length && !byConnection.includes(log.connectionId)) {\n        return false;\n      }\n      if (byEvent.length && !byEvent.includes(log.eventKind)) {\n        return false;\n      }\n      if (byStatus.length && !byStatus.includes(log.status)) {\n        return false;\n      }\n      return true;\n    }).sort((a, b) => b.receivedAt - a.receivedAt);\n  }, [filters]);\n\n  return (\n    <WebhookLogsDialogStyled\n      open={open}\n      onClose={onClose}\n      enableBackgroundClick\n    >\n      <Dialog.Title disableDefaultHeading>\n        <DialogTitleBar>\n          <Header3>Webhook Logs</Header3>\n          <div className=\"title-actions\">\n            <Filter\n              data={filterData}\n              selected={filters}\n              label=\"Filter\"\n              clearAllText=\"Clear All\"\n              noResultText=\"No results\"\n              emptyFilterText=\"No filters to show\"\n              onChange={setFilters}\n            />\n            <IconButton variant=\"text gray\" onClick={onClose}>\n              <CancelCrossIcon />\n            </IconButton>\n          </div>\n        </DialogTitleBar>\n      </Dialog.Title>\n      <Dialog.ContentDivider />\n      <Dialog.Content>\n        {visibleLogs.length > 0 ? (\n          <>\n            <LogListHeader>\n              <Caption2 className=\"lh-conn\" color=\"secondary\" weight=\"bold\">\n                CONNECTION\n              </Caption2>\n              <Caption2 className=\"lh-event\" color=\"secondary\" weight=\"bold\">\n                EVENT TYPE\n              </Caption2>\n              <Caption2 className=\"lh-status\" color=\"secondary\" weight=\"bold\">\n                STATUS\n              </Caption2>\n              <Caption2 className=\"lh-outcomes\" color=\"secondary\" weight=\"bold\">\n                OUTCOMES\n              </Caption2>\n            </LogListHeader>\n            {visibleLogs.map((log) => (\n              <LogRow\n                key={log.id}\n                log={log}\n                connection={connectionsById[log.connectionId]}\n              />\n            ))}\n          </>\n        ) : (\n          <EmptyLogs>\n            <Body2 color=\"tertiary\">\n              No webhook logs match the selected filters.\n            </Body2>\n          </EmptyLogs>\n        )}\n      </Dialog.Content>\n    </WebhookLogsDialogStyled>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/presentation/shared/headers.d.ts

@@ -1,4 +1,5 @@
 import { ReactElement, ReactNode } from "react";
+import { Repository } from "./ConnectRepositoryDialog";
 export interface PageHeaderProps {
     title: string;
     children?: ReactNode;
@@ -11,16 +12,20 @@ export declare const PageHeader: {
 export interface ProjectOptionsMenuProps {
     /** When the `source` module is loaded, show the Repositories section. */
     sourceModuleLoaded?: boolean;
+    /** Repositories already connected to the project when the menu first mounts. */
+    initialConnectedRepositories?: Repository[];
 }
 export interface ProjectPageHeaderProps {
     title?: string;
     /** When the `source` module is loaded, the "..." menu shows a Repositories
      *  section (connected repositories + Connect Repository). */
     sourceModuleLoaded?: boolean;
+    /** Repositories already connected to the project (seeds the count + submenu). */
+    initialConnectedRepositories?: Repository[];
 }
 /** The project page header: back arrow, title, progress, info, people, options. */
 export declare const ProjectPageHeader: {
-    ({ title, sourceModuleLoaded, }: ProjectPageHeaderProps): ReactElement;
+    ({ title, sourceModuleLoaded, initialConnectedRepositories, }: ProjectPageHeaderProps): ReactElement;
     displayName: string;
 };
 export interface TabHeaderProps {