Add certificate model for http and dns

change is_ecc to boolean, its still stored as int in sqlite

Author: jc21

backend/internal/api/schema/certificates.go

@@ -51,9 +51,7 @@ func createCertificateHTTP() string {
 					"type": "object"
 				},
 				"is_ecc": {
-					"type": "integer",
-					"minimum": 0,
-					"maximum": 1
+					"type": "boolean"
 				}
 			}
 		}`, strictString("http"), intMinOne, stringMinMax(1, 100), domainNames())
@@ -83,9 +81,7 @@ func createCertificateDNS() string {
 					"type": "object"
 				},
 				"is_ecc": {
-					"type": "integer",
-					"minimum": 0,
-					"maximum": 1
+					"type": "boolean"
 				}
 			}
 		}`, strictString("dns"), intMinOne, intMinOne, stringMinMax(1, 100), domainNames())

backend/internal/entity/certificate/model.go

@@ -57,7 +57,7 @@ type Model struct {
 	Status                 string               `json:"status" db:"status" filter:"status,string"`
 	ErrorMessage           string               `json:"error_message" db:"error_message" filter:"error_message,string"`
 	Meta                   types.JSONB          `json:"-" db:"meta"`
-	IsECC                  int                  `json:"is_ecc" db:"is_ecc" filter:"is_ecc,integer"`
+	IsECC                  bool                 `json:"is_ecc" db:"is_ecc" filter:"is_ecc,bool"`
 	IsDeleted              bool                 `json:"is_deleted,omitempty" db:"is_deleted"`
 	// Expansions:
 	CertificateAuthority *certificateauthority.Model `json:"certificate_authority,omitempty"`

backend/internal/entity/certificate/template.go

@@ -13,7 +13,7 @@ type Template struct {
 	Name                   string
 	DomainNames            []string
 	Status                 string
-	IsECC                  int
+	IsECC                  bool
 	// These are helpers for template generation
 	IsCustom   bool
 	IsAcme     bool // non-custom

frontend/package.json

@@ -22,6 +22,7 @@
 		"@typescript-eslint/parser": "^5.30.6",
 		"ajv": "^8.12.0",
 		"babel-eslint": "^10.1.0",
+		"chakra-react-select": "^4.5.0",
 		"classnames": "^2.3.1",
 		"country-flag-icons": "^1.5.5",
 		"date-fns": "2.28.0",

frontend/src/api/npm/models.ts

@@ -52,12 +52,16 @@ export interface Certificate {
 	id: number;
 	createdOn: number;
 	modifiedOn: number;
+	expiresOn: number | null;
+	type: string;
+	userId: number;
+	certificateAuthorityId: number;
+	dnsProviderId: number;
 	name: string;
-	acmeshServer: string;
-	caBundle: string;
-	maxDomains: number;
-	isWildcardSupported: boolean;
-	isSetup: boolean;
+	domainNames: string[];
+	status: string;
+	errorMessage: string;
+	isEcc: boolean;
 }
 
 export interface CertificateAuthority {

frontend/src/hooks/useCertificate.ts

@@ -47,7 +47,7 @@ const useSetCertificate = () => {
 			onError: (error, values, rollback: any) => rollback(),
 			onSuccess: async ({ id }: Certificate) => {
 				queryClient.invalidateQueries(["certificate", id]);
-				queryClient.invalidateQueries("certificate");
+				queryClient.invalidateQueries("certificates");
 			},
 		},
 	);

frontend/src/hooks/useCertificates.ts

@@ -28,7 +28,7 @@ const useCertificates = (
 	options = {},
 ) => {
 	return useQuery<CertificatesResponse, Error>(
-		["hosts", { offset, limit, sortBy, filters }],
+		["certificates", { offset, limit, sortBy, filters }],
 		() => fetchCertificates(offset, limit, sortBy, filters),
 		{
 			keepPreviousData: true,

frontend/src/locale/src/HelpDoc/en/Certificates.md

@@ -1,3 +1,17 @@
 # Certificates Help
 
+## HTTP Certificate
+
+todo
+
+## DNS Certificate
+
+todo
+
+## Custom Certificate
+
+todo
+
+## MKCert Certificate
+
 todo

frontend/src/locale/src/en.json

@@ -314,6 +314,9 @@
 	"certificate-authorities.title": {
 		"defaultMessage": "Certificate Authorities"
 	},
+	"certificate-authority": {
+		"defaultMessage": "Certificate Authority"
+	},
 	"certificate-authority.acmesh-server": {
 		"defaultMessage": "ACME Server"
 	},
@@ -404,12 +407,24 @@
 	"disabled": {
 		"defaultMessage": "Disabled"
 	},
+	"dns-provider": {
+		"defaultMessage": "DNS Provider"
+	},
 	"dns-provider.acmesh-name": {
 		"defaultMessage": "Acme.sh Provider"
 	},
 	"dns-provider.create": {
 		"defaultMessage": "Create DNS Provider"
 	},
+	"dns-providers-empty": {
+		"defaultMessage": "No DNS Providers - Create one first"
+	},
+	"domain_names": {
+		"defaultMessage": "Domain Names"
+	},
+	"domain_names.max": {
+		"defaultMessage": "{count} ___domain names maximum"
+	},
 	"name": {
 		"defaultMessage": "Name"
 	},
@@ -524,6 +539,9 @@
 	"https-only": {
 		"defaultMessage": "HTTPS Only"
 	},
+	"is-ecc": {
+		"defaultMessage": "ECC Certificate"
+	},
 	"lets-go": {
 		"defaultMessage": "Let's go"
 	},
@@ -638,6 +656,9 @@
 	"type.http": {
 		"defaultMessage": "HTTP"
 	},
+	"type.mkcert": {
+		"defaultMessage": "MKCert"
+	},
 	"type.proxy": {
 		"defaultMessage": "Proxy Host"
 	},

frontend/src/modals/CertificateCreateModal/CertificateCreateModal.tsx

@@ -1,9 +1,5 @@
 import {
 	Button,
-	FormControl,
-	FormErrorMessage,
-	FormLabel,
-	Input,
 	Modal,
 	ModalOverlay,
 	ModalContent,
@@ -16,14 +12,14 @@ import {
 } from "@chakra-ui/react";
 import { Certificate } from "api/npm";
 import { PrettyButton } from "components";
-import { Formik, Form, Field } from "formik";
+import { Formik, Form } from "formik";
 import { useSetCertificate } from "hooks";
 import { intl } from "locale";
-import { validateString } from "modules/Validations";
 
 import CustomForm from "./CustomForm";
 import DNSForm from "./DNSForm";
 import HTTPForm from "./HTTPForm";
+import MKCertForm from "./MKCertForm";
 
 interface CertificateCreateModalProps {
 	isOpen: boolean;
@@ -44,8 +40,9 @@ function CertificateCreateModal({
 
 	const onSubmit = async (
 		payload: Certificate,
-		{ setErrors, setSubmitting }: any,
+		{ /*setErrors,*/ setSubmitting }: any,
 	) => {
+		payload.type = certType;
 		const showErr = (msg: string) => {
 			toast({
 				description: intl.formatMessage({
@@ -60,6 +57,8 @@ function CertificateCreateModal({
 
 		setCertificate(payload, {
 			onError: (err: any) => {
+				showErr(err.message);
+				/*
 				if (err.message === "ca-bundle-does-not-exist") {
 					setErrors({
 						caBundle: intl.formatMessage({
@@ -68,28 +67,52 @@ function CertificateCreateModal({
 					});
 				} else {
 					showErr(err.message);
-				}
+				}*/
 			},
 			onSuccess: () => onModalClose(),
 			onSettled: () => setSubmitting(false),
 		});
 	};
 
+	const getInitialValues = (type: string): any => {
+		switch (type) {
+			case "http":
+				return {
+					certificateAuthorityId: 0,
+					name: "",
+					domainNames: [],
+					isEcc: false,
+				} as any;
+			case "dns":
+				return {
+					certificateAuthorityId: 0,
+					dnsProviderId: 0,
+					name: "",
+					domainNames: [],
+					isEcc: false,
+				} as any;
+			case "custom":
+				return {
+					name: "",
+					domainNames: [],
+					// isEcc: false, // todo, required?
+					// todo: add meta?
+				} as any;
+			case "mkcert":
+				return {
+					name: "",
+					domainNames: [],
+					// isEcc: false, // todo, supported?
+					// todo: add meta?
+				} as any;
+		}
+	};
+
 	return (
 		<Modal isOpen={isOpen} onClose={onModalClose} closeOnOverlayClick={false}>
 			<ModalOverlay />
 			<ModalContent>
-				<Formik
-					initialValues={
-						{
-							name: "",
-							acmeshServer: "",
-							caBundle: "",
-							maxDomains: 5,
-							isWildcardSupported: false,
-						} as Certificate
-					}
-					onSubmit={onSubmit}>
+				<Formik initialValues={getInitialValues(certType)} onSubmit={onSubmit}>
 					{({ isSubmitting }) => (
 						<Form>
 							<ModalHeader>
@@ -98,39 +121,16 @@ function CertificateCreateModal({
 							<ModalCloseButton />
 							<ModalBody>
 								<Stack spacing={4}>
-									<Field name="name" validate={validateString(1, 100)}>
-										{({ field, form }: any) => (
-											<FormControl
-												isRequired
-												isInvalid={form.errors.name && form.touched.name}>
-												<FormLabel htmlFor="name">
-													{intl.formatMessage({
-														id: "name",
-													})}
-												</FormLabel>
-												<Input
-													{...field}
-													id="name"
-													placeholder={intl.formatMessage({
-														id: "name",
-													})}
-												/>
-												<FormErrorMessage>{form.errors.name}</FormErrorMessage>
-											</FormControl>
-										)}
-									</Field>
+									{certType === "http" ? <HTTPForm /> : null}
+									{certType === "dns" ? <DNSForm /> : null}
+									{certType === "custom" ? <CustomForm /> : null}
+									{certType === "mkcert" ? <MKCertForm /> : null}
 								</Stack>
-
-								{certType === "http" ? <HTTPForm /> : null}
-								{certType === "dns" ? <DNSForm /> : null}
-								{certType === "custom" ? <CustomForm /> : null}
 							</ModalBody>
 							<ModalFooter>
-								{certType !== "" ? (
-									<PrettyButton mr={3} isLoading={isSubmitting}>
-										{intl.formatMessage({ id: "form.save" })}
-									</PrettyButton>
-								) : null}
+								<PrettyButton mr={3} isLoading={isSubmitting}>
+									{intl.formatMessage({ id: "form.save" })}
+								</PrettyButton>
 								<Button onClick={onModalClose} isLoading={isSubmitting}>
 									{intl.formatMessage({ id: "form.cancel" })}
 								</Button>