Allow updating custom certificates from the UI

backend/internal/certificate.js

@@ -595,7 +595,10 @@ const internalCertificate = {
 	 * @returns {Promise}
 	 */
 	upload: async (access, data) => {
-		const row = await internalCertificate.get(access, { id: data.id });
+		const row = await internalCertificate.get(access, {
+			id: data.id,
+			expand: ["proxy_hosts", "redirection_hosts", "dead_hosts", "streams"],
+		});
 		if (row.provider !== "other") {
 			throw new error.ValidationError("Cannot upload certificates for this type of provider");
 		}
@@ -620,6 +623,17 @@ const internalCertificate = {
 
 		certificate.meta = row.meta;
 		await internalCertificate.writeCustomCert(certificate);
+
+		// Reload nginx when the certificate is in use, so the new files are served
+		const inUseCount =
+			(row.proxy_hosts?.length || 0) +
+			(row.redirection_hosts?.length || 0) +
+			(row.dead_hosts?.length || 0) +
+			(row.streams?.length || 0);
+		if (inUseCount > 0) {
+			await internalNginx.reload();
+		}
+
 		return _.pick(row.meta, internalCertificate.allowedSslFiles);
 	},
 

frontend/src/hooks/useCertificate.ts

@@ -1,11 +1,24 @@
 import { useQuery } from "@tanstack/react-query";
 import { type Certificate, getCertificate } from "src/api/backend";
 
-const fetchCertificate = (id: number) => {
+const fetchCertificate = (id: number | "new") => {
+	if (id === "new") {
+		return Promise.resolve({
+			id: 0,
+			createdOn: "",
+			modifiedOn: "",
+			ownerUserId: 0,
+			provider: "",
+			niceName: "",
+			domainNames: [],
+			expiresOn: "",
+			meta: {},
+		} as Certificate);
+	}
 	return getCertificate(id, ["owner"]);
 };
 
-const useCertificate = (id: number, options = {}) => {
+const useCertificate = (id: number | "new", options = {}) => {
 	return useQuery<Certificate, Error>({
 		queryKey: ["certificate", id],
 		queryFn: () => fetchCertificate(id),