Basis for Certificate modal

frontend/src/modals/CertificateCreateModal/CertificateCreateModal.tsx

@@ -24,6 +24,8 @@ import { useSetCertificate } from "hooks";
 import { intl } from "locale";
 import { validateString } from "modules/Validations";
 
+import HTTPForm from "./HTTPForm";
+
 interface CertificateCreateModalProps {
 	isOpen: boolean;
 	onClose: () => void;
@@ -104,13 +106,18 @@ function CertificateCreateModal({
 										<ButtonGroup style={{ width: "100%" }}>
 											<Button
 												onClick={() => setCertType("http")}
-												style={{ width: "50%" }}>
-												HTTP
+												style={{ width: "33%" }}>
+												{intl.formatMessage({ id: "type.http" })}
 											</Button>
 											<Button
 												onClick={() => setCertType("dns")}
-												style={{ width: "50%" }}>
-												DNS
+												style={{ width: "34%" }}>
+												{intl.formatMessage({ id: "type.dns" })}
+											</Button>
+											<Button
+												onClick={() => setCertType("custom")}
+												style={{ width: "33%" }}>
+												{intl.formatMessage({ id: "type.custom" })}
 											</Button>
 										</ButtonGroup>
 									</FormControl>
@@ -143,6 +150,8 @@ function CertificateCreateModal({
 										</Field>
 									</Stack>
 								) : null}
+
+								{certType === "http" ? <HTTPForm /> : null}
 							</ModalBody>
 							<ModalFooter>
 								{certType !== "" ? (

frontend/src/modals/CertificateCreateModal/CustomForm.tsx

@@ -0,0 +1,5 @@
+function CustomForm() {
+	return <p>Custom form</p>;
+}
+
+export default CustomForm;

frontend/src/modals/CertificateCreateModal/DNSForm.tsx

@@ -0,0 +1,5 @@
+function DNSForm() {
+	return <p>DNS form</p>;
+}
+
+export default DNSForm;

frontend/src/modals/CertificateCreateModal/HTTPForm.tsx

@@ -0,0 +1,5 @@
+function HTTPForm() {
+	return <p>Http form</p>;
+}
+
+export default HTTPForm;

frontend/src/modals/CertificateCreateModal/index.ts

@@ -0,0 +1 @@
+export * from "./CertificateCreateModal";