feat: dedicated support self-serve #7381
Conversation
|
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
5 Skipped Deployments
|
WalkthroughA new feature for managing dedicated support channels (Slack or Telegram) for teams is introduced. This includes a server-side API to create support channels, a React component to display and configure the channel based on billing plan and ownership, and integration of this component into the team settings UI. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant TeamGeneralSettingsPageUI
participant TeamDedicatedSupportCard
participant API as createDedicatedSupportChannel
User->>TeamGeneralSettingsPageUI: Opens team settings
TeamGeneralSettingsPageUI->>TeamDedicatedSupportCard: Renders with team and ownership props
User->>TeamDedicatedSupportCard: Selects channel type and clicks Save
TeamDedicatedSupportCard->>API: Calls createDedicatedSupportChannel(teamIdOrSlug, channelType)
API-->>TeamDedicatedSupportCard: Returns success or error
TeamDedicatedSupportCard-->>User: Shows success or error toast
Possibly related PRs
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (3)
🚧 Files skipped from review as they are similar to previous changes (3)
⏰ Context from checks skipped due to timeout of 90000ms (8)
✨ Finishing Touches
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed 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)
Other keywords and placeholders
CodeRabbit Configuration File (
|
How to use the Graphite Merge QueueAdd either label to this PR to merge it via the merge queue:
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. |
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #7381 +/- ##
=======================================
Coverage 52.06% 52.06%
=======================================
Files 945 945
Lines 63565 63565
Branches 4208 4208
=======================================
Hits 33098 33098
Misses 30361 30361
Partials 106 106
🚀 New features to boost your workflow:
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (4)
apps/dashboard/src/@/api/dedicated-support.ts (2)
7-14: Add input validation for the teamIdOrSlug parameter.Consider adding basic validation to ensure the
teamIdOrSlugparameter is not empty or contains invalid characters that could cause issues with the API endpoint construction.export async function createDedicatedSupportChannel( teamIdOrSlug: string, channelType: "slack" | "telegram", ): Promise<{ error: string | null }> { + if (!teamIdOrSlug?.trim()) { + return { error: "Team ID or slug is required" }; + } const token = await getAuthToken();
36-36: Consider removing unnecessary response body cancellation.The
res.body?.cancel()call appears unnecessary since the response body is not being consumed in the success case. The response will be garbage collected naturally.- res.body?.cancel(); return { error: null };apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/settings-cards/dedicated-support.tsx (2)
5-5: Remove unused import.The import
{} from "@/components/ui/alert"is not used in the component and should be removed.-import {} from "@/components/ui/alert";
66-86: Consider adding validation for channel data consistency.The component assumes that if
channelTypeexists,channelNamewill also exist. Consider adding validation to handle cases where only one property is present.- if (channelType && channelName) { + if (channelType && channelName) { return ( <SettingsCard header={{ title: "Dedicated Support", description: "Get a dedicated support channel with the thirdweb team.", }} errorText={undefined} noPermissionText={undefined} bottomText={undefined} > <div className="md:w-[450px]"> <p className="text-muted-foreground text-sm"> Your dedicated support channel: <strong>{channelName}</strong> on{" "} {CHANNEL_TYPES.find((c) => c.value === channelType)?.name} </p> </div> </SettingsCard> ); + } + + // Handle inconsistent state where only one property exists + if (channelType || channelName) { + console.warn("Inconsistent dedicated support channel data:", { channelType, channelName }); }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (5)
apps/dashboard/src/@/api/dedicated-support.ts(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/settings-cards/dedicated-support.tsx(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/general/TeamGeneralSettingsPageUI.tsx(2 hunks)apps/dashboard/src/stories/stubs.ts(1 hunks)packages/service-utils/src/core/api.ts(1 hunks)
🧰 Additional context used
🧬 Code Graph Analysis (1)
apps/dashboard/src/@/api/dedicated-support.ts (2)
apps/dashboard/src/app/(app)/api/lib/getAuthToken.ts (1)
getAuthToken(6-14)apps/dashboard/src/@/constants/public-envs.ts (1)
NEXT_PUBLIC_THIRDWEB_API_HOST(18-19)
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: Analyze (javascript)
🔇 Additional comments (6)
packages/service-utils/src/core/api.ts (1)
150-154: LGTM! Well-structured type definition.The new
dedicatedSupportChannelproperty is properly typed with appropriate constraints for the channel types and follows the existing code patterns.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/general/TeamGeneralSettingsPageUI.tsx (2)
20-20: LGTM! Clean import addition.The import follows the existing import patterns and is properly organized.
61-66: LGTM! Well-integrated component usage.The component is properly positioned in the settings layout and receives all necessary props with appropriate optional chaining for the channel properties.
apps/dashboard/src/stories/stubs.ts (1)
113-113: LGTM! Consistent stub data addition.The new property is properly initialized to
null, matching the type definition and providing a sensible default for testing scenarios.apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/settings/_components/settings-cards/dedicated-support.tsx (2)
40-40: LGTM! Proper feature gating logic.The billing plan check correctly restricts the feature to "scale" and "pro" plans as intended.
42-63: LGTM! Well-implemented mutation with proper error handling.The mutation setup includes appropriate success and error handling with user-friendly toast notifications.
arcoraven
force-pushed
the
ph/06-19-feat_dedicated_support_self-serve
branch
from
b41e8c9 to
f9a160c
Compare
...board/src/app/(app)/team/[team_slug]/(team)/~/settings/general/TeamGeneralSettingsPageUI.tsx
Outdated
Show resolved
Hide resolved
size-limit report 📦
|
arcoraven
force-pushed
the
ph/06-19-feat_dedicated_support_self-serve
branch
from
6a1945f to
17cc431
Compare
jnsdls
force-pushed
the
ph/06-19-feat_dedicated_support_self-serve
branch
from
9fe8022 to
e54673f
Compare
jnsdls
force-pushed
the
ph/06-19-feat_dedicated_support_self-serve
branch
from
e54673f to
c220e3d
Compare
jnsdls
force-pushed
the
ph/06-19-feat_dedicated_support_self-serve
branch
from
c220e3d to
5cd8ab0
Compare
jnsdls
force-pushed
the
ph/06-19-feat_dedicated_support_self-serve
branch
from
5cd8ab0 to
63a5da8
Compare
[Dashboard] Feature: Add Dedicated Support Channel for Teams
Screenshots
Already set up
Not on Scale/Pro plan
Eligible to select a support channel
Notes for the reviewer
This PR adds the ability for teams on Pro or Scale plans to create dedicated support channels via Slack or Telegram. The feature includes:
How to test
PR-Codex overview
This PR introduces a new
TeamDedicatedSupportCardcomponent to theTeamGeneralSettingsPageUI, enabling team owners to create dedicated support channels (Slack or Telegram) for their teams. It also adds server-side functionality to handle the support channel creation.Detailed summary
TeamDedicatedSupportCardtoTeamGeneralSettingsPageUI.createDedicatedSupportChannelfunction indedicated-support.tsfor creating support channels.TeamDedicatedSupportCard.Summary by CodeRabbit