Audit log table and modal

- no longer setup a default
- still able to do that with env vars however

.version

@@ -1 +1 @@
-2.13.0
+2.12.6

README.md

@@ -1,7 +1,7 @@
 <p align="center">
 	<img src="https://nginxproxymanager.com/github.png">
 	<br><br>
-	<img src="https://img.shields.io/badge/version-2.13.0-green.svg?style=for-the-badge">
+	<img src="https://img.shields.io/badge/version-2.12.6-green.svg?style=for-the-badge">
 	<a href="https://hub.docker.com/repository/docker/jc21/nginx-proxy-manager">
 		<img src="https://img.shields.io/docker/stars/jc21/nginx-proxy-manager.svg?style=for-the-badge">
 	</a>
@@ -88,6 +88,14 @@ Sometimes this can take a little bit because of the entropy of keys.
 
 [http://127.0.0.1:81](http://127.0.0.1:81)
 
+Default Admin User:
+```
+Email:    admin@example.com
+Password: changeme
+```
+
+Immediately after logging in with this default user you will be asked to modify your details and change your password.
+
 
 ## Contributing
 

backend/internal/certificate.js

@@ -13,7 +13,6 @@ import utils from "../lib/utils.js";
 import { ssl as logger } from "../logger.js";
 import certificateModel from "../models/certificate.js";
 import tokenModel from "../models/token.js";
-import userModel from "../models/user.js";
 import internalAuditLog from "./audit-log.js";
 import internalHost from "./host.js";
 import internalNginx from "./nginx.js";
@@ -82,7 +81,7 @@ const internalCertificate = {
 											Promise.resolve({
 												permission_visibility: "all",
 											}),
-										token: tokenModel(),
+										token: new tokenModel(),
 									},
 									{ id: certificate.id },
 								)
@@ -119,7 +118,10 @@ const internalCertificate = {
 			data.nice_name = data.domain_names.join(", ");
 		}
 
-		const certificate = await certificateModel.query().insertAndFetch(data).then(utils.omitRow(omissions()));
+		const certificate = await certificateModel
+			.query()
+			.insertAndFetch(data)
+			.then(utils.omitRow(omissions()));
 
 		if (certificate.provider === "letsencrypt") {
 			// Request a new Cert from LE. Let the fun begin.
@@ -137,19 +139,12 @@ const internalCertificate = {
 			// 2. Disable them in nginx temporarily
 			await internalCertificate.disableInUseHosts(inUseResult);
 
-			const user = await userModel.query().where("is_deleted", 0).andWhere("id", data.owner_user_id).first();
-			if (!user || !user.email) {
-				throw new error.ValidationError(
-					"A valid email address must be set on your user account to use Let's Encrypt",
-				);
-			}
-
 			// With DNS challenge no config is needed, so skip 3 and 5.
 			if (certificate.meta?.dns_challenge) {
 				try {
 					await internalNginx.reload();
 					// 4. Request cert
-					await internalCertificate.requestLetsEncryptSslWithDnsChallenge(certificate, user.email);
+					await internalCertificate.requestLetsEncryptSslWithDnsChallenge(certificate);
 					await internalNginx.reload();
 					// 6. Re-instate previously disabled hosts
 					await internalCertificate.enableInUseHosts(inUseResult);
@@ -164,9 +159,9 @@ const internalCertificate = {
 				try {
 					await internalNginx.generateLetsEncryptRequestConfig(certificate);
 					await internalNginx.reload();
-					setTimeout(() => {}, 5000);
+					setTimeout(() => {}, 5000)
 					// 4. Request cert
-					await internalCertificate.requestLetsEncryptSsl(certificate, user.email);
+					await internalCertificate.requestLetsEncryptSsl(certificate);
 					// 5. Remove LE config
 					await internalNginx.deleteLetsEncryptRequestConfig(certificate);
 					await internalNginx.reload();
@@ -209,7 +204,8 @@ const internalCertificate = {
 		data.meta = _.assign({}, data.meta || {}, certificate.meta);
 
 		// Add to audit log
-		await internalAuditLog.add(access, {
+		await internalAuditLog
+			.add(access, {
 				action: "created",
 				object_type: "certificate",
 				object_id: certificate.id,
@@ -252,7 +248,8 @@ const internalCertificate = {
 		}
 
 		// Add to audit log
-		await internalAuditLog.add(access, {
+		await internalAuditLog
+			.add(access, {
 				action: "updated",
 				object_type: "certificate",
 				object_id: row.id,
@@ -271,7 +268,7 @@ const internalCertificate = {
 	 * @return {Promise}
 	 */
 	get: async (access, data) => {
-		const accessData = await access.can("certificates:get", data.id);
+		const accessData = await access.can("certificates:get", data.id)
 		const query = certificateModel
 			.query()
 			.where("is_deleted", 0)
@@ -370,7 +367,10 @@ const internalCertificate = {
 			throw new error.ItemNotFoundError(data.id);
 		}
 
-		await certificateModel.query().where("id", row.id).patch({
+		await certificateModel
+			.query()
+			.where("id", row.id)
+			.patch({
 				is_deleted: 1,
 			});
 
@@ -406,7 +406,10 @@ const internalCertificate = {
 			.query()
 			.where("is_deleted", 0)
 			.groupBy("id")
-			.allowGraph("[owner,proxy_hosts,redirection_hosts,dead_hosts]")
+			.allowGraph("[owner]")
+			.allowGraph("[proxy_hosts]")
+			.allowGraph("[redirection_hosts]")
+			.allowGraph("[dead_hosts]")
 			.orderBy("nice_name", "ASC");
 
 		if (accessData.permission_visibility !== "all") {
@@ -435,7 +438,10 @@ const internalCertificate = {
 	 * @returns {Promise}
 	 */
 	getCount: async (userId, visibility) => {
-		const query = certificateModel.query().count("id as count").where("is_deleted", 0);
+		const query = certificateModel
+			.query()
+			.count("id as count")
+			.where("is_deleted", 0);
 
 		if (visibility !== "all") {
 			query.andWhere("owner_user_id", userId);
@@ -498,10 +504,12 @@ const internalCertificate = {
 	 * @param   {Access}   access
 	 * @param   {Object}   data
 	 * @param   {Array}    data.domain_names
+	 * @param   {String}   data.meta.letsencrypt_email
+	 * @param   {Boolean}  data.meta.letsencrypt_agree
 	 * @returns {Promise}
 	 */
 	createQuickCertificate: async (access, data) => {
-		return await internalCertificate.create(access, {
+		return internalCertificate.create(access, {
 			provider: "letsencrypt",
 			domain_names: data.domain_names,
 			meta: data.meta,
@@ -576,7 +584,7 @@ const internalCertificate = {
 			}
 		});
 
-		const certificate = await internalCertificate.update(access, {
+		const certificate = internalCertificate.update(access, {
 			id: data.id,
 			expires_on: moment(validations.certificate.dates.to, "X").format("YYYY-MM-DD HH:mm:ss"),
 			domain_names: [validations.certificate.cn],
@@ -647,7 +655,7 @@ const internalCertificate = {
 		const certData = {};
 
 		try {
-			const result = await utils.execFile("openssl", ["x509", "-in", certificateFile, "-subject", "-noout"]);
+			const result = await utils.execFile("openssl", ["x509", "-in", certificateFile, "-subject", "-noout"])
 			// Examples:
 			// subject=CN = *.jc21.com
 			// subject=CN = something.example.com
@@ -734,10 +742,9 @@ const internalCertificate = {
 	/**
 	 * Request a certificate using the http challenge
 	 * @param   {Object}  certificate   the certificate row
-	 * @param   {String}  email         the email address to use for registration
 	 * @returns {Promise}
 	 */
-	requestLetsEncryptSsl: async (certificate, email) => {
+	requestLetsEncryptSsl: async (certificate) => {
 		logger.info(
 			`Requesting LetsEncrypt certificates for Cert #${certificate.id}: ${certificate.domain_names.join(", ")}`,
 		);
@@ -756,7 +763,7 @@ const internalCertificate = {
 			"--authenticator",
 			"webroot",
 			"--email",
-			email,
+			certificate.meta.letsencrypt_email,
 			"--preferred-challenges",
 			"dns,http",
 			"--domains",
@@ -775,10 +782,9 @@ const internalCertificate = {
 
 	/**
 	 * @param   {Object}   certificate  the certificate row
-	 * @param   {String}   email        the email address to use for registration
 	 * @returns {Promise}
 	 */
-	requestLetsEncryptSslWithDnsChallenge: async (certificate, email) => {
+	requestLetsEncryptSslWithDnsChallenge: async (certificate) => {
 		await installPlugin(certificate.meta.dns_provider);
 		const dnsPlugin = dnsPlugins[certificate.meta.dns_provider];
 		logger.info(
@@ -804,7 +810,7 @@ const internalCertificate = {
 			`npm-${certificate.id}`,
 			"--agree-tos",
 			"--email",
-			email,
+			certificate.meta.letsencrypt_email,
 			"--domains",
 			certificate.domain_names.join(","),
 			"--authenticator",
@@ -844,7 +850,7 @@ const internalCertificate = {
 	 * @returns {Promise}
 	 */
 	renew: async (access, data) => {
-		await access.can("certificates:update", data);
+		await access.can("certificates:update", data)
 		const certificate = await internalCertificate.get(access, data);
 
 		if (certificate.provider === "letsencrypt") {
@@ -857,7 +863,9 @@ const internalCertificate = {
 				`${internalCertificate.getLiveCertPath(certificate.id)}/fullchain.pem`,
 			);
 
-			const updatedCertificate = await certificateModel.query().patchAndFetchById(certificate.id, {
+			const updatedCertificate = await certificateModel
+				.query()
+				.patchAndFetchById(certificate.id, {
 					expires_on: moment(certInfo.dates.to, "X").format("YYYY-MM-DD HH:mm:ss"),
 				});
 
@@ -1154,9 +1162,7 @@ const internalCertificate = {
 				return "no-host";
 			}
 			// Other errors
-			logger.info(
+			logger.info(`HTTP challenge test failed for domain ${domain} because code ${result.responsecode} was returned`);
-				`HTTP challenge test failed for domain ${domain} because code ${result.responsecode} was returned`,
-			);
 			return `other:${result.responsecode}`;
 		}
 
@@ -1198,7 +1204,7 @@ const internalCertificate = {
 
 	getLiveCertPath: (certificateId) => {
 		return `/etc/letsencrypt/live/npm-${certificateId}`;
-	},
+	}
 };
 
 export default internalCertificate;

backend/internal/dead-host.js

@@ -54,21 +54,10 @@ const internalDeadHost = {
 			thisData.advanced_config = "";
 		}
 
-		const row = await deadHostModel.query()
+		const row = await deadHostModel.query().insertAndFetch(thisData).then(utils.omitRow(omissions()));
-			.insertAndFetch(thisData)
-			.then(utils.omitRow(omissions()));
-
-		// Add to audit log
-		await internalAuditLog.add(access, {
-			action: "created",
-			object_type: "dead-host",
-			object_id: row.id,
-			meta: thisData,
-		});
 
 		if (createCertificate) {
 			const cert = await internalCertificate.createQuickCertificate(access, data);
-
 			// update host with cert id
 			await internalDeadHost.update(access, {
 				id: row.id,
@@ -82,13 +71,17 @@ const internalDeadHost = {
 			expand: ["certificate", "owner"],
 		});
 
-		// Sanity check
-		if (createCertificate && !freshRow.certificate_id) {
-			throw new errs.InternalValidationError("The host was created but the Certificate creation failed.");
-		}
-
 		// Configure nginx
 		await internalNginx.configure(deadHostModel, "dead_host", freshRow);
+		data.meta = _.assign({}, data.meta || {}, freshRow.meta);
+
+		// Add to audit log
+		await internalAuditLog.add(access, {
+			action: "created",
+			object_type: "dead-host",
+			object_id: freshRow.id,
+			meta: data,
+		});
 
 		return freshRow;
 	},
@@ -101,6 +94,7 @@ const internalDeadHost = {
 	 */
 	update: async (access, data) => {
 		const createCertificate = data.certificate_id === "new";
+
 		if (createCertificate) {
 			delete data.certificate_id;
 		}
@@ -153,13 +147,6 @@ const internalDeadHost = {
 
 		thisData = internalHost.cleanSslHstsData(thisData, row);
 
-
-		// do the row update
-		await deadHostModel
-			.query()
-			.where({id: data.id})
-			.patch(data);
-
 		// Add to audit log
 		await internalAuditLog.add(access, {
 			action: "updated",
@@ -240,7 +227,6 @@ const internalDeadHost = {
 		// Delete Nginx Config
 		await internalNginx.deleteConfig("dead_host", row);
 		await internalNginx.reload();
-
 		// Add to audit log
 		await internalAuditLog.add(access, {
 			action: "deleted",
@@ -248,7 +234,6 @@ const internalDeadHost = {
 			object_id: row.id,
 			meta: _.omit(row, omissions()),
 		});
-		return true;
 	},
 
 	/**

backend/internal/nginx.js

@@ -301,11 +301,8 @@ const internalNginx = {
 	 * @param   {String}  filename
 	 */
 	deleteFile: (filename) => {
-		if (!fs.existsSync(filename)) {
-			return;
-		}
-		try {
 		logger.debug(`Deleting file: ${filename}`);
+		try {
 			fs.unlinkSync(filename);
 		} catch (err) {
 			logger.debug("Could not delete file:", JSON.stringify(err, null, 2));

backend/internal/proxy-host.js

@@ -422,6 +422,7 @@ const internalProxyHost = {
 	 */
 	getAll: async (access, expand, searchQuery) => {
 		const accessData = await access.can("proxy_hosts:list");
+
 		const query = proxyHostModel
 			.query()
 			.where("is_deleted", 0)
@@ -445,9 +446,11 @@ const internalProxyHost = {
 		}
 
 		const rows = await query.then(utils.omitRows(omissions()));
+
 		if (typeof expand !== "undefined" && expand !== null && expand.indexOf("certificate") !== -1) {
 			return internalHost.cleanAllRowsCertificateMeta(rows);
 		}
+
 		return rows;
 	},
 

backend/internal/stream.js

@@ -348,7 +348,7 @@ const internalStream = {
 						// Add to audit log
 						return internalAuditLog.add(access, {
 							action: "disabled",
-							object_type: "stream",
+							object_type: "stream-host",
 							object_id: row.id,
 							meta: _.omit(row, omissions()),
 						});

backend/internal/user.js

@@ -131,7 +131,7 @@ const internalUser = {
 						action: "updated",
 						object_type: "user",
 						object_id: user.id,
-						meta: { ...data, id: user.id, name: user.name },
+						meta: data,
 					})
 					.then(() => {
 						return user;

backend/lib/access.js

@@ -131,7 +131,7 @@ export default function (tokenString) {
 						const rows = await query;
 						objects = [];
 						_.forEach(rows, (ruleRow) => {
-							objects.push(ruleRow.id);
+							result.push(ruleRow.id);
 						});
 
 						// enum should not have less than 1 item

backend/lib/certbot.js

@@ -6,6 +6,46 @@ import utils from "./utils.js";
 
 const CERTBOT_VERSION_REPLACEMENT = "$(certbot --version | grep -Eo '[0-9](\\.[0-9]+)+')";
 
+/**
+ * @param {array} pluginKeys
+ */
+const installPlugins = async (pluginKeys) => {
+	let hasErrors = false;
+
+	return new Promise((resolve, reject) => {
+		if (pluginKeys.length === 0) {
+			resolve();
+			return;
+		}
+
+		batchflow(pluginKeys)
+			.sequential()
+			.each((_i, pluginKey, next) => {
+				certbot
+					.installPlugin(pluginKey)
+					.then(() => {
+						next();
+					})
+					.catch((err) => {
+						hasErrors = true;
+						next(err);
+					});
+			})
+			.error((err) => {
+				logger.error(err.message);
+			})
+			.end(() => {
+				if (hasErrors) {
+					reject(
+						new errs.CommandError("Some plugins failed to install. Please check the logs above", 1),
+					);
+				} else {
+					resolve();
+				}
+			});
+	});
+};
+
 /**
  * Installs a cerbot plugin given the key for the object from
  * ../global/certbot-dns-plugins.json
@@ -44,43 +84,4 @@ const installPlugin = async (pluginKey) => {
 		});
 };
 
-/**
- * @param {array} pluginKeys
- */
-const installPlugins = async (pluginKeys) => {
-	let hasErrors = false;
-
-	return new Promise((resolve, reject) => {
-		if (pluginKeys.length === 0) {
-			resolve();
-			return;
-		}
-
-		batchflow(pluginKeys)
-			.sequential()
-			.each((_i, pluginKey, next) => {
-				installPlugin(pluginKey)
-					.then(() => {
-						next();
-					})
-					.catch((err) => {
-						hasErrors = true;
-						next(err);
-					});
-			})
-			.error((err) => {
-				logger.error(err.message);
-			})
-			.end(() => {
-				if (hasErrors) {
-					reject(
-						new errs.CommandError("Some plugins failed to install. Please check the logs above", 1),
-					);
-				} else {
-					resolve();
-				}
-			});
-	});
-};
-
 export { installPlugins, installPlugin };

backend/routes/nginx/certificates.js

@@ -1,5 +1,4 @@
 import express from "express";
-import dnsPlugins from "../../global/certbot-dns-plugins.json" with { type: "json" };
 import internalCertificate from "../../internal/certificate.js";
 import errs from "../../lib/error.js";
 import jwtdecode from "../../lib/express/jwt-decode.js";
@@ -73,40 +72,6 @@ router
 		}
 	});
 
-/**
- * /api/nginx/certificates/dns-providers
- */
-router
-	.route("/dns-providers")
-	.options((_, res) => {
-		res.sendStatus(204);
-	})
-	.all(jwtdecode())
-
-	/**
-	 * GET /api/nginx/certificates/dns-providers
-	 *
-	 * Get list of all supported DNS providers
-	 */
-	.get(async (req, res, next) => {
-		try {
-			if (!res.locals.access.token.getUserId()) {
-				throw new errs.PermissionError("Login required");
-			}
-			const clean = Object.keys(dnsPlugins).map((key) => ({
-				id: key,
-				name: dnsPlugins[key].name,
-				credentials: dnsPlugins[key].credentials,
-			}));
-
-			clean.sort((a, b) => a.name.localeCompare(b.name));
-			res.status(200).send(clean);
-		} catch (err) {
-			logger.debug(`${req.method.toUpperCase()} ${req.path}: ${err}`);
-			next(err);
-		}
-	});
-
 /**
  * Test HTTP challenge for domains
  *
@@ -142,41 +107,6 @@ router
 		}
 	});
 
-
-/**
- * Validate Certs before saving
- *
- * /api/nginx/certificates/validate
- */
-router
-	.route("/validate")
-	.options((_, res) => {
-		res.sendStatus(204);
-	})
-	.all(jwtdecode())
-
-	/**
-	 * POST /api/nginx/certificates/validate
-	 *
-	 * Validate certificates
-	 */
-	.post(async (req, res, next) => {
-		if (!req.files) {
-			res.status(400).send({ error: "No files were uploaded" });
-			return;
-		}
-
-		try {
-			const result = await internalCertificate.validate({
-				files: req.files,
-			});
-			res.status(200).send(result);
-		} catch (err) {
-			logger.debug(`${req.method.toUpperCase()} ${req.path}: ${err}`);
-			next(err);
-		}
-	});
-
 /**
  * Specific certificate
  *
@@ -336,4 +266,38 @@ router
 		}
 	});
 
+/**
+ * Validate Certs before saving
+ *
+ * /api/nginx/certificates/validate
+ */
+router
+	.route("/validate")
+	.options((_, res) => {
+		res.sendStatus(204);
+	})
+	.all(jwtdecode())
+
+	/**
+	 * POST /api/nginx/certificates/validate
+	 *
+	 * Validate certificates
+	 */
+	.post(async (req, res, next) => {
+		if (!req.files) {
+			res.status(400).send({ error: "No files were uploaded" });
+			return;
+		}
+
+		try {
+			const result = await internalCertificate.validate({
+				files: req.files,
+			});
+			res.status(200).send(result);
+		} catch (err) {
+			logger.debug(`${req.method.toUpperCase()} ${req.path}: ${err}`);
+			next(err);
+		}
+	});
+
 export default router;

backend/routes/nginx/dead_hosts.js

@@ -121,7 +121,7 @@ router
 	/**
 	 * PUT /api/nginx/dead-hosts/123
 	 *
-	 * Update an existing dead-host
+	 * Update and existing dead-host
 	 */
 	.put(async (req, res, next) => {
 		try {
@@ -138,7 +138,7 @@ router
 	/**
 	 * DELETE /api/nginx/dead-hosts/123
 	 *
-	 * Delete a dead-host
+	 * Update and existing dead-host
 	 */
 	.delete(async (req, res, next) => {
 		try {

backend/routes/reports.js

@@ -14,12 +14,11 @@ router
 	.options((_, res) => {
 		res.sendStatus(204);
 	})
-	.all(jwtdecode())
 
 	/**
 	 * GET /reports/hosts
 	 */
-	.get(async (req, res, next) => {
+	.get(jwtdecode(), async (req, res, next) => {
 		try {
 			const data = await internalReport.getHostsReport(res.locals.access);
 			res.status(200).send(data);

backend/schema/components/audit-log-list.json

@@ -1,7 +0,0 @@
-{
-	"type": "array",
-	"description": "Audit Log list",
-	"items": {
-		"$ref": "./audit-log-object.json"
-	}
-}

backend/schema/components/audit-log-object.json

@@ -1,16 +1,7 @@
 {
 	"type": "object",
 	"description": "Audit Log object",
-	"required": [
+	"required": ["id", "created_on", "modified_on", "user_id", "object_type", "object_id", "action", "meta"],
-		"id",
-		"created_on",
-		"modified_on",
-		"user_id",
-		"object_type",
-		"object_id",
-		"action",
-		"meta"
-	],
 	"additionalProperties": false,
 	"properties": {
 		"id": {
@@ -36,9 +27,6 @@
 		},
 		"meta": {
 			"type": "object"
-		},
-		"user": {
-			"$ref": "./user-object.json"
 		}
 	}
 }

backend/schema/components/certificate-object.json

@@ -62,9 +62,15 @@
 				"dns_provider_credentials": {
 					"type": "string"
 				},
+				"letsencrypt_agree": {
+					"type": "boolean"
+				},
 				"letsencrypt_certificate": {
 					"type": "object"
 				},
+				"letsencrypt_email": {
+					"$ref": "../common.json#/properties/email"
+				},
 				"propagation_seconds": {
 					"type": "integer",
 					"minimum": 0

backend/schema/components/stream-object.json

@@ -31,7 +31,7 @@
 				},
 				{
 					"type": "string",
-					"format": "^[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}$"
+					"format": "ipv4"
 				},
 				{
 					"type": "string",

backend/schema/paths/audit-log/get.json

@@ -1,6 +1,6 @@
 {
-	"operationId": "getAuditLogs",
+	"operationId": "getAuditLog",
-	"summary": "Get Audit Logs",
+	"summary": "Get Audit Log",
 	"tags": ["Audit Log"],
 	"security": [
 		{
@@ -44,7 +44,7 @@
 						}
 					},
 					"schema": {
-						"$ref": "../../components/audit-log-list.json"
+						"$ref": "../../components/audit-log-object.json"
 					}
 				}
 			}

backend/schema/paths/audit-log/id/get.json

@@ -1,73 +0,0 @@
-{
-	"operationId": "getAuditLog",
-	"summary": "Get Audit Log Event",
-	"tags": [
-		"Audit Log"
-	],
-	"security": [
-		{
-			"BearerAuth": [
-				"audit-log"
-			]
-		}
-	],
-	"parameters": [
-		{
-			"in": "path",
-			"name": "id",
-			"schema": {
-				"type": "integer",
-				"minimum": 1
-			},
-			"required": true,
-			"example": 1
-		}
-	],
-	"responses": {
-		"200": {
-			"description": "200 response",
-			"content": {
-				"application/json": {
-					"examples": {
-						"default": {
-							"value": {
-								"id": 1,
-								"created_on": "2025-09-15T17:27:45.000Z",
-								"modified_on": "2025-09-15T17:27:45.000Z",
-								"user_id": 1,
-								"object_type": "user",
-								"object_id": 1,
-								"action": "created",
-								"meta": {
-									"id": 1,
-									"created_on": "2025-09-15T17:27:45.000Z",
-									"modified_on": "2025-09-15T17:27:45.000Z",
-									"is_disabled": false,
-									"email": "jc@jc21.com",
-									"name": "Jamie",
-									"nickname": "Jamie",
-									"avatar": "//www.gravatar.com/avatar/6193176330f8d38747f038c170ddb193?default=mm",
-									"roles": [
-										"admin"
-									],
-									"permissions": {
-										"visibility": "all",
-										"proxy_hosts": "manage",
-										"redirection_hosts": "manage",
-										"dead_hosts": "manage",
-										"streams": "manage",
-										"access_lists": "manage",
-										"certificates": "manage"
-									}
-								}
-							}
-						}
-					},
-					"schema": {
-						"$ref": "../../../components/audit-log-object.json"
-					}
-				}
-			}
-		}
-	}
-}

backend/schema/paths/nginx/certificates/certID/get.json

@@ -36,6 +36,8 @@
 								"domain_names": ["test.example.com"],
 								"expires_on": "2025-01-07T04:34:18.000Z",
 								"meta": {
+									"letsencrypt_email": "jc@jc21.com",
+									"letsencrypt_agree": true,
 									"dns_challenge": false
 								}
 							}

backend/schema/paths/nginx/certificates/certID/renew/post.json

@@ -37,6 +37,8 @@
 								"nice_name": "My Test Cert",
 								"domain_names": ["test.jc21.supernerd.pro"],
 								"meta": {
+									"letsencrypt_email": "jc@jc21.com",
+									"letsencrypt_agree": true,
 									"dns_challenge": false
 								}
 							}

backend/schema/paths/nginx/certificates/get.json

@@ -36,6 +36,8 @@
 									"domain_names": ["test.example.com"],
 									"expires_on": "2025-01-07T04:34:18.000Z",
 									"meta": {
+										"letsencrypt_email": "jc@jc21.com",
+										"letsencrypt_agree": true,
 										"dns_challenge": false
 									}
 								}

backend/schema/paths/nginx/certificates/post.json

@@ -52,6 +52,8 @@
 								"nice_name": "test.example.com",
 								"domain_names": ["test.example.com"],
 								"meta": {
+									"letsencrypt_email": "jc@jc21.com",
+									"letsencrypt_agree": true,
 									"dns_challenge": false,
 									"letsencrypt_certificate": {
 										"cn": "test.example.com",

backend/schema/paths/nginx/streams/post.json

@@ -37,9 +37,6 @@
 						},
 						"meta": {
 							"$ref": "../../../components/stream-object.json#/properties/meta"
-						},
-						"domain_names": {
-							"$ref": "../../../components/dead-host-object.json#/properties/domain_names"
 						}
 					}
 				}

backend/schema/swagger.json

@@ -29,11 +29,6 @@
 				"$ref": "./paths/audit-log/get.json"
 			}
 		},
-		"/audit-log/{id}": {
-			"get": {
-				"$ref": "./paths/audit-log/id/get.json"
-			}
-		},
 		"/nginx/access-lists": {
 			"get": {
 				"$ref": "./paths/nginx/access-lists/get.json"

backend/setup.js

@@ -121,14 +121,12 @@ const setupCertbotPlugins = async () => {
 				// Make sure credentials file exists
 				const credentials_loc = `/etc/letsencrypt/credentials/credentials-${certificate.id}`;
 				// Escape single quotes and backslashes
-				if (typeof certificate.meta.dns_provider_credentials === "string") {
 				const escapedCredentials = certificate.meta.dns_provider_credentials
 					.replaceAll("'", "\\'")
 					.replaceAll("\\", "\\\\");
 				const credentials_cmd = `[ -f '${credentials_loc}' ] || { mkdir -p /etc/letsencrypt/credentials 2> /dev/null; echo '${escapedCredentials}' > '${credentials_loc}' && chmod 600 '${credentials_loc}'; }`;
 				promises.push(utils.exec(credentials_cmd));
 			}
-			}
 			return true;
 		});
 

docker/dev/Dockerfile

@@ -15,7 +15,7 @@ ENV SUPPRESS_NO_CONFIG_WARNING=1 \
 
 RUN echo "fs.file-max = 65535" > /etc/sysctl.conf \
 	&& apt-get update \
-	&& apt-get install -y jq python3-pip logrotate moreutils \
+	&& apt-get install -y jq python3-pip logrotate \
 	&& apt-get clean \
 	&& rm -rf /var/lib/apt/lists/*
 

docker/docker-compose.dev.yml

@@ -52,7 +52,7 @@ services:
       - ../global:/app/global
       - '/etc/localtime:/etc/localtime:ro'
     healthcheck:
-      test: [ "CMD", "/usr/bin/check-health" ]
+      test: ["CMD", "/usr/bin/check-health"]
       interval: 10s
       timeout: 3s
     depends_on:
@@ -71,14 +71,12 @@ services:
     networks:
       - nginx_proxy_manager
     environment:
-      TZ: "${TZ:-Australia/Brisbane}"
       MYSQL_ROOT_PASSWORD: 'npm'
       MYSQL_DATABASE: 'npm'
       MYSQL_USER: 'npm'
       MYSQL_PASSWORD: 'npm'
     volumes:
       - db_data:/var/lib/mysql
-      - '/etc/localtime:/etc/localtime:ro'
 
   db-postgres:
     image: postgres:latest
@@ -204,7 +202,7 @@ services:
       - nginx_proxy_manager
     restart: unless-stopped
     healthcheck:
-      test: [ 'CMD-SHELL', 'redis-cli ping | grep PONG' ]
+      test: ['CMD-SHELL', 'redis-cli ping | grep PONG']
       start_period: 20s
       interval: 30s
       retries: 5

frontend/biome.json

@@ -64,8 +64,7 @@
                 "useUniqueElementIds": "off"
             },
             "suspicious": {
-                "noExplicitAny": "off",
+                "noExplicitAny": "off"
-                "noArrayIndexKey": "off"
             },
             "performance": {
                 "noDelete": "off"

frontend/package.json

@@ -12,51 +12,48 @@
 		"prettier": "biome format --write ./src",
 		"locale-extract": "formatjs extract 'src/**/*.tsx'",
 		"locale-compile": "formatjs compile-folder src/locale/src src/locale/lang",
-		"locale-sort": "./src/locale/scripts/locale-sort.sh",
 		"test": "vitest"
 	},
 	"dependencies": {
 		"@tabler/core": "^1.4.0",
-		"@tabler/icons-react": "^3.35.0",
+		"@tabler/icons-react": "^3.34.1",
-		"@tanstack/react-query": "^5.89.0",
+		"@tanstack/react-query": "^5.85.6",
 		"@tanstack/react-table": "^8.21.3",
-		"@uiw/react-textarea-code-editor": "^3.1.1",
 		"classnames": "^2.5.1",
-		"country-flag-icons": "^1.5.20",
+		"country-flag-icons": "^1.5.19",
 		"date-fns": "^4.1.0",
 		"formik": "^2.4.6",
 		"generate-password-browser": "^1.1.0",
 		"humps": "^2.0.1",
-		"query-string": "^9.3.1",
+		"query-string": "^9.2.2",
 		"react": "^19.1.1",
 		"react-bootstrap": "^2.10.10",
 		"react-dom": "^19.1.1",
 		"react-intl": "^7.1.11",
-		"react-router-dom": "^7.9.1",
+		"react-router-dom": "^7.8.2",
-		"react-select": "^5.10.2",
 		"react-toastify": "^11.0.5",
-		"rooks": "^9.3.0"
+		"rooks": "^9.2.0"
 	},
 	"devDependencies": {
 		"@biomejs/biome": "^2.2.4",
 		"@formatjs/cli": "^6.7.2",
-		"@tanstack/react-query-devtools": "^5.89.0",
+		"@tanstack/react-query-devtools": "^5.85.6",
 		"@testing-library/dom": "^10.4.1",
 		"@testing-library/jest-dom": "^6.8.0",
 		"@testing-library/react": "^16.3.0",
 		"@types/country-flag-icons": "^1.2.2",
 		"@types/humps": "^2.0.6",
-		"@types/react": "^19.1.13",
+		"@types/react": "^19.1.12",
 		"@types/react-dom": "^19.1.9",
 		"@types/react-table": "^7.7.20",
-		"@vitejs/plugin-react": "^5.0.3",
+		"@vitejs/plugin-react": "^5.0.2",
 		"happy-dom": "^18.0.1",
 		"postcss": "^8.5.6",
 		"postcss-simple-vars": "^7.0.1",
-		"sass": "^1.93.0",
+		"sass": "^1.91.0",
 		"tmp": "^0.2.5",
 		"typescript": "5.9.2",
-		"vite": "^7.1.6",
+		"vite": "^7.1.4",
 		"vite-plugin-checker": "^0.10.3",
 		"vite-tsconfig-paths": "^5.1.4",
 		"vitest": "^3.2.4"

frontend/src/App.css

@@ -1,14 +1,3 @@
-:root {
-	color-scheme: light dark;
-}
-
-.light {
-	color-scheme: light;
-}
-.dark {
-	color-scheme: dark;
-}
-
 .modal-backdrop {
 	--tblr-backdrop-opacity: 0.8 !important;
 }
@@ -23,54 +12,3 @@
 .ml-1 {
 	margin-left: 0.25rem;
 }
-
-.react-select-container {
-	.react-select__control  {
-		color: var(--tblr-body-color);
-		background-color: var(--tblr-bg-forms);
-		border: var(--tblr-border-width) solid var(--tblr-border-color);
-
-		.react-select__input {
-			color: var(--tblr-body-color) !important;
-		}
-
-		.react-select__single-value {
-			color: var(--tblr-body-color);
-		}
-
-		.react-select__multi-value {
-			border: 1px solid var(--tblr-border-color);
-			background-color: var(--tblr-bg-surface-tertiary);
-			color: var(--tblr-secondary) !important;
-
-			.react-select__multi-value__label {
-				color: var(--tblr-secondary) !important;
-			}
-		}
-	}
-
-	.react-select__menu {
-		background-color: var(--tblr-bg-forms);
-
-		.react-select__option {
-			background: rgba(var(--tblr-primary-rgb), .04);
-			color: inherit !important;
-			&.react-select__option--is-focused {
-				background: rgba(var(--tblr-primary-rgb), .1);
-			}
-
-			&.react-select__option--is-focused.react-select__option--is-selected {
-				background: rgba(var(--tblr-primary-rgb), .2);
-			}
-		}
-	}
-}
-
-.textareaMono {
-	font-family: 'Courier New', Courier, monospace !important;
-	resize: vertical;
-}
-
-label.row {
-	cursor: pointer;
-}

frontend/src/api/backend/createAccessList.ts

@@ -1,10 +1,13 @@
 import * as api from "./base";
 import type { AccessList } from "./models";
 
-export async function createAccessList(item: AccessList): Promise<AccessList> {
+export async function createAccessList(item: AccessList, abortController?: AbortController): Promise<AccessList> {
-	return await api.post({
+	return await api.post(
+		{
 			url: "/nginx/access-lists",
 			// todo: only use whitelist of fields for this data
 			data: item,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/createCertificate.ts

@@ -1,10 +1,13 @@
 import * as api from "./base";
 import type { Certificate } from "./models";
 
-export async function createCertificate(item: Certificate): Promise<Certificate> {
+export async function createCertificate(item: Certificate, abortController?: AbortController): Promise<Certificate> {
-	return await api.post({
+	return await api.post(
+		{
 			url: "/nginx/certificates",
 			// todo: only use whitelist of fields for this data
 			data: item,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/createDeadHost.ts

@@ -1,10 +1,13 @@
 import * as api from "./base";
 import type { DeadHost } from "./models";
 
-export async function createDeadHost(item: DeadHost): Promise<DeadHost> {
+export async function createDeadHost(item: DeadHost, abortController?: AbortController): Promise<DeadHost> {
-	return await api.post({
+	return await api.post(
+		{
 			url: "/nginx/dead-hosts",
 			// todo: only use whitelist of fields for this data
 			data: item,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/createProxyHost.ts

@@ -1,10 +1,13 @@
 import * as api from "./base";
 import type { ProxyHost } from "./models";
 
-export async function createProxyHost(item: ProxyHost): Promise<ProxyHost> {
+export async function createProxyHost(item: ProxyHost, abortController?: AbortController): Promise<ProxyHost> {
-	return await api.post({
+	return await api.post(
+		{
 			url: "/nginx/proxy-hosts",
 			// todo: only use whitelist of fields for this data
 			data: item,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/createRedirectionHost.ts

@@ -1,10 +1,16 @@
 import * as api from "./base";
 import type { RedirectionHost } from "./models";
 
-export async function createRedirectionHost(item: RedirectionHost): Promise<RedirectionHost> {
+export async function createRedirectionHost(
-	return await api.post({
+	item: RedirectionHost,
+	abortController?: AbortController,
+): Promise<RedirectionHost> {
+	return await api.post(
+		{
 			url: "/nginx/redirection-hosts",
 			// todo: only use whitelist of fields for this data
 			data: item,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/createStream.ts

@@ -1,10 +1,13 @@
 import * as api from "./base";
 import type { Stream } from "./models";
 
-export async function createStream(item: Stream): Promise<Stream> {
+export async function createStream(item: Stream, abortController?: AbortController): Promise<Stream> {
-	return await api.post({
+	return await api.post(
+		{
 			url: "/nginx/streams",
 			// todo: only use whitelist of fields for this data
 			data: item,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/createUser.ts

@@ -15,11 +15,14 @@ export interface NewUser {
 	roles?: string[];
 }
 
-export async function createUser(item: NewUser, noAuth?: boolean): Promise<User> {
+export async function createUser(item: NewUser, noAuth?: boolean, abortController?: AbortController): Promise<User> {
-	return await api.post({
+	return await api.post(
+		{
 			url: "/users",
 			// todo: only use whitelist of fields for this data
 			data: item,
 			noAuth,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/deleteAccessList.ts

@@ -1,7 +1,10 @@
 import * as api from "./base";
 
-export async function deleteAccessList(id: number): Promise<boolean> {
+export async function deleteAccessList(id: number, abortController?: AbortController): Promise<boolean> {
-	return await api.del({
+	return await api.del(
+		{
 			url: `/nginx/access-lists/${id}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/deleteCertificate.ts

@@ -1,7 +1,10 @@
 import * as api from "./base";
 
-export async function deleteCertificate(id: number): Promise<boolean> {
+export async function deleteCertificate(id: number, abortController?: AbortController): Promise<boolean> {
-	return await api.del({
+	return await api.del(
+		{
 			url: `/nginx/certificates/${id}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/deleteDeadHost.ts

@@ -1,7 +1,10 @@
 import * as api from "./base";
 
-export async function deleteDeadHost(id: number): Promise<boolean> {
+export async function deleteDeadHost(id: number, abortController?: AbortController): Promise<boolean> {
-	return await api.del({
+	return await api.del(
+		{
 			url: `/nginx/dead-hosts/${id}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/deleteProxyHost.ts

@@ -1,7 +1,10 @@
 import * as api from "./base";
 
-export async function deleteProxyHost(id: number): Promise<boolean> {
+export async function deleteProxyHost(id: number, abortController?: AbortController): Promise<boolean> {
-	return await api.del({
+	return await api.del(
+		{
 			url: `/nginx/proxy-hosts/${id}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/deleteRedirectionHost.ts

@@ -1,7 +1,10 @@
 import * as api from "./base";
 
-export async function deleteRedirectionHost(id: number): Promise<boolean> {
+export async function deleteRedirectionHost(id: number, abortController?: AbortController): Promise<boolean> {
-	return await api.del({
+	return await api.del(
+		{
 			url: `/nginx/redirection-hosts/${id}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/deleteStream.ts

@@ -1,7 +1,10 @@
 import * as api from "./base";
 
-export async function deleteStream(id: number): Promise<boolean> {
+export async function deleteStream(id: number, abortController?: AbortController): Promise<boolean> {
-	return await api.del({
+	return await api.del(
+		{
 			url: `/nginx/streams/${id}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/deleteUser.ts

@@ -1,7 +1,10 @@
 import * as api from "./base";
 
-export async function deleteUser(id: number): Promise<boolean> {
+export async function deleteUser(id: number, abortController?: AbortController): Promise<boolean> {
-	return await api.del({
+	return await api.del(
+		{
 			url: `/users/${id}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/downloadCertificate.ts

@@ -1,8 +1,11 @@
 import * as api from "./base";
 import type { Binary } from "./responseTypes";
 
-export async function downloadCertificate(id: number): Promise<Binary> {
+export async function downloadCertificate(id: number, abortController?: AbortController): Promise<Binary> {
-	return await api.get({
+	return await api.get(
+		{
 			url: `/nginx/certificates/${id}/download`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/expansions.ts

@@ -1,6 +0,0 @@
-export type AccessListExpansion = "owner" | "items" | "clients";
-export type AuditLogExpansion = "user";
-export type CertificateExpansion = "owner" | "proxy_hosts" | "redirection_hosts" | "dead_hosts";
-export type HostExpansion = "owner" | "certificate";
-export type ProxyHostExpansion = "owner" | "access_list" | "certificate";
-export type UserExpansion = "permissions";

frontend/src/api/backend/getAccessList.ts

@@ -1,13 +1,11 @@
 import * as api from "./base";
-import type { AccessListExpansion } from "./expansions";
 import type { AccessList } from "./models";
 
-export async function getAccessList(id: number, expand?: AccessListExpansion[], params = {}): Promise<AccessList> {
+export async function getAccessList(id: number, abortController?: AbortController): Promise<AccessList> {
-	return await api.get({
+	return await api.get(
+		{
 			url: `/nginx/access-lists/${id}`,
-		params: {
-			expand: expand?.join(","),
-			...params,
 		},
-	});
+		abortController,
+	);
 }

frontend/src/api/backend/getAccessLists.ts

@@ -1,7 +1,8 @@
 import * as api from "./base";
-import type { AccessListExpansion } from "./expansions";
 import type { AccessList } from "./models";
 
+export type AccessListExpansion = "owner" | "items" | "clients";
+
 export async function getAccessLists(expand?: AccessListExpansion[], params = {}): Promise<AccessList[]> {
 	return await api.get({
 		url: "/nginx/access-lists",

frontend/src/api/backend/getAuditLog.ts

@@ -1,5 +1,5 @@
 import * as api from "./base";
-import type { AuditLogExpansion } from "./expansions";
+import type { AuditLogExpansion } from "./getAuditLogs";
 import type { AuditLog } from "./models";
 
 export async function getAuditLog(id: number, expand?: AuditLogExpansion[], params = {}): Promise<AuditLog> {

frontend/src/api/backend/getAuditLogs.ts

@@ -1,7 +1,8 @@
 import * as api from "./base";
-import type { AuditLogExpansion } from "./expansions";
 import type { AuditLog } from "./models";
 
+export type AuditLogExpansion = "user";
+
 export async function getAuditLogs(expand?: AuditLogExpansion[], params = {}): Promise<AuditLog[]> {
 	return await api.get({
 		url: "/audit-log",

frontend/src/api/backend/getCertificate.ts

@@ -1,13 +1,11 @@
 import * as api from "./base";
-import type { CertificateExpansion } from "./expansions";
 import type { Certificate } from "./models";
 
-export async function getCertificate(id: number, expand?: CertificateExpansion[], params = {}): Promise<Certificate> {
+export async function getCertificate(id: number, abortController?: AbortController): Promise<Certificate> {
-	return await api.get({
+	return await api.get(
+		{
 			url: `/nginx/certificates/${id}`,
-		params: {
-			expand: expand?.join(","),
-			...params,
 		},
-	});
+		abortController,
+	);
 }

frontend/src/api/backend/getCertificateDNSProviders.ts

@@ -1,9 +0,0 @@
-import * as api from "./base";
-import type { DNSProvider } from "./models";
-
-export async function getCertificateDNSProviders(params = {}): Promise<DNSProvider[]> {
-	return await api.get({
-		url: "/nginx/certificates/dns-providers",
-		params,
-	});
-}

frontend/src/api/backend/getCertificates.ts

@@ -1,8 +1,7 @@
 import * as api from "./base";
-import type { CertificateExpansion } from "./expansions";
 import type { Certificate } from "./models";
 
-export async function getCertificates(expand?: CertificateExpansion[], params = {}): Promise<Certificate[]> {
+export async function getCertificates(expand?: string[], params = {}): Promise<Certificate[]> {
 	return await api.get({
 		url: "/nginx/certificates",
 		params: {

frontend/src/api/backend/getDeadHost.ts

@@ -1,13 +1,11 @@
 import * as api from "./base";
-import type { HostExpansion } from "./expansions";
 import type { DeadHost } from "./models";
 
-export async function getDeadHost(id: number, expand?: HostExpansion[], params = {}): Promise<DeadHost> {
+export async function getDeadHost(id: number, abortController?: AbortController): Promise<DeadHost> {
-	return await api.get({
+	return await api.get(
+		{
 			url: `/nginx/dead-hosts/${id}`,
-		params: {
-			expand: expand?.join(","),
-			...params,
 		},
-	});
+		abortController,
+	);
 }

frontend/src/api/backend/getDeadHosts.ts

@@ -1,8 +1,9 @@
 import * as api from "./base";
-import type { HostExpansion } from "./expansions";
 import type { DeadHost } from "./models";
 
-export async function getDeadHosts(expand?: HostExpansion[], params = {}): Promise<DeadHost[]> {
+export type DeadHostExpansion = "owner" | "certificate";
+
+export async function getDeadHosts(expand?: DeadHostExpansion[], params = {}): Promise<DeadHost[]> {
 	return await api.get({
 		url: "/nginx/dead-hosts",
 		params: {

frontend/src/api/backend/getHealth.ts

@@ -1,8 +1,11 @@
 import * as api from "./base";
 import type { HealthResponse } from "./responseTypes";
 
-export async function getHealth(): Promise<HealthResponse> {
+export async function getHealth(abortController?: AbortController): Promise<HealthResponse> {
-	return await api.get({
+	return await api.get(
+		{
 			url: "/",
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/getHostsReport.ts

@@ -1,7 +1,10 @@
 import * as api from "./base";
 
-export async function getHostsReport(): Promise<Record<string, number>> {
+export async function getHostsReport(abortController?: AbortController): Promise<Record<string, number>> {
-	return await api.get({
+	return await api.get(
+		{
 			url: "/reports/hosts",
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/getProxyHost.ts

@@ -1,13 +1,11 @@
 import * as api from "./base";
-import type { ProxyHostExpansion } from "./expansions";
 import type { ProxyHost } from "./models";
 
-export async function getProxyHost(id: number, expand?: ProxyHostExpansion[], params = {}): Promise<ProxyHost> {
+export async function getProxyHost(id: number, abortController?: AbortController): Promise<ProxyHost> {
-	return await api.get({
+	return await api.get(
+		{
 			url: `/nginx/proxy-hosts/${id}`,
-		params: {
-			expand: expand?.join(","),
-			...params,
 		},
-	});
+		abortController,
+	);
 }

frontend/src/api/backend/getProxyHosts.ts

@@ -1,7 +1,8 @@
 import * as api from "./base";
-import type { ProxyHostExpansion } from "./expansions";
 import type { ProxyHost } from "./models";
 
+export type ProxyHostExpansion = "owner" | "access_list" | "certificate";
+
 export async function getProxyHosts(expand?: ProxyHostExpansion[], params = {}): Promise<ProxyHost[]> {
 	return await api.get({
 		url: "/nginx/proxy-hosts",

frontend/src/api/backend/getRedirectionHost.ts

@@ -1,13 +1,11 @@
 import * as api from "./base";
-import type { HostExpansion } from "./expansions";
+import type { ProxyHost } from "./models";
-import type { RedirectionHost } from "./models";
 
-export async function getRedirectionHost(id: number, expand?: HostExpansion[], params = {}): Promise<RedirectionHost> {
+export async function getRedirectionHost(id: number, abortController?: AbortController): Promise<ProxyHost> {
-	return await api.get({
+	return await api.get(
+		{
 			url: `/nginx/redirection-hosts/${id}`,
-		params: {
-			expand: expand?.join(","),
-			...params,
 		},
-	});
+		abortController,
+	);
 }

frontend/src/api/backend/getRedirectionHosts.ts

@@ -1,8 +1,11 @@
 import * as api from "./base";
-import type { HostExpansion } from "./expansions";
 import type { RedirectionHost } from "./models";
 
-export async function getRedirectionHosts(expand?: HostExpansion[], params = {}): Promise<RedirectionHost[]> {
+export type RedirectionHostExpansion = "owner" | "certificate";
+export async function getRedirectionHosts(
+	expand?: RedirectionHostExpansion[],
+	params = {},
+): Promise<RedirectionHost[]> {
 	return await api.get({
 		url: "/nginx/redirection-hosts",
 		params: {

frontend/src/api/backend/getSetting.ts

@@ -1,12 +1,11 @@
 import * as api from "./base";
 import type { Setting } from "./models";
 
-export async function getSetting(id: string, expand?: string[], params = {}): Promise<Setting> {
+export async function getSetting(id: string, abortController?: AbortController): Promise<Setting> {
-	return await api.get({
+	return await api.get(
+		{
 			url: `/settings/${id}`,
-		params: {
-			expand: expand?.join(","),
-			...params,
 		},
-	});
+		abortController,
+	);
 }

frontend/src/api/backend/getStream.ts

@@ -1,13 +1,11 @@
 import * as api from "./base";
-import type { HostExpansion } from "./expansions";
 import type { Stream } from "./models";
 
-export async function getStream(id: number, expand?: HostExpansion[], params = {}): Promise<Stream> {
+export async function getStream(id: number, abortController?: AbortController): Promise<Stream> {
-	return await api.get({
+	return await api.get(
+		{
 			url: `/nginx/streams/${id}`,
-		params: {
-			expand: expand?.join(","),
-			...params,
 		},
-	});
+		abortController,
+	);
 }

frontend/src/api/backend/getStreams.ts

@@ -1,8 +1,9 @@
 import * as api from "./base";
-import type { HostExpansion } from "./expansions";
 import type { Stream } from "./models";
 
-export async function getStreams(expand?: HostExpansion[], params = {}): Promise<Stream[]> {
+export type StreamExpansion = "owner" | "certificate";
+
+export async function getStreams(expand?: StreamExpansion[], params = {}): Promise<Stream[]> {
 	return await api.get({
 		url: "/nginx/streams",
 		params: {

frontend/src/api/backend/getToken.ts

@@ -1,9 +1,19 @@
 import * as api from "./base";
 import type { TokenResponse } from "./responseTypes";
 
-export async function getToken(identity: string, secret: string): Promise<TokenResponse> {
+interface Options {
-	return await api.post({
+	payload: {
-		url: "/tokens",
+		identity: string;
-		data: { identity, secret },
+		secret: string;
-	});
+	};
+}
+
+export async function getToken({ payload }: Options, abortController?: AbortController): Promise<TokenResponse> {
+	return await api.post(
+		{
+			url: "/tokens",
+			data: payload,
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/getUser.ts

@@ -1,14 +1,10 @@
 import * as api from "./base";
-import type { UserExpansion } from "./expansions";
 import type { User } from "./models";
 
-export async function getUser(id: number | string = "me", expand?: UserExpansion[], params = {}): Promise<User> {
+export async function getUser(id: number | string = "me", params = {}): Promise<User> {
 	const userId = id ? id : "me";
 	return await api.get({
 		url: `/users/${userId}`,
-		params: {
+		params,
-			expand: expand?.join(","),
-			...params,
-		},
 	});
 }

frontend/src/api/backend/getUsers.ts

@@ -1,7 +1,8 @@
 import * as api from "./base";
-import type { UserExpansion } from "./expansions";
 import type { User } from "./models";
 
+export type UserExpansion = "permissions";
+
 export async function getUsers(expand?: UserExpansion[], params = {}): Promise<User[]> {
 	return await api.get({
 		url: "/users",

frontend/src/api/backend/index.ts

@@ -13,13 +13,11 @@ export * from "./deleteRedirectionHost";
 export * from "./deleteStream";
 export * from "./deleteUser";
 export * from "./downloadCertificate";
-export * from "./expansions";
 export * from "./getAccessList";
 export * from "./getAccessLists";
 export * from "./getAuditLog";
 export * from "./getAuditLogs";
 export * from "./getCertificate";
-export * from "./getCertificateDNSProviders";
 export * from "./getCertificates";
 export * from "./getDeadHost";
 export * from "./getDeadHosts";
@@ -47,7 +45,6 @@ export * from "./toggleDeadHost";
 export * from "./toggleProxyHost";
 export * from "./toggleRedirectionHost";
 export * from "./toggleStream";
-export * from "./toggleUser";
 export * from "./updateAccessList";
 export * from "./updateAuth";
 export * from "./updateDeadHost";

frontend/src/api/backend/models.ts

@@ -53,7 +53,7 @@ export interface AccessList {
 	meta: Record<string, any>;
 	satisfyAny: boolean;
 	passAuth: boolean;
-	proxyHostCount?: number;
+	proxyHostCount: number;
 	// Expansions:
 	owner?: User;
 	items?: AccessListItem[];
@@ -103,7 +103,6 @@ export interface ProxyHost {
 	modifiedOn: string;
 	ownerUserId: number;
 	domainNames: string[];
-	forwardScheme: string;
 	forwardHost: string;
 	forwardPort: number;
 	accessListId: number;
@@ -115,8 +114,9 @@ export interface ProxyHost {
 	meta: Record<string, any>;
 	allowWebsocketUpgrade: boolean;
 	http2Support: boolean;
+	forwardScheme: string;
 	enabled: boolean;
-	locations?: string[]; // todo: string or object?
+	locations: string[]; // todo: string or object?
 	hstsEnabled: boolean;
 	hstsSubdomains: boolean;
 	// Expansions:
@@ -193,9 +193,3 @@ export interface Setting {
 	value: string;
 	meta: Record<string, any>;
 }
-
-export interface DNSProvider {
-	id: string;
-	name: string;
-	credentials: string;
-}

frontend/src/api/backend/refreshToken.ts

@@ -1,8 +1,11 @@
 import * as api from "./base";
 import type { TokenResponse } from "./responseTypes";
 
-export async function refreshToken(): Promise<TokenResponse> {
+export async function refreshToken(abortController?: AbortController): Promise<TokenResponse> {
-	return await api.get({
+	return await api.get(
+		{
 			url: "/tokens",
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/renewCertificate.ts

@@ -1,8 +1,11 @@
 import * as api from "./base";
 import type { Certificate } from "./models";
 
-export async function renewCertificate(id: number): Promise<Certificate> {
+export async function renewCertificate(id: number, abortController?: AbortController): Promise<Certificate> {
-	return await api.post({
+	return await api.post(
+		{
 			url: `/nginx/certificates/${id}/renew`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/setPermissions.ts

@@ -1,10 +1,17 @@
 import * as api from "./base";
 import type { UserPermissions } from "./models";
 
-export async function setPermissions(userId: number, data: UserPermissions): Promise<boolean> {
+export async function setPermissions(
+	userId: number,
+	data: UserPermissions,
+	abortController?: AbortController,
+): Promise<boolean> {
 	// Remove readonly fields
-	return await api.put({
+	return await api.put(
+		{
 			url: `/users/${userId}/permissions`,
 			data,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/testHttpCertificate.ts

@@ -1,10 +1,16 @@
 import * as api from "./base";
 
-export async function testHttpCertificate(domains: string[]): Promise<Record<string, string>> {
+export async function testHttpCertificate(
-	return await api.get({
+	domains: string[],
+	abortController?: AbortController,
+): Promise<Record<string, string>> {
+	return await api.get(
+		{
 			url: "/nginx/certificates/test-http",
 			params: {
 				domains: domains.join(","),
 			},
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/toggleDeadHost.ts

@@ -1,7 +1,14 @@
 import * as api from "./base";
 
-export async function toggleDeadHost(id: number, enabled: boolean): Promise<boolean> {
+export async function toggleDeadHost(
-	return await api.post({
+	id: number,
+	enabled: boolean,
+	abortController?: AbortController,
+): Promise<boolean> {
+	return await api.post(
+		{
 			url: `/nginx/dead-hosts/${id}/${enabled ? "enable" : "disable"}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/toggleProxyHost.ts

@@ -1,7 +1,14 @@
 import * as api from "./base";
 
-export async function toggleProxyHost(id: number, enabled: boolean): Promise<boolean> {
+export async function toggleProxyHost(
-	return await api.post({
+	id: number,
+	enabled: boolean,
+	abortController?: AbortController,
+): Promise<boolean> {
+	return await api.post(
+		{
 			url: `/nginx/proxy-hosts/${id}/${enabled ? "enable" : "disable"}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/toggleRedirectionHost.ts

@@ -1,7 +1,14 @@
 import * as api from "./base";
 
-export async function toggleRedirectionHost(id: number, enabled: boolean): Promise<boolean> {
+export async function toggleRedirectionHost(
-	return await api.post({
+	id: number,
+	enabled: boolean,
+	abortController?: AbortController,
+): Promise<boolean> {
+	return await api.post(
+		{
 			url: `/nginx/redirection-hosts/${id}/${enabled ? "enable" : "disable"}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/toggleStream.ts

@@ -1,7 +1,10 @@
 import * as api from "./base";
 
-export async function toggleStream(id: number, enabled: boolean): Promise<boolean> {
+export async function toggleStream(id: number, enabled: boolean, abortController?: AbortController): Promise<boolean> {
-	return await api.post({
+	return await api.post(
+		{
 			url: `/nginx/streams/${id}/${enabled ? "enable" : "disable"}`,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/toggleUser.ts

@@ -1,10 +0,0 @@
-import type { User } from "./models";
-import { updateUser } from "./updateUser";
-
-export async function toggleUser(id: number, enabled: boolean): Promise<boolean> {
-	await updateUser({
-		id,
-		isDisabled: !enabled,
-	} as User);
-	return true;
-}

frontend/src/api/backend/updateAccessList.ts

@@ -1,12 +1,15 @@
 import * as api from "./base";
 import type { AccessList } from "./models";
 
-export async function updateAccessList(item: AccessList): Promise<AccessList> {
+export async function updateAccessList(item: AccessList, abortController?: AbortController): Promise<AccessList> {
 	// Remove readonly fields
 	const { id, createdOn: _, modifiedOn: __, ...data } = item;
 
-	return await api.put({
+	return await api.put(
+		{
 			url: `/nginx/access-lists/${id}`,
 			data: data,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/updateAuth.ts

@@ -1,7 +1,12 @@
 import * as api from "./base";
 import type { User } from "./models";
 
-export async function updateAuth(userId: number | "me", newPassword: string, current?: string): Promise<User> {
+export async function updateAuth(
+	userId: number | "me",
+	newPassword: string,
+	current?: string,
+	abortController?: AbortController,
+): Promise<User> {
 	const data = {
 		type: "password",
 		current: current,
@@ -11,8 +16,11 @@ export async function updateAuth(userId: number | "me", newPassword: string, cur
 		data.current = current;
 	}
 
-	return await api.put({
+	return await api.put(
+		{
 			url: `/users/${userId}/auth`,
 			data,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/updateDeadHost.ts

@@ -1,12 +1,15 @@
 import * as api from "./base";
 import type { DeadHost } from "./models";
 
-export async function updateDeadHost(item: DeadHost): Promise<DeadHost> {
+export async function updateDeadHost(item: DeadHost, abortController?: AbortController): Promise<DeadHost> {
 	// Remove readonly fields
 	const { id, createdOn: _, modifiedOn: __, ...data } = item;
 
-	return await api.put({
+	return await api.put(
+		{
 			url: `/nginx/dead-hosts/${id}`,
 			data: data,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/updateProxyHost.ts

@@ -1,12 +1,15 @@
 import * as api from "./base";
 import type { ProxyHost } from "./models";
 
-export async function updateProxyHost(item: ProxyHost): Promise<ProxyHost> {
+export async function updateProxyHost(item: ProxyHost, abortController?: AbortController): Promise<ProxyHost> {
 	// Remove readonly fields
 	const { id, createdOn: _, modifiedOn: __, ...data } = item;
 
-	return await api.put({
+	return await api.put(
+		{
 			url: `/nginx/proxy-hosts/${id}`,
 			data: data,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/updateRedirectionHost.ts

@@ -1,12 +1,18 @@
 import * as api from "./base";
 import type { RedirectionHost } from "./models";
 
-export async function updateRedirectionHost(item: RedirectionHost): Promise<RedirectionHost> {
+export async function updateRedirectionHost(
+	item: RedirectionHost,
+	abortController?: AbortController,
+): Promise<RedirectionHost> {
 	// Remove readonly fields
 	const { id, createdOn: _, modifiedOn: __, ...data } = item;
 
-	return await api.put({
+	return await api.put(
+		{
 			url: `/nginx/redirection-hosts/${id}`,
 			data: data,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/updateSetting.ts

@@ -1,12 +1,15 @@
 import * as api from "./base";
 import type { Setting } from "./models";
 
-export async function updateSetting(item: Setting): Promise<Setting> {
+export async function updateSetting(item: Setting, abortController?: AbortController): Promise<Setting> {
 	// Remove readonly fields
 	const { id, ...data } = item;
 
-	return await api.put({
+	return await api.put(
+		{
 			url: `/settings/${id}`,
 			data: data,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/updateStream.ts

@@ -1,12 +1,15 @@
 import * as api from "./base";
 import type { Stream } from "./models";
 
-export async function updateStream(item: Stream): Promise<Stream> {
+export async function updateStream(item: Stream, abortController?: AbortController): Promise<Stream> {
 	// Remove readonly fields
 	const { id, createdOn: _, modifiedOn: __, ...data } = item;
 
-	return await api.put({
+	return await api.put(
+		{
 			url: `/nginx/streams/${id}`,
 			data: data,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/updateUser.ts

@@ -1,12 +1,15 @@
 import * as api from "./base";
 import type { User } from "./models";
 
-export async function updateUser(item: User): Promise<User> {
+export async function updateUser(item: User, abortController?: AbortController): Promise<User> {
 	// Remove readonly fields
 	const { id, createdOn: _, modifiedOn: __, ...data } = item;
 
-	return await api.put({
+	return await api.put(
+		{
 			url: `/users/${id}`,
 			data: data,
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/uploadCertificate.ts

@@ -6,9 +6,13 @@ export async function uploadCertificate(
 	certificate: string,
 	certificateKey: string,
 	intermediateCertificate?: string,
+	abortController?: AbortController,
 ): Promise<Certificate> {
-	return await api.post({
+	return await api.post(
+		{
 			url: `/nginx/certificates/${id}/upload`,
 			data: { certificate, certificateKey, intermediateCertificate },
-	});
+		},
+		abortController,
+	);
 }

frontend/src/api/backend/validateCertificate.ts

@@ -5,9 +5,13 @@ export async function validateCertificate(
 	certificate: string,
 	certificateKey: string,
 	intermediateCertificate?: string,
+	abortController?: AbortController,
 ): Promise<ValidatedCertificateResponse> {
-	return await api.post({
+	return await api.post(
+		{
 			url: "/nginx/certificates/validate",
 			data: { certificate, certificateKey, intermediateCertificate },
-	});
+		},
+		abortController,
+	);
 }

frontend/src/components/ErrorNotFound.tsx

@@ -1,6 +1,6 @@
+import { intl } from "src/locale";
 import { useNavigate } from "react-router-dom";
 import { Button } from "src/components";
-import { T } from "src/locale";
 
 export function ErrorNotFound() {
 	const navigate = useNavigate();
@@ -8,15 +8,13 @@ export function ErrorNotFound() {
 	return (
 		<div className="container-tight py-4">
 			<div className="empty">
-				<p className="empty-title">
+				<p className="empty-title">{intl.formatMessage({ id: "notfound.title" })}</p>
-					<T id="notfound.title" />
-				</p>
 				<p className="empty-subtitle text-secondary">
-					<T id="notfound.text" />
+					{intl.formatMessage({ id: "notfound.text" })}
 				</p>
 				<div className="empty-action">
 					<Button type="button" size="md" onClick={() => navigate("/")}>
-						<T id="notfound.action" />
+						{intl.formatMessage({ id: "notfound.action" })}
 					</Button>
 				</div>
 			</div>

frontend/src/components/Form/AccessField.tsx

@@ -1,99 +0,0 @@
-import { IconLock, IconLockOpen2 } from "@tabler/icons-react";
-import { Field, useFormikContext } from "formik";
-import type { ReactNode } from "react";
-import Select, { type ActionMeta, components, type OptionProps } from "react-select";
-import type { AccessList } from "src/api/backend";
-import { useAccessLists } from "src/hooks";
-import { DateTimeFormat, intl, T } from "src/locale";
-
-interface AccessOption {
-	readonly value: number;
-	readonly label: string;
-	readonly subLabel: string;
-	readonly icon: ReactNode;
-}
-
-const Option = (props: OptionProps<AccessOption>) => {
-	return (
-		<components.Option {...props}>
-			<div className="flex-fill">
-				<div className="font-weight-medium">
-					{props.data.icon} <strong>{props.data.label}</strong>
-				</div>
-				<div className="text-secondary mt-1 ps-3">{props.data.subLabel}</div>
-			</div>
-		</components.Option>
-	);
-};
-
-interface Props {
-	id?: string;
-	name?: string;
-	label?: string;
-}
-export function AccessField({ name = "accessListId", label = "access.title", id = "accessListId" }: Props) {
-	const { isLoading, isError, error, data } = useAccessLists();
-	const { setFieldValue } = useFormikContext();
-
-	const handleChange = (newValue: any, _actionMeta: ActionMeta<AccessOption>) => {
-		setFieldValue(name, newValue?.value);
-	};
-
-	const options: AccessOption[] =
-		data?.map((item: AccessList) => ({
-			value: item.id || 0,
-			label: item.name,
-			subLabel: intl.formatMessage(
-				{ id: "access.subtitle" },
-				{
-					users: item?.items?.length,
-					rules: item?.clients?.length,
-					date: item?.createdOn ? DateTimeFormat(item?.createdOn) : "N/A",
-				},
-			),
-			icon: <IconLock size={14} className="text-lime" />,
-		})) || [];
-
-	// Public option
-	options?.unshift({
-		value: 0,
-		label: intl.formatMessage({ id: "access.public" }),
-		subLabel: "No basic auth required",
-		icon: <IconLockOpen2 size={14} className="text-red" />,
-	});
-
-	return (
-		<Field name={name}>
-			{({ field, form }: any) => (
-				<div className="mb-3">
-					<label className="form-label" htmlFor={id}>
-						<T id={label} />
-					</label>
-					{isLoading ? <div className="placeholder placeholder-lg col-12 my-3 placeholder-glow" /> : null}
-					{isError ? <div className="invalid-feedback">{`${error}`}</div> : null}
-					{!isLoading && !isError ? (
-						<Select
-							className="react-select-container"
-							classNamePrefix="react-select"
-							defaultValue={options.find((o) => o.value === field.value) || options[0]}
-							options={options}
-							components={{ Option }}
-							styles={{
-								option: (base) => ({
-									...base,
-									height: "100%",
-								}),
-							}}
-							onChange={handleChange}
-						/>
-					) : null}
-					{form.errors[field.name] ? (
-						<div className="invalid-feedback">
-							{form.errors[field.name] && form.touched[field.name] ? form.errors[field.name] : null}
-						</div>
-					) : null}
-				</div>
-			)}
-		</Field>
-	);
-}

frontend/src/components/Form/BasicAuthField.tsx

@@ -1,36 +0,0 @@
-import { useFormikContext } from "formik";
-import { T } from "src/locale";
-
-interface Props {
-	id?: string;
-	name?: string;
-}
-export function BasicAuthField({ name = "items", id = "items" }: Props) {
-	const { setFieldValue } = useFormikContext();
-
-	return (
-		<>
-			<div className="row">
-				<div className="col-6">
-					<label className="form-label" htmlFor="...">
-						<T id="username" />
-					</label>
-				</div>
-				<div className="col-6">
-					<label className="form-label" htmlFor="...">
-						<T id="password" />
-					</label>
-				</div>
-			</div>
-			<div className="row mb-3">
-				<div className="col-6">
-					<input id="name" type="text" required autoComplete="off" className="form-control" />
-				</div>
-				<div className="col-6">
-					<input id="pw" type="password" required autoComplete="off" className="form-control" />
-				</div>
-			</div>
-			<button className="btn">+</button>
-		</>
-	);
-}

frontend/src/components/Form/DNSProviderFields.module.css

@@ -1,8 +0,0 @@
-.dnsChallengeWarning {
-	border: 1px solid var(--tblr-orange-lt);
-	padding: 1rem;
-	border-radius: 0.375rem;
-	margin-top: 1rem;
-	background-color: var(--tblr-cyan-lt);
-}
-

frontend/src/components/Form/DNSProviderFields.tsx

@@ -1,119 +0,0 @@
-import { Field, useFormikContext } from "formik";
-import { useState } from "react";
-import Select, { type ActionMeta } from "react-select";
-import type { DNSProvider } from "src/api/backend";
-import { useDnsProviders } from "src/hooks";
-import styles from "./DNSProviderFields.module.css";
-
-interface DNSProviderOption {
-	readonly value: string;
-	readonly label: string;
-	readonly credentials: string;
-}
-export function DNSProviderFields() {
-	const { values, setFieldValue } = useFormikContext();
-	const { data: dnsProviders, isLoading } = useDnsProviders();
-	const [dnsProviderId, setDnsProviderId] = useState<string | null>(null);
-
-	const v: any = values || {};
-
-	const handleChange = (newValue: any, _actionMeta: ActionMeta<DNSProviderOption>) => {
-		setFieldValue("meta.dnsProvider", newValue?.value);
-		setFieldValue("meta.dnsProviderCredentials", newValue?.credentials);
-		setDnsProviderId(newValue?.value);
-	};
-
-	const options: DNSProviderOption[] =
-		dnsProviders?.map((p: DNSProvider) => ({
-			value: p.id,
-			label: p.name,
-			credentials: p.credentials,
-		})) || [];
-
-	return (
-		<div className={styles.dnsChallengeWarning}>
-			<p className="text-info">
-				This section requires some knowledge about Certbot and DNS plugins. Please consult the respective
-				plugins documentation.
-			</p>
-
-			<Field name="meta.dnsProvider">
-				{({ field }: any) => (
-					<div className="row">
-						<label htmlFor="dnsProvider" className="form-label">
-							DNS Provider
-						</label>
-						<Select
-							className="react-select-container"
-							classNamePrefix="react-select"
-							name={field.name}
-							id="dnsProvider"
-							closeMenuOnSelect={true}
-							isClearable={false}
-							placeholder="Select a Provider..."
-							isLoading={isLoading}
-							isSearchable
-							onChange={handleChange}
-							options={options}
-						/>
-					</div>
-				)}
-			</Field>
-
-			{dnsProviderId ? (
-				<>
-					<Field name="meta.dnsProviderCredentials">
-						{({ field }: any) => (
-							<div className="mt-3">
-								<label htmlFor="dnsProviderCredentials" className="form-label">
-									Credentials File Content
-								</label>
-								<textarea
-									id="dnsProviderCredentials"
-									className="form-control textareaMono"
-									rows={3}
-									spellCheck={false}
-									value={v.meta.dnsProviderCredentials || ""}
-									{...field}
-								/>
-								<div>
-									<small className="text-muted">
-										This plugin requires a configuration file containing an API token or other
-										credentials to your provider
-									</small>
-								</div>
-								<div>
-									<small className="text-danger">
-										This data will be stored as plaintext in the database and in a file!
-									</small>
-								</div>
-							</div>
-						)}
-					</Field>
-					<Field name="meta.propagationSeconds">
-						{({ field }: any) => (
-							<div className="mt-3">
-								<label htmlFor="propagationSeconds" className="form-label">
-									Propagation Seconds
-								</label>
-								<input
-									id="propagationSeconds"
-									type="number"
-									x
-									className="form-control"
-									min={0}
-									max={600}
-									{...field}
-								/>
-								<small className="text-muted">
-									Leave empty to use the plugins default value. Number of seconds to wait for DNS
-									propagation.
-								</small>
-							</div>
-						)}
-					</Field>
-				</>
-			) : null}
-		</div>
-	);
-}

frontend/src/components/Form/DomainNamesField.tsx

@@ -1,82 +0,0 @@
-import { Field, useFormikContext } from "formik";
-import type { ReactNode } from "react";
-import type { ActionMeta, MultiValue } from "react-select";
-import CreatableSelect from "react-select/creatable";
-import { intl, T } from "src/locale";
-import { validateDomain, validateDomains } from "src/modules/Validations";
-
-type SelectOption = {
-	label: string;
-	value: string;
-	color?: string;
-};
-
-interface Props {
-	id?: string;
-	maxDomains?: number;
-	isWildcardPermitted?: boolean;
-	dnsProviderWildcardSupported?: boolean;
-	name?: string;
-	label?: string;
-}
-export function DomainNamesField({
-	name = "domainNames",
-	label = "domain-names",
-	id = "domainNames",
-	maxDomains,
-	isWildcardPermitted = true,
-	dnsProviderWildcardSupported = true,
-}: Props) {
-	const { setFieldValue } = useFormikContext();
-
-	const handleChange = (v: MultiValue<SelectOption>, _actionMeta: ActionMeta<SelectOption>) => {
-		const doms = v?.map((i: SelectOption) => {
-			return i.value;
-		});
-		setFieldValue(name, doms);
-	};
-
-	const helperTexts: ReactNode[] = [];
-	if (maxDomains) {
-		helperTexts.push(<T id="domain-names.max" data={{ count: maxDomains }} />);
-	}
-	if (!isWildcardPermitted) {
-		helperTexts.push(<T id="domain-names.wildcards-not-permitted" />);
-	} else if (!dnsProviderWildcardSupported) {
-		helperTexts.push(<T id="domain-names.wildcards-not-supported" />);
-	}
-
-	return (
-		<Field name={name} validate={validateDomains(isWildcardPermitted && dnsProviderWildcardSupported, maxDomains)}>
-			{({ field, form }: any) => (
-				<div className="mb-3">
-					<label className="form-label" htmlFor={id}>
-						<T id={label} />
-					</label>
-					<CreatableSelect
-						className="react-select-container"
-						classNamePrefix="react-select"
-						name={field.name}
-						id={id}
-						closeMenuOnSelect={true}
-						isClearable={false}
-						isValidNewOption={validateDomain(isWildcardPermitted && dnsProviderWildcardSupported)}
-						isMulti
-						placeholder={intl.formatMessage({ id: "domain-names.placeholder" })}
-						onChange={handleChange}
-						value={field.value?.map((d: string) => ({ label: d, value: d }))}
-					/>
-					{form.errors[field.name] && form.touched[field.name] ? (
-						<small className="text-danger">{form.errors[field.name]}</small>
-					) : helperTexts.length ? (
-						helperTexts.map((i, idx) => (
-							<small key={idx} className="text-info">
-								{i}
-							</small>
-						))
-					) : null}
-				</div>
-			)}
-		</Field>
-	);
-}

frontend/src/components/Form/NginxConfigField.tsx

@@ -1,40 +0,0 @@
-import CodeEditor from "@uiw/react-textarea-code-editor";
-import { Field } from "formik";
-import { intl, T } from "src/locale";
-
-interface Props {
-	id?: string;
-	name?: string;
-	label?: string;
-}
-export function NginxConfigField({
-	name = "advancedConfig",
-	label = "nginx-config.label",
-	id = "advancedConfig",
-}: Props) {
-	return (
-		<Field name={name}>
-			{({ field }: any) => (
-				<div className="mt-3">
-					<label htmlFor={id} className="form-label">
-						<T id={label} />
-					</label>
-					<CodeEditor
-						language="nginx"
-						placeholder={intl.formatMessage({ id: "nginx-config.placeholder" })}
-						padding={15}
-						data-color-mode="dark"
-						minHeight={200}
-						indentWidth={2}
-						style={{
-							fontFamily: "ui-monospace,SFMono-Regular,SF Mono,Consolas,Liberation Mono,Menlo,monospace",
-							borderRadius: "0.3rem",
-							minHeight: "200px",
-						}}
-						{...field}
-					/>
-				</div>
-			)}
-		</Field>
-	);
-}

frontend/src/components/Form/SSLCertificateField.tsx

@@ -1,138 +0,0 @@
-import { IconShield } from "@tabler/icons-react";
-import { Field, useFormikContext } from "formik";
-import Select, { type ActionMeta, components, type OptionProps } from "react-select";
-import type { Certificate } from "src/api/backend";
-import { useCertificates } from "src/hooks";
-import { DateTimeFormat, T } from "src/locale";
-
-interface CertOption {
-	readonly value: number | "new";
-	readonly label: string;
-	readonly subLabel: string;
-	readonly icon: React.ReactNode;
-}
-
-const Option = (props: OptionProps<CertOption>) => {
-	return (
-		<components.Option {...props}>
-			<div className="flex-fill">
-				<div className="font-weight-medium">
-					{props.data.icon} <strong>{props.data.label}</strong>
-				</div>
-				<div className="text-secondary mt-1 ps-3">{props.data.subLabel}</div>
-			</div>
-		</components.Option>
-	);
-};
-
-interface Props {
-	id?: string;
-	name?: string;
-	label?: string;
-	required?: boolean;
-	allowNew?: boolean;
-	forHttp?: boolean; // the sslForced, http2Support, hstsEnabled, hstsSubdomains fields
-}
-export function SSLCertificateField({
-	name = "certificateId",
-	label = "ssl-certificate",
-	id = "certificateId",
-	required,
-	allowNew,
-	forHttp = true,
-}: Props) {
-	const { isLoading, isError, error, data } = useCertificates();
-	const { values, setFieldValue } = useFormikContext();
-	const v: any = values || {};
-
-	const handleChange = (newValue: any, _actionMeta: ActionMeta<CertOption>) => {
-		setFieldValue(name, newValue?.value);
-		const {
-			sslForced,
-			http2Support,
-			hstsEnabled,
-			hstsSubdomains,
-			dnsChallenge,
-			dnsProvider,
-			dnsProviderCredentials,
-			propagationSeconds,
-		} = v;
-		if (forHttp && !newValue?.value) {
-			sslForced && setFieldValue("sslForced", false);
-			http2Support && setFieldValue("http2Support", false);
-			hstsEnabled && setFieldValue("hstsEnabled", false);
-			hstsSubdomains && setFieldValue("hstsSubdomains", false);
-		}
-		if (newValue?.value !== "new") {
-			dnsChallenge && setFieldValue("dnsChallenge", undefined);
-			dnsProvider && setFieldValue("dnsProvider", undefined);
-			dnsProviderCredentials && setFieldValue("dnsProviderCredentials", undefined);
-			propagationSeconds && setFieldValue("propagationSeconds", undefined);
-		}
-	};
-
-	const options: CertOption[] =
-		data?.map((cert: Certificate) => ({
-			value: cert.id,
-			label: cert.niceName,
-			subLabel: `${cert.provider === "letsencrypt" ? "Let's Encrypt" : cert.provider} &mdash; Expires: ${
-				cert.expiresOn ? DateTimeFormat(cert.expiresOn) : "N/A"
-			}`,
-			icon: <IconShield size={14} className="text-pink" />,
-		})) || [];
-
-	// Prepend the Add New option
-	if (allowNew) {
-		options?.unshift({
-			value: "new",
-			label: "Request a new Certificate",
-			subLabel: "with Let's Encrypt",
-			icon: <IconShield size={14} className="text-lime" />,
-		});
-	}
-
-	// Prepend the None option
-	if (!required) {
-		options?.unshift({
-			value: 0,
-			label: "None",
-			subLabel: forHttp ? "This host will not use HTTPS" : "No certificate assigned",
-			icon: <IconShield size={14} className="text-red" />,
-		});
-	}
-
-	return (
-		<Field name={name}>
-			{({ field, form }: any) => (
-				<div className="mb-3">
-					<label className="form-label" htmlFor={id}>
-						<T id={label} />
-					</label>
-					{isLoading ? <div className="placeholder placeholder-lg col-12 my-3 placeholder-glow" /> : null}
-					{isError ? <div className="invalid-feedback">{`${error}`}</div> : null}
-					{!isLoading && !isError ? (
-						<Select
-							className="react-select-container"
-							classNamePrefix="react-select"
-							defaultValue={options.find((o) => o.value === field.value) || options[0]}
-							options={options}
-							components={{ Option }}
-							styles={{
-								option: (base) => ({
-									...base,
-									height: "100%",
-								}),
-							}}
-							onChange={handleChange}
-						/>
-					) : null}
-					{form.errors[field.name] ? (
-						<div className="invalid-feedback">
-							{form.errors[field.name] && form.touched[field.name] ? form.errors[field.name] : null}
-						</div>
-					) : null}
-				</div>
-			)}
-		</Field>
-	);
-}

frontend/src/components/Form/SSLOptionsFields.tsx

@@ -1,145 +0,0 @@
-import cn from "classnames";
-import { Field, useFormikContext } from "formik";
-import { DNSProviderFields, DomainNamesField } from "src/components";
-import { T } from "src/locale";
-
-interface Props {
-	forHttp?: boolean; // the sslForced, http2Support, hstsEnabled, hstsSubdomains fields
-	forceDNSForNew?: boolean;
-	requireDomainNames?: boolean; // used for streams
-	color?: string;
-}
-export function SSLOptionsFields({ forHttp = true, forceDNSForNew, requireDomainNames, color = "bg-cyan" }: Props) {
-	const { values, setFieldValue } = useFormikContext();
-	const v: any = values || {};
-
-	const newCertificate = v?.certificateId === "new";
-	const hasCertificate = newCertificate || (v?.certificateId && v?.certificateId > 0);
-	const { sslForced, http2Support, hstsEnabled, hstsSubdomains, meta } = v;
-	const { dnsChallenge } = meta || {};
-
-	if (forceDNSForNew && newCertificate && !dnsChallenge) {
-		setFieldValue("meta.dnsChallenge", true);
-	}
-
-	const handleToggleChange = (e: any, fieldName: string) => {
-		setFieldValue(fieldName, e.target.checked);
-		if (fieldName === "meta.dnsChallenge" && !e.target.checked) {
-			setFieldValue("meta.dnsProvider", undefined);
-			setFieldValue("meta.dnsProviderCredentials", undefined);
-			setFieldValue("meta.propagationSeconds", undefined);
-		}
-	};
-
-	const toggleClasses = "form-check-input";
-	const toggleEnabled = cn(toggleClasses, color);
-
-	const getHttpOptions = () => (
-		<div>
-			<div className="row">
-				<div className="col-6">
-					<Field name="sslForced">
-						{({ field }: any) => (
-							<label className="form-check form-switch mt-1">
-								<input
-									className={sslForced ? toggleEnabled : toggleClasses}
-									type="checkbox"
-									checked={!!sslForced}
-									onChange={(e) => handleToggleChange(e, field.name)}
-									disabled={!hasCertificate}
-								/>
-								<span className="form-check-label">
-									<T id="domains.force-ssl" />
-								</span>
-							</label>
-						)}
-					</Field>
-				</div>
-				<div className="col-6">
-					<Field name="http2Support">
-						{({ field }: any) => (
-							<label className="form-check form-switch mt-1">
-								<input
-									className={http2Support ? toggleEnabled : toggleClasses}
-									type="checkbox"
-									checked={!!http2Support}
-									onChange={(e) => handleToggleChange(e, field.name)}
-									disabled={!hasCertificate}
-								/>
-								<span className="form-check-label">
-									<T id="domains.http2-support" />
-								</span>
-							</label>
-						)}
-					</Field>
-				</div>
-			</div>
-			<div className="row">
-				<div className="col-6">
-					<Field name="hstsEnabled">
-						{({ field }: any) => (
-							<label className="form-check form-switch mt-1">
-								<input
-									className={hstsEnabled ? toggleEnabled : toggleClasses}
-									type="checkbox"
-									checked={!!hstsEnabled}
-									onChange={(e) => handleToggleChange(e, field.name)}
-									disabled={!hasCertificate || !sslForced}
-								/>
-								<span className="form-check-label">
-									<T id="domains.hsts-enabled" />
-								</span>
-							</label>
-						)}
-					</Field>
-				</div>
-				<div className="col-6">
-					<Field name="hstsSubdomains">
-						{({ field }: any) => (
-							<label className="form-check form-switch mt-1">
-								<input
-									className={hstsSubdomains ? toggleEnabled : toggleClasses}
-									type="checkbox"
-									checked={!!hstsSubdomains}
-									onChange={(e) => handleToggleChange(e, field.name)}
-									disabled={!hasCertificate || !hstsEnabled}
-								/>
-								<span className="form-check-label">
-									<T id="domains.hsts-subdomains" />
-								</span>
-							</label>
-						)}
-					</Field>
-				</div>
-			</div>
-		</div>
-	);
-
-	return (
-		<div>
-			{forHttp ? getHttpOptions() : null}
-			{newCertificate ? (
-				<>
-					<Field name="meta.dnsChallenge">
-						{({ field }: any) => (
-							<label className="form-check form-switch mt-1">
-								<input
-									className={dnsChallenge ? toggleEnabled : toggleClasses}
-									type="checkbox"
-									checked={forceDNSForNew ? true : !!dnsChallenge}
-									disabled={forceDNSForNew}
-									onChange={(e) => handleToggleChange(e, field.name)}
-								/>
-								<span className="form-check-label">
-									<T id="domains.use-dns" />
-								</span>
-							</label>
-						)}
-					</Field>
-					{requireDomainNames ? <DomainNamesField /> : null}
-					{dnsChallenge ? <DNSProviderFields /> : null}
-				</>
-			) : null}
-		</div>
-	);
-}

frontend/src/components/Form/index.ts

@@ -1,7 +0,0 @@
-export * from "./AccessField";
-export * from "./BasicAuthField";
-export * from "./DNSProviderFields";
-export * from "./DomainNamesField";
-export * from "./NginxConfigField";
-export * from "./SSLCertificateField";
-export * from "./SSLOptionsFields";

frontend/src/components/HasPermission.tsx

@@ -2,7 +2,7 @@ import type { ReactNode } from "react";
 import Alert from "react-bootstrap/Alert";
 import { Loading, LoadingPage } from "src/components";
 import { useUser } from "src/hooks";
-import { T } from "src/locale";
+import { intl } from "src/locale";
 
 interface Props {
 	permission: string;
@@ -64,11 +64,7 @@ function HasPermission({
 		return <>{children}</>;
 	}
 
-	return !hideError ? (
+	return !hideError ? <Alert variant="danger">{intl.formatMessage({ id: "no-permission-error" })}</Alert> : null;
-		<Alert variant="danger">
-			<T id="no-permission-error" />
-		</Alert>
-	) : null;
 }
 
 export { HasPermission };