From cb994dcb8f4f3f6d0767b72a601fc9740ee9f71a Mon Sep 17 00:00:00 2001 From: AmineAfia Date: Thu, 29 May 2025 19:30:57 +0000 Subject: [PATCH] Re-enable webhooks sidebar link in project dashboard (#7196) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## [Dashboard] Feature: Add Webhooks to Project Sidebar ## Notes for the reviewer This PR adds the Webhooks option to the project sidebar navigation. The option was previously commented out due to a scrolling issue, which has now been resolved. ## How to test Navigate to a project page and verify that the Webhooks option appears in the sidebar with a "New" badge. --- ## PR-Codex overview This PR primarily focuses on refining the handling of webhook payloads and enhancing the `ProjectSidebarLayout` component by reintroducing the webhooks link. It also updates the API fetch calls to ensure they consistently use HTTPS. ### Detailed summary - Changed `params` type in `webhookPayloadUtils.ts` from `Record | unknown[]` to `Record`. - Updated `params` in the `buildTransactionWebhookPayload` function to use an empty object instead of an empty array. - Reintroduced the webhooks link in `ProjectSidebarLayout.tsx` with appropriate properties. - Updated fetch calls in `webhooks.ts` to use HTTPS for the API domain in multiple functions (`getWebhooks`, `deleteWebhook`, `testWebhook`). > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` ## Summary by CodeRabbit - **New Features** - Re-enabled the "Webhooks" link in the project sidebar, now visible with a "New" badge. - **Bug Fixes** - Improved API reliability by ensuring all webhook-related network requests use the correct HTTPS scheme. - **Refactor** - Updated internal data structures for webhook payloads to improve consistency and type safety. --- apps/dashboard/src/@/api/insight/webhooks.ts | 38 +++++++++++-------- .../components/ProjectSidebarLayout.tsx | 22 +++++------ .../webhooks/utils/webhookPayloadUtils.ts | 4 +- 3 files changed, 35 insertions(+), 29 deletions(-) diff --git a/apps/dashboard/src/@/api/insight/webhooks.ts b/apps/dashboard/src/@/api/insight/webhooks.ts index 9a803425cd3..8ac3733f84c 100644 --- a/apps/dashboard/src/@/api/insight/webhooks.ts +++ b/apps/dashboard/src/@/api/insight/webhooks.ts @@ -73,15 +73,18 @@ export async function createWebhook( ): Promise { try { const authToken = await getAuthToken(); - const response = await fetch(`${THIRDWEB_INSIGHT_API_DOMAIN}/v1/webhooks`, { - method: "POST", - headers: { - "Content-Type": "application/json", - "x-client-id": clientId, - Authorization: `Bearer ${authToken}`, + const response = await fetch( + `https://${THIRDWEB_INSIGHT_API_DOMAIN}/v1/webhooks`, + { + method: "POST", + headers: { + "Content-Type": "application/json", + "x-client-id": clientId, + Authorization: `Bearer ${authToken}`, + }, + body: JSON.stringify(payload), }, - body: JSON.stringify(payload), - }); + ); if (!response.ok) { const errorText = await response.text(); @@ -105,13 +108,16 @@ export async function getWebhooks( ): Promise { try { const authToken = await getAuthToken(); - const response = await fetch(`${THIRDWEB_INSIGHT_API_DOMAIN}/v1/webhooks`, { - method: "GET", - headers: { - "x-client-id": clientId, - Authorization: `Bearer ${authToken}`, + const response = await fetch( + `https://${THIRDWEB_INSIGHT_API_DOMAIN}/v1/webhooks`, + { + method: "GET", + headers: { + "x-client-id": clientId, + Authorization: `Bearer ${authToken}`, + }, }, - }); + ); if (!response.ok) { const errorText = await response.text(); @@ -137,7 +143,7 @@ export async function deleteWebhook( try { const authToken = await getAuthToken(); const response = await fetch( - `${THIRDWEB_INSIGHT_API_DOMAIN}/v1/webhooks/${encodeURIComponent(webhookId)}`, + `https://${THIRDWEB_INSIGHT_API_DOMAIN}/v1/webhooks/${encodeURIComponent(webhookId)}`, { method: "DELETE", headers: { @@ -171,7 +177,7 @@ export async function testWebhook( try { const authToken = await getAuthToken(); const response = await fetch( - `${THIRDWEB_INSIGHT_API_DOMAIN}/v1/webhooks/test`, + `https://${THIRDWEB_INSIGHT_API_DOMAIN}/v1/webhooks/test`, { method: "POST", headers: { diff --git a/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx b/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx index 60be652ece4..8ce108a67d0 100644 --- a/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx +++ b/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/ProjectSidebarLayout.tsx @@ -2,6 +2,7 @@ import { FullWidthSidebarLayout } from "@/components/blocks/SidebarLayout"; import { Badge } from "@/components/ui/badge"; import { + BellIcon, BookTextIcon, BoxIcon, CoinsIcon, @@ -94,17 +95,16 @@ export function ProjectSidebarLayout(props: { icon: NebulaIcon, tracking: tracking("nebula"), }, - // Commented until we solve the scrolling issue - // { - // href: `${layoutPath}/webhooks`, - // label: ( - // - // Webhooks New - // - // ), - // icon: BellIcon, - // tracking: tracking("webhooks"), - // }, + { + href: `${layoutPath}/webhooks`, + label: ( + + Webhooks New + + ), + icon: BellIcon, + tracking: tracking("webhooks"), + }, ]} footerSidebarLinks={[ { diff --git a/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/webhookPayloadUtils.ts b/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/webhookPayloadUtils.ts index a385d8a0f8f..8f677f6118c 100644 --- a/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/webhookPayloadUtils.ts +++ b/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/webhookPayloadUtils.ts @@ -20,7 +20,7 @@ export interface WebhookPayload { signatures?: Array<{ sig_hash: string; abi?: string; - params: Record | unknown[]; + params: Record; }>; } >; @@ -59,7 +59,7 @@ export function buildTransactionWebhookPayload( txSignatures.push({ sig_hash: data.sigHash, abi: data.sigHashAbi, - params: [], + params: {}, }); } return {