public-offering
/
cal.pub0.org
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Harsh/auto add url (#4997) 

* add: auto complete for slug

* Remove useStates not required for feature

* remove: states logic

* Using touched validation from react-hook-form

* Fix size of width for steps indicador

* Apply same changes for react-hook-form touched from createNewTeam

Co-authored-by: root <root@pop-os.localdomain>
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
Co-authored-by: Alan <alannnc@gmail.com>
pull/5049/head^2
Harsh Singh 2022-10-18 00:22:24 +05:30 committed by GitHub
parent aa038acafd
commit 06732c5c6d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 22 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/web/components/getting-started/components/Steps.tsx
View File

@ -22,12 +22,12 @@ const Steps = (props: ISteps) => {
key={`step-${index}`}
onClick={() => navigateToStep(index)}
className={classNames(
"h-1 w-1/4 rounded-[1px] bg-black dark:bg-white",
"h-1 w-full rounded-[1px] bg-black dark:bg-white",
index < currentStep ? "cursor-pointer" : ""
)}
/>
) : (
<div key={`step-${index}`} className="h-1 w-1/4 rounded-[1px] bg-black bg-opacity-25" />
<div key={`step-${index}`} className="h-1 w-full rounded-[1px] bg-black bg-opacity-25" />
);
})}
</div>

7
packages/features/ee/teams/components/v2/CreateNewTeam.tsx
View File

@ -2,6 +2,7 @@ import { useForm, Controller } from "react-hook-form";
import { WEBAPP_URL } from "@calcom/lib/constants";
import { useLocale } from "@calcom/lib/hooks/useLocale";
import slugify from "@calcom/lib/slugify";
import { trpc } from "@calcom/trpc/react";
import { Icon } from "@calcom/ui";
import { Button, Avatar } from "@calcom/ui/v2";
@ -45,7 +46,11 @@ const CreateANewTeamForm = (props: { nextStep: () => void; setTeamId: (teamId: n
value={value}
onChange={(e) => {
formMethods.setValue("name", e?.target.value);
if (formMethods.formState.touchedFields["slug"] === undefined) {
formMethods.setValue("slug", slugify(e?.target.value));
}
}}
autoComplete="off"
/>
)}
/>
@ -63,7 +68,7 @@ const CreateANewTeamForm = (props: { nextStep: () => void; setTeamId: (teamId: n
addOnLeading={`${WEBAPP_URL}/team/`}
value={value}
onChange={(e) => {
formMethods.setValue("slug", e?.target.value);
formMethods.setValue("slug", slugify(e?.target.value), { shouldTouch: true });
}}
/>
)}

25
packages/ui/v2/modules/event-types/CreateEventType.tsx
View File

@ -84,16 +84,6 @@ export default function CreateEventTypeButton(props: CreateEventTypeBtnProps) {
// If query params change, update the form
}, [router.isReady, router.query, setValue]);
useEffect(() => {
const subscription = watch((value, { name, type }) => {
if (name === "title" && type === "change") {
if (value.title) setValue("slug", slugify(value.title));
else setValue("slug", "");
}
});
return () => subscription.unsubscribe();
}, [watch, setValue]);
const createMutation = trpc.useMutation("viewer.eventTypes.create", {
onSuccess: async ({ eventType }) => {
await router.replace("/event-types/" + eventType.id);
@ -202,7 +192,17 @@ export default function CreateEventTypeButton(props: CreateEventTypeBtnProps) {
value={teamId}
/>
)}
<TextField label={t("title")} placeholder={t("quick_chat")} {...register("title")} />
<TextField
label={t("title")}
placeholder={t("quick_chat")}
{...register("title")}
onChange={(e) => {
form.setValue("title", e?.target.value);
if (form.formState.touchedFields["slug"] === undefined) {
form.setValue("slug", slugify(e?.target.value));
}
}}
/>
{process.env.NEXT_PUBLIC_WEBSITE_URL !== undefined &&
process.env.NEXT_PUBLIC_WEBSITE_URL?.length >= 21 ? (
@ -211,6 +211,9 @@ export default function CreateEventTypeButton(props: CreateEventTypeBtnProps) {
required
addOnLeading={<>/{pageSlug}/</>}
{...register("slug")}
onChange={(e) => {
form.setValue("slug", slugify(e?.target.value), { shouldTouch: true });
}}
/>
) : (
<TextField