WIP
This commit is contained in:
parent
35502c0784
commit
74fd513e44
|
@ -27,6 +27,7 @@ import { useTypedQuery } from "@calcom/lib/hooks/useTypedQuery";
|
||||||
import { HttpError } from "@calcom/lib/http-error";
|
import { HttpError } from "@calcom/lib/http-error";
|
||||||
import { markdownToSafeHTML } from "@calcom/lib/markdownToSafeHTML";
|
import { markdownToSafeHTML } from "@calcom/lib/markdownToSafeHTML";
|
||||||
import { SchedulingType } from "@calcom/prisma/enums";
|
import { SchedulingType } from "@calcom/prisma/enums";
|
||||||
|
import { EventTypeMetaDataSchema } from "@calcom/prisma/zod-utils";
|
||||||
import type { RouterOutputs } from "@calcom/trpc/react";
|
import type { RouterOutputs } from "@calcom/trpc/react";
|
||||||
import { trpc, TRPCClientError } from "@calcom/trpc/react";
|
import { trpc, TRPCClientError } from "@calcom/trpc/react";
|
||||||
import {
|
import {
|
||||||
|
@ -82,7 +83,11 @@ type EventTypeGroupProfile = EventTypeGroups[number]["profile"];
|
||||||
type PaginateEventTypeViewer = RouterOutputs["viewer"]["eventTypes"]["paginate"];
|
type PaginateEventTypeViewer = RouterOutputs["viewer"]["eventTypes"]["paginate"];
|
||||||
|
|
||||||
interface EventTypeListHeadingProps {
|
interface EventTypeListHeadingProps {
|
||||||
profile: EventTypeGroupProfile;
|
profile: {
|
||||||
|
name: string | null;
|
||||||
|
slug?: string | null;
|
||||||
|
username?: string | null;
|
||||||
|
};
|
||||||
membershipCount: number;
|
membershipCount: number;
|
||||||
teamId?: number | null;
|
teamId?: number | null;
|
||||||
orgSlug?: string;
|
orgSlug?: string;
|
||||||
|
@ -374,11 +379,14 @@ export const EventTypeList = ({ data }: EventTypeListProps): JSX.Element => {
|
||||||
<div className="bg-default border-subtle mb-16 flex overflow-hidden rounded-md border">
|
<div className="bg-default border-subtle mb-16 flex overflow-hidden rounded-md border">
|
||||||
<ul ref={parent} className="divide-subtle !static w-full divide-y" data-testid="event-types">
|
<ul ref={parent} className="divide-subtle !static w-full divide-y" data-testid="event-types">
|
||||||
{data.map((eventType, index) => {
|
{data.map((eventType, index) => {
|
||||||
const embedLink = `${eventType?.team?.slug}/${eventType.slug}`;
|
const embedLink = `${eventType?.team?.slug || eventType.users[0].username}/${eventType.slug}`;
|
||||||
const calLink = `${orgBranding?.fullDomain ?? CAL_URL}/${embedLink}`;
|
const calLink = `${orgBranding?.fullDomain ?? CAL_URL}/${embedLink}`;
|
||||||
|
|
||||||
const isManagedEventType = eventType.schedulingType === SchedulingType.MANAGED;
|
const isManagedEventType = eventType.schedulingType === SchedulingType.MANAGED;
|
||||||
|
const eventTypeMetadata = EventTypeMetaDataSchema.safeParse(eventType.metadata);
|
||||||
const isChildrenManagedEventType =
|
const isChildrenManagedEventType =
|
||||||
eventType.metadata?.managedEventConfig !== undefined &&
|
eventTypeMetadata.success &&
|
||||||
|
eventTypeMetadata.data?.managedEventConfig !== undefined &&
|
||||||
eventType.schedulingType !== SchedulingType.MANAGED;
|
eventType.schedulingType !== SchedulingType.MANAGED;
|
||||||
return (
|
return (
|
||||||
<li key={eventType.id}>
|
<li key={eventType.id}>
|
||||||
|
@ -717,12 +725,13 @@ const EventTypeListHeading = ({
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
const bookerUrl = useBookerUrl();
|
const bookerUrl = useBookerUrl();
|
||||||
|
const slug = profile?.slug || profile?.username;
|
||||||
return (
|
return (
|
||||||
<div className="mb-4 flex items-center space-x-2">
|
<div className="mb-4 flex items-center space-x-2">
|
||||||
<Avatar
|
<Avatar
|
||||||
alt={profile?.name || ""}
|
alt={profile?.name || ""}
|
||||||
href={teamId ? `/settings/teams/${teamId}/profile` : "/settings/my-account/profile"}
|
href={teamId ? `/settings/teams/${teamId}/profile` : "/settings/my-account/profile"}
|
||||||
imageSrc={`${orgBranding?.fullDomain ?? WEBAPP_URL}/${profile.slug}/avatar.png` || undefined}
|
imageSrc={`${orgBranding?.fullDomain ?? WEBAPP_URL}/${slug}/avatar.png` || undefined}
|
||||||
size="md"
|
size="md"
|
||||||
className="mt-1 inline-flex justify-center"
|
className="mt-1 inline-flex justify-center"
|
||||||
/>
|
/>
|
||||||
|
@ -732,7 +741,7 @@ const EventTypeListHeading = ({
|
||||||
className="text-emphasis font-bold">
|
className="text-emphasis font-bold">
|
||||||
{profile?.name || ""}
|
{profile?.name || ""}
|
||||||
</Link>
|
</Link>
|
||||||
{membershipCount && teamId && (
|
{membershipCount >= 0 && teamId && (
|
||||||
<span className="text-subtle relative -top-px me-2 ms-2 text-xs">
|
<span className="text-subtle relative -top-px me-2 ms-2 text-xs">
|
||||||
<Link href={`/settings/teams/${teamId}/members`}>
|
<Link href={`/settings/teams/${teamId}/members`}>
|
||||||
<Badge variant="gray">
|
<Badge variant="gray">
|
||||||
|
@ -742,15 +751,15 @@ const EventTypeListHeading = ({
|
||||||
</Link>
|
</Link>
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
{profile?.slug && (
|
{slug && (
|
||||||
<Link
|
<Link
|
||||||
href={`${orgBranding ? orgBranding.fullDomain : CAL_URL}/${profile.slug}`}
|
href={`${orgBranding ? orgBranding.fullDomain : CAL_URL}/${slug}`}
|
||||||
className="text-subtle block text-xs">
|
className="text-subtle block text-xs">
|
||||||
{`${bookerUrl.replace("https://", "").replace("http://", "")}/${profile.slug}`}
|
{`${bookerUrl.replace("https://", "").replace("http://", "")}/${slug}`}
|
||||||
</Link>
|
</Link>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
{!profile?.slug && !!teamId && (
|
{!slug && !!teamId && (
|
||||||
<button onClick={() => publishTeamMutation.mutate({ teamId })}>
|
<button onClick={() => publishTeamMutation.mutate({ teamId })}>
|
||||||
<Badge variant="gray" className="-ml-2 mb-1">
|
<Badge variant="gray" className="-ml-2 mb-1">
|
||||||
{t("upgrade")}
|
{t("upgrade")}
|
||||||
|
@ -873,50 +882,48 @@ const Main = ({
|
||||||
const isFilteredByOnlyOneItem = false;
|
const isFilteredByOnlyOneItem = false;
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{/* {data?.length > 1 || isFilteredByOnlyOneItem ? (
|
{data?.length > 1 || isFilteredByOnlyOneItem ? (
|
||||||
<>
|
<>
|
||||||
{isMobile ? (
|
{isMobile ? (
|
||||||
<MobileTeamsTab eventTypeGroups={data} />
|
<MobileTeamsTab eventTypeGroups={data} />
|
||||||
) : (
|
) : (
|
||||||
data.map((group: EventTypeGroup, index: number) => (
|
<div className="flex flex-col">
|
||||||
<div className="flex flex-col" key={group.profile.slug}>
|
|
||||||
<EventTypeListHeading
|
<EventTypeListHeading
|
||||||
profile={group.profile}
|
profile={data[0].users[0] || data[0].team}
|
||||||
membershipCount={group.metadata.membershipCount}
|
membershipCount={data[0].team?.members.length || 0}
|
||||||
teamId={group.teamId}
|
teamId={data[0].teamId}
|
||||||
orgSlug={orgBranding?.slug}
|
orgSlug={orgBranding?.slug}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{group.eventTypes.length ? (
|
{data[0].length > 0 ? (
|
||||||
<EventTypeList
|
<EventTypeList
|
||||||
types={group.eventTypes}
|
data={data}
|
||||||
group={group}
|
// group={group}
|
||||||
groupIndex={index}
|
// groupIndex={index}
|
||||||
readOnly={group.metadata.readOnly}
|
readOnly={false}
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<EmptyEventTypeList group={group} />
|
<EmptyEventTypeList group={group} />
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
))
|
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
data?.length === 1 && (
|
data?.length === 1 && (
|
||||||
<EventTypeList
|
|
||||||
types={data?.eventTypeGroups[0].eventTypes}
|
|
||||||
group={data?.eventTypeGroups[0]}
|
|
||||||
groupIndex={0}
|
|
||||||
readOnly={data.eventTypeGroups[0].metadata.readOnly}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
)} */}
|
|
||||||
<EventTypeList
|
<EventTypeList
|
||||||
data={data}
|
data={data}
|
||||||
// group={data?.eventTypeGroups[0]}
|
// group={data?.eventTypeGroups[0]}
|
||||||
// groupIndex={0}
|
// groupIndex={0}
|
||||||
readOnly={false}
|
readOnly={false}
|
||||||
/>
|
/>
|
||||||
|
)
|
||||||
|
)}
|
||||||
|
{/* <EventTypeList
|
||||||
|
data={data}
|
||||||
|
// group={data?.eventTypeGroups[0]}
|
||||||
|
// groupIndex={0}
|
||||||
|
readOnly={false}
|
||||||
|
/> */}
|
||||||
{data.length === 0 && <CreateFirstEventTypeView />}
|
{data.length === 0 && <CreateFirstEventTypeView />}
|
||||||
<EventTypeEmbedDialog />
|
<EventTypeEmbedDialog />
|
||||||
{searchParams?.get("dialog") === "duplicate" && <DuplicateDialog />}
|
{searchParams?.get("dialog") === "duplicate" && <DuplicateDialog />}
|
||||||
|
@ -943,7 +950,7 @@ const EventTypesPage = () => {
|
||||||
const { data, status, error } = trpc.viewer.eventTypes.paginate.useQuery(
|
const { data, status, error } = trpc.viewer.eventTypes.paginate.useQuery(
|
||||||
{
|
{
|
||||||
page: 1,
|
page: 1,
|
||||||
pageSize: 20,
|
pageSize: 10,
|
||||||
teamIds: filters?.teamIds,
|
teamIds: filters?.teamIds,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -953,6 +960,10 @@ const EventTypesPage = () => {
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const eventTypePaginate = trpc.useQueries((t) =>
|
||||||
|
filters?.teamIds.map((id) => t.viewer.eventTypes.paginate({ page: 1, pageSize: 10, teamIds: [id] }))
|
||||||
|
);
|
||||||
|
|
||||||
function closeBanner() {
|
function closeBanner() {
|
||||||
setShowProfileBanner(false);
|
setShowProfileBanner(false);
|
||||||
document.cookie = `calcom-profile-banner=1;max-age=${60 * 60 * 24 * 90}`; // 3 months
|
document.cookie = `calcom-profile-banner=1;max-age=${60 * 60 * 24 * 90}`; // 3 months
|
||||||
|
|
Loading…
Reference in New Issue
Block a user