fixed location input, date overwrite dialog (#7778)

Co-authored-by: Carina Wollendorfer <30310907+CarinaWolli@users.noreply.github.com>
This commit is contained in:
Peer Richelsen 2023-03-20 18:55:40 +01:00 committed by GitHub
parent 0c29f2a135
commit 19bc329377
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 17 additions and 9 deletions

View File

@ -17,6 +17,7 @@ import {
import { useLocale } from "@calcom/lib/hooks/useLocale";
import type { RouterOutputs } from "@calcom/trpc/react";
import { trpc } from "@calcom/trpc/react";
import { Input } from "@calcom/ui";
import { Button, Dialog, DialogContent, DialogFooter, Form, PhoneInput } from "@calcom/ui";
import { FiMapPin } from "@calcom/ui/components/icon";
@ -52,7 +53,7 @@ const LocationInput = (props: {
const { control } = useFormContext() as typeof locationFormMethods;
if (eventLocationType?.organizerInputType === "text") {
return (
<input {...locationFormMethods.register(eventLocationType.variable)} type="text" {...remainingProps} />
<Input {...locationFormMethods.register(eventLocationType.variable)} type="text" {...remainingProps} />
);
} else if (eventLocationType?.organizerInputType === "phone") {
return (
@ -171,7 +172,6 @@ export const EditLocationDialog = (props: ISetLocationDialog) => {
id="locationInput"
placeholder={t(eventLocationType.organizerInputPlaceholder || "")}
required
className="block w-full rounded-sm border-gray-300 text-sm"
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
defaultValue={
defaultLocation ? defaultLocation[eventLocationType.defaultValueVariable] : undefined

View File

@ -198,8 +198,16 @@ export const EventSetupTab = (
return (
<li
onClick={() => {
locationFormMethods.setValue("locationType", location.type);
locationFormMethods.unregister("locationLink");
locationFormMethods.unregister("locationAddress");
locationFormMethods.unregister("locationPhoneNumber");
setEditingLocationType(location.type);
openLocationModal(location.type);
}}
key={`${location.type}${index}`}
className="mb-2 rounded-md border border-gray-300 py-1.5 px-2">
className="mb-2 rounded-md border border-gray-300 py-1.5 px-2 hover:cursor-pointer">
<div className="flex items-center justify-between">
<div className="flex items-center">
<img

View File

@ -223,7 +223,7 @@ export default function Availability() {
</Button>
</div>
}>
<div className="w-full">
<div className="mt-4 w-full md:mt-0">
<Form
form={form}
id="availability-form"

View File

@ -116,8 +116,8 @@ const DateOverrideForm = ({
);
onClose();
}}
className="space-y-4 sm:flex sm:space-x-4">
<div className={classNames(date && "w-full sm:border-r sm:pr-6")}>
className="p-6 sm:flex sm:p-0">
<div className={classNames(date && "w-full sm:border-r sm:pr-6", "sm:p-4 md:p-8")}>
<DialogHeader title={t("date_overrides_dialog_title")} />
<DatePicker
includedDates={includedDates}
@ -133,7 +133,7 @@ const DateOverrideForm = ({
/>
</div>
{date && (
<div className="relative flex w-full flex-col sm:pl-2">
<div className="relative mt-8 flex w-full flex-col sm:mt-0 sm:p-4 md:p-8">
<div className="mb-4 flex-grow space-y-4">
<p className="text-medium text-sm">{t("date_overrides_dialog_which_hours")}</p>
<div>
@ -150,7 +150,7 @@ const DateOverrideForm = ({
data-testid="date-override-mark-unavailable"
/>
</div>
<div className="flex flex-row-reverse">
<div className="mt-4 flex flex-row-reverse sm:mt-0">
<Button
className="ml-2"
color="primary"
@ -190,7 +190,7 @@ const DateOverrideInputDialog = ({
<Dialog open={open} onOpenChange={setOpen}>
<DialogTrigger asChild>{Trigger}</DialogTrigger>
<DialogContent enableOverflow={enableOverflow} size="md">
<DialogContent enableOverflow={enableOverflow} size="md" className="p-0">
<DateOverrideForm
excludedDates={excludedDates}
{...passThroughProps}