You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
39 lines
1.4 KiB
TypeScript
39 lines
1.4 KiB
TypeScript
import { HStack, styled } from "@styled-system/jsx";
|
|
|
|
import { Button } from "@/components/ui/button";
|
|
import { Field } from "@/components/ui/field";
|
|
import { Input } from "@/components/ui/input";
|
|
import { getI18n } from "@/i18n/server";
|
|
import { stack } from "@styled-system/patterns";
|
|
import { submitContactFormAction } from "@/actions/contact";
|
|
|
|
export default async function ContactForm() {
|
|
const t = await getI18n();
|
|
|
|
return (
|
|
<styled.form action={submitContactFormAction} className={stack()}>
|
|
<Field.Root id="name">
|
|
<Field.Label>{t("contact.name")}</Field.Label>
|
|
<Field.Input name="name" placeholder={t("contact.name")} />
|
|
</Field.Root>
|
|
<Field.Root id="email">
|
|
<Field.Label>{t("general.email")}</Field.Label>
|
|
<Field.Input name="email" placeholder={t("general.email")} asChild>
|
|
<Input type="email" />
|
|
</Field.Input>
|
|
</Field.Root>
|
|
<Field.Root id="subject">
|
|
<Field.Label>{t("contact.subject")}</Field.Label>
|
|
<Field.Input name="subject" placeholder={t("contact.subject")} />
|
|
</Field.Root>
|
|
<Field.Root id="message">
|
|
<Field.Label>{t("contact.message")}</Field.Label>
|
|
<Field.Textarea name="message" placeholder={t("contact.message")}/>
|
|
</Field.Root>
|
|
<HStack justify="end">
|
|
<Button type="submit">{t("general.submit")}</Button>
|
|
</HStack>
|
|
</styled.form>
|
|
);
|
|
}
|