58 lines
1.5 KiB
TypeScript
58 lines
1.5 KiB
TypeScript
import type { UseFormReturn } from "react-hook-form";
|
|
import { FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage } from "~/client/components/ui/form";
|
|
import { Input } from "~/client/components/ui/input";
|
|
import type { NotificationFormValues } from "../create-notification-form";
|
|
|
|
type Props = {
|
|
form: UseFormReturn<NotificationFormValues>;
|
|
};
|
|
|
|
export const SlackForm = ({ form }: Props) => {
|
|
return (
|
|
<>
|
|
<FormField
|
|
control={form.control}
|
|
name="webhookUrl"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>Webhook URL</FormLabel>
|
|
<FormControl>
|
|
<Input
|
|
{...field}
|
|
placeholder="https://hooks.slack.com/services/T00000000/B00000000/XXXXXXXXXXXXXXXXXXXX"
|
|
/>
|
|
</FormControl>
|
|
<FormDescription>Get this from your Slack app's Incoming Webhooks settings.</FormDescription>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
<FormField
|
|
control={form.control}
|
|
name="username"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>Bot Username (Optional)</FormLabel>
|
|
<FormControl>
|
|
<Input {...field} placeholder="Zerobyte" />
|
|
</FormControl>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
<FormField
|
|
control={form.control}
|
|
name="iconEmoji"
|
|
render={({ field }) => (
|
|
<FormItem>
|
|
<FormLabel>Icon Emoji (Optional)</FormLabel>
|
|
<FormControl>
|
|
<Input {...field} placeholder=":floppy_disk:" />
|
|
</FormControl>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
</>
|
|
);
|
|
};
|