fix: platform booker icons and address property for type inPerson (#15207)

* fix: platform booker icons

* fix label not being shown for address

* fix type check

* PR feedback

---------

Co-authored-by: Morgan Vernay <morgan@cal.com>
This commit is contained in:
Rajiv Sahal
2024-05-27 11:02:58 +00:00
committed by GitHub
co-authored by Morgan Vernay
parent 360b729d08
commit bddc235c3c
2 changed files with 20 additions and 8 deletions
@@ -22,7 +22,13 @@ function RenderIcon({
const isPlatform = useIsPlatform();
if (isPlatform) {
return <Icon name="video" className="me-[10px] h-4 w-4" />;
if (eventLocationType.type === "conferencing") return <Icon name="video" className="me-[10px] h-4 w-4" />;
if (eventLocationType.type === "attendeeInPerson" || eventLocationType.type === "inPerson")
return <Icon name="map-pin" className="me-[10px] h-4 w-4" />;
if (eventLocationType.type === "phone" || eventLocationType.type === "userPhone")
return <Icon name="phone" className="me-[10px] h-4 w-4" />;
if (eventLocationType.type === "link") return <Icon name="link" className="me-[10px] h-4 w-4" />;
return <Icon name="book-user" className="me-[10px] h-4 w-4" />;
}
return (
@@ -65,6 +71,7 @@ function RenderLocationTooltip({ locations }: { locations: LocationObject[] }) {
export function AvailableEventLocations({ locations }: { locations: LocationObject[] }) {
const { t } = useLocale();
const isPlatform = useIsPlatform();
const renderLocations = locations.map(
(
@@ -101,11 +108,15 @@ export function AvailableEventLocations({ locations }: { locations: LocationObje
return filteredLocations.length > 1 ? (
<div className="flex flex-row items-center text-sm font-medium">
<img
src="/map-pin-dark.svg"
className={classNames("me-[10px] h-4 w-4 opacity-70 dark:invert")}
alt="map-pin"
/>
{isPlatform ? (
<Icon name="map-pin" className={classNames("me-[10px] h-4 w-4 opacity-70 dark:invert")} />
) : (
<img
src="/map-pin-dark.svg"
className={classNames("me-[10px] h-4 w-4 opacity-70 dark:invert")}
alt="map-pin"
/>
)}
<Tooltip content={<RenderLocationTooltip locations={locations} />}>
<p className="line-clamp-1">
{t("location_options", {
@@ -1,6 +1,7 @@
import type { LocationObject } from "@calcom/app-store/locations";
import { locationKeyToString } from "@calcom/app-store/locations";
import { getEventLocationType } from "@calcom/app-store/locations";
import { getTranslatedLocation } from "@calcom/app-store/locations";
import type { useLocale } from "@calcom/lib/hooks/useLocale";
import notEmpty from "@calcom/lib/notEmpty";
@@ -18,11 +19,11 @@ export default function getLocationsOptionsForSelect(
return null;
}
const type = eventLocation.type;
const translatedLocation = getTranslatedLocation(location, eventLocation, t);
return {
// XYZ: is considered a namespace in i18next https://www.i18next.com/principles/namespaces and thus it get's cleaned up.
// Beacause there can be a URL in here, simply don't translate it if it starts with http: or https:. This would allow us to keep supporting namespaces if we plan to use them
label: locationString.search(/^https?:/) !== -1 ? locationString : t(locationString),
label: translatedLocation || locationString,
value: type,
inputPlaceholder: t(eventLocation?.attendeeInputPlaceholder || ""),
};