chore: add webhook secret to table, fix api error (#7606)

Author: arcoraven

apps/dashboard/src/@/api/webhook-configs.ts

@@ -37,7 +37,7 @@ type WebhookConfigsResponse =
     };
 
 interface CreateWebhookConfigRequest {
-  topics: { id: string; filters: object | null }[];
+  topicIdsWithFilters: { id: string; filters: object | null }[];
   destinationUrl: string;
   description: string;
   isPaused?: boolean;
@@ -76,7 +76,7 @@ type TopicsResponse =
 
 interface UpdateWebhookConfigRequest {
   destinationUrl?: string;
-  topics?: { id: string; filters: object | null }[];
+  topicIdsWithFilters?: { id: string; filters: object | null }[];
   description?: string;
   isPaused?: boolean;
 }

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/webhook-config-modal.tsx

@@ -97,7 +97,7 @@ export function WebhookConfigModal(props: WebhookConfigModalProps) {
             description: values.description,
             destinationUrl: values.destinationUrl,
             isPaused: values.isPaused,
-            topics: processedTopics,
+            topicIdsWithFilters: processedTopics,
           },
           projectIdOrSlug: props.projectSlug,
           teamIdOrSlug: props.teamSlug,
@@ -115,7 +115,7 @@ export function WebhookConfigModal(props: WebhookConfigModalProps) {
             description: values.description,
             destinationUrl: values.destinationUrl,
             isPaused: values.isPaused,
-            topics: processedTopics,
+            topicIdsWithFilters: processedTopics,
           },
           projectIdOrSlug: props.projectSlug,
           teamIdOrSlug: props.teamSlug,

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/webhook-configs-table.tsx

@@ -187,6 +187,7 @@ export function WebhookConfigsTable(props: {
                   <TableHead className="w-[150px]">Destination URL</TableHead>
                   <TableHead>Topics</TableHead>
                   <TableHead>Activity (24h)</TableHead>
+                  <TableHead>Webhook Secret</TableHead>
                   <TableHead>Created</TableHead>
                   <TableHead className="w-[50px]"></TableHead>
                 </TableRow>
@@ -258,6 +259,22 @@ export function WebhookConfigsTable(props: {
                         metrics={props.metricsMap.get(config.id) || null}
                       />
                     </TableCell>
+                    <TableCell>
+                      {config.webhookSecret ? (
+                        <CopyTextButton
+                          className="max-w-[120px] text-sm text-muted-foreground font-mono justify-start p-0 h-auto"
+                          textToCopy={config.webhookSecret}
+                          textToShow={`...${config.webhookSecret.slice(-4)}`}
+                          variant="ghost"
+                          copyIconPosition="right"
+                          tooltip="Copy webhook secret"
+                        />
+                      ) : (
+                        <span className="text-sm text-muted-foreground">
+                          No secret
+                        </span>
+                      )}
+                    </TableCell>
                     <TableCell className="text-muted-foreground">
                       {config.createdAt
                         ? format(new Date(config.createdAt), "MMM d, yyyy")