Skip to content

show contract webhooks as deprecated #7612

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from

Conversation

iuwqyir
Copy link
Contributor

@iuwqyir iuwqyir commented Jul 14, 2025

[Dashboard] Feature: Deprecate legacy contract webhooks

NB! This should be merged only once the new webhooks UI is available to all users, not just thirdweb

Notes for the reviewer

This PR updates the contract webhooks UI to mark them as deprecated, removing the ability to create new contract webhooks and test existing ones. Users are now directed to use the new unified webhooks system.

Key changes:

  • Added a deprecation notice banner with a link to the new webhooks section
  • Removed the "Create Webhook" and "Test Webhook" buttons
  • Updated the status badge to show "Deprecated" instead of "Active/Suspended"
  • Simplified the component props by passing the entire project object
  • Updated styling to make the UI appear more visually deprecated

How to test

Navigate to the contract webhooks page for a project to verify:

  1. The deprecation banner appears with a link to the new webhooks section
  2. Existing webhooks are displayed but can only be deleted, not tested
  3. The "Create Webhook" button is removed
  4. All webhooks show as "Deprecated" in the status column

PR-Codex overview

This PR focuses on the removal of several components and hooks related to webhooks in the application, along with updates to the ContractsWebhooksTable component to reflect these changes. It also introduces deprecation notices for legacy webhooks.

Detailed summary

  • Deleted the following files:
    • useTestWebhook.ts
    • ReviewStep.tsx
    • BasicInfoStep.tsx
    • FilterDetailsStep.tsx
    • CreateWebhookModal.tsx
  • Removed WebhookFormStep and WebhookFormSteps types.
  • Updated ContractsWebhooksPageContent to use _supportedChainIds instead of supportedChainIds.
  • Changed client to _client in ContractsWebhooksPageContent.
  • Modified ContractsWebhooksTable to accept a project prop instead of multiple individual props.
  • Removed the testWebhook functionality and its related UI in ContractsWebhooksTable.
  • Added a deprecation notice for legacy webhooks in the ContractsWebhooksTable.
  • Updated styling for certain elements to improve UI consistency.

✨ Ask PR-Codex anything about this PR by commenting with /codex {your question}

Summary by CodeRabbit

  • Refactor
    • Removed the ability to create, configure, or test contract webhooks from the dashboard.
    • Updated the webhooks table to display legacy webhooks as deprecated and removed related testing features.
    • Simplified the table interface and props for improved clarity.
    • Added a deprecation notice with guidance to use the new unified webhooks section.
    • Removed all user interface elements and forms related to contract webhook creation and management.

Copy link

vercel bot commented Jul 14, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
thirdweb-www ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jul 16, 2025 1:43pm
4 Skipped Deployments
Name Status Preview Comments Updated (UTC)
docs-v2 ⬜️ Skipped (Inspect) Jul 16, 2025 1:43pm
nebula ⬜️ Skipped (Inspect) Jul 16, 2025 1:43pm
thirdweb_playground ⬜️ Skipped (Inspect) Jul 16, 2025 1:43pm
wallet-ui ⬜️ Skipped (Inspect) Jul 16, 2025 1:43pm

@vercel vercel bot temporarily deployed to Preview – nebula July 14, 2025 21:40 Inactive
@vercel vercel bot temporarily deployed to Preview – docs-v2 July 14, 2025 21:40 Inactive
@vercel vercel bot temporarily deployed to Preview – wallet-ui July 14, 2025 21:40 Inactive
@vercel vercel bot temporarily deployed to Preview – thirdweb_playground July 14, 2025 21:40 Inactive
Copy link
Contributor

coderabbitai bot commented Jul 14, 2025

Walkthrough

This change removes the contract webhook creation and testing functionality from the dashboard application. It deletes all related React components, hooks, utility functions, and API calls for creating, filtering, reviewing, and testing webhooks. The UI for legacy webhooks is updated to show a deprecation notice and disables webhook creation and testing.

Changes

File(s) / Path(s) Change Summary
apps/dashboard/src/@/api/insight/webhooks.ts Removed interfaces and functions for creating and testing webhooks (CreateWebhookPayload, TestWebhookPayload, TestWebhookResponse, createWebhook, testWebhook).
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/BasicInfoStep.tsx Deleted the BasicInfoStep component for the webhook creation multi-step form.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/CreateWebhookModal.tsx Deleted the CreateContractWebhookButton component and modal for creating contract webhooks.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/FilterDetailsStep.tsx Deleted the FilterDetailsStep component for configuring webhook filters and advanced options.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/ReviewStep.tsx Deleted the ReviewStep component for reviewing and testing webhook configurations.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/WebhooksTable.tsx Refactored the table: removed webhook testing, updated props, removed creation button, added deprecation notice, changed status to always "Deprecated", and updated UI text styles.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/contract-webhooks/contract-webhooks-page.tsx Removed usage and rendering of the webhook creation button and reduced props passed to the table; updated variable names.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/hooks/useTestWebhook.ts Deleted the useTestWebhook React hook for managing webhook endpoint testing state and logic.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/webhookPayloadUtils.ts Removed all code for building webhook payloads and related types, except for the parseAddresses utility.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/webhookTypes.ts Removed the WebhookFormStep type alias and WebhookFormSteps constant.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant Dashboard UI

    User->>Dashboard UI: View Legacy Webhooks
    Dashboard UI-->>User: Show "Legacy Webhooks" table with deprecation notice
    Note over Dashboard UI: Webhook creation and testing UI is not available
Loading

Possibly related PRs

  • thirdweb-dev/js#7174: Adds the webhook creation UI and related utilities, which are directly removed in this PR, making them strongly related.

Suggested reviewers

  • MananTank
✨ Finishing Touches
  • 📝 Generate Docstrings

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Explain this complex logic.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai explain this code block.
    • @coderabbitai modularize this function.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and explain its main purpose.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
    • @coderabbitai help me debug CodeRabbit configuration file.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai generate docstrings to generate docstrings for this PR.
  • @coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@github-actions github-actions bot added the Dashboard Involves changes to the Dashboard. label Jul 14, 2025
Copy link
Contributor Author

iuwqyir commented Jul 14, 2025


How to use the Graphite Merge Queue

Add either label to this PR to merge it via the merge queue:

  • merge-queue - adds this PR to the back of the merge queue
  • hotfix - for urgent hot fixes, skip the queue and merge this PR next

You must have a Graphite account in order to use the merge queue. Sign up using this link.

An organization admin has enabled the Graphite Merge Queue in this repository.

Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue.

This stack of pull requests is managed by Graphite. Learn more about stacking.

@iuwqyir iuwqyir requested review from arcoraven, MananTank and a team July 14, 2025 21:41
@iuwqyir iuwqyir marked this pull request as ready for review July 14, 2025 21:41
Copy link

codecov bot commented Jul 14, 2025

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 56.42%. Comparing base (9d259d0) to head (da1b41a).

Additional details and impacted files
@@           Coverage Diff           @@
##             main    #7612   +/-   ##
=======================================
  Coverage   56.42%   56.42%           
=======================================
  Files         906      906           
  Lines       58126    58126           
  Branches     4222     4222           
=======================================
  Hits        32795    32795           
  Misses      25223    25223           
  Partials      108      108           
Flag Coverage Δ
packages 56.42% <ø> (ø)
🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Copy link
Contributor

github-actions bot commented Jul 14, 2025

size-limit report 📦

Path Size Loading time (3g) Running time (snapdragon) Total time
thirdweb (esm) 63.25 KB (0%) 1.3 s (0%) 195 ms (+143.72% 🔺) 1.5 s
thirdweb (cjs) 353.31 KB (0%) 7.1 s (0%) 673 ms (+9.05% 🔺) 7.8 s
thirdweb (minimal + tree-shaking) 5.7 KB (0%) 114 ms (0%) 82 ms (+1933.34% 🔺) 196 ms
thirdweb/chains (tree-shaking) 526 B (0%) 11 ms (0%) 38 ms (+2679.91% 🔺) 49 ms
thirdweb/react (minimal + tree-shaking) 19.59 KB (0%) 392 ms (0%) 85 ms (+625.46% 🔺) 477 ms

@iuwqyir iuwqyir force-pushed the 07-15-show_contract_webhooks_as_deprecated branch from cfe1262 to 0f194e7 Compare July 14, 2025 21:50
@iuwqyir iuwqyir force-pushed the 07-11-add_insight_filter_selection_to_webhook_creation_and_update branch from ab2a368 to 8c19216 Compare July 14, 2025 21:50
Copy link

changeset-bot bot commented Jul 14, 2025

⚠️ No Changeset found

Latest commit: da1b41a

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@vercel vercel bot temporarily deployed to Preview – nebula July 14, 2025 21:50 Inactive
@vercel vercel bot temporarily deployed to Preview – thirdweb_playground July 14, 2025 21:50 Inactive
Copy link

changeset-bot bot commented Jul 14, 2025

⚠️ No Changeset found

Latest commit: 0f194e7

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@vercel vercel bot temporarily deployed to Preview – wallet-ui July 14, 2025 21:50 Inactive
@vercel vercel bot temporarily deployed to Preview – docs-v2 July 14, 2025 21:50 Inactive
@iuwqyir iuwqyir force-pushed the 07-11-add_insight_filter_selection_to_webhook_creation_and_update branch from 8c19216 to c1bfaeb Compare July 14, 2025 21:55
@iuwqyir iuwqyir force-pushed the 07-15-show_contract_webhooks_as_deprecated branch from 0f194e7 to 2d862e5 Compare July 14, 2025 21:55
@vercel vercel bot temporarily deployed to Preview – docs-v2 July 14, 2025 21:55 Inactive
@vercel vercel bot temporarily deployed to Preview – wallet-ui July 14, 2025 21:55 Inactive
@iuwqyir iuwqyir force-pushed the 07-15-show_contract_webhooks_as_deprecated branch from 1e714ab to 92474e8 Compare July 16, 2025 07:57
@iuwqyir iuwqyir force-pushed the 07-11-add_insight_filter_selection_to_webhook_creation_and_update branch from 2c09e36 to 704ba1a Compare July 16, 2025 07:57
@vercel vercel bot temporarily deployed to Preview – nebula July 16, 2025 07:57 Inactive
@vercel vercel bot temporarily deployed to Preview – wallet-ui July 16, 2025 07:57 Inactive
@vercel vercel bot temporarily deployed to Preview – docs-v2 July 16, 2025 07:57 Inactive
@vercel vercel bot temporarily deployed to Preview – thirdweb_playground July 16, 2025 07:57 Inactive
@iuwqyir iuwqyir force-pushed the 07-15-show_contract_webhooks_as_deprecated branch from 92474e8 to 27ca83e Compare July 16, 2025 08:45
@vercel vercel bot temporarily deployed to Preview – wallet-ui July 16, 2025 08:45 Inactive
@vercel vercel bot temporarily deployed to Preview – thirdweb_playground July 16, 2025 08:45 Inactive
@vercel vercel bot temporarily deployed to Preview – docs-v2 July 16, 2025 08:45 Inactive
@vercel vercel bot temporarily deployed to Preview – nebula July 16, 2025 08:45 Inactive
@graphite-app graphite-app bot changed the base branch from 07-11-add_insight_filter_selection_to_webhook_creation_and_update to graphite-base/7612 July 16, 2025 13:17
@graphite-app graphite-app bot force-pushed the 07-15-show_contract_webhooks_as_deprecated branch from 27ca83e to 1562213 Compare July 16, 2025 13:27
@graphite-app graphite-app bot force-pushed the graphite-base/7612 branch from 704ba1a to 9d259d0 Compare July 16, 2025 13:27
@vercel vercel bot temporarily deployed to Preview – thirdweb_playground July 16, 2025 13:27 Inactive
@vercel vercel bot temporarily deployed to Preview – wallet-ui July 16, 2025 13:27 Inactive
@vercel vercel bot temporarily deployed to Preview – docs-v2 July 16, 2025 13:27 Inactive
@vercel vercel bot temporarily deployed to Preview – nebula July 16, 2025 13:27 Inactive
@graphite-app graphite-app bot changed the base branch from graphite-base/7612 to main July 16, 2025 13:27
@graphite-app graphite-app bot force-pushed the 07-15-show_contract_webhooks_as_deprecated branch from 1562213 to da1b41a Compare July 16, 2025 13:27
@vercel vercel bot temporarily deployed to Preview – docs-v2 July 16, 2025 13:27 Inactive
@vercel vercel bot temporarily deployed to Preview – nebula July 16, 2025 13:27 Inactive
@vercel vercel bot temporarily deployed to Preview – thirdweb_playground July 16, 2025 13:27 Inactive
@vercel vercel bot temporarily deployed to Preview – wallet-ui July 16, 2025 13:27 Inactive
Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🧹 Nitpick comments (1)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/WebhooksTable.tsx (1)

55-55: Remove underscore prefix from actively used function

The _handleDeleteWebhook function is prefixed with an underscore but is actively used in the component. The underscore prefix convention typically indicates unused variables/functions.

-  const _handleDeleteWebhook = async (webhookId: string) => {
+  const handleDeleteWebhook = async (webhookId: string) => {

And update the usage:

-              onClick={() => _handleDeleteWebhook(webhook.id)}
+              onClick={() => handleDeleteWebhook(webhook.id)}

Also applies to: 192-192

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 9d259d0 and da1b41a.

📒 Files selected for processing (10)
  • apps/dashboard/src/@/api/insight/webhooks.ts (0 hunks)
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/BasicInfoStep.tsx (0 hunks)
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/CreateWebhookModal.tsx (0 hunks)
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/FilterDetailsStep.tsx (0 hunks)
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/ReviewStep.tsx (0 hunks)
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/WebhooksTable.tsx (8 hunks)
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/contract-webhooks/contract-webhooks-page.tsx (4 hunks)
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/hooks/useTestWebhook.ts (0 hunks)
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/webhookPayloadUtils.ts (0 hunks)
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/webhookTypes.ts (0 hunks)
💤 Files with no reviewable changes (8)
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/webhookTypes.ts
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/utils/webhookPayloadUtils.ts
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/ReviewStep.tsx
  • apps/dashboard/src/@/api/insight/webhooks.ts
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/FilterDetailsStep.tsx
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/CreateWebhookModal.tsx
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/BasicInfoStep.tsx
  • apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/hooks/useTestWebhook.ts
🧰 Additional context used
📓 Path-based instructions (2)
**/*.{ts,tsx}

Instructions used from:

Sources:
📄 CodeRabbit Inference Engine

  • CLAUDE.md
apps/{dashboard,playground-web}/**/*.{tsx,ts}

Instructions used from:

Sources:
📄 CodeRabbit Inference Engine

  • CLAUDE.md
🧠 Learnings (3)
📓 Common learnings
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.488Z
Learning: Surface breaking changes prominently in PR descriptions
Learnt from: arcoraven
PR: thirdweb-dev/js#7505
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/analytics/components/WebhookAnalyticsCharts.tsx:186-204
Timestamp: 2025-07-10T10:18:33.238Z
Learning: The ThirdwebBarChart component in apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/analytics/components/WebhookAnalyticsCharts.tsx does not accept standard accessibility props like `aria-label` and `role` in its TypeScript interface, causing compilation errors when added.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.489Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{tsx,ts} : Client Components: Handle interactive UI with React hooks (`useState`, `useEffect`, React Query, wallet hooks)
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/components/*.client.tsx : Interactive UI that relies on hooks (`useState`, `useEffect`, React Query, wallet hooks).
Learnt from: AmineAfia
PR: thirdweb-dev/js#7173
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/WebhooksTable.tsx:59-73
Timestamp: 2025-05-27T21:57:09.248Z
Learning: In the webhooks functionality, form validation prevents users from reaching test webhook functionality without entering a valid URL, ensuring data integrity before testing operations.
Learnt from: AmineAfia
PR: thirdweb-dev/js#7173
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/hooks/useTestWebhook.ts:87-89
Timestamp: 2025-05-27T21:57:57.175Z
Learning: In the webhook testing functionality, error detection using string matching (e.g., checking if error message includes "Failed to send test event") is intentional and based on specific error messages returned by the backend API, not frontend-generated errors.
Learnt from: MananTank
PR: thirdweb-dev/js#7177
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/erc20/erc20.tsx:15-17
Timestamp: 2025-05-27T19:54:55.885Z
Learning: The `fetchDashboardContractMetadata` function from "@3rdweb-sdk/react/hooks/useDashboardContractMetadata" has internal error handlers for all promises and cannot throw errors, so external error handling is not needed when calling this function.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/analytics/shared-analytics-page.tsx:33-39
Timestamp: 2025-05-26T16:30:24.965Z
Learning: In the thirdweb dashboard codebase, redirectToContractLandingPage function already handles execution termination internally (likely using Next.js redirect() which throws an exception), so no explicit return statement is needed after calling it.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/components/*.client.tsx : Anything that consumes hooks from `@tanstack/react-query` or thirdweb SDKs.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/claim-conditions/shared-claim-conditions-page.tsx:43-49
Timestamp: 2025-05-26T16:31:02.480Z
Learning: In the thirdweb dashboard codebase, when `redirectToContractLandingPage()` is called, an explicit return statement is not required afterward because the function internally calls Next.js's `redirect()` which throws an error to halt execution.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/contract-webhooks/contract-webhooks-page.tsx (17)
Learnt from: MananTank
PR: thirdweb-dev/js#7434
File: apps/dashboard/src/app/(app)/team/~/~/contract/[chain]/[contractAddress]/components/project-selector.tsx:62-76
Timestamp: 2025-06-24T21:38:03.155Z
Learning: In the project-selector.tsx component for contract imports, the addToProject.mutate() call is intentionally not awaited (fire-and-forget pattern) to allow immediate navigation to the contract page while the import happens in the background. This is a deliberate design choice to prioritize user experience.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/tokens/shared-page.tsx:41-48
Timestamp: 2025-05-26T16:28:50.772Z
Learning: The `projectMeta` prop is not required for the server-rendered `ContractTokensPage` component in the tokens shared page, unlike some other shared pages where it's needed for consistency.
Learnt from: arcoraven
PR: thirdweb-dev/js#7505
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/analytics/components/WebhookAnalyticsCharts.tsx:186-204
Timestamp: 2025-07-10T10:18:33.238Z
Learning: The ThirdwebBarChart component in apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/analytics/components/WebhookAnalyticsCharts.tsx does not accept standard accessibility props like `aria-label` and `role` in its TypeScript interface, causing compilation errors when added.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.489Z
Learning: Applies to src/extensions/**/*.{ts,tsx} : Auto-generated contracts from ABI definitions in extensions
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/(marketplace)/direct-listings/shared-direct-listings-page.tsx:47-52
Timestamp: 2025-05-26T16:29:54.317Z
Learning: The `projectMeta` prop is not required for the server-rendered `ContractDirectListingsPage` component in the direct listings shared page, following the same pattern as other server components in the codebase where `projectMeta` is only needed for client components.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/components/*.client.tsx : Interactive UI that relies on hooks (`useState`, `useEffect`, React Query, wallet hooks).
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.489Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{tsx,ts} : Client Components: Handle interactive UI with React hooks (`useState`, `useEffect`, React Query, wallet hooks)
Learnt from: MananTank
PR: thirdweb-dev/js#7177
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/erc20/erc20.tsx:15-17
Timestamp: 2025-05-27T19:54:55.885Z
Learning: The `fetchDashboardContractMetadata` function from "@3rdweb-sdk/react/hooks/useDashboardContractMetadata" has internal error handlers for all promises and cannot throw errors, so external error handling is not needed when calling this function.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/components/*.client.tsx : Anything that consumes hooks from `@tanstack/react-query` or thirdweb SDKs.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: MananTank
PR: thirdweb-dev/js#7227
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx:26-26
Timestamp: 2025-05-30T17:14:25.332Z
Learning: The ModuleCardUIProps interface already includes a client prop of type ThirdwebClient, so when components use `Omit<ModuleCardUIProps, "children" | "updateButton">`, they inherit the client prop without needing to add it explicitly.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.489Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{tsx,ts} : Server Components: Perform heavy data fetching
Learnt from: MananTank
PR: thirdweb-dev/js#7298
File: apps/dashboard/src/app/nebula-app/move-funds/move-funds.tsx:424-424
Timestamp: 2025-06-06T23:46:08.795Z
Learning: The thirdweb project has an ESLint rule that restricts direct usage of `defineChain`. When it's necessary to use `defineChain` directly, it's acceptable to disable the rule with `// eslint-disable-next-line no-restricted-syntax`.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/nfts/components/table.tsx:304-313
Timestamp: 2025-05-26T16:27:26.443Z
Learning: The `useChainSlug` hook returns a `string`, not `string | undefined`. When the input chainId is undefined or falsy, the hook returns an empty string "", but never returns undefined itself.
Learnt from: MananTank
PR: thirdweb-dev/js#7177
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/erc20/_hooks/useTokenTransfers.ts:41-44
Timestamp: 2025-05-27T19:56:16.920Z
Learning: When reviewing hooks that use environment variables like NEXT_PUBLIC_DASHBOARD_THIRDWEB_CLIENT_ID for API calls, MananTank prefers not to add explicit validation checks for these variables, trusting they will be set in the deployment environment.
Learnt from: MananTank
PR: thirdweb-dev/js#7356
File: apps/nebula/src/app/not-found.tsx:1-1
Timestamp: 2025-06-17T18:30:52.976Z
Learning: In the thirdweb/js project, the React namespace is available for type annotations (like React.FC) without needing to explicitly import React. This is project-specific configuration that differs from typical TypeScript/React setups.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/WebhooksTable.tsx (24)
Learnt from: arcoraven
PR: thirdweb-dev/js#7505
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/analytics/components/WebhookAnalyticsCharts.tsx:186-204
Timestamp: 2025-07-10T10:18:33.238Z
Learning: The ThirdwebBarChart component in apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/analytics/components/WebhookAnalyticsCharts.tsx does not accept standard accessibility props like `aria-label` and `role` in its TypeScript interface, causing compilation errors when added.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.489Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{tsx,ts} : Client Components: Handle interactive UI with React hooks (`useState`, `useEffect`, React Query, wallet hooks)
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/components/*.client.tsx : Interactive UI that relies on hooks (`useState`, `useEffect`, React Query, wallet hooks).
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/components/*.client.tsx : Anything that consumes hooks from `@tanstack/react-query` or thirdweb SDKs.
Learnt from: jnsdls
PR: thirdweb-dev/js#6929
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx:14-19
Timestamp: 2025-05-21T05:17:31.283Z
Learning: In Next.js server components, the `params` object can sometimes be a Promise that needs to be awaited, despite type annotations suggesting otherwise. In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/insight/webhooks/page.tsx, it's necessary to await the params object before accessing its properties.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.488Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{tsx,ts} : Import UI primitives from `@/components/ui/*` (Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in dashboard and playground apps
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.488Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{tsx,ts} : Use `NavLink` for internal navigation with automatic active states in dashboard and playground apps
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:155-160
Timestamp: 2025-06-10T00:46:58.580Z
Learning: In the dashboard application, the route structure for team and project navigation is `/team/[team_slug]/[project_slug]/...` without a `/project/` segment. Contract links should be formatted as `/team/${teamSlug}/${projectSlug}/contract/${chainId}/${contractAddress}`.
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.488Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{tsx,ts} : Use Tailwind CSS only – no inline styles or CSS modules
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/components/*.client.tsx : Components that listen to user events, animations or live updates.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.489Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{tsx,ts} : Server Components: Perform heavy data fetching
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/components/**/*.{ts,tsx} : Icons come from `lucide-react` or the project-specific `…/icons` exports – never embed raw SVG.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/hooks/**/*.{ts,tsx} : Use React Query (`@tanstack/react-query`) for all client data fetching.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.489Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{tsx,ts} : Client Components: Support fast transitions with prefetched data
Learnt from: MananTank
PR: thirdweb-dev/js#7227
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx:26-26
Timestamp: 2025-05-30T17:14:25.332Z
Learning: The ModuleCardUIProps interface already includes a client prop of type ThirdwebClient, so when components use `Omit<ModuleCardUIProps, "children" | "updateButton">`, they inherit the client prop without needing to add it explicitly.
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-06-30T10:25:29.489Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{tsx,ts} : Server Side Data Fetching: Return typed results (`Project[]`, `User[]`) – avoid `any`
Learnt from: MananTank
PR: thirdweb-dev/js#7177
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/erc20/erc20.tsx:15-17
Timestamp: 2025-05-27T19:54:55.885Z
Learning: The `fetchDashboardContractMetadata` function from "@3rdweb-sdk/react/hooks/useDashboardContractMetadata" has internal error handlers for all promises and cannot throw errors, so external error handling is not needed when calling this function.
Learnt from: MananTank
PR: thirdweb-dev/js#7152
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/tokens/shared-page.tsx:41-48
Timestamp: 2025-05-26T16:28:50.772Z
Learning: The `projectMeta` prop is not required for the server-rendered `ContractTokensPage` component in the tokens shared page, unlike some other shared pages where it's needed for consistency.
Learnt from: AmineAfia
PR: thirdweb-dev/js#7173
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/hooks/useTestWebhook.ts:87-89
Timestamp: 2025-05-27T21:57:57.175Z
Learning: In the webhook testing functionality, error detection using string matching (e.g., checking if error message includes "Failed to send test event") is intentional and based on specific error messages returned by the backend API, not frontend-generated errors.
Learnt from: AmineAfia
PR: thirdweb-dev/js#7173
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/WebhooksTable.tsx:59-73
Timestamp: 2025-05-27T21:57:09.248Z
Learning: In the webhooks functionality, form validation prevents users from reaching test webhook functionality without entering a valid URL, ensuring data integrity before testing operations.
Learnt from: MananTank
PR: thirdweb-dev/js#7177
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/erc20/_components/RecentTransfers.tsx:75-76
Timestamp: 2025-05-27T19:55:53.707Z
Learning: Using array index as React keys is acceptable for skeleton loading rows since they are temporary, fixed-count placeholder elements that don't represent dynamic data and get completely replaced once loading completes. The biome lint rule against array index keys is overly strict in this loading skeleton context.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/components/**/*.{ts,tsx} : For notices & skeletons rely on `AnnouncementBanner`, `GenericLoadingPage`, `EmptyStateCard`.
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-06-30T10:26:04.389Z
Learning: Applies to dashboard/**/layout.tsx : Building layout shells (`layout.tsx`) and top-level pages that mainly assemble data.
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (7)
  • GitHub Check: Lint Packages
  • GitHub Check: Unit Tests
  • GitHub Check: Size
  • GitHub Check: E2E Tests (pnpm, esbuild)
  • GitHub Check: E2E Tests (pnpm, webpack)
  • GitHub Check: Build Packages
  • GitHub Check: Analyze (javascript)
🔇 Additional comments (5)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/contract-webhooks/contract-webhooks-page.tsx (1)

56-56: LGTM!

Good simplification of the component props by passing the entire project object instead of individual properties.

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/components/WebhooksTable.tsx (4)

225-246: Well-implemented deprecation notice!

The deprecation banner clearly communicates the deprecated status and provides a helpful link to the new webhooks section. The styling with amber colors effectively draws attention while maintaining good UX.


172-177: Status column correctly shows deprecated state

Good implementation of the static "Deprecated" badge, replacing the dynamic status logic as intended.


79-91: Consistent muted styling throughout the UI

The text styling changes with text-muted-foreground and reduced opacity effectively convey the deprecated nature of these webhooks.

Also applies to: 98-100, 110-112, 162-162


253-253: Clear title update

The title change from "Webhooks" to "Legacy Webhooks" clearly indicates the deprecated nature of this feature.

@@ -14,7 +13,7 @@ export async function ContractsWebhooksPageContent(props: {
}) {
let webhooks: WebhookResponse[] = [];
let errorMessage = "";
let supportedChainIds: number[] = [];
let _supportedChainIds: number[] = [];
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Remove unused variable assignment

The _supportedChainIds variable is prefixed with an underscore indicating it's unused, but the code still makes an API call to fetch supported chains and assigns the result.

Since this variable is no longer used, remove the entire API call to improve performance:

-  let _supportedChainIds: number[] = [];

And remove the corresponding API call block:

-    const supportedChainsRes = await getSupportedWebhookChains();
-    if ("chains" in supportedChainsRes) {
-      _supportedChainIds = supportedChainsRes.chains;
-    } else {
-      errorMessage = supportedChainsRes.error;
-    }

Also applies to: 30-30

🤖 Prompt for AI Agents
In
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/contract-webhooks/contract-webhooks-page.tsx
around lines 16 and 30, the variable _supportedChainIds is declared and assigned
from an API call but never used. Remove the declaration of _supportedChainIds
and the entire API call block that fetches and assigns supported chains to this
variable to eliminate unnecessary code and improve performance.

Comment on lines +39 to 42
const _client = getClientThirdwebClient({
jwt: props.authToken,
teamId: props.project.teamId,
});
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🛠️ Refactor suggestion

Remove unused client initialization

The _client variable is prefixed with an underscore indicating it's unused, but it's still being initialized.

Remove the unused client initialization to reduce unnecessary computation:

-  const _client = getClientThirdwebClient({
-    jwt: props.authToken,
-    teamId: props.project.teamId,
-  });
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
const _client = getClientThirdwebClient({
jwt: props.authToken,
teamId: props.project.teamId,
});
🤖 Prompt for AI Agents
In
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/contract-webhooks/contract-webhooks-page.tsx
around lines 39 to 42, the variable _client is initialized but never used.
Remove the entire initialization of _client to avoid unnecessary computation and
clean up the code.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Dashboard Involves changes to the Dashboard.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant