maronato/cal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

CAL-1589: Added utm link to powered by in booker. Also added new colors to powered by component, so theyre also used in current booker form now on. (#8670)

This commit is contained in:
Jeroen Reumkens 2023-05-05 08:36:23 +01:00 committed by GitHub
parent 05b42c001f
commit c401a58bb1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/features/bookings/Booker/Booker.tsx
View File

@ -1,4 +1,5 @@
import { LazyMotion, domAnimation, m, AnimatePresence } from "framer-motion";
import dynamic from "next/dynamic";
import { useCallback, useEffect, useRef } from "react";
import StickyBox from "react-sticky-box";
import { shallow } from "zustand/shallow";
@ -7,7 +8,7 @@ import classNames from "@calcom/lib/classNames";
import useGetBrandingColours from "@calcom/lib/getBrandColours";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import useMediaQuery from "@calcom/lib/hooks/useMediaQuery";
import { Logo, ToggleGroup, useCalcomTheme } from "@calcom/ui";
import { ToggleGroup, useCalcomTheme } from "@calcom/ui";
import { Calendar, Columns, Grid } from "@calcom/ui/components/icon";
import { AvailableTimeSlots } from "./components/AvailableTimeSlots";
@ -24,6 +25,8 @@ import { useBookerStore, useInitializeBookerStore } from "./store";
import type { BookerLayout, BookerProps } from "./types";
import { useEvent } from "./utils/event";
const PoweredBy = dynamic(() => import("@calcom/ee/components/PoweredBy"));
const useBrandColors = ({ brandColor, darkBrandColor }: { brandColor?: string; darkBrandColor?: string }) => {
const brandTheme = useGetBrandingColours({
lightVal: brandColor,
@ -205,8 +208,11 @@ const BookerComponent = ({ username, eventSlug, month, rescheduleBooking }: Book
<m.span
key="logo"
className={classNames("mt-auto mb-6 pt-6", layout === "small_calendar" ? "block" : "hidden")}>
<Logo small />
className={classNames(
"mt-auto mb-6 pt-6 [&_img]:h-[15px]",
layout === "small_calendar" ? "block" : "hidden"
)}>
<PoweredBy logoOnly />
</m.span>
</div>

17
packages/features/ee/components/PoweredBy.tsx
View File

@ -5,7 +5,7 @@ import { useIsEmbed } from "@calcom/embed-core/embed-iframe";
import { APP_NAME, POWERED_BY_URL } from "@calcom/lib/constants";
import { useLocale } from "@calcom/lib/hooks/useLocale";
const PoweredByCal = () => {
const PoweredByCal = ({ logoOnly }: { logoOnly?: boolean }) => {
const { t } = useLocale();
const session = useSession();
const isEmbed = useIsEmbed();
@ -13,23 +13,18 @@ const PoweredByCal = () => {
return (
<div className={"p-2 text-center text-xs sm:text-right" + (isEmbed ? " max-w-3xl" : "")}>
<Link href={POWERED_BY_URL} target="_blank" className="text-subtle opacity-50 hover:opacity-100">
{t("powered_by")}{" "}
<Link href={POWERED_BY_URL} target="_blank" className="text-subtle">
{!logoOnly && <>{t("powered_by")} </>}
{APP_NAME === "Cal.com" || !hasValidLicense ? (
<>
<img
className="relative -mt-px inline h-[10px] w-auto dark:hidden"
src="/cal-logo-word.svg"
alt="Cal.com Logo"
/>
<img
className="relativ -mt-px hidden h-[10px] w-auto dark:inline"
src="/cal-logo-word-dark.svg"
className="relative -mt-px inline h-[10px] w-auto dark:invert"
src="/api/logo"
alt="Cal.com Logo"
/>
</>
) : (
<span className="text-emphasis font-semibold">{APP_NAME}</span>
<span className="text-emphasis font-semibold opacity-50 hover:opacity-100">{APP_NAME}</span>
)}
</Link>
</div>