import { FC } from "react"; import { Controller, useForm } from "react-hook-form"; // ui import { Button, Input, ToggleSwitch } from "@plane/ui"; // types import { IFormattedInstanceConfiguration } from "types/instance"; // hooks import useToast from "hooks/use-toast"; // mobx store import { useMobxStore } from "lib/mobx/store-provider"; export interface IInstanceEmailForm { config: IFormattedInstanceConfiguration; } export interface EmailFormValues { EMAIL_HOST: string; EMAIL_PORT: string; EMAIL_HOST_USER: string; EMAIL_HOST_PASSWORD: string; EMAIL_USE_TLS: string; EMAIL_USE_SSL: string; } export const InstanceEmailForm: FC = (props) => { const { config } = props; // store const { instance: instanceStore } = useMobxStore(); // toast const { setToastAlert } = useToast(); // form data const { handleSubmit, watch, control, formState: { errors, isSubmitting }, } = useForm({ defaultValues: { EMAIL_HOST: config["EMAIL_HOST"], EMAIL_PORT: config["EMAIL_PORT"], EMAIL_HOST_USER: config["EMAIL_HOST_USER"], EMAIL_HOST_PASSWORD: config["EMAIL_HOST_PASSWORD"], EMAIL_USE_TLS: config["EMAIL_USE_TLS"], EMAIL_USE_SSL: config["EMAIL_USE_SSL"], }, }); const onSubmit = async (formData: EmailFormValues) => { const payload: Partial = { ...formData }; await instanceStore .updateInstanceConfigurations(payload) .then(() => setToastAlert({ title: "Success", type: "success", message: "Email Settings updated successfully", }) ) .catch((err) => console.error(err)); }; return ( <>

Host

( )} />

Port

( )} />

Username

( )} />

Password

( )} />
Turn TLS {Boolean(parseInt(watch("EMAIL_USE_TLS"))) ? "off" : "on"}
Use this if your email domain supports TLS.
( { Boolean(parseInt(value)) === true ? onChange("0") : onChange("1"); }} size="sm" /> )} />
Turn SSL {Boolean(parseInt(watch("EMAIL_USE_SSL"))) ? "off" : "on"}
Most email domains support SSL. Use this to secure comms between this instance and your users.
( { Boolean(parseInt(value)) === true ? onChange("0") : onChange("1"); }} size="sm" /> )} />
); };