* feat: add delayed formbricks tracking for feature opt-in Adds delayed Formbricks survey tracking for feature opt-in. When a user opts into a feature, this allows triggering a Formbricks action after a configurable delay (e.g., 24 hours later) to collect feedback once they've had time to use the feature. Key changes: - Added `formbricks` config option to `OptInFeatureConfig` interface with `actionName` and `delayMs` properties - Created `useFormbricksOptInTracking` hook that handles the delayed tracking logic - Added `isFeatureTracked` / `setFeatureTracked` storage helpers to prevent duplicate tracking - Integrated the tracking hook into `useFeatureOptInBanner` Co-Authored-By: Claude Opus 4.5 <[email protected]> * upgrade formbricks * feat: replace formbricks popup with custom feedback dialog Instead of using Formbricks' built-in popup, we now show a custom Cal.com-styled feedback dialog that submits responses directly to Formbricks API via tRPC mutation. - Add FeedbackDialog component with emoji rating selector - Add feedback tRPC router for server-side Formbricks submission - Update useFormbricksOptInTracking to return dialog state - Add survey config fields (surveyId, questions) to config Co-Authored-By: Claude Opus 4.5 <[email protected]> * feat: position feedback dialog at bottom-right corner - Use base-ui Dialog primitives for custom positioning - Position dialog at bottom-right to avoid Intercom overlap - Use z-index 10000 (below Intercom's high z-index) - Keep blocking backdrop for modal behavior - Use i18n keys for title/description - Add survey IDs for bookings-v3 feedback Co-Authored-By: Claude Opus 4.5 <[email protected]> * feat: add i18n keys for feedback dialog title/description Allow each feature to specify custom i18n keys for the feedback dialog title and description via the formbricks config. - Add titleKey/descriptionKey to formbricks config interface - Pass i18n keys through feedbackDialogProps - Add bookings_v3_feedback_title/description translation keys Co-Authored-By: Claude Opus 4.5 <[email protected]> * refactor: move FeedbackDialog into FeatureOptInBannerWrapper Better encapsulation - consumers of the feature opt-in banner no longer need to handle the feedback dialog separately. Co-Authored-By: Claude Opus 4.5 <[email protected]> * feat: add 5 second delay before showing feedback dialog Ensures the page has time to finish loading before showing the feedback dialog, avoiding showing it while skeletons are still visible. Co-Authored-By: Claude Opus 4.5 <[email protected]> * refactor: simplify feedback dialog UI - Remove redundant question labels - Add "(optional)" to comment placeholder Co-Authored-By: Claude Opus 4.5 <[email protected]> * fix: remove emoji button borders and add footer gap - Remove borders from rating emoji buttons - Add proper gap between textarea and footer (pb-4) Co-Authored-By: Claude Opus 4.5 <[email protected]> * fix: delayMs is opt-in waiting period, not setTimeout delay delayMs represents the minimum time that must pass since opt-in before showing the feedback form (e.g., 3 days). If not enough time has passed, we skip showing the form entirely instead of setting a long setTimeout. Co-Authored-By: Claude Opus 4.5 <[email protected]> * feat: custom feedback dialog for feature opt-in - Replace Formbricks popup with Cal.com-styled dialog - Add configurable delay (waitAfterDays) before showing feedback - Position dialog at bottom-right, non-blocking - Add localStorage tracking to prevent duplicate feedback - Add device targeting (showOn: desktop/mobile/all) - Create tRPC endpoint for Formbricks API submission - Use proper logger for error handling Co-Authored-By: Claude Opus 4.5 <[email protected]> * refactor: rename tracking terminology to feedback - Rename useFormbricksOptInTracking → useOptInFeedback - Rename FormbricksOptInTrackingResult → OptInFeedbackState - Rename formbricksTracking property → feedback - Rename FormbricksTrackingState → FeedbackState We no longer "track" events to Formbricks. Instead, we show our custom feedback dialog when conditions are met. Co-Authored-By: Claude Opus 4.5 <[email protected]> * fix: set waitAfterDays to 3 for production feedback delay Co-Authored-By: unknown <> * fix: update formbricks JS SDK usage for v3.0.0 The @formbricks/js SDK v3.0.0 changed its API: - setup() no longer accepts debug, userId, or attributes - Use setUserId() and setAttributes() after setup instead - track() now expects { hiddenFields: ... } or undefined Co-Authored-By: Claude Opus 4.5 <[email protected]> --------- Co-authored-by: Claude Opus 4.5 <[email protected]> Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
43 lines
1.4 KiB
TypeScript
43 lines
1.4 KiB
TypeScript
import { FormbricksAPI } from "@formbricks/api";
|
|
|
|
import type { Feedback } from "@calcom/emails/templates/feedback-email";
|
|
|
|
enum Rating {
|
|
"Extremely unsatisfied" = 1,
|
|
Unsatisfied = 2,
|
|
Satisfied = 3,
|
|
"Extremely satisfied" = 4,
|
|
}
|
|
|
|
export const sendFeedbackFormbricks = async (userId: number, feedback: Feedback) => {
|
|
if (!process.env.NEXT_PUBLIC_FORMBRICKS_HOST_URL || !process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID)
|
|
throw new Error("Missing FORMBRICKS_HOST_URL or FORMBRICKS_ENVIRONMENT_ID env variable");
|
|
const api = new FormbricksAPI({
|
|
apiHost: process.env.NEXT_PUBLIC_FORMBRICKS_HOST_URL,
|
|
environmentId: process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID,
|
|
});
|
|
if (process.env.FORMBRICKS_FEEDBACK_SURVEY_ID) {
|
|
const formbricksUserId = userId.toString();
|
|
const ratingValue = Object.keys(Rating).includes(feedback.rating)
|
|
? Rating[feedback.rating as keyof typeof Rating]
|
|
: undefined;
|
|
if (ratingValue === undefined) throw new Error("Invalid rating value");
|
|
|
|
await api.client.response.create({
|
|
surveyId: process.env.FORMBRICKS_FEEDBACK_SURVEY_ID,
|
|
userId: formbricksUserId,
|
|
finished: true,
|
|
data: {
|
|
"formbricks-share-comments-question": feedback.comment,
|
|
"formbricks-rating-question": ratingValue,
|
|
},
|
|
});
|
|
await api.client.people.update(formbricksUserId, {
|
|
attributes: {
|
|
email: feedback.email,
|
|
username: feedback.username,
|
|
},
|
|
});
|
|
}
|
|
};
|