e4e4ec5ffc
* Recurring info format * More mismatch visual bugs when booking * More tweaks * Prettier * Prettier cont Co-authored-by: Peer Richelsen <peeroke@gmail.com> Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
38 lines
1.4 KiB
TypeScript
38 lines
1.4 KiB
TypeScript
import { getEventLocationType, locationKeyToString } from "@calcom/app-store/locations";
|
|
import { classNames } from "@calcom/lib";
|
|
|
|
import { Props } from "./pages/AvailabilityPage";
|
|
|
|
export function AvailableEventLocations({ locations }: { locations: Props["eventType"]["locations"] }) {
|
|
return locations.length ? (
|
|
<div>
|
|
<div className="flex-warp mr-6 flex break-words text-sm text-gray-600 dark:text-white">
|
|
<p className="w-full">
|
|
{locations.map((location) => {
|
|
const eventLocationType = getEventLocationType(location.type);
|
|
if (!eventLocationType) {
|
|
// It's possible that the location app got uninstalled
|
|
return null;
|
|
}
|
|
return (
|
|
<span key={location.type} className="flex flex-row items-center text-sm font-medium">
|
|
<img
|
|
src={eventLocationType.iconUrl}
|
|
className={classNames(
|
|
"mr-[10px] ml-[2px] h-4 w-4 opacity-70 dark:opacity-100",
|
|
!eventLocationType.iconUrl?.includes("api") ? "dark:invert" : ""
|
|
)}
|
|
alt={`${eventLocationType.label} icon`}
|
|
/>
|
|
<span key={location.type}>{locationKeyToString(location)} </span>
|
|
</span>
|
|
);
|
|
})}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
) : (
|
|
<></>
|
|
);
|
|
}
|