diff --git a/.env.example b/.env.example index ea6231b16cd518..55cd9899706b11 100644 --- a/.env.example +++ b/.env.example @@ -214,6 +214,8 @@ STRIPE_TEAM_PRODUCT_ID= # It is a price ID in the product with id STRIPE_ORG_PRODUCT_ID STRIPE_ORG_MONTHLY_PRICE_ID= STRIPE_ORG_PRODUCT_ID= +# Used to pass trial days for orgs during the Stripe checkout session +STRIPE_ORG_TRIAL_DAYS= STRIPE_WEBHOOK_SECRET= STRIPE_WEBHOOK_SECRET_APPS= diff --git a/apps/web/modules/settings/organizations/new/_components/OrganizationWizardLayout.tsx b/apps/web/modules/settings/organizations/new/_components/OrganizationWizardLayout.tsx new file mode 100644 index 00000000000000..adee177bccf3c7 --- /dev/null +++ b/apps/web/modules/settings/organizations/new/_components/OrganizationWizardLayout.tsx @@ -0,0 +1,35 @@ +"use client"; + +import { useLocale } from "@calcom/lib/hooks/useLocale"; +import { Alert } from "@calcom/ui/components/alert"; +import { WizardLayout } from "@calcom/ui/components/layout"; + +interface OrganizationWizardLayoutProps { + children: React.ReactNode; + currentStep: number; + maxSteps?: number; + isOptionalCallback?: () => void; + footer?: React.ReactNode; +} + +export function OrganizationWizardLayout({ + children, + currentStep, + maxSteps = 5, + isOptionalCallback, + footer, +}: OrganizationWizardLayoutProps) { + const { t } = useLocale(); + + const defaultFooter = ; + + return ( + + {children} + + ); +} diff --git a/apps/web/modules/settings/organizations/new/about-view.tsx b/apps/web/modules/settings/organizations/new/about-view.tsx index c1d58b30814180..385d50a0841d2b 100644 --- a/apps/web/modules/settings/organizations/new/about-view.tsx +++ b/apps/web/modules/settings/organizations/new/about-view.tsx @@ -1,14 +1,11 @@ "use client"; import { AboutOrganizationForm } from "@calcom/features/ee/organizations/components"; -import { WizardLayout } from "@calcom/ui/components/layout"; + +import { OrganizationWizardLayout } from "./_components/OrganizationWizardLayout"; export const LayoutWrapper = ({ children }: { children: React.ReactNode }) => { - return ( - - {children} - - ); + return {children}; }; export default AboutOrganizationForm; diff --git a/apps/web/modules/settings/organizations/new/add-teams-view.tsx b/apps/web/modules/settings/organizations/new/add-teams-view.tsx index 5c471bef9dcdaa..0130e843deb4d3 100644 --- a/apps/web/modules/settings/organizations/new/add-teams-view.tsx +++ b/apps/web/modules/settings/organizations/new/add-teams-view.tsx @@ -1,15 +1,10 @@ "use client"; -import { WizardLayout } from "@calcom/ui/components/layout"; - import { AddNewTeamsForm } from "./_components/AddNewTeamsForm"; +import { OrganizationWizardLayout } from "./_components/OrganizationWizardLayout"; export const LayoutWrapper = ({ children }: { children: React.ReactNode }) => { - return ( - - {children} - - ); + return {children}; }; export default AddNewTeamsForm; diff --git a/apps/web/modules/settings/organizations/new/create-new-view.tsx b/apps/web/modules/settings/organizations/new/create-new-view.tsx index 395669b427df0a..0c479838353573 100644 --- a/apps/web/modules/settings/organizations/new/create-new-view.tsx +++ b/apps/web/modules/settings/organizations/new/create-new-view.tsx @@ -3,9 +3,10 @@ import { CreateANewOrganizationForm } from "@calcom/features/ee/organizations/components"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { Alert } from "@calcom/ui/components/alert"; -import { WizardLayout } from "@calcom/ui/components/layout"; import { useGetUserAttributes } from "@calcom/web/components/settings/platform/hooks/useGetUserAttributes"; +import { OrganizationWizardLayout } from "./_components/OrganizationWizardLayout"; + export const LayoutWrapper = ({ children }: { children: React.ReactNode }) => { const { t } = useLocale(); const { isPlatformUser } = useGetUserAttributes(); @@ -20,11 +21,7 @@ export const LayoutWrapper = ({ children }: { children: React.ReactNode }) => { ); } - return ( - - {children} - - ); + return {children}; }; export default CreateANewOrganizationForm; diff --git a/apps/web/modules/settings/organizations/new/onboard-members-view.tsx b/apps/web/modules/settings/organizations/new/onboard-members-view.tsx index cfb7417609fe69..293451e158a8d6 100644 --- a/apps/web/modules/settings/organizations/new/onboard-members-view.tsx +++ b/apps/web/modules/settings/organizations/new/onboard-members-view.tsx @@ -1,15 +1,10 @@ "use client"; -import { WizardLayout } from "@calcom/ui/components/layout"; - import AddNewTeamMembers from "./_components/OnboardMembersView"; +import { OrganizationWizardLayout } from "./_components/OrganizationWizardLayout"; export const LayoutWrapper = ({ children }: { children: React.ReactNode }) => { - return ( - - {children} - - ); + return {children}; }; export default AddNewTeamMembers; diff --git a/apps/web/modules/settings/organizations/new/payment-status-view.tsx b/apps/web/modules/settings/organizations/new/payment-status-view.tsx index 47f9ebd0bb054f..4fb5c57d1111f4 100644 --- a/apps/web/modules/settings/organizations/new/payment-status-view.tsx +++ b/apps/web/modules/settings/organizations/new/payment-status-view.tsx @@ -1,15 +1,11 @@ "use client"; -import { WizardLayout } from "@calcom/ui/components/layout"; - import PaymentStatusView from "~/settings/organizations/new/_components/PaymentStatusView"; +import { OrganizationWizardLayout } from "./_components/OrganizationWizardLayout"; + export const LayoutWrapper = ({ children }: { children: React.ReactNode }) => { - return ( - - {children} - - ); + return {children}; }; export default PaymentStatusView; diff --git a/apps/web/modules/settings/organizations/new/resume-view.tsx b/apps/web/modules/settings/organizations/new/resume-view.tsx index 84fe7b9fab679b..f692b878cdd6c1 100644 --- a/apps/web/modules/settings/organizations/new/resume-view.tsx +++ b/apps/web/modules/settings/organizations/new/resume-view.tsx @@ -6,15 +6,12 @@ import { useEffect } from "react"; import { useOnboarding } from "@calcom/features/ee/organizations/lib/onboardingStore"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { Alert } from "@calcom/ui/components/alert"; -import { WizardLayout } from "@calcom/ui/components/layout"; import { SkeletonContainer, SkeletonText } from "@calcom/ui/components/skeleton"; +import { OrganizationWizardLayout } from "./_components/OrganizationWizardLayout"; + export const LayoutWrapper = ({ children }: { children: React.ReactNode }) => { - return ( - - {children} - - ); + return {children}; }; const ResumeOnboardingView = () => { diff --git a/apps/web/public/static/locales/en/common.json b/apps/web/public/static/locales/en/common.json index 305cc183672405..34643b62a334af 100644 --- a/apps/web/public/static/locales/en/common.json +++ b/apps/web/public/static/locales/en/common.json @@ -2501,6 +2501,7 @@ "currency": "Currency", "organization_banner_description": "Create an environment where your teams can create shared apps, workflows and event types with round-robin and collective scheduling.", "organization_banner_title": "Manage organizations with multiple teams", + "organization_trial_workspace_warning": "This trial uses the Organizations workspace structure. Your current data will move with you into Organizations, but it won't transfer back if you switch to Teams later. If you prefer Teams again in the future, you can create a new team.", "set_up_your_organization": "Set up your organization", "set_up_your_platform_organization": "Set up your platform", "organizations_description": "Organizations are shared environments where teams can create shared event types, apps, workflows and more.", diff --git a/packages/features/ee/organizations/components/CreateANewOrganizationForm.tsx b/packages/features/ee/organizations/components/CreateANewOrganizationForm.tsx index eb2afa6ced2b07..0d4fb27f0176fb 100644 --- a/packages/features/ee/organizations/components/CreateANewOrganizationForm.tsx +++ b/packages/features/ee/organizations/components/CreateANewOrganizationForm.tsx @@ -25,11 +25,8 @@ import { RadioAreaGroup as RadioArea } from "@calcom/ui/components/radio"; import { useOnboarding } from "../lib/onboardingStore"; function extractDomainFromEmail(email: string) { - let out = ""; - try { - const match = email.match(/^(?:.*?:\/\/)?.*?([\w\-]*(?:\.\w{2,}|\.\w{2,}\.\w{2}))(?:[\/?#:]|$)/); - out = (match && match[1]) ?? ""; - } catch (ignore) {} + const match = email.match(/^(?:.*?:\/\/)?.*?([\w-]*(?:\.\w{2,}|\.\w{2,}\.\w{2}))(?:[/?#:]|$)/); + const out = (match && match[1]) ?? ""; return out.split(".")[0]; } diff --git a/packages/features/ee/organizations/lib/OrganizationPaymentService.ts b/packages/features/ee/organizations/lib/OrganizationPaymentService.ts index 639be238de70ab..334f960dccf0a0 100644 --- a/packages/features/ee/organizations/lib/OrganizationPaymentService.ts +++ b/packages/features/ee/organizations/lib/OrganizationPaymentService.ts @@ -5,6 +5,7 @@ import { ORGANIZATION_SELF_SERVE_MIN_SEATS, ORGANIZATION_SELF_SERVE_PRICE, WEBAPP_URL, + ORG_TRIAL_DAYS, } from "@calcom/lib/constants"; import logger from "@calcom/lib/logger"; import { safeStringify } from "@calcom/lib/safeStringify"; @@ -277,6 +278,13 @@ export class OrganizationPaymentService { organizationOnboardingId, }) ); + + const subscriptionData = ORG_TRIAL_DAYS + ? { + trial_period_days: ORG_TRIAL_DAYS, + } + : undefined; + return this.billingService.createSubscriptionCheckout({ customerId: stripeCustomerId, successUrl: `${WEBAPP_URL}/settings/organizations/new/status?session_id={CHECKOUT_SESSION_ID}&paymentStatus=success&${params.toString()}`, @@ -289,6 +297,7 @@ export class OrganizationPaymentService { pricePerSeat: config.pricePerSeat, billingPeriod: config.billingPeriod, }, + ...(subscriptionData && { subscriptionData }), }); } diff --git a/packages/features/ee/teams/lib/payments.ts b/packages/features/ee/teams/lib/payments.ts index 79111c9af1035b..1c6129a049f9d5 100644 --- a/packages/features/ee/teams/lib/payments.ts +++ b/packages/features/ee/teams/lib/payments.ts @@ -10,6 +10,7 @@ import { ORGANIZATION_SELF_SERVE_MIN_SEATS, ORGANIZATION_SELF_SERVE_PRICE, WEBAPP_URL, + ORG_TRIAL_DAYS, } from "@calcom/lib/constants"; import logger from "@calcom/lib/logger"; import { safeStringify } from "@calcom/lib/safeStringify"; @@ -198,6 +199,7 @@ export const purchaseTeamOrOrgSubscription = async (input: { teamId, dubCustomerId: userId, }, + ...(isOrg && ORG_TRIAL_DAYS && { trial_period_days: ORG_TRIAL_DAYS }), }, }); return { url: session.url }; diff --git a/packages/lib/constants.ts b/packages/lib/constants.ts index a797fe80f7aab3..eeb1e1bf953d62 100644 --- a/packages/lib/constants.ts +++ b/packages/lib/constants.ts @@ -254,3 +254,7 @@ export const RETELL_AI_TEST_EVENT_TYPE_MAP = (() => { /* This is an internal environment variable and is not meant to be used by the self-hosters. It is planned to be removed later by either having it as an option in Event Type or by some other customer configurable approaches*/ export const ENV_PAST_BOOKING_RESCHEDULE_CHANGE_TEAM_IDS = process.env._CAL_INTERNAL_PAST_BOOKING_RESCHEDULE_CHANGE_TEAM_IDS; + +export const ORG_TRIAL_DAYS = process.env.STRIPE_ORG_TRIAL_DAYS + ? Math.max(0, parseInt(process.env.STRIPE_ORG_TRIAL_DAYS, 10)) + : null; diff --git a/packages/ui/components/layout/WizardLayout.tsx b/packages/ui/components/layout/WizardLayout.tsx index fddd71782809a1..5506495c73ff0c 100644 --- a/packages/ui/components/layout/WizardLayout.tsx +++ b/packages/ui/components/layout/WizardLayout.tsx @@ -1,6 +1,6 @@ "use client"; -// eslint-disable-next-line no-restricted-imports + import { usePathname } from "next/navigation"; import React, { useEffect, useState } from "react"; import { Toaster } from "sonner"; @@ -18,9 +18,10 @@ export function WizardLayout({ maxSteps = 2, currentStep = 0, isOptionalCallback, + footer, }: { children: React.ReactNode; -} & { maxSteps?: number; currentStep?: number; isOptionalCallback?: () => void }) { +} & { maxSteps?: number; currentStep?: number; isOptionalCallback?: () => void; footer?: React.ReactNode }) { const { t, isLocaleReady } = useLocale(); const [meta, setMeta] = useState({ title: "", subtitle: " " }); const pathname = usePathname(); @@ -60,6 +61,7 @@ export function WizardLayout({ {children} + {footer &&
{footer}
} {isOptionalCallback && ( diff --git a/turbo.json b/turbo.json index 1f3be4b7e5a8f6..73e65bc9a63ffa 100644 --- a/turbo.json +++ b/turbo.json @@ -184,6 +184,7 @@ "STRIPE_TEAM_PRODUCT_ID", "STRIPE_ORG_MONTHLY_PRICE_ID", "STRIPE_ORG_PRODUCT_ID", + "STRIPE_ORG_TRIAL_DAYS", "ORG_MONTHLY_CREDITS", "TANDEM_BASE_URL", "TANDEM_CLIENT_ID", @@ -345,6 +346,7 @@ "ORG_MONTHLY_CREDITS", "STRIPE_ORG_MONTHLY_PRICE_ID", "STRIPE_ORG_PRODUCT_ID", + "STRIPE_ORG_TRIAL_DAYS", "NEXT_PUBLIC_API_V2_URL", "NEXT_PUBLIC_VAPID_PUBLIC_KEY", "NEXT_PUBLIC_SENTRY_DSN_CLIENT",