change request (#9075)

Co-authored-by: gitstart-calcom <gitstart@users.noreply.github.com>
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
Co-authored-by: Bailey Pumfleet <bailey@pumfleet.co.uk>
This commit is contained in:
GitStart-Cal.com 2023-05-30 09:43:24 -06:00 committed by GitHub
parent ea063dd487
commit 93c4211da4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 55 additions and 20 deletions

View File

@ -238,20 +238,34 @@ function EventTypeSingleLayout({
<div className="flex items-center justify-end"> <div className="flex items-center justify-end">
{!eventType.metadata.managedEventConfig && ( {!eventType.metadata.managedEventConfig && (
<> <>
<div className="sm:hover:bg-muted hidden items-center rounded-md px-2 lg:flex"> <div
<Skeleton className={classNames(
as={Label} "sm:hover:bg-muted hidden cursor-pointer items-center rounded-md",
htmlFor="hiddenSwitch" formMethods.watch("hidden") ? "px-2" : "",
className="mt-2 hidden cursor-pointer self-center whitespace-nowrap pr-2 sm:inline"> "lg:flex"
{t("hide_from_profile")} )}>
</Skeleton> {formMethods.watch("hidden") && (
<Switch <Skeleton
id="hiddenSwitch" as={Label}
checked={formMethods.watch("hidden")} htmlFor="hiddenSwitch"
onCheckedChange={(e) => { className="mt-2 hidden cursor-pointer self-center whitespace-nowrap pr-2 sm:inline">
formMethods.setValue("hidden", e); {t("hidden")}
}} </Skeleton>
/> )}
<Tooltip
content={
formMethods.watch("hidden") ? t("show_eventtype_on_profile") : t("hide_from_profile")
}>
<div className="self-center rounded-md p-2">
<Switch
id="hiddenSwitch"
checked={!formMethods.watch("hidden")}
onCheckedChange={(e) => {
formMethods.setValue("hidden", !e);
}}
/>
</div>
</Tooltip>
</div> </div>
<VerticalDivider className="hidden lg:block" /> <VerticalDivider className="hidden lg:block" />
</> </>
@ -344,18 +358,18 @@ function EventTypeSingleLayout({
</DropdownItem> </DropdownItem>
</DropdownMenuItem> </DropdownMenuItem>
<DropdownMenuSeparator /> <DropdownMenuSeparator />
<div className="sm:hover:bg-subtle flex h-9 flex-row items-center justify-between py-2 px-4"> <div className="hover:bg-subtle flex h-9 cursor-pointer flex-row items-center justify-between py-2 px-4">
<Skeleton <Skeleton
as={Label} as={Label}
htmlFor="hiddenSwitch" htmlFor="hiddenSwitch"
className="mt-2 inline cursor-pointer self-center pr-2 "> className="mt-2 inline cursor-pointer self-center pr-2 ">
{t("hide_from_profile")} {formMethods.watch("hidden") ? t("show_eventtype_on_profile") : t("hide_from_profile")}
</Skeleton> </Skeleton>
<Switch <Switch
id="hiddenSwitch" id="hiddenSwitch"
checked={formMethods.watch("hidden")} checked={!formMethods.watch("hidden")}
onCheckedChange={(e) => { onCheckedChange={(e) => {
formMethods.setValue("hidden", e); formMethods.setValue("hidden", !e);
}} }}
/> />
</div> </div>

View File

@ -42,6 +42,8 @@ import {
CreateButton, CreateButton,
HorizontalTabs, HorizontalTabs,
HeadSeo, HeadSeo,
Skeleton,
Label,
} from "@calcom/ui"; } from "@calcom/ui";
import { import {
ArrowDown, ArrowDown,
@ -416,7 +418,8 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
{!isManagedEventType && ( {!isManagedEventType && (
<> <>
{type.hidden && <Badge variant="gray">{t("hidden")}</Badge>} {type.hidden && <Badge variant="gray">{t("hidden")}</Badge>}
<Tooltip content={t("show_eventtype_on_profile")}> <Tooltip
content={type.hidden ? t("show_eventtype_on_profile") : t("hide_from_profile")}>
<div className="self-center rounded-md p-2"> <div className="self-center rounded-md p-2">
<Switch <Switch
name="Hidden" name="Hidden"
@ -607,7 +610,6 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
{(group.metadata?.readOnly === false || group.metadata.readOnly === null) && {(group.metadata?.readOnly === false || group.metadata.readOnly === null) &&
!isChildrenManagedEventType && ( !isChildrenManagedEventType && (
<> <>
<DropdownMenuSeparator />
<DropdownMenuItem className="outline-none"> <DropdownMenuItem className="outline-none">
<DropdownItem <DropdownItem
color="destructive" color="destructive"
@ -623,6 +625,25 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
</DropdownMenuItem> </DropdownMenuItem>
</> </>
)} )}
<DropdownMenuSeparator />
{!isManagedEventType && (
<div className="hover:bg-subtle flex h-9 cursor-pointer flex-row items-center justify-between py-2 px-4">
<Skeleton
as={Label}
htmlFor="hiddenSwitch"
className="mt-2 inline cursor-pointer self-center pr-2 ">
{type.hidden ? t("show_eventtype_on_profile") : t("hide_from_profile")}
</Skeleton>
<Switch
id="hiddenSwitch"
name="Hidden"
checked={!type.hidden}
onCheckedChange={() => {
setHiddenMutation.mutate({ id: type.id, hidden: !type.hidden });
}}
/>
</div>
)}
</DropdownMenuContent> </DropdownMenuContent>
</DropdownMenuPortal> </DropdownMenuPortal>
</Dropdown> </Dropdown>