Fix type errors
This commit is contained in:
parent
027a036765
commit
63b4c9fa2d
@ -9,16 +9,7 @@ import { useLocale } from "@calcom/lib/hooks/useLocale";
|
|||||||
import { trpc } from "@calcom/trpc/react";
|
import { trpc } from "@calcom/trpc/react";
|
||||||
import { Button } from "@calcom/ui/v2";
|
import { Button } from "@calcom/ui/v2";
|
||||||
|
|
||||||
const PurchaseNewTeam = ({
|
const PurchaseNewTeam = ({ total, newTeamData }: { total: number; newTeamData: NewTeamData }) => {
|
||||||
total,
|
|
||||||
newTeamData,
|
|
||||||
}: {
|
|
||||||
paymentIntent: string;
|
|
||||||
clientSecret: string;
|
|
||||||
total: number;
|
|
||||||
billingFrequency: string;
|
|
||||||
newTeamData: NewTeamData;
|
|
||||||
}) => {
|
|
||||||
const { t } = useLocale();
|
const { t } = useLocale();
|
||||||
const [errorMessage, setErrorMessage] = useState("");
|
const [errorMessage, setErrorMessage] = useState("");
|
||||||
const [paymentProcessing, setPaymentProcessing] = useState(false);
|
const [paymentProcessing, setPaymentProcessing] = useState(false);
|
||||||
|
@ -1,18 +1,23 @@
|
|||||||
import { Elements, useElements } from "@stripe/react-stripe-js";
|
import { MembershipRole } from "@prisma/client";
|
||||||
|
import { Elements } from "@stripe/react-stripe-js";
|
||||||
import { loadStripe } from "@stripe/stripe-js";
|
import { loadStripe } from "@stripe/stripe-js";
|
||||||
import Head from "next/head";
|
import Head from "next/head";
|
||||||
import { useRouter } from "next/router";
|
import { useRouter } from "next/router";
|
||||||
import { useState, useEffect } from "react";
|
import { useState } from "react";
|
||||||
import { Toaster } from "react-hot-toast";
|
import { Toaster } from "react-hot-toast";
|
||||||
import { z } from "zod";
|
import { z } from "zod";
|
||||||
|
|
||||||
// import TeamGeneralSettings from "@calcom/features/teams/createNewTeam/TeamGeneralSettings";
|
// import TeamGeneralSettings from "@calcom/features/teams/createNewTeam/TeamGeneralSettings";
|
||||||
import AddNewTeamMembers from "@calcom/features/ee/teams/components/v2/AddNewTeamMembers";
|
import AddNewTeamMembers from "@calcom/features/ee/teams/components/v2/AddNewTeamMembers";
|
||||||
import CreateNewTeam from "@calcom/features/ee/teams/components/v2/CreateNewTeam";
|
import CreateNewTeam from "@calcom/features/ee/teams/components/v2/CreateNewTeam";
|
||||||
import { NewTeamFormValues, PendingMember, NewTeamData } from "@calcom/features/ee/teams/lib/types";
|
import {
|
||||||
|
NewTeamFormValues,
|
||||||
|
PendingMember,
|
||||||
|
NewTeamData,
|
||||||
|
TeamPrices,
|
||||||
|
} from "@calcom/features/ee/teams/lib/types";
|
||||||
import { STRIPE_PUBLISHABLE_KEY } from "@calcom/lib/constants";
|
import { STRIPE_PUBLISHABLE_KEY } from "@calcom/lib/constants";
|
||||||
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
||||||
import { localStorage } from "@calcom/lib/webstorage";
|
|
||||||
import { trpc } from "@calcom/trpc/react";
|
import { trpc } from "@calcom/trpc/react";
|
||||||
|
|
||||||
import { StepCard } from "@components/getting-started/components/StepCard";
|
import { StepCard } from "@components/getting-started/components/StepCard";
|
||||||
@ -38,6 +43,18 @@ const stepRouteSchema = z.object({
|
|||||||
step: z.array(z.enum(steps)).default([INITIAL_STEP]),
|
step: z.array(z.enum(steps)).default([INITIAL_STEP]),
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const defaultMember = [
|
||||||
|
{
|
||||||
|
name: "",
|
||||||
|
email: "",
|
||||||
|
username: "",
|
||||||
|
id: 0,
|
||||||
|
role: "MEMBER" as MembershipRole,
|
||||||
|
avatar: null,
|
||||||
|
sendInviteEmail: false,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
const CreateNewTeamPage = () => {
|
const CreateNewTeamPage = () => {
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const [newTeamData, setNewTeamData] = useState<NewTeamData>({
|
const [newTeamData, setNewTeamData] = useState<NewTeamData>({
|
||||||
@ -48,10 +65,12 @@ const CreateNewTeamPage = () => {
|
|||||||
billingFrequency: "monthly",
|
billingFrequency: "monthly",
|
||||||
});
|
});
|
||||||
const [clientSecret, setClientSecret] = useState("");
|
const [clientSecret, setClientSecret] = useState("");
|
||||||
const [paymentIntent, setPaymentIntent] = useState("");
|
const [teamPrices, setTeamPrices] = useState({
|
||||||
const [teamPrices, setTeamPrices] = useState({});
|
monthly: 0,
|
||||||
|
yearly: 0,
|
||||||
|
});
|
||||||
|
|
||||||
const { t, i18n } = useLocale();
|
const { t } = useLocale();
|
||||||
|
|
||||||
const result = stepRouteSchema.safeParse(router.query);
|
const result = stepRouteSchema.safeParse(router.query);
|
||||||
const currentStep = result.success ? result.data.step[0] : INITIAL_STEP;
|
const currentStep = result.success ? result.data.step[0] : INITIAL_STEP;
|
||||||
@ -88,14 +107,14 @@ const CreateNewTeamPage = () => {
|
|||||||
const currentStepIndex = steps.indexOf(currentStep);
|
const currentStepIndex = steps.indexOf(currentStep);
|
||||||
|
|
||||||
const createPaymentIntentMutation = trpc.useMutation(["viewer.teams.createPaymentIntent"], {
|
const createPaymentIntentMutation = trpc.useMutation(["viewer.teams.createPaymentIntent"], {
|
||||||
onSuccess: (data) => {
|
onSuccess: (data: { clientSecret: string }) => {
|
||||||
setClientSecret(data.clientSecret);
|
setClientSecret(data.clientSecret);
|
||||||
goToIndex(2);
|
goToIndex(2);
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const getTeamPricesQuery = trpc.useQuery(["viewer.teams.getTeamPrices"], {
|
const getTeamPricesQuery = trpc.useQuery(["viewer.teams.getTeamPrices"], {
|
||||||
onSuccess: (data) => {
|
onSuccess: (data: TeamPrices) => {
|
||||||
setTeamPrices(data);
|
setTeamPrices(data);
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@ -131,7 +150,7 @@ const CreateNewTeamPage = () => {
|
|||||||
{currentStep === "create-a-new-team" && (
|
{currentStep === "create-a-new-team" && (
|
||||||
<CreateNewTeam
|
<CreateNewTeam
|
||||||
nextStep={(values: NewTeamFormValues) => {
|
nextStep={(values: NewTeamFormValues) => {
|
||||||
setNewTeamData({ ...values, members: [] });
|
setNewTeamData({ ...values, members: defaultMember, billingFrequency: "monthly" });
|
||||||
goToIndex(1);
|
goToIndex(1);
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
@ -148,7 +167,6 @@ const CreateNewTeamPage = () => {
|
|||||||
members: PendingMember[];
|
members: PendingMember[];
|
||||||
billingFrequency: "monthly" | "yearly";
|
billingFrequency: "monthly" | "yearly";
|
||||||
}) => {
|
}) => {
|
||||||
console.log("🚀 ~ file: [[...step]].tsx ~ line 148 ~ CreateNewTeamPage ~ values", values);
|
|
||||||
createPaymentIntentMutation.mutate({
|
createPaymentIntentMutation.mutate({
|
||||||
teamName: newTeamData.name,
|
teamName: newTeamData.name,
|
||||||
billingFrequency: values.billingFrequency,
|
billingFrequency: values.billingFrequency,
|
||||||
@ -166,8 +184,6 @@ const CreateNewTeamPage = () => {
|
|||||||
{currentStep === "purchase-new-team" && (
|
{currentStep === "purchase-new-team" && (
|
||||||
<Elements stripe={stripe} options={{ clientSecret }}>
|
<Elements stripe={stripe} options={{ clientSecret }}>
|
||||||
<PurchaseNewTeam
|
<PurchaseNewTeam
|
||||||
paymentIntent={paymentIntent}
|
|
||||||
clientSecret={clientSecret}
|
|
||||||
total={
|
total={
|
||||||
newTeamData.members.length *
|
newTeamData.members.length *
|
||||||
teamPrices[newTeamData.billingFrequency as keyof typeof teamPrices]
|
teamPrices[newTeamData.billingFrequency as keyof typeof teamPrices]
|
||||||
|
@ -1,5 +1,4 @@
|
|||||||
import { useSession } from "next-auth/react";
|
import { useSession } from "next-auth/react";
|
||||||
import { useRouter } from "next/router";
|
|
||||||
import { useState, useEffect } from "react";
|
import { useState, useEffect } from "react";
|
||||||
import { useForm, Controller, useFieldArray } from "react-hook-form";
|
import { useForm, Controller, useFieldArray } from "react-hook-form";
|
||||||
|
|
||||||
@ -7,14 +6,13 @@ import MemberInvitationModal from "@calcom/features/ee/teams/components/MemberIn
|
|||||||
import { classNames } from "@calcom/lib";
|
import { classNames } from "@calcom/lib";
|
||||||
import { WEBAPP_URL } from "@calcom/lib/constants";
|
import { WEBAPP_URL } from "@calcom/lib/constants";
|
||||||
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
import { useLocale } from "@calcom/lib/hooks/useLocale";
|
||||||
import { localStorage } from "@calcom/lib/webstorage";
|
|
||||||
import { trpc } from "@calcom/trpc/react";
|
import { trpc } from "@calcom/trpc/react";
|
||||||
import { Icon } from "@calcom/ui";
|
import { Icon } from "@calcom/ui";
|
||||||
import { Avatar, Badge, Button, showToast, Switch } from "@calcom/ui/v2/core";
|
import { Avatar, Badge, Button, showToast, Switch } from "@calcom/ui/v2/core";
|
||||||
import { Form } from "@calcom/ui/v2/core/form";
|
import { Form } from "@calcom/ui/v2/core/form";
|
||||||
import { SkeletonContainer, SkeletonText, SkeletonAvatar } from "@calcom/ui/v2/core/skeleton";
|
import { SkeletonContainer, SkeletonText, SkeletonAvatar } from "@calcom/ui/v2/core/skeleton";
|
||||||
|
|
||||||
import { NewTeamMembersFieldArray, PendingMember } from "../../lib/types";
|
import { PendingMember, TeamPrices } from "../../lib/types";
|
||||||
import { NewMemberForm } from "../MemberInvitationModal";
|
import { NewMemberForm } from "../MemberInvitationModal";
|
||||||
|
|
||||||
const AddNewTeamMembers = ({
|
const AddNewTeamMembers = ({
|
||||||
@ -22,14 +20,10 @@ const AddNewTeamMembers = ({
|
|||||||
teamPrices,
|
teamPrices,
|
||||||
}: {
|
}: {
|
||||||
nextStep: (values: { members: PendingMember[]; billingFrequency: "monthly" | "yearly" }) => void;
|
nextStep: (values: { members: PendingMember[]; billingFrequency: "monthly" | "yearly" }) => void;
|
||||||
teamPrices: {
|
teamPrices: TeamPrices;
|
||||||
monthly: number;
|
|
||||||
yearly: number;
|
|
||||||
};
|
|
||||||
}) => {
|
}) => {
|
||||||
const { t } = useLocale();
|
const { t } = useLocale();
|
||||||
const session = useSession();
|
const session = useSession();
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
const [memberInviteModal, setMemberInviteModal] = useState(false);
|
const [memberInviteModal, setMemberInviteModal] = useState(false);
|
||||||
const [inviteMemberInput, setInviteMemberInput] = useState<NewMemberForm>({
|
const [inviteMemberInput, setInviteMemberInput] = useState<NewMemberForm>({
|
||||||
|
@ -1,3 +1,5 @@
|
|||||||
|
import { MembershipRole } from "@prisma/client";
|
||||||
|
|
||||||
export interface NewTeamMembersFieldArray {
|
export interface NewTeamMembersFieldArray {
|
||||||
members: PendingMember[];
|
members: PendingMember[];
|
||||||
}
|
}
|
||||||
@ -13,10 +15,15 @@ export interface PendingMember {
|
|||||||
email: string;
|
email: string;
|
||||||
id?: number;
|
id?: number;
|
||||||
username: string | null;
|
username: string | null;
|
||||||
role: "OWNER" | "ADMIN" | "MEMBER";
|
role: MembershipRole;
|
||||||
avatar: string | null;
|
avatar: string | null;
|
||||||
sendInviteEmail?: boolean;
|
sendInviteEmail?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export type NewTeamData = NewTeamFormValues &
|
export type NewTeamData = NewTeamFormValues &
|
||||||
NewTeamMembersFieldArray & { billingFrequency: "monthly" | "yearly" };
|
NewTeamMembersFieldArray & { billingFrequency: "monthly" | "yearly" };
|
||||||
|
|
||||||
|
export interface TeamPrices {
|
||||||
|
monthly: number;
|
||||||
|
yearly: number;
|
||||||
|
}
|
||||||
|
@ -697,7 +697,6 @@ export const viewerTeamsRouter = createProtectedRouter()
|
|||||||
seats: z.number(),
|
seats: z.number(),
|
||||||
}),
|
}),
|
||||||
async resolve({ ctx, input }) {
|
async resolve({ ctx, input }) {
|
||||||
console.log("🚀 ~ file: teams.tsx ~ line 699 ~ resolve ~ input", input);
|
|
||||||
// First create the customer
|
// First create the customer
|
||||||
const customer = await createTeamCustomer(input.teamName, ctx.user.email);
|
const customer = await createTeamCustomer(input.teamName, ctx.user.email);
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user