thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

fix: create workspace form validation (#2958)

Browse Source 
* fix: create workspace form validation

* fix: textfield placeholder typo

* fix: name field onchange
This commit is contained in:
Lakhan Baheti 2023-12-01 15:18:48 +05:30 committed by Aaryan Khandelwal
parent 81bccc1884
commit 8d021389a0
3 changed files with 13 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/components/account/sign-in-forms/unique-code.tsx
View File

@ -196,7 +196,7 @@ export const UniqueCodeForm: React.FC<Props> = (props) => {
value={value} value={value}
onChange={onChange} onChange={onChange}
hasError={Boolean(errors.token)} hasError={Boolean(errors.token)}
placeholder="gets-sets-fays" placeholder="gets-sets-flys"
className="w-full h-[46px] placeholder:text-onboarding-text-400 border border-onboarding-border-100 pr-12" className="w-full h-[46px] placeholder:text-onboarding-text-400 border border-onboarding-border-100 pr-12"
/> />
)} )}

2
web/components/onboarding/join-workspaces.tsx
View File

@ -24,7 +24,7 @@ export const JoinWorkspaces: React.FC<Props> = ({ stepChange, setTryDiffAccount
} = useForm<IWorkspace>({ } = useForm<IWorkspace>({
defaultValues: { defaultValues: {
name: "", name: "",
slug: `${window.location.host}/`, slug: "",
}, },
mode: "onChange", mode: "onChange",
}); });

29
web/components/onboarding/workspace.tsx
View File

@ -40,8 +40,6 @@ export const Workspace: React.FC<Props> = (props) => {
const handleCreateWorkspace = async (formData: IWorkspace) => { const handleCreateWorkspace = async (formData: IWorkspace) => {
if (isSubmitting) return; if (isSubmitting) return;
const slug = formData.slug.split("/");
formData.slug = slug[slug.length - 1];
await workspaceService await workspaceService
.workspaceSlugCheck(formData.slug) .workspaceSlugCheck(formData.slug)
@ -118,11 +116,7 @@ export const Workspace: React.FC<Props> = (props) => {
onChange={(event) => { onChange={(event) => {
onChange(event.target.value); onChange(event.target.value);
setValue("name", event.target.value); setValue("name", event.target.value);
if (window && window.location.host) { setValue("slug", event.target.value.toLocaleLowerCase().trim().replace(/ /g, "-"));
const host = window.location.host;
const slug = event.currentTarget.value.split("/");
setValue("slug", `${host}/${slug[slug.length - 1].toLocaleLowerCase().trim().replace(/ /g, "-")}`);
}
}} }}
placeholder="Enter workspace name..." placeholder="Enter workspace name..."
ref={ref} ref={ref}
@ -137,26 +131,25 @@ export const Workspace: React.FC<Props> = (props) => {
<Controller <Controller
control={control} control={control}
name="slug" name="slug"
render={({ field: { value, ref } }) => ( render={({ field: { value, ref, onChange } }) => (
<div className="flex items-center relative rounded-md bg-onboarding-background-200"> <div
className={`flex items-center px-3 relative rounded-md bg-onboarding-background-200 border ${
invalidSlug ? "border-red-500" : "border-onboarding-border-100"
} `}
>
<span className="whitespace-nowrap text-sm">{window && window.location.host}/</span>
<Input <Input
id="slug" id="slug"
name="slug" name="slug"
type="text" type="text"
value={value.toLocaleLowerCase().trim().replace(/ /g, "-")} value={value.toLocaleLowerCase().trim().replace(/ /g, "-")}
onChange={(e) => { onChange={(e) => {
const host = window.location.host; /^[a-zA-Z0-9_-]+$/.test(e.target.value) ? setInvalidSlug(false) : setInvalidSlug(true);
const slug = e.currentTarget.value.split("/"); onChange(e.target.value.toLowerCase());
if (slug.length > 1) {
/^[a-zA-Z0-9_-]+$/.test(slug[slug.length - 1]) ? setInvalidSlug(false) : setInvalidSlug(true);
setValue("slug", `${host}/${slug[slug.length - 1].toLocaleLowerCase().trim().replace(/ /g, "-")}`);
} else {
setValue("slug", `${host}/`);
}
}} }}
ref={ref} ref={ref}
hasError={Boolean(errors.slug)} hasError={Boolean(errors.slug)}
className="w-full h-[46px] border-onboarding-border-100" className="w-full h-[46px] !px-0 border-none"
/> />
</div> </div>
)} )}