From 8b2786945b0b008df58ab0114544afecbb510605 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Sun, 16 Aug 2026 15:26:11 +0000 Subject: [PATCH 1/3] Initial plan From 616837962568b51c2ce540e4c68fa04307d75b1b Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Sun, 16 Aug 2026 15:30:39 +0000 Subject: [PATCH 2/3] fix: open consent review in full view Co-authored-by: Power-Maverick <36135520+Power-Maverick@users.noreply.github.com> --- src/renderer/index.html | 31 +--------- .../cspConsentReviewSidebarManagement.ts | 61 +++---------------- src/renderer/modules/initialization.ts | 11 ++++ src/renderer/modules/sidebarManagement.ts | 14 ----- src/renderer/modules/themeManagement.ts | 5 -- src/renderer/styles.scss | 58 +++++++++++------- tests/e2e/navigation.spec.ts | 25 +------- 7 files changed, 58 insertions(+), 147 deletions(-) diff --git a/src/renderer/index.html b/src/renderer/index.html index c4eed520..54867f3d 100644 --- a/src/renderer/index.html +++ b/src/renderer/index.html @@ -43,7 +43,7 @@ - - - -
-
- - -
-
- -
-
-
- -
- -
diff --git a/src/renderer/modules/cspConsentReviewSidebarManagement.ts b/src/renderer/modules/cspConsentReviewSidebarManagement.ts index cea1cf3b..f89efae9 100644 --- a/src/renderer/modules/cspConsentReviewSidebarManagement.ts +++ b/src/renderer/modules/cspConsentReviewSidebarManagement.ts @@ -1,6 +1,6 @@ /** * CSP consent review module - * Renders consent review in sidebar and in full-tab mode. + * Renders consent review in full-tab mode. */ import { logError, logInfo } from "../../common/logger"; @@ -334,50 +334,17 @@ function attachContextEventHandlers(context: ConsentReviewContext): void { bindActionHandling(context); } -function registerSidebarContext(): ConsentReviewContext | null { - const searchInput = document.getElementById("consents-search-input") as HTMLInputElement | null; - const statusFilter = document.getElementById("consents-status-filter") as HTMLSelectElement | null; - const listContainer = document.getElementById("sidebar-consent-review-container") as HTMLElement | null; - - if (!searchInput || !statusFilter || !listContainer) { - return null; - } - - const existing = contexts.get("sidebar"); - if (existing) { - return existing; - } - - const context: ConsentReviewContext = { - key: "sidebar", - searchInput, - statusFilter, - listContainer, - }; - contexts.set("sidebar", context); - attachContextEventHandlers(context); - - const openTabBtn = document.getElementById("sidebar-consents-open-tab-btn"); - if (openTabBtn && openTabBtn.getAttribute("data-bound") !== "true") { - openTabBtn.setAttribute("data-bound", "true"); - openTabBtn.addEventListener("click", () => { - openConsentReviewTab().catch((error) => { - logError(error instanceof Error ? error : new Error(String(error))); - }); - }); - } - - return context; -} - function renderConsentTabContent(panel: HTMLElement): void { panel.className = "settings-tab-container"; panel.innerHTML = `
`; @@ -431,15 +398,3 @@ export async function openConsentReviewTab(): Promise { registerCloseGuard("consent-review", async () => true); await openLocalPageAsTab("consent-review", "Consent Review", renderConsentTabContent, ""); } - -/** - * Loads and renders all CSP consent records in the sidebar panel. - */ -export async function loadSidebarConsentReview(): Promise { - const context = registerSidebarContext(); - if (!context) { - return; - } - - await refreshContext(context); -} diff --git a/src/renderer/modules/initialization.ts b/src/renderer/modules/initialization.ts index c85a8f52..2c5fd029 100644 --- a/src/renderer/modules/initialization.ts +++ b/src/renderer/modules/initialization.ts @@ -26,6 +26,7 @@ import { openAddConnectionModal, updateFooterConnection, } from "./connectionManagement"; +import { openConsentReviewTab } from "./cspConsentReviewSidebarManagement"; import { initializeGlobalSearch } from "./globalSearchManagement"; import { loadHomepageData, setupHomepageActions } from "./homepageManagement"; import { clearMarketplaceDropdownFilters, handleProtocolInstallToolRequest, loadMarketplace, loadToolsLibrary } from "./marketplaceManagement"; @@ -270,6 +271,16 @@ function setupActivityBar(): void { }); } + // Consent review button opens a tab instead of a sidebar panel + const consentReviewActivityBtn = document.getElementById("consent-review-activity-btn"); + if (consentReviewActivityBtn) { + consentReviewActivityBtn.addEventListener("click", () => { + openConsentReviewTab().catch((err) => { + logError(err instanceof Error ? err : new Error(String(err))); + }); + }); + } + // Agent invocation logs button opens a tab const agentInvocationLogsBtn = document.getElementById("mcp-btn"); if (agentInvocationLogsBtn) { diff --git a/src/renderer/modules/sidebarManagement.ts b/src/renderer/modules/sidebarManagement.ts index e901e6e7..217f59d9 100644 --- a/src/renderer/modules/sidebarManagement.ts +++ b/src/renderer/modules/sidebarManagement.ts @@ -5,7 +5,6 @@ import { logError } from "../../common/logger"; import { loadSidebarCommunityResources } from "./communityResourcesSidebarManagement"; -import { loadSidebarConsentReview } from "./cspConsentReviewSidebarManagement"; import { loadSettings } from "./settingsManagement"; // Track current sidebar @@ -56,12 +55,6 @@ export function switchSidebar(sidebarId: string): void { }); } - // Load consent review when re-expanding consent sidebar - if (sidebarId === "consents") { - loadSidebarConsentReview().catch((err) => { - logError(err instanceof Error ? err : new Error(String(err))); - }); - } } window.api?.send("sidebar-layout-changed"); return; @@ -103,12 +96,5 @@ export function switchSidebar(sidebarId: string): void { }); } - // Load consent review when switching to consent sidebar - if (sidebarId === "consents") { - loadSidebarConsentReview().catch((err) => { - logError(err instanceof Error ? err : new Error(String(err))); - }); - } - window.api?.send("sidebar-layout-changed"); } diff --git a/src/renderer/modules/themeManagement.ts b/src/renderer/modules/themeManagement.ts index 3e4ebbbf..4722e2a8 100644 --- a/src/renderer/modules/themeManagement.ts +++ b/src/renderer/modules/themeManagement.ts @@ -104,11 +104,6 @@ export function updateConnectionIconsForTheme(): void { exportIcon.src = isDarkTheme ? "icons/dark/export.svg" : "icons/light/export.svg"; } - const consentsOpenTabIcon = document.getElementById("consents-open-tab-icon") as HTMLImageElement | null; - if (consentsOpenTabIcon) { - consentsOpenTabIcon.src = isDarkTheme ? "icons/dark/expand.svg" : "icons/light/expand.svg"; - } - // Update category group export icons const exportIconPath = isDarkTheme ? "icons/dark/export.svg" : "icons/light/export.svg"; document.querySelectorAll(".connection-group-export-icon").forEach((img) => { diff --git a/src/renderer/styles.scss b/src/renderer/styles.scss index aa643f97..5da38074 100644 --- a/src/renderer/styles.scss +++ b/src/renderer/styles.scss @@ -862,7 +862,7 @@ body.dark-theme .settings-section-card { padding-left: 4px; } -/* Consent Review Sidebar */ +/* Consent Review */ .consent-review-summary-card { margin-bottom: 4px; } @@ -947,8 +947,8 @@ body.dark-theme .settings-section-card { .consent-review-domains-grid { display: grid; - grid-template-columns: 1fr; - gap: 10px; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 24px; } .consent-review-domain-section { @@ -1003,38 +1003,43 @@ body.dark-theme .settings-section-card { } .consent-review-tab-toolbar { - margin-bottom: 12px; + display: flex; + gap: 12px; + align-items: center; + padding: 16px 0; + border-bottom: 1px solid var(--border-color); } -#consent-review-tab-scroll-area { - padding: 16px 24px 20px; - box-sizing: border-box; +.consent-review-tab-toolbar .sidebar-search-input-wrapper { + flex: 1; } -#consent-review-tab-scroll-area #consent-review-section { - border-bottom: none; +.consent-review-page-header h2 { + margin: 4px 0 6px; + font-size: 24px; + font-weight: 600; } -#consent-review-tab-scroll-area .settings-vscode-section-title { - position: static; - padding: 0 0 8px; - border-bottom: none; +.consent-review-page-header > p:last-child { + margin: 0; + color: var(--text-secondary); + font-size: 13px; } -#consent-review-tab-scroll-area .settings-vscode-item-description { - margin-bottom: 12px; +.consent-review-list { + display: flex; + flex-direction: column; + gap: 16px; + padding-top: 16px; } -#sidebar-consents-open-tab-btn { - padding: 5px 10px; - font-size: 12px; - display: inline-flex; - align-items: center; - gap: 6px; +#consent-review-tab-scroll-area { + padding: 24px 32px 32px; + box-sizing: border-box; } -#consents-open-tab-icon { - flex-shrink: 0; +#consent-review-tab-scroll-area #consent-review-section { + border-bottom: none; } @media (max-width: 1280px) { @@ -1043,6 +1048,13 @@ body.dark-theme .settings-section-card { } } +@media (max-width: 800px) { + .consent-review-domains-grid { + grid-template-columns: 1fr; + gap: 12px; + } +} + .consent-action-btn[disabled] { opacity: 0.7; cursor: not-allowed; diff --git a/tests/e2e/navigation.spec.ts b/tests/e2e/navigation.spec.ts index 878849cf..002c95e2 100644 --- a/tests/e2e/navigation.spec.ts +++ b/tests/e2e/navigation.spec.ts @@ -118,32 +118,13 @@ test.describe("Navigation", () => { await expect(window.locator("#sidebar-connections-list").getByText(connectionName, { exact: true })).toBeVisible({ timeout: 10_000 }); }); - test("consent review sidebar is reachable and renders controls", async ({ window }) => { - const consentButton = window.locator('[data-sidebar="consents"]'); + test("consent review opens directly in full view", async ({ window }) => { + const consentButton = window.locator("#consent-review-activity-btn"); await expect(consentButton).toBeVisible({ timeout: 10_000 }); await consentButton.click(); - await expect(window.locator("#sidebar-consents.sidebar-content.active")).toBeVisible({ timeout: 10_000 }); - await expect(window.locator("#consents-search-input")).toBeVisible({ timeout: 10_000 }); - await expect(window.locator("#consents-status-filter")).toBeVisible({ timeout: 10_000 }); - await expect(window.locator("#sidebar-consent-review-container")).toBeVisible({ timeout: 10_000 }); - - await expect - .poll(async () => { - return await window.locator("#sidebar-consent-review-container .consent-review-count-badge").count(); - }) - .toBeGreaterThan(0); - }); - - test("consent review full view opens from sidebar", async ({ window }) => { - const consentButton = window.locator('[data-sidebar="consents"]'); - await consentButton.click(); - - const openFullViewButton = window.locator("#sidebar-consents-open-tab-btn"); - await expect(openFullViewButton).toBeVisible({ timeout: 10_000 }); - await openFullViewButton.click(); - await expect(window.locator("#consent-review-tab-scroll-area")).toBeVisible({ timeout: 10_000 }); + await expect(window.locator("#sidebar-consents")).toHaveCount(0); await expect(window.locator("#consent-tab-search-input")).toBeVisible({ timeout: 10_000 }); await expect(window.locator("#consent-tab-status-filter")).toBeVisible({ timeout: 10_000 }); await expect(window.locator("#consent-tab-refresh-btn")).toBeVisible({ timeout: 10_000 }); From 2d19ac6f4459ad73c8fa60aa6a1e4f4a126b41a9 Mon Sep 17 00:00:00 2001 From: Power-Maverick Date: Sun, 16 Aug 2026 11:45:50 -0400 Subject: [PATCH 3/3] refactor: enhance consent review UI and improve summary statistics display --- .../cspConsentReviewSidebarManagement.ts | 69 +++++----- src/renderer/styles.scss | 129 +++++++++++------- 2 files changed, 115 insertions(+), 83 deletions(-) diff --git a/src/renderer/modules/cspConsentReviewSidebarManagement.ts b/src/renderer/modules/cspConsentReviewSidebarManagement.ts index f89efae9..f890b717 100644 --- a/src/renderer/modules/cspConsentReviewSidebarManagement.ts +++ b/src/renderer/modules/cspConsentReviewSidebarManagement.ts @@ -71,11 +71,20 @@ function buildConsentEntries(tools: Tool[], consentsByToolId: { [toolId: string] }); } -function createCountBadge(label: string, count: number): HTMLElement { - const badge = document.createElement("span"); - badge.className = "consent-review-count-badge"; - badge.textContent = `${label} ${count}`; - return badge; +function createSummaryStat(label: string, count: number): HTMLElement { + const stat = document.createElement("div"); + stat.className = "consent-review-summary-stat"; + + const value = document.createElement("span"); + value.className = "consent-review-summary-value"; + value.textContent = String(count); + + const labelElement = document.createElement("span"); + labelElement.className = "consent-review-summary-label"; + labelElement.textContent = label; + + stat.append(value, labelElement); + return stat; } function createDomainList(title: string, domains: string[]): HTMLElement { @@ -153,24 +162,15 @@ function renderContext(context: ConsentReviewContext, entries: ConsentReviewEntr const filtered = getFilteredEntries(entries, context); - const summaryCard = document.createElement("section"); - summaryCard.className = "settings-section-card consent-review-summary-card"; - summaryCard.innerHTML = ` -
-

Security

-

Review marketplace tool permissions and apply changes in one flow.

-
- `; - - const summaryBody = document.createElement("div"); - summaryBody.className = "consent-review-summary-badges"; + const summary = document.createElement("section"); + summary.className = "consent-review-summary"; + summary.setAttribute("aria-label", "Consent summary"); const grantedCount = entries.filter((entry) => entry.granted).length; const revokedCount = entries.length - grantedCount; - summaryBody.appendChild(createCountBadge("Total", entries.length)); - summaryBody.appendChild(createCountBadge("Granted", grantedCount)); - summaryBody.appendChild(createCountBadge("Revoked", revokedCount)); - summaryCard.appendChild(summaryBody); - container.appendChild(summaryCard); + summary.appendChild(createSummaryStat("Tools", entries.length)); + summary.appendChild(createSummaryStat("Granted", grantedCount)); + summary.appendChild(createSummaryStat("Revoked", revokedCount)); + container.appendChild(summary); if (filtered.length === 0) { const emptyCard = document.createElement("section"); @@ -185,7 +185,7 @@ function renderContext(context: ConsentReviewContext, entries: ConsentReviewEntr filtered.forEach((entry) => { const card = document.createElement("section"); - card.className = "settings-section-card consent-review-card"; + card.className = "settings-vscode-item consent-review-card"; const statusClass = entry.granted ? "granted" : "revoked"; const statusText = entry.granted ? "Granted" : "Revoked"; @@ -194,21 +194,25 @@ function renderContext(context: ConsentReviewContext, entries: ConsentReviewEntr const notConsentedDomains = getNotConsentedDomains(entry); card.innerHTML = ` -
-
-

${entry.toolName}

-

${contributorsText}

+
+
+
+

${entry.toolName}

+

${contributorsText}

+
- ${statusText} + ${entry.description ? `

${entry.description}

` : ""} +
+
+ ${statusText}
- ${entry.description ? `

${entry.description}

` : ""} `; const domains = document.createElement("div"); domains.className = "consent-review-domains-grid"; domains.appendChild(createDomainList("Consented", consentedDomains)); domains.appendChild(createDomainList("Not Consented", notConsentedDomains)); - card.appendChild(domains); + card.querySelector(".consent-review-card-main")?.appendChild(domains); const actions = document.createElement("div"); actions.className = "consent-review-card-actions"; @@ -218,7 +222,7 @@ function renderContext(context: ConsentReviewContext, entries: ConsentReviewEntr actionButton.textContent = "Make Changes"; actionButton.setAttribute("data-tool-id", entry.toolId); actions.appendChild(actionButton); - card.appendChild(actions); + card.querySelector(".consent-review-card-control")?.appendChild(actions); container.appendChild(card); }); @@ -340,9 +344,8 @@ function renderConsentTabContent(panel: HTMLElement): void {