feat: webhook monitoring#322
Open
sarimrmalik wants to merge 129 commits into
Open
Conversation
- Refactored the webhooks page to utilize a new layout with improved content organization. - Replaced the previous card and frame structure with a more streamlined Page component. - Introduced WebhooksPageContent for better separation of concerns and added search functionality. - Removed unused WebhooksEmpty and TableBody components to clean up the codebase. - Updated WebhooksTable to handle error states and display appropriate messages based on webhook data.
- Removed the unused `hasActiveSearch` prop from the `WebhooksTable` component. - Streamlined the logic for displaying empty states based on webhook data. - Updated the `WebhooksPageContent` component to enhance layout and button styling. - Added `.cursor/` to `.gitignore` to exclude cursor-related files from version control.
- Updated the Page component to include padding for improved spacing. - Adjusted the DefaultDashboardLayout to modify padding for better responsiveness. - Refined the WebhooksTable to conditionally apply border styles based on webhook data presence.
…ent labels - Introduced a new `WebhookExamplePayload` component to display a sample JSON payload for webhooks. - Replaced hardcoded event names with corresponding labels from `WEBHOOK_EVENT_LABELS` for better readability. - Removed unused imports and constants related to the previous payload structure. - Updated documentation link for webhook signature validation.
- Enhanced the `Input` component to support a clearable feature, allowing users to easily reset input fields. - Updated `WebhookAddEditDialogSteps` to utilize the new clearable input functionality for webhook URLs and example webhooks. - Adjusted padding in the `WebhookAddEditDialog` for improved layout consistency.
- Updated `WebhookExamplePayload` to accept an `eventType` prop for dynamic rendering of example payloads. - Simplified the display of the webhook secret description and removed the link to signature validation documentation. - Introduced state management for the last selected event to improve user experience in the webhook dialog. - Adjusted layout and styling for better clarity and usability in the webhook add/edit dialog.
# Conflicts: # .gitignore
…ling - Added a custom input ref to focus on the secret input when 'custom' secret type is selected. - Updated the button to show a check icon when the copy action is successful, improving user feedback. - Adjusted layout and styling for better responsiveness and clarity in the dialog components.
- Added clipboard support to the `WebhookAddEditDialogSteps` for copying the generated webhook secret. - Introduced state management for copy success feedback, enhancing user experience. - Updated button styles to reflect copy status, improving visual feedback during interactions.
- Updated the `WebhookSecretSchema` to maintain a minimum character requirement of 32 characters for the secret. - Adjusted the `WebhookAddEditDialogSteps` to validate the `signatureSecret` field correctly, ensuring user feedback is displayed when errors occur.
- Replaced the existing webhook fetching and management logic with TRPC for improved data handling and state management. - Removed deprecated `getWebhooks` function and associated actions, streamlining the codebase. - Updated the webhooks page to utilize `Suspense` and `HydrateClient` for better loading states and error handling. - Refactored the webhook add/edit and delete dialogs to use React Query for mutation handling, enhancing user experience with real-time updates. - Adjusted schema definitions for webhook actions to align with new input structures. - Improved error handling and user feedback across webhook-related components. This refactor aims to enhance the maintainability and performance of the webhooks feature within the dashboard.
…xperience - Added a new FinishWebhookSetupDialog component to guide users through verifying webhook signatures. - Implemented language selection for verification snippets (JavaScript and Python) to assist users in integrating webhook security. - Updated the existing WebhookAddEditDialog to trigger the new dialog upon successful webhook addition, improving user flow. This enhancement aims to streamline the webhook setup process and provide clear guidance on signature verification.
…nd functionality - Refactored WebhookTableRow to separate row actions into a new WebhookRowActions component for better readability and maintainability. - Introduced a utility function to map webhook events to their corresponding labels, enhancing clarity in the UI. - Updated the table layout and styling for improved responsiveness and user experience. - Removed unnecessary props and streamlined the component's interface. This refactor aims to improve the overall structure and usability of the webhook management interface.
…owActions components - Introduced consistent class names for table row and cell styling to enhance readability and maintainability. - Updated the WebhookRowActions component to use the new class names for action icons, improving visual consistency. - Adjusted the WebhooksTable header styling for better alignment and presentation of table data. These changes aim to streamline the UI and improve the overall user experience in the webhook management interface.
…sTable components - Adjusted class names for consistent styling across WebhookTableRow and WebhooksTable, enhancing layout and alignment. - Improved the structure of the WebhookRowActions component for better visual consistency. - Refined header cell styling in WebhooksTable for improved readability and presentation. These changes aim to enhance the user interface and overall experience in the webhook management section.
…ctor/webhooks-page
- Changed the webhook input mode from 'edit' to 'update' for consistency across the application. - Refactored related components and schemas to align with the new mode terminology. - Introduced a new UpsertWebhookDialog component to streamline the webhook creation and update process. - Updated the webhooks page to utilize the new dialog, enhancing the user experience in managing webhooks. These changes aim to improve clarity and maintainability in the webhook management interface.
…'email' - Changed the UserAvatar component to accept a 'label' prop for displaying user information, enhancing clarity in the codebase. - Updated instances of UserAvatar across member and API keys table rows to reflect this change, ensuring consistency in the usage of the component. - Removed the TeamAvatar component in favor of UserAvatar for better uniformity in the dashboard's UI. These changes aim to improve the maintainability and readability of the code related to user avatars.
- Introduced a new WebhookNameAndUrl component to encapsulate the display and copy functionality for webhook names and URLs. - Implemented clipboard copying with visual feedback for the URL, improving user interaction. - Updated WebhookTableRow to utilize the new component, streamlining the code and enhancing maintainability. These changes aim to improve the user experience when managing webhooks by making URL copying more intuitive.
- Introduced a new WebhookEventBadges component to display webhook events with tooltips for better user interaction. - Replaced inline event badge rendering in WebhookTableRow with the new component, improving code readability and maintainability. - Added tooltip functionality to provide additional context for webhook events, enhancing the user experience. These changes aim to improve the clarity and usability of the webhook management interface.
- Added a new schema for SandboxLifecycleEventType to standardize lifecycle event types related to sandboxes. - Updated constants and components to utilize the new schema, enhancing type safety and maintainability. - Refactored webhook-related components to replace hardcoded event strings with the new type, improving clarity and reducing potential errors. These changes aim to streamline the webhook management process and ensure consistent handling of sandbox lifecycle events.
…t and styling - Refactored WebhookTableRow to enhance the structure and styling of table cells, improving visual consistency. - Updated WebhooksTable header and body styles for better alignment and readability. - Adjusted class names to streamline the layout and ensure a cohesive design across components. These changes aim to enhance the user interface and overall experience in the webhook management section.
…ng functionality - Removed the className prop from WebhookTableRow for cleaner code. - Reorganized WebhookRowActions to enhance the layout of action items. - Updated the label for the secret editing action to "Edit secret" for clarity. - Improved the structure of the Delete action for better visual consistency. These changes aim to enhance the user experience and maintainability of the webhook management interface.
- Introduced a new DiscardWebhookChangesDialog component to prompt users when they attempt to leave the UpsertWebhookDialog with unsaved changes. - Integrated the dialog into the UpsertWebhookDialog, managing its visibility based on user actions. - Enhanced the user experience by preventing accidental loss of changes during webhook management. These changes aim to improve the usability and safety of the webhook editing process.
…proved structure - Removed the old WebhookDeleteDialog component and replaced it with the new DeleteWebhookDialog component, enhancing the user interface for webhook deletion. - Updated references in WebhookTableRow to utilize the new dialog, ensuring consistency across the application. - Refactored the EditSecretDialog component for better clarity and maintainability. These changes aim to streamline the webhook management process and improve the overall user experience.
- Updated the badge component used in webhook delivery rows and filters to improve consistency and clarity in naming. - Refactored imports and usages across the codebase to reflect the new component name, enhancing maintainability.
- Deleted the WebhookStatusBadge component from the codebase to streamline the webhook handling. - This change simplifies the overall structure and reduces unnecessary complexity in the dashboard settings.
…onents - Replaced the WebhookStatsChart and WebhookRangeSelector with new StatsChart and StatsIntervalSelect components for improved functionality and maintainability. - Updated type references in the WebhookOverviewContent to align with the new charting and selection logic. - This change enhances the overall structure of the webhook overview, providing a more streamlined user experience.
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 11a60afd19
ℹ️ About Codex in GitHub
Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
![claude[bot]](https://avatars.githubusercontent.com/in/1236702?s=60&v=4){kind=small}
drankou
reviewed
Jun 3, 2026
drankou
reviewed
Jun 3, 2026
Contributor
drankou
left a comment
drankou
left a comment
There was a problem hiding this comment.
left few comments, also please resolve/address AI-review comments
- Introduced a constant to define the maximum allowable range for webhook stats, set to 7 days. - Updated the validation logic in `getValidWebhookStatsBounds` to ensure the end time does not exceed the defined maximum range, enhancing data integrity and preventing excessive queries.
- Added a prefetch call for the latest webhook deliveries in the WebhookTabsLayout component, improving data retrieval efficiency. - This change enhances the user experience by ensuring that delivery data is readily available when the layout is rendered.
- Adjusted the ChartPanel component's styling by removing unnecessary min-height, improving layout flexibility. - Updated the grid container in WebhookOverviewContent to enforce a minimum height, ensuring consistent display of event delivery stats. - These changes enhance the overall user experience by providing a more responsive and visually appealing dashboard layout.
…verviewContent - Replaced the xAxisScale prop with xAxisRange in the StatsChart component to improve type safety and clarity. - Adjusted the x-axis label formatting and interval calculations to align with the new range-based logic. - These changes enhance the overall functionality and maintainability of the webhook statistics visualization.
- Removed the getLatestAttempt function and directly accessed the first attempt in the toDeliveryGroup function to streamline the logic. - This change enhances code clarity and reduces unnecessary complexity in the webhook delivery processing.
- Updated the conditional rendering in the WebhookDeliveriesTable to handle the scrollContainer state more effectively. - Simplified the useMemo hook for groups to enhance readability and maintainability. - These changes improve the overall performance and clarity of the webhook deliveries component.
- Introduced a new `chart-utils.ts` file containing utility functions for processing webhook delivery statistics, including data grouping and response time calculations. - Refactored the `overview-content.tsx` file to utilize these new functions, improving code organization and readability. - These changes enhance the functionality of the webhook statistics visualization by providing a more structured approach to data handling.
…eries content - Changed the empty state label from 'No event types selected' to 'No events selected' for improved clarity. - This update enhances the user experience by providing a more concise message in the webhook deliveries component.
- Updated the `hideInactiveZeroValuePoints` function to accept customizable nearby offsets, improving flexibility in handling zero-value points. - Refactored the delivery series data handling in `WebhookOverviewContent` to utilize a separate variable for failed deliveries, enhancing code clarity and maintainability. - These changes improve the overall functionality and readability of the webhook delivery statistics visualization.
- Introduced a new function, `getTimestampBucketInterval`, to determine appropriate bucket intervals for delivery statistics based on the selected time range. - Updated `getDeliveryCountSeriesData` and `getResponseTimeSeriesData` to utilize dynamic timestamp intervals, improving data accuracy and visualization. - Refactored the handling of synthetic data points in chart data generation, enhancing clarity and maintainability. - Added unit tests for new utility functions to ensure correctness and reliability in data processing.
- Introduced `WebhookDetailHeaderFallback` and `WebhookDetailContentFallback` components to provide skeleton loading states for the webhook details page. - Integrated these fallback components into the `WebhookDetailLayout` using React's `Suspense` for improved user experience during data loading. - These changes enhance the visual feedback for users while the webhook details are being fetched.
drankou
approved these changes
Jun 5, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Test plan
bunx tsc --noEmit --pretty false.