Skip to content

Commit

Permalink
feat: add more fields to GeneralHelpForm
Browse files Browse the repository at this point in the history 
Signed-off-by: GitHub <[email protected]>
  • Loading branch information
@virtual-designer
virtual-designer authored Sep 2, 2024
1 parent 0e3c8b6 commit aeeb319
Show file tree
Hide file tree
Showing 2 changed files with 170 additions and 3 deletions.
150 changes: 148 additions & 2 deletions src/features/SupportForm/GeneralHelpForm.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { zodResolver } from "@hookform/resolvers/zod";
import { Input, Select, SelectItem, Spacer, Textarea } from "@nextui-org/react";
import { type FC } from "react";
import { Form, useForm } from "react-hook-form";
import { Controller, Form, useForm } from "react-hook-form";
import { z } from "zod";
import CommonFields from "./CommonFields";
import SubmitButton from "./SubmitButton";
Expand All @@ -9,7 +10,7 @@ import { GeneralHelpFormSchema } from "./SupportFormSchemas";
type GeneralHelpFormProps = {};

const GeneralHelpForm: FC<GeneralHelpFormProps> = (props) => {
const { control, register, formState } = useForm<
const { control, register, formState, watch } = useForm<
z.infer<typeof GeneralHelpFormSchema>
>({
resolver: zodResolver(GeneralHelpFormSchema),
Expand All @@ -22,6 +23,151 @@ const GeneralHelpForm: FC<GeneralHelpFormProps> = (props) => {
register={register}
formState={formState}
/>

<Controller
name="type"
control={control}
render={({ field, fieldState }) => (
<Select
label="What type of help do you need?"
name="type"
selectionMode="single"
defaultSelectedKeys={field.value}
onSelectionChange={(keys) =>
field.onChange(
Array.from(keys as unknown as Set<string>)[0] ||
null,
)
}
isInvalid={fieldState.invalid}
errorMessage={fieldState.error?.message?.toString()}
>
<SelectItem key="getting_started">
Getting started or Setting up SudoBot
</SelectItem>
<SelectItem key="troubleshooting">
Troubleshooting or General Support
</SelectItem>
<SelectItem key="other">Other</SelectItem>
</Select>
)}
/>

<Spacer y={2} />

<Input
label="Subject"
isInvalid={Boolean(formState.errors.subject)}
errorMessage={formState.errors.subject?.message?.toString()}
placeholder="How can we help you?"
{...register("subject")}
/>

<Spacer y={2} />

{watch("type") !== "other" && (
<>
<Controller
name="platform"
control={control}
render={({ field, fieldState }) => (
<Select
label="Platform"
name="platform"
selectionMode="single"
defaultSelectedKeys={field.value}
onSelectionChange={(keys) =>
field.onChange(
Array.from(
keys as unknown as Set<string>,
)[0] || null,
)
}
isInvalid={fieldState.invalid}
errorMessage={fieldState.error?.message?.toString()}
>
<SelectItem key="linux-x86_64">
Linux x86_64
</SelectItem>

<SelectItem key="linux-i386">
Linux i386
</SelectItem>

<SelectItem key="linux-arm64">
Linux arm64
</SelectItem>

<SelectItem key="linux-armhf">
Linux armhf
</SelectItem>

<SelectItem key="darwin-x86_64">
macOS x86_64
</SelectItem>

<SelectItem key="darwin-arm64">
macOS arm64 (Apple Silicon)
</SelectItem>

<SelectItem key="windows-x86_64">
Windows x64 (64-bit)
</SelectItem>

<SelectItem key="windows-i386">
Windows x86 (32-bit)
</SelectItem>

<SelectItem key="windows-arm64">
Windows arm64
</SelectItem>

<SelectItem key="other">
Other (please specify in description)
</SelectItem>
</Select>
)}
/>

<Spacer y={2} />

<Controller
name="interpreter"
control={control}
render={({ field, fieldState }) => (
<Select
label="JavaScript Interpreter"
name="interpreter"
selectionMode="single"
defaultSelectedKeys={field.value}
onSelectionChange={(keys) =>
field.onChange(
Array.from(
keys as unknown as Set<string>,
)[0] || null,
)
}
isInvalid={fieldState.invalid}
errorMessage={fieldState.error?.message?.toString()}
>
<SelectItem key="bun">Bun</SelectItem>
<SelectItem key="node">Node.js</SelectItem>
</Select>
)}
/>

<Spacer y={2} />
</>
)}

<Textarea
label="Description"
isInvalid={Boolean(formState.errors.description)}
errorMessage={formState.errors.description?.message?.toString()}
placeholder="Describe your issue or question in detail"
{...register("description")}
/>

<SubmitButton />
</Form>
);
Expand Down
23 changes: 22 additions & 1 deletion src/features/SupportForm/SupportFormSchemas.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,28 @@ const CommonSchema = z.object({
.max(255, "Email is too long!"),
});

export const GeneralHelpFormSchema = CommonSchema.extend({});
export const GeneralHelpFormSchema = CommonSchema.extend({
subject: z
.string({ message: "Please enter the subject!" })
.min(1, "Please enter the subject!")
.max(255, "Subject is too long!"),
type: z
.string({ message: "Please select a type!" })
.min(1, "Please select a type!")
.max(255, "Type is too long!"),
description: z
.string({ message: "Please enter the description!" })
.min(1, "Please enter the description!")
.max(1024 * 16, "Description is too long!"),
platform: z
.string({ message: "Please select a platform!" })
.min(1, "Please select a platform!")
.max(255, "Platform is too long!"),
interpreter: z
.string({ message: "Please select an interpreter!" })
.min(1, "Please select an interpreter!")
.max(255, "Interpreter is too long!"),
});
export const DMCAFormSchema = CommonSchema.extend({
infringingURLs: z
.array(
Expand Down

0 comments on commit aeeb319

Please sign in to comment.