Wrap intl in span identifying translation

and remove the need for email and agreement on cert requests

.version

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

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.12.6-green.svg?style=for-the-badge">
+	<img src="https://img.shields.io/badge/version-2.13.0-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,14 +88,6 @@ 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/access-list.js

@@ -21,11 +21,9 @@ const internalAccessList = {
 	 * @param   {Object}  data
 	 * @returns {Promise}
 	 */
-	create: (access, data) => {
-		return access
-			.can("access_lists:create", data)
-			.then((/*access_data*/) => {
-				return accessListModel
+	create: async (access, data) => {
+		await access.can("access_lists:create", data);
+		const row = await accessListModel
 			.query()
 			.insertAndFetch({
 				name: data.name,
@@ -34,13 +32,11 @@ const internalAccessList = {
 				owner_user_id: access.token.getUserId(1),
 			})
 			.then(utils.omitRow(omissions()));
-			})
-			.then((row) => {
+
 		data.id = row.id;
 
 		const promises = [];
-
-				// Now add the items
+		// Items
 		data.items.map((item) => {
 			promises.push(
 				accessListAuthModel.query().insert({
@@ -52,9 +48,8 @@ const internalAccessList = {
 			return true;
 		});
 
-				// Now add the clients
-				if (typeof data.clients !== "undefined" && data.clients) {
-					data.clients.map((client) => {
+		// Clients
+		data.clients?.map((client) => {
 			promises.push(
 				accessListClientModel.query().insert({
 					access_list_id: row.id,
@@ -64,45 +59,36 @@ const internalAccessList = {
 			);
 			return true;
 		});
-				}
 
-				return Promise.all(promises);
-			})
-			.then(() => {
+		await Promise.all(promises);
+
 		// re-fetch with expansions
-				return internalAccessList.get(
+		const freshRow = await internalAccessList.get(
 			access,
 			{
 				id: data.id,
 				expand: ["owner", "items", "clients", "proxy_hosts.access_list.[clients,items]"],
 			},
-					true /* <- skip masking */,
+			true // skip masking
 		);
-			})
-			.then((row) => {
-				// Audit log
-				data.meta = _.assign({}, data.meta || {}, row.meta);
 
-				return internalAccessList
-					.build(row)
-					.then(() => {
-						if (Number.parseInt(row.proxy_host_count, 10)) {
-							return internalNginx.bulkGenerateConfigs("proxy_host", row.proxy_hosts);
+		// Audit log
+		data.meta = _.assign({}, data.meta || {}, freshRow.meta);
+		await internalAccessList.build(freshRow);
+
+		if (Number.parseInt(freshRow.proxy_host_count, 10)) {
+			await internalNginx.bulkGenerateConfigs("proxy_host", freshRow.proxy_hosts);
 		}
-					})
-					.then(() => {
+
 		// Add to audit log
-						return internalAuditLog.add(access, {
+		await internalAuditLog.add(access, {
 			action: "created",
 			object_type: "access-list",
-							object_id: row.id,
+			object_id: freshRow.id,
 			meta: internalAccessList.maskItems(data),
 		});
-					})
-					.then(() => {
-						return internalAccessList.maskItems(row);
-					});
-			});
+
+		return internalAccessList.maskItems(freshRow);
 	},
 
 	/**
@@ -113,35 +99,29 @@ const internalAccessList = {
 	 * @param  {String}  [data.items]
 	 * @return {Promise}
 	 */
-	update: (access, data) => {
-		return access
-			.can("access_lists:update", data.id)
-			.then((/*access_data*/) => {
-				return internalAccessList.get(access, { id: data.id });
-			})
-			.then((row) => {
+	update: async (access, data) => {
+		await access.can("access_lists:update", data.id);
+		const row = await internalAccessList.get(access, { id: data.id });
 		if (row.id !== data.id) {
 			// Sanity check that something crazy hasn't happened
 			throw new errs.InternalValidationError(
 				`Access List could not be updated, IDs do not match: ${row.id} !== ${data.id}`,
 			);
 		}
-			})
-			.then(() => {
+
 		// patch name if specified
 		if (typeof data.name !== "undefined" && data.name) {
-					return accessListModel.query().where({ id: data.id }).patch({
+			await accessListModel.query().where({ id: data.id }).patch({
 				name: data.name,
 				satisfy_any: data.satisfy_any,
 				pass_auth: data.pass_auth,
 			});
 		}
-			})
-			.then(() => {
+
 		// Check for items and add/update/remove them
 		if (typeof data.items !== "undefined" && data.items) {
 			const promises = [];
-					const items_to_keep = [];
+			const itemsToKeep = [];
 
 			data.items.map((item) => {
 				if (item.password) {
@@ -154,33 +134,30 @@ const internalAccessList = {
 					);
 				} else {
 					// This was supplied with an empty password, which means keep it but don't change the password
-							items_to_keep.push(item.username);
+					itemsToKeep.push(item.username);
 				}
 				return true;
 			});
 
 			const query = accessListAuthModel.query().delete().where("access_list_id", data.id);
 
-					if (items_to_keep.length) {
-						query.andWhere("username", "NOT IN", items_to_keep);
+			if (itemsToKeep.length) {
+				query.andWhere("username", "NOT IN", itemsToKeep);
 			}
 
-					return query.then(() => {
+			await query;
 			// Add new items
 			if (promises.length) {
-							return Promise.all(promises);
+				await Promise.all(promises);
 			}
-					});
 		}
-			})
-			.then(() => {
+
 		// Check for clients and add/update/remove them
 		if (typeof data.clients !== "undefined" && data.clients) {
-					const promises = [];
-
+			const clientPromises = [];
 			data.clients.map((client) => {
 				if (client.address) {
-							promises.push(
+					clientPromises.push(
 						accessListClientModel.query().insert({
 							access_list_id: data.id,
 							address: client.address,
@@ -192,48 +169,37 @@ const internalAccessList = {
 			});
 
 			const query = accessListClientModel.query().delete().where("access_list_id", data.id);
+			await query;
+			// Add new clitens
+			if (clientPromises.length) {
+				await Promise.all(clientPromises);
+			}
+		}
 
-					return query.then(() => {
-						// Add new items
-						if (promises.length) {
-							return Promise.all(promises);
-						}
-					});
-				}
-			})
-			.then(() => {
 		// Add to audit log
-				return internalAuditLog.add(access, {
+		await internalAuditLog.add(access, {
 			action: "updated",
 			object_type: "access-list",
 			object_id: data.id,
 			meta: internalAccessList.maskItems(data),
 		});
-			})
-			.then(() => {
+
 		// re-fetch with expansions
-				return internalAccessList.get(
+		const freshRow = await internalAccessList.get(
 			access,
 			{
 				id: data.id,
 				expand: ["owner", "items", "clients", "proxy_hosts.[certificate,access_list.[clients,items]]"],
 			},
-					true /* <- skip masking */,
+			true // skip masking
 		);
-			})
-			.then((row) => {
-				return internalAccessList
-					.build(row)
-					.then(() => {
+
+		await internalAccessList.build(freshRow)
 		if (Number.parseInt(row.proxy_host_count, 10)) {
-							return internalNginx.bulkGenerateConfigs("proxy_host", row.proxy_hosts);
+			await internalNginx.bulkGenerateConfigs("proxy_host", row.proxy_hosts);
 		}
-					})
-					.then(internalNginx.reload)
-					.then(() => {
+		await internalNginx.reload();
 		return internalAccessList.maskItems(row);
-					});
-			});
 	},
 
 	/**
@@ -242,15 +208,13 @@ const internalAccessList = {
 	 * @param  {Integer}  data.id
 	 * @param  {Array}    [data.expand]
 	 * @param  {Array}    [data.omit]
-	 * @param  {Boolean}  [skip_masking]
+	 * @param  {Boolean}  [skipMasking]
 	 * @return {Promise}
 	 */
-	get: (access, data, skip_masking) => {
+	get: async (access, data, skipMasking) => {
 		const thisData = data || {};
+		const accessData = await access.can("access_lists:get", thisData.id)
 
-		return access
-			.can("access_lists:get", thisData.id)
-			.then((accessData) => {
 		const query = accessListModel
 			.query()
 			.select("access_list.*", accessListModel.raw("COUNT(proxy_host.id) as proxy_host_count"))
@@ -275,22 +239,19 @@ const internalAccessList = {
 			query.withGraphFetched(`[${thisData.expand.join(", ")}]`);
 		}
 
-				return query.then(utils.omitRow(omissions()));
-			})
-			.then((row) => {
-				let thisRow = row;
+		let row = await query.then(utils.omitRow(omissions()));
+
 		if (!row || !row.id) {
 			throw new errs.ItemNotFoundError(thisData.id);
 		}
-				if (!skip_masking && typeof thisRow.items !== "undefined" && thisRow.items) {
-					thisRow = internalAccessList.maskItems(thisRow);
+		if (!skipMasking && typeof row.items !== "undefined" && row.items) {
+			row = internalAccessList.maskItems(row);
 		}
 		// Custom omissions
 		if (typeof data.omit !== "undefined" && data.omit !== null) {
-					thisRow = _.omit(thisRow, data.omit);
+			row = _.omit(row, data.omit);
 		}
-				return thisRow;
-			});
+		return row;
 	},
 
 	/**
@@ -300,13 +261,13 @@ const internalAccessList = {
 	 * @param   {String}  [data.reason]
 	 * @returns {Promise}
 	 */
-	delete: (access, data) => {
-		return access
-			.can("access_lists:delete", data.id)
-			.then(() => {
-				return internalAccessList.get(access, { id: data.id, expand: ["proxy_hosts", "items", "clients"] });
-			})
-			.then((row) => {
+	delete: async (access, data) => {
+		await access.can("access_lists:delete", data.id);
+		const row = await internalAccessList.get(access, {
+			id: data.id,
+			expand: ["proxy_hosts", "items", "clients"],
+		});
+
 		if (!row || !row.id) {
 			throw new errs.ItemNotFoundError(data.id);
 		}
@@ -317,58 +278,47 @@ const internalAccessList = {
 		// 4. audit log
 
 		// 1. update row to be deleted
-				return accessListModel
+		await accessListModel
 			.query()
 			.where("id", row.id)
 			.patch({
 				is_deleted: 1,
-					})
-					.then(() => {
+			});
+
 		// 2. update any proxy hosts that were using it (ignoring permissions)
 		if (row.proxy_hosts) {
-							return proxyHostModel
+			await proxyHostModel
 				.query()
 				.where("access_list_id", "=", row.id)
-								.patch({ access_list_id: 0 })
-								.then(() => {
-									// 3. reconfigure those hosts, then reload nginx
+				.patch({ access_list_id: 0 });
 
+			// 3. reconfigure those hosts, then reload nginx
 			// set the access_list_id to zero for these items
 			row.proxy_hosts.map((_val, idx) => {
 				row.proxy_hosts[idx].access_list_id = 0;
 				return true;
 			});
 
-									return internalNginx.bulkGenerateConfigs("proxy_host", row.proxy_hosts);
-								})
-								.then(() => {
-									return internalNginx.reload();
-								});
+			await internalNginx.bulkGenerateConfigs("proxy_host", row.proxy_hosts);
 		}
-					})
-					.then(() => {
-						// delete the htpasswd file
-						const htpasswd_file = internalAccessList.getFilename(row);
 
+		await internalNginx.reload();
+
+		// delete the htpasswd file
 		try {
-							fs.unlinkSync(htpasswd_file);
+			fs.unlinkSync(internalAccessList.getFilename(row));
 		} catch (_err) {
 			// do nothing
 		}
-					})
-					.then(() => {
+
 		// 4. audit log
-						return internalAuditLog.add(access, {
+		await internalAuditLog.add(access, {
 			action: "deleted",
 			object_type: "access-list",
 			object_id: row.id,
 			meta: _.omit(internalAccessList.maskItems(row), ["is_deleted", "proxy_hosts"]),
 		});
-					});
-			})
-			.then(() => {
 		return true;
-			});
 	},
 
 	/**
@@ -376,13 +326,12 @@ const internalAccessList = {
 	 *
 	 * @param   {Access}  access
 	 * @param   {Array}   [expand]
-	 * @param   {String}  [search_query]
+	 * @param   {String}  [searchQuery]
 	 * @returns {Promise}
 	 */
-	getAll: (access, expand, search_query) => {
-		return access
-			.can("access_lists:list")
-			.then((access_data) => {
+	getAll: async (access, expand, searchQuery) => {
+		const accessData = await access.can("access_lists:list");
+
 		const query = accessListModel
 			.query()
 			.select("access_list.*", accessListModel.raw("COUNT(proxy_host.id) as proxy_host_count"))
@@ -398,14 +347,14 @@ const internalAccessList = {
 			.allowGraph("[owner,items,clients]")
 			.orderBy("access_list.name", "ASC");
 
-				if (access_data.permission_visibility !== "all") {
+		if (accessData.permission_visibility !== "all") {
 			query.andWhere("access_list.owner_user_id", access.token.getUserId(1));
 		}
 
 		// Query is used for searching
-				if (typeof search_query === "string") {
+		if (typeof searchQuery === "string") {
 			query.where(function () {
-						this.where("name", "like", `%${search_query}%`);
+				this.where("name", "like", `%${searchQuery}%`);
 			});
 		}
 
@@ -413,9 +362,7 @@ const internalAccessList = {
 			query.withGraphFetched(`[${expand.join(", ")}]`);
 		}
 
-				return query.then(utils.omitRows(omissions()));
-			})
-			.then((rows) => {
+		const rows = await query.then(utils.omitRows(omissions()));
 		if (rows) {
 			rows.map((row, idx) => {
 				if (typeof row.items !== "undefined" && row.items) {
@@ -424,28 +371,28 @@ const internalAccessList = {
 				return true;
 			});
 		}
-
 		return rows;
-			});
 	},
 
 	/**
-	 * Report use
+	 * Count is used in reports
 	 *
-	 * @param   {Integer} user_id
+	 * @param   {Integer} userId
 	 * @param   {String}  visibility
 	 * @returns {Promise}
 	 */
-	getCount: (user_id, visibility) => {
-		const query = accessListModel.query().count("id as count").where("is_deleted", 0);
+	getCount: async (userId, visibility) => {
+		const query = accessListModel
+			.query()
+			.count("id as count")
+			.where("is_deleted", 0);
 
 		if (visibility !== "all") {
-			query.andWhere("owner_user_id", user_id);
+			query.andWhere("owner_user_id", userId);
 		}
 
-		return query.first().then((row) => {
+		const row = await query.first();
 		return Number.parseInt(row.count, 10);
-		});
 	},
 
 	/**
@@ -455,20 +402,19 @@ const internalAccessList = {
 	maskItems: (list) => {
 		if (list && typeof list.items !== "undefined") {
 			list.items.map((val, idx) => {
-				let repeat_for = 8;
-				let first_char = "*";
+				let repeatFor = 8;
+				let firstChar = "*";
 
 				if (typeof val.password !== "undefined" && val.password) {
-					repeat_for = val.password.length - 1;
-					first_char = val.password.charAt(0);
+					repeatFor = val.password.length - 1;
+					firstChar = val.password.charAt(0);
 				}
 
-				list.items[idx].hint = first_char + "*".repeat(repeat_for);
+				list.items[idx].hint = firstChar + "*".repeat(repeatFor);
 				list.items[idx].password = "";
 				return true;
 			});
 		}
-
 		return list;
 	},
 
@@ -488,43 +434,33 @@ const internalAccessList = {
 	 * @param   {Array}   list.items
 	 * @returns {Promise}
 	 */
-	build: (list) => {
+	build: async (list) => {
 		logger.info(`Building Access file #${list.id} for: ${list.name}`);
 
-		return new Promise((resolve, reject) => {
-			const htpasswd_file = internalAccessList.getFilename(list);
+		const htpasswdFile = internalAccessList.getFilename(list);
 
 		// 1. remove any existing access file
 		try {
-				fs.unlinkSync(htpasswd_file);
+			fs.unlinkSync(htpasswdFile);
 		} catch (_err) {
 			// do nothing
 		}
 
 		// 2. create empty access file
-			try {
-				fs.writeFileSync(htpasswd_file, "", { encoding: "utf8" });
-				resolve(htpasswd_file);
-			} catch (err) {
-				reject(err);
-			}
-		}).then((htpasswd_file) => {
+		fs.writeFileSync(htpasswdFile, '', {encoding: 'utf8'});
+
 		// 3. generate password for each user
 		if (list.items.length) {
-				return new Promise((resolve, reject) => {
-					batchflow(list.items)
-						.sequential()
+			await new Promise((resolve, reject) => {
+				batchflow(list.items).sequential()
 					.each((_i, item, next) => {
 						if (item.password?.length) {
 							logger.info(`Adding: ${item.username}`);
 
-								utils
-									.execFile("openssl", ["passwd", "-apr1", item.password])
+							utils.execFile('openssl', ['passwd', '-apr1', item.password])
 								.then((res) => {
 									try {
-											fs.appendFileSync(htpasswd_file, `${item.username}:${res}\n`, {
-												encoding: "utf8",
-											});
+										fs.appendFileSync(htpasswdFile, `${item.username}:${res}\n`, {encoding: 'utf8'});
 									} catch (err) {
 										reject(err);
 									}
@@ -546,8 +482,7 @@ const internalAccessList = {
 					});
 			});
 		}
-		});
-	},
-};
+	}
+}
 
 export default internalAccessList;

backend/internal/audit-log.js

@@ -9,11 +9,12 @@ const internalAuditLog = {
 	 *
 	 * @param   {Access}  access
 	 * @param   {Array}   [expand]
-	 * @param   {String}  [search_query]
+	 * @param   {String}  [searchQuery]
 	 * @returns {Promise}
 	 */
-	getAll: (access, expand, search_query) => {
-		return access.can("auditlog:list").then(() => {
+	getAll: async (access, expand, searchQuery) => {
+		await access.can("auditlog:list");
+
 		const query = auditLogModel
 			.query()
 			.orderBy("created_on", "DESC")
@@ -22,9 +23,9 @@ const internalAuditLog = {
 			.allowGraph("[user]");
 
 		// Query is used for searching
-			if (typeof search_query === "string" && search_query.length > 0) {
+		if (typeof searchQuery === "string" && searchQuery.length > 0) {
 			query.where(function () {
-					this.where(castJsonIfNeed("meta"), "like", `%${search_query}`);
+				this.where(castJsonIfNeed("meta"), "like", `%${searchQuery}`);
 			});
 		}
 
@@ -32,8 +33,36 @@ const internalAuditLog = {
 			query.withGraphFetched(`[${expand.join(", ")}]`);
 		}
 
-			return query;
-		});
+		return await query;
+	},
+
+	/**
+	 * @param  {Access}   access
+	 * @param  {Object}   [data]
+	 * @param  {Integer}  [data.id]          Defaults to the token user
+	 * @param  {Array}    [data.expand]
+	 * @return {Promise}
+	 */
+	get: async (access, data) => {
+		await access.can("auditlog:list");
+
+		const query = auditLogModel
+			.query()
+			.andWhere("id", data.id)
+			.allowGraph("[user]")
+			.first();
+
+		if (typeof data.expand !== "undefined" && data.expand !== null) {
+			query.withGraphFetched(`[${data.expand.join(", ")}]`);
+		}
+
+		const row = await query;
+
+		if (!row?.id) {
+			throw new errs.ItemNotFoundError(data.id);
+		}
+
+		return row;
 	},
 
 	/**
@@ -50,27 +79,22 @@ const internalAuditLog = {
 	 * @param   {Object}   [data.meta]
 	 * @returns {Promise}
 	 */
-	add: (access, data) => {
-		return new Promise((resolve, reject) => {
-			// Default the user id
+	add: async (access, data) => {
 		if (typeof data.user_id === "undefined" || !data.user_id) {
 			data.user_id = access.token.getUserId(1);
 		}
 
 		if (typeof data.action === "undefined" || !data.action) {
-				reject(new errs.InternalValidationError("Audit log entry must contain an Action"));
-			} else {
+			throw new errs.InternalValidationError("Audit log entry must contain an Action");
+		}
+
 		// Make sure at least 1 of the IDs are set and action
-				resolve(
-					auditLogModel.query().insert({
+		return await auditLogModel.query().insert({
 			user_id: data.user_id,
 			action: data.action,
 			object_type: data.object_type || "",
 			object_id: data.object_id || 0,
 			meta: data.meta || {},
-					}),
-				);
-			}
 		});
 	},
 };

backend/internal/dead-host.js

@@ -18,25 +18,24 @@ const internalDeadHost = {
 	 * @param   {Object}  data
 	 * @returns {Promise}
 	 */
-	create: (access, data) => {
+	create: async (access, data) => {
 		const createCertificate = data.certificate_id === "new";
 
 		if (createCertificate) {
 			delete data.certificate_id;
 		}
 
-		return access
-			.can("dead_hosts:create", data)
-			.then((/*access_data*/) => {
+		await access.can("dead_hosts:create", data);
+
 		// Get a list of the domain names and check each of them against existing records
-				const domain_name_check_promises = [];
+		const domainNameCheckPromises = [];
 
 		data.domain_names.map((domain_name) => {
-					domain_name_check_promises.push(internalHost.isHostnameTaken(domain_name));
+			domainNameCheckPromises.push(internalHost.isHostnameTaken(domain_name));
 			return true;
 		});
 
-				return Promise.all(domain_name_check_promises).then((check_results) => {
+		await Promise.all(domainNameCheckPromises).then((check_results) => {
 			check_results.map((result) => {
 				if (result.is_taken) {
 					throw new errs.ValidationError(`${result.hostname} is already in use`);
@@ -44,8 +43,7 @@ const internalDeadHost = {
 				return true;
 			});
 		});
-			})
-			.then(() => {
+
 		// At this point the domains should have been checked
 		data.owner_user_id = access.token.getUserId(1);
 		const thisData = internalHost.cleanSslHstsData(data);
@@ -56,53 +54,43 @@ const internalDeadHost = {
 			thisData.advanced_config = "";
 		}
 
-				return deadHostModel.query().insertAndFetch(thisData).then(utils.omitRow(omissions()));
-			})
-			.then((row) => {
-				if (createCertificate) {
-					return internalCertificate
-						.createQuickCertificate(access, data)
-						.then((cert) => {
-							// update host with cert id
-							return internalDeadHost.update(access, {
-								id: row.id,
-								certificate_id: cert.id,
-							});
-						})
-						.then(() => {
-							return row;
-						});
-				}
-				return row;
-			})
-			.then((row) => {
-				// re-fetch with cert
-				return internalDeadHost.get(access, {
-					id: row.id,
-					expand: ["certificate", "owner"],
-				});
-			})
-			.then((row) => {
-				// Configure nginx
-				return internalNginx.configure(deadHostModel, "dead_host", row).then(() => {
-					return row;
-				});
-			})
-			.then((row) => {
-				data.meta = _.assign({}, data.meta || {}, row.meta);
+		const row = await deadHostModel.query()
+			.insertAndFetch(thisData)
+			.then(utils.omitRow(omissions()));
 
 		// Add to audit log
-				return internalAuditLog
-					.add(access, {
+		await internalAuditLog.add(access, {
 			action: "created",
 			object_type: "dead-host",
 			object_id: row.id,
-						meta: data,
-					})
-					.then(() => {
-						return row;
+			meta: thisData,
 		});
+
+		if (createCertificate) {
+			const cert = await internalCertificate.createQuickCertificate(access, data);
+
+			// update host with cert id
+			await internalDeadHost.update(access, {
+				id: row.id,
+				certificate_id: cert.id,
 			});
+		}
+
+		// re-fetch with cert
+		const freshRow = await internalDeadHost.get(access, {
+			id: row.id,
+			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);
+
+		return freshRow;
 	},
 
 	/**
@@ -111,66 +99,51 @@ const internalDeadHost = {
 	 * @param  {Number}  data.id
 	 * @return {Promise}
 	 */
-	update: (access, data) => {
-		let thisData = data;
-		const createCertificate = thisData.certificate_id === "new";
-
+	update: async (access, data) => {
+		const createCertificate = data.certificate_id === "new";
 		if (createCertificate) {
-			delete thisData.certificate_id;
+			delete data.certificate_id;
 		}
 
-		return access
-			.can("dead_hosts:update", thisData.id)
-			.then((/*access_data*/) => {
-				// Get a list of the domain names and check each of them against existing records
-				const domain_name_check_promises = [];
+		await access.can("dead_hosts:update", data.id);
 
-				if (typeof thisData.domain_names !== "undefined") {
-					thisData.domain_names.map((domain_name) => {
-						domain_name_check_promises.push(internalHost.isHostnameTaken(domain_name, "dead", data.id));
+		// Get a list of the domain names and check each of them against existing records
+		const domainNameCheckPromises = [];
+		if (typeof data.domain_names !== "undefined") {
+			data.domain_names.map((domainName) => {
+				domainNameCheckPromises.push(internalHost.isHostnameTaken(domainName, "dead", data.id));
 				return true;
 			});
 
-					return Promise.all(domain_name_check_promises).then((check_results) => {
-						check_results.map((result) => {
+			const checkResults = await Promise.all(domainNameCheckPromises);
+			checkResults.map((result) => {
 				if (result.is_taken) {
 					throw new errs.ValidationError(`${result.hostname} is already in use`);
 				}
 				return true;
 			});
-					});
 		}
-			})
-			.then(() => {
-				return internalDeadHost.get(access, { id: thisData.id });
-			})
-			.then((row) => {
-				if (row.id !== thisData.id) {
+		const row = await internalDeadHost.get(access, { id: data.id });
+
+		if (row.id !== data.id) {
 			// Sanity check that something crazy hasn't happened
 			throw new errs.InternalValidationError(
-						`404 Host could not be updated, IDs do not match: ${row.id} !== ${thisData.id}`,
+				`404 Host could not be updated, IDs do not match: ${row.id} !== ${data.id}`,
 			);
 		}
 
 		if (createCertificate) {
-					return internalCertificate
-						.createQuickCertificate(access, {
-							domain_names: thisData.domain_names || row.domain_names,
-							meta: _.assign({}, row.meta, thisData.meta),
-						})
-						.then((cert) => {
-							// update host with cert id
-							thisData.certificate_id = cert.id;
-						})
-						.then(() => {
-							return row;
+			const cert = await internalCertificate.createQuickCertificate(access, {
+				domain_names: data.domain_names || row.domain_names,
+				meta: _.assign({}, row.meta, data.meta),
 			});
+
+			// update host with cert id
+			data.certificate_id = cert.id;
 		}
-				return row;
-			})
-			.then((row) => {
+
 		// Add domain_names to the data in case it isn't there, so that the audit log renders correctly. The order is important here.
-				thisData = _.assign(
+		let thisData = _.assign(
 			{},
 			{
 				domain_names: row.domain_names,
@@ -180,38 +153,31 @@ const internalDeadHost = {
 
 		thisData = internalHost.cleanSslHstsData(thisData, row);
 
-				return deadHostModel
+
+		// do the row update
+		await deadHostModel
 			.query()
-					.where({ id: thisData.id })
-					.patch(thisData)
-					.then((saved_row) => {
+			.where({id: data.id})
+			.patch(data);
+
 		// Add to audit log
-						return internalAuditLog
-							.add(access, {
+		await internalAuditLog.add(access, {
 			action: "updated",
 			object_type: "dead-host",
 			object_id: row.id,
 			meta: thisData,
-							})
-							.then(() => {
-								return _.omit(saved_row, omissions());
 		});
-					});
-			})
-			.then(() => {
-				return internalDeadHost
+
+		const thisRow = await internalDeadHost
 			.get(access, {
 				id: thisData.id,
 				expand: ["owner", "certificate"],
-					})
-					.then((row) => {
+			});
+
 		// Configure nginx
-						return internalNginx.configure(deadHostModel, "dead_host", row).then((new_meta) => {
-							row.meta = new_meta;
-							return _.omit(internalHost.cleanRowCertificateMeta(row), omissions());
-						});
-					});
-			});
+		const newMeta = await internalNginx.configure(deadHostModel, "dead_host", row);
+		row.meta = newMeta;
+		return _.omit(internalHost.cleanRowCertificateMeta(thisRow), omissions());
 	},
 
 	/**
@@ -222,39 +188,32 @@ const internalDeadHost = {
 	 * @param  {Array}    [data.omit]
 	 * @return {Promise}
 	 */
-	get: (access, data) => {
-		const thisData = data || {};
-
-		return access
-			.can("dead_hosts:get", thisData.id)
-			.then((access_data) => {
+	get: async (access, data) => {
+		const accessData = await access.can("dead_hosts:get", data.id);
 		const query = deadHostModel
 			.query()
 			.where("is_deleted", 0)
-					.andWhere("id", dthisDataata.id)
+			.andWhere("id", data.id)
 			.allowGraph("[owner,certificate]")
 			.first();
 
-				if (access_data.permission_visibility !== "all") {
+		if (accessData.permission_visibility !== "all") {
 			query.andWhere("owner_user_id", access.token.getUserId(1));
 		}
 
-				if (typeof thisData.expand !== "undefined" && thisData.expand !== null) {
+		if (typeof data.expand !== "undefined" && data.expand !== null) {
 			query.withGraphFetched(`[${data.expand.join(", ")}]`);
 		}
 
-				return query.then(utils.omitRow(omissions()));
-			})
-			.then((row) => {
+		const row = await query.then(utils.omitRow(omissions()));
 		if (!row || !row.id) {
-					throw new errs.ItemNotFoundError(thisData.id);
+			throw new errs.ItemNotFoundError(data.id);
 		}
 		// Custom omissions
-				if (typeof thisData.omit !== "undefined" && thisData.omit !== null) {
-					return _.omit(row, thisData.omit);
+		if (typeof data.omit !== "undefined" && data.omit !== null) {
+			return _.omit(row, data.omit);
 		}
 		return row;
-			});
 	},
 
 	/**
@@ -264,42 +223,32 @@ const internalDeadHost = {
 	 * @param {String}  [data.reason]
 	 * @returns {Promise}
 	 */
-	delete: (access, data) => {
-		return access
-			.can("dead_hosts:delete", data.id)
-			.then(() => {
-				return internalDeadHost.get(access, { id: data.id });
-			})
-			.then((row) => {
+	delete: async (access, data) => {
+		await access.can("dead_hosts:delete", data.id)
+		const row = await internalDeadHost.get(access, { id: data.id });
 		if (!row || !row.id) {
 			throw new errs.ItemNotFoundError(data.id);
 		}
 
-				return deadHostModel
+		await deadHostModel
 			.query()
 			.where("id", row.id)
 			.patch({
 				is_deleted: 1,
-					})
-					.then(() => {
-						// Delete Nginx Config
-						return internalNginx.deleteConfig("dead_host", row).then(() => {
-							return internalNginx.reload();
 			});
-					})
-					.then(() => {
+
+		// Delete Nginx Config
+		await internalNginx.deleteConfig("dead_host", row);
+		await internalNginx.reload();
+
 		// Add to audit log
-						return internalAuditLog.add(access, {
+		await internalAuditLog.add(access, {
 			action: "deleted",
 			object_type: "dead-host",
 			object_id: row.id,
 			meta: _.omit(row, omissions()),
 		});
-					});
-			})
-			.then(() => {
 		return true;
-			});
 	},
 
 	/**
@@ -309,16 +258,12 @@ const internalDeadHost = {
 	 * @param {String}  [data.reason]
 	 * @returns {Promise}
 	 */
-	enable: (access, data) => {
-		return access
-			.can("dead_hosts:update", data.id)
-			.then(() => {
-				return internalDeadHost.get(access, {
+	enable: async (access, data) => {
+		await access.can("dead_hosts:update", data.id)
+		const row = await internalDeadHost.get(access, {
 			id: data.id,
 			expand: ["certificate", "owner"],
 		});
-			})
-			.then((row) => {
 		if (!row || !row.id) {
 			throw new errs.ItemNotFoundError(data.id);
 		}
@@ -328,29 +273,24 @@ const internalDeadHost = {
 
 		row.enabled = 1;
 
-				return deadHostModel
+		await deadHostModel
 			.query()
 			.where("id", row.id)
 			.patch({
 				enabled: 1,
-					})
-					.then(() => {
+			});
+
 		// Configure nginx
-						return internalNginx.configure(deadHostModel, "dead_host", row);
-					})
-					.then(() => {
+		await internalNginx.configure(deadHostModel, "dead_host", row);
+
 		// Add to audit log
-						return internalAuditLog.add(access, {
+		await internalAuditLog.add(access, {
 			action: "enabled",
 			object_type: "dead-host",
 			object_id: row.id,
 			meta: _.omit(row, omissions()),
 		});
-					});
-			})
-			.then(() => {
 		return true;
-			});
 	},
 
 	/**
@@ -360,13 +300,9 @@ const internalDeadHost = {
 	 * @param {String}  [data.reason]
 	 * @returns {Promise}
 	 */
-	disable: (access, data) => {
-		return access
-			.can("dead_hosts:update", data.id)
-			.then(() => {
-				return internalDeadHost.get(access, { id: data.id });
-			})
-			.then((row) => {
+	disable: async (access, data) => {
+		await access.can("dead_hosts:update", data.id)
+		const row = await internalDeadHost.get(access, { id: data.id });
 		if (!row || !row.id) {
 			throw new errs.ItemNotFoundError(data.id);
 		}
@@ -376,31 +312,25 @@ const internalDeadHost = {
 
 		row.enabled = 0;
 
-				return deadHostModel
+		await deadHostModel
 			.query()
 			.where("id", row.id)
 			.patch({
 				enabled: 0,
-					})
-					.then(() => {
-						// Delete Nginx Config
-						return internalNginx.deleteConfig("dead_host", row).then(() => {
-							return internalNginx.reload();
 			});
-					})
-					.then(() => {
+
+		// Delete Nginx Config
+		await internalNginx.deleteConfig("dead_host", row);
+		await internalNginx.reload();
+
 		// Add to audit log
-						return internalAuditLog.add(access, {
+		await internalAuditLog.add(access, {
 			action: "disabled",
 			object_type: "dead-host",
 			object_id: row.id,
 			meta: _.omit(row, omissions()),
 		});
-					});
-			})
-			.then(() => {
 		return true;
-			});
 	},
 
 	/**
@@ -408,13 +338,11 @@ const internalDeadHost = {
 	 *
 	 * @param   {Access}  access
 	 * @param   {Array}   [expand]
-	 * @param   {String}  [search_query]
+	 * @param   {String}  [searchQuery]
 	 * @returns {Promise}
 	 */
-	getAll: (access, expand, search_query) => {
-		return access
-			.can("dead_hosts:list")
-			.then((access_data) => {
+	getAll: async (access, expand, searchQuery) => {
+		const accessData = await access.can("dead_hosts:list")
 		const query = deadHostModel
 			.query()
 			.where("is_deleted", 0)
@@ -422,14 +350,14 @@ const internalDeadHost = {
 			.allowGraph("[owner,certificate]")
 			.orderBy(castJsonIfNeed("domain_names"), "ASC");
 
-				if (access_data.permission_visibility !== "all") {
+		if (accessData.permission_visibility !== "all") {
 			query.andWhere("owner_user_id", access.token.getUserId(1));
 		}
 
 		// Query is used for searching
-				if (typeof search_query === "string" && search_query.length > 0) {
+		if (typeof searchQuery === "string" && searchQuery.length > 0) {
 			query.where(function () {
-						this.where(castJsonIfNeed("domain_names"), "like", `%${search_query}%`);
+				this.where(castJsonIfNeed("domain_names"), "like", `%${searchQuery}%`);
 			});
 		}
 
@@ -437,15 +365,11 @@ const internalDeadHost = {
 			query.withGraphFetched(`[${expand.join(", ")}]`);
 		}
 
-				return query.then(utils.omitRows(omissions()));
-			})
-			.then((rows) => {
+		const rows = await query.then(utils.omitRows(omissions()));
 		if (typeof expand !== "undefined" && expand !== null && expand.indexOf("certificate") !== -1) {
-					return internalHost.cleanAllRowsCertificateMeta(rows);
+			internalHost.cleanAllRowsCertificateMeta(rows);
 		}
-
 		return rows;
-			});
 	},
 
 	/**
@@ -455,16 +379,15 @@ const internalDeadHost = {
 	 * @param   {String}  visibility
 	 * @returns {Promise}
 	 */
-	getCount: (user_id, visibility) => {
+	getCount: async (user_id, visibility) => {
 		const query = deadHostModel.query().count("id as count").where("is_deleted", 0);
 
 		if (visibility !== "all") {
 			query.andWhere("owner_user_id", user_id);
 		}
 
-		return query.first().then((row) => {
+		const row = await query.first();
 		return Number.parseInt(row.count, 10);
-		});
 	},
 };
 

backend/internal/host.js

@@ -65,50 +65,33 @@ const internalHost = {
 	},
 
 	/**
-	 * This returns all the host types with any domain listed in the provided domain_names array.
+	 * This returns all the host types with any domain listed in the provided domainNames array.
 	 * This is used by the certificates to temporarily disable any host that is using the domain
 	 *
-	 * @param   {Array}  domain_names
+	 * @param   {Array}  domainNames
 	 * @returns {Promise}
 	 */
-	getHostsWithDomains: (domain_names) => {
-		const promises = [
-			proxyHostModel.query().where("is_deleted", 0),
-			redirectionHostModel.query().where("is_deleted", 0),
-			deadHostModel.query().where("is_deleted", 0),
-		];
-
-		return Promise.all(promises).then((promises_results) => {
-			const response_object = {
+	getHostsWithDomains: async (domainNames) => {
+		const responseObject = {
 			total_count: 0,
 			dead_hosts: [],
 			proxy_hosts: [],
 			redirection_hosts: [],
 		};
 
-			if (promises_results[0]) {
-				// Proxy Hosts
-				response_object.proxy_hosts = internalHost._getHostsWithDomains(promises_results[0], domain_names);
-				response_object.total_count += response_object.proxy_hosts.length;
-			}
+		const proxyRes = await proxyHostModel.query().where("is_deleted", 0);
+		responseObject.proxy_hosts = internalHost._getHostsWithDomains(proxyRes, domainNames);
+		responseObject.total_count += responseObject.proxy_hosts.length;
 
-			if (promises_results[1]) {
-				// Redirection Hosts
-				response_object.redirection_hosts = internalHost._getHostsWithDomains(
-					promises_results[1],
-					domain_names,
-				);
-				response_object.total_count += response_object.redirection_hosts.length;
-			}
+		const redirRes = await redirectionHostModel.query().where("is_deleted", 0);
+		responseObject.redirection_hosts = internalHost._getHostsWithDomains(redirRes, domainNames);
+		responseObject.total_count += responseObject.redirection_hosts.length;
 
-			if (promises_results[2]) {
-				// Dead Hosts
-				response_object.dead_hosts = internalHost._getHostsWithDomains(promises_results[2], domain_names);
-				response_object.total_count += response_object.dead_hosts.length;
-			}
+		const deadRes = await deadHostModel.query().where("is_deleted", 0);
+		responseObject.dead_hosts = internalHost._getHostsWithDomains(deadRes, domainNames);
+		responseObject.total_count += responseObject.dead_hosts.length;
 
-			return response_object;
-		});
+		return responseObject;
 	},
 
 	/**

backend/internal/nginx.js

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

backend/internal/proxy-host.js

@@ -422,7 +422,6 @@ const internalProxyHost = {
 	 */
 	getAll: async (access, expand, searchQuery) => {
 		const accessData = await access.can("proxy_hosts:list");
-
 		const query = proxyHostModel
 			.query()
 			.where("is_deleted", 0)
@@ -446,11 +445,9 @@ 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-host",
+							object_type: "stream",
 							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,
+						meta: { ...data, id: user.id, name: user.name },
 					})
 					.then(() => {
 						return user;

backend/lib/access.js

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

backend/lib/certbot.js

@@ -6,46 +6,6 @@ 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
@@ -84,4 +44,43 @@ 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/audit-log.js

@@ -52,4 +52,56 @@ router
 		}
 	});
 
+/**
+ * Specific audit log entry
+ *
+ * /api/audit-log/123
+ */
+router
+	.route("/:event_id")
+	.options((_, res) => {
+		res.sendStatus(204);
+	})
+	.all(jwtdecode())
+
+	/**
+	 * GET /api/audit-log/123
+	 *
+	 * Retrieve a specific entry
+	 */
+	.get(async (req, res, next) => {
+		try {
+			const data = await validator(
+				{
+					required: ["event_id"],
+					additionalProperties: false,
+					properties: {
+						event_id: {
+							$ref: "common#/properties/id",
+						},
+						expand: {
+							$ref: "common#/properties/expand",
+						},
+					},
+				},
+				{
+					event_id: req.params.event_id,
+					expand:
+						typeof req.query.expand === "string"
+							? req.query.expand.split(",")
+							: null,
+				},
+			);
+
+			const item = await internalAuditLog.get(res.locals.access, {
+				id: data.event_id,
+				expand: data.expand,
+			});
+			res.status(200).send(item);
+		} catch (err) {
+			logger.debug(`${req.method.toUpperCase()} ${req.path}: ${err}`);
+			next(err);
+		}
+	});
+
 export default router;

backend/routes/nginx/certificates.js

@@ -1,4 +1,5 @@
 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";
@@ -72,6 +73,40 @@ 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
  *
@@ -107,6 +142,41 @@ 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
  *
@@ -266,38 +336,4 @@ 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 and existing dead-host
+	 * Update an existing dead-host
 	 */
 	.put(async (req, res, next) => {
 		try {
@@ -138,7 +138,7 @@ router
 	/**
 	 * DELETE /api/nginx/dead-hosts/123
 	 *
-	 * Update and existing dead-host
+	 * Delete a dead-host
 	 */
 	.delete(async (req, res, next) => {
 		try {

backend/routes/reports.js

@@ -14,11 +14,12 @@ router
 	.options((_, res) => {
 		res.sendStatus(204);
 	})
+	.all(jwtdecode())
 
 	/**
 	 * GET /reports/hosts
 	 */
-	.get(jwtdecode(), async (req, res, next) => {
+	.get(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

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

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

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

backend/schema/components/certificate-object.json

@@ -62,15 +62,9 @@
 				"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": "ipv4"
+					"format": "^[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}$"
 				},
 				{
 					"type": "string",

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

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

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

@@ -0,0 +1,73 @@
+{
+	"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,8 +36,6 @@
 								"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,8 +37,6 @@
 								"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,8 +36,6 @@
 									"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,8 +52,6 @@
 								"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,6 +37,9 @@
 						},
 						"meta": {
 							"$ref": "../../../components/stream-object.json#/properties/meta"
+						},
+						"domain_names": {
+							"$ref": "../../../components/dead-host-object.json#/properties/domain_names"
 						}
 					}
 				}

backend/schema/swagger.json

@@ -29,6 +29,11 @@
 				"$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,12 +121,14 @@ 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 \
+	&& apt-get install -y jq python3-pip logrotate moreutils \
 	&& 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,12 +71,14 @@ 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
@@ -202,7 +204,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,7 +64,8 @@
                 "useUniqueElementIds": "off"
             },
             "suspicious": {
-                "noExplicitAny": "off"
+                "noExplicitAny": "off",
+                "noArrayIndexKey": "off"
             },
             "performance": {
                 "noDelete": "off"

frontend/package.json

@@ -12,47 +12,51 @@
 		"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.34.1",
-		"@tanstack/react-query": "^5.85.6",
+		"@tabler/icons-react": "^3.35.0",
+		"@tanstack/react-query": "^5.89.0",
 		"@tanstack/react-table": "^8.21.3",
+		"@uiw/react-textarea-code-editor": "^3.1.1",
 		"classnames": "^2.5.1",
-		"country-flag-icons": "^1.5.19",
+		"country-flag-icons": "^1.5.20",
 		"date-fns": "^4.1.0",
 		"formik": "^2.4.6",
+		"generate-password-browser": "^1.1.0",
 		"humps": "^2.0.1",
-		"query-string": "^9.2.2",
+		"query-string": "^9.3.1",
 		"react": "^19.1.1",
 		"react-bootstrap": "^2.10.10",
 		"react-dom": "^19.1.1",
 		"react-intl": "^7.1.11",
-		"react-router-dom": "^7.8.2",
+		"react-router-dom": "^7.9.1",
+		"react-select": "^5.10.2",
 		"react-toastify": "^11.0.5",
-		"rooks": "^9.2.0"
+		"rooks": "^9.3.0"
 	},
 	"devDependencies": {
 		"@biomejs/biome": "^2.2.4",
 		"@formatjs/cli": "^6.7.2",
-		"@tanstack/react-query-devtools": "^5.85.6",
+		"@tanstack/react-query-devtools": "^5.89.0",
 		"@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.12",
+		"@types/react": "^19.1.13",
 		"@types/react-dom": "^19.1.9",
 		"@types/react-table": "^7.7.20",
-		"@vitejs/plugin-react": "^5.0.2",
+		"@vitejs/plugin-react": "^5.0.3",
 		"happy-dom": "^18.0.1",
 		"postcss": "^8.5.6",
 		"postcss-simple-vars": "^7.0.1",
-		"sass": "^1.91.0",
+		"sass": "^1.93.0",
 		"tmp": "^0.2.5",
 		"typescript": "5.9.2",
-		"vite": "^7.1.4",
+		"vite": "^7.1.6",
 		"vite-plugin-checker": "^0.10.3",
 		"vite-tsconfig-paths": "^5.1.4",
 		"vitest": "^3.2.4"

frontend/src/App.css

@@ -1,3 +1,14 @@
+:root {
+	color-scheme: light dark;
+}
+
+.light {
+	color-scheme: light;
+}
+.dark {
+	color-scheme: dark;
+}
+
 .modal-backdrop {
 	--tblr-backdrop-opacity: 0.8 !important;
 }
@@ -12,3 +23,54 @@
 .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,13 +1,10 @@
 import * as api from "./base";
 import type { AccessList } from "./models";
 
-export async function createAccessList(item: AccessList, abortController?: AbortController): Promise<AccessList> {
-	return await api.post(
-		{
+export async function createAccessList(item: AccessList): Promise<AccessList> {
+	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,13 +1,10 @@
 import * as api from "./base";
 import type { Certificate } from "./models";
 
-export async function createCertificate(item: Certificate, abortController?: AbortController): Promise<Certificate> {
-	return await api.post(
-		{
+export async function createCertificate(item: Certificate): Promise<Certificate> {
+	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,13 +1,10 @@
 import * as api from "./base";
 import type { DeadHost } from "./models";
 
-export async function createDeadHost(item: DeadHost, abortController?: AbortController): Promise<DeadHost> {
-	return await api.post(
-		{
+export async function createDeadHost(item: DeadHost): Promise<DeadHost> {
+	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,13 +1,10 @@
 import * as api from "./base";
 import type { ProxyHost } from "./models";
 
-export async function createProxyHost(item: ProxyHost, abortController?: AbortController): Promise<ProxyHost> {
-	return await api.post(
-		{
+export async function createProxyHost(item: ProxyHost): Promise<ProxyHost> {
+	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,16 +1,10 @@
 import * as api from "./base";
 import type { RedirectionHost } from "./models";
 
-export async function createRedirectionHost(
-	item: RedirectionHost,
-	abortController?: AbortController,
-): Promise<RedirectionHost> {
-	return await api.post(
-		{
+export async function createRedirectionHost(item: RedirectionHost): 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,13 +1,10 @@
 import * as api from "./base";
 import type { Stream } from "./models";
 
-export async function createStream(item: Stream, abortController?: AbortController): Promise<Stream> {
-	return await api.post(
-		{
+export async function createStream(item: Stream): Promise<Stream> {
+	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,14 +15,11 @@ export interface NewUser {
 	roles?: string[];
 }
 
-export async function createUser(item: NewUser, noAuth?: boolean, abortController?: AbortController): Promise<User> {
-	return await api.post(
-		{
+export async function createUser(item: NewUser, noAuth?: boolean): Promise<User> {
+	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,10 +1,7 @@
 import * as api from "./base";
 
-export async function deleteAccessList(id: number, abortController?: AbortController): Promise<boolean> {
-	return await api.del(
-		{
+export async function deleteAccessList(id: number): Promise<boolean> {
+	return await api.del({
 		url: `/nginx/access-lists/${id}`,
-		},
-		abortController,
-	);
+	});
 }

frontend/src/api/backend/deleteCertificate.ts

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

frontend/src/api/backend/deleteDeadHost.ts

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

frontend/src/api/backend/deleteProxyHost.ts

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

frontend/src/api/backend/deleteRedirectionHost.ts

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

frontend/src/api/backend/deleteStream.ts

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

frontend/src/api/backend/deleteUser.ts

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

frontend/src/api/backend/downloadCertificate.ts

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

frontend/src/api/backend/expansions.ts

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

frontend/src/api/backend/getAccessLists.ts

@@ -1,8 +1,7 @@
 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,9 +1,10 @@
 import * as api from "./base";
+import type { AuditLogExpansion } from "./expansions";
 import type { AuditLog } from "./models";
 
-export async function getAuditLog(expand?: string[], params = {}): Promise<AuditLog[]> {
+export async function getAuditLog(id: number, expand?: AuditLogExpansion[], params = {}): Promise<AuditLog> {
 	return await api.get({
-		url: "/audit-log",
+		url: `/audit-log/${id}`,
 		params: {
 			expand: expand?.join(","),
 			...params,

frontend/src/api/backend/getAuditLogs.ts

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

frontend/src/api/backend/getCertificate.ts

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

frontend/src/api/backend/getCertificateDNSProviders.ts

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

frontend/src/api/backend/getDeadHost.ts

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

frontend/src/api/backend/getDeadHosts.ts

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

frontend/src/api/backend/getHealth.ts

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

frontend/src/api/backend/getHostsReport.ts

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

frontend/src/api/backend/getProxyHost.ts

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

frontend/src/api/backend/getProxyHosts.ts

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

frontend/src/api/backend/getRedirectionHosts.ts

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

frontend/src/api/backend/getSetting.ts

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

frontend/src/api/backend/getStream.ts

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

frontend/src/api/backend/getStreams.ts

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

frontend/src/api/backend/getToken.ts

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

frontend/src/api/backend/getUser.ts

@@ -1,10 +1,14 @@
 import * as api from "./base";
+import type { UserExpansion } from "./expansions";
 import type { User } from "./models";
 
-export async function getUser(id: number | string = "me", params = {}): Promise<User> {
+export async function getUser(id: number | string = "me", expand?: UserExpansion[], 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,8 +1,7 @@
 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,10 +13,13 @@ 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";
@@ -44,6 +47,7 @@ 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

@@ -40,6 +40,8 @@ export interface AuditLog {
 	objectId: number;
 	action: string;
 	meta: Record<string, any>;
+	// Expansions:
+	user?: User;
 }
 
 export interface AccessList {
@@ -51,7 +53,7 @@ export interface AccessList {
 	meta: Record<string, any>;
 	satisfyAny: boolean;
 	passAuth: boolean;
-	proxyHostCount: number;
+	proxyHostCount?: number;
 	// Expansions:
 	owner?: User;
 	items?: AccessListItem[];
@@ -101,6 +103,7 @@ export interface ProxyHost {
 	modifiedOn: string;
 	ownerUserId: number;
 	domainNames: string[];
+	forwardScheme: string;
 	forwardHost: string;
 	forwardPort: number;
 	accessListId: number;
@@ -112,9 +115,8 @@ 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:
@@ -191,3 +193,9 @@ 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,11 +1,8 @@
 import * as api from "./base";
 import type { TokenResponse } from "./responseTypes";
 
-export async function refreshToken(abortController?: AbortController): Promise<TokenResponse> {
-	return await api.get(
-		{
+export async function refreshToken(): Promise<TokenResponse> {
+	return await api.get({
 		url: "/tokens",
-		},
-		abortController,
-	);
+	});
 }

frontend/src/api/backend/renewCertificate.ts

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

frontend/src/api/backend/setPermissions.ts

@@ -1,17 +1,10 @@
 import * as api from "./base";
 import type { UserPermissions } from "./models";
 
-export async function setPermissions(
-	userId: number,
-	data: UserPermissions,
-	abortController?: AbortController,
-): Promise<boolean> {
+export async function setPermissions(userId: number, data: UserPermissions): 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,16 +1,10 @@
 import * as api from "./base";
 
-export async function testHttpCertificate(
-	domains: string[],
-	abortController?: AbortController,
-): Promise<Record<string, string>> {
-	return await api.get(
-		{
+export async function testHttpCertificate(domains: string[]): 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,14 +1,7 @@
 import * as api from "./base";
 
-export async function toggleDeadHost(
-	id: number,
-	enabled: boolean,
-	abortController?: AbortController,
-): Promise<boolean> {
-	return await api.post(
-		{
+export async function toggleDeadHost(id: number, enabled: boolean): Promise<boolean> {
+	return await api.post({
 		url: `/nginx/dead-hosts/${id}/${enabled ? "enable" : "disable"}`,
-		},
-		abortController,
-	);
+	});
 }

frontend/src/api/backend/toggleProxyHost.ts

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

frontend/src/api/backend/toggleRedirectionHost.ts

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

frontend/src/api/backend/toggleStream.ts

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

frontend/src/api/backend/toggleUser.ts

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

frontend/src/api/backend/updateDeadHost.ts

@@ -1,15 +1,12 @@
 import * as api from "./base";
 import type { DeadHost } from "./models";
 
-export async function updateDeadHost(item: DeadHost, abortController?: AbortController): Promise<DeadHost> {
+export async function updateDeadHost(item: DeadHost): 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,15 +1,12 @@
 import * as api from "./base";
 import type { ProxyHost } from "./models";
 
-export async function updateProxyHost(item: ProxyHost, abortController?: AbortController): Promise<ProxyHost> {
+export async function updateProxyHost(item: ProxyHost): 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,18 +1,12 @@
 import * as api from "./base";
 import type { RedirectionHost } from "./models";
 
-export async function updateRedirectionHost(
-	item: RedirectionHost,
-	abortController?: AbortController,
-): Promise<RedirectionHost> {
+export async function updateRedirectionHost(item: RedirectionHost): 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,15 +1,12 @@
 import * as api from "./base";
 import type { Setting } from "./models";
 
-export async function updateSetting(item: Setting, abortController?: AbortController): Promise<Setting> {
+export async function updateSetting(item: Setting): 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,15 +1,12 @@
 import * as api from "./base";
 import type { Stream } from "./models";
 
-export async function updateStream(item: Stream, abortController?: AbortController): Promise<Stream> {
+export async function updateStream(item: Stream): 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,15 +1,12 @@
 import * as api from "./base";
 import type { User } from "./models";
 
-export async function updateUser(item: User, abortController?: AbortController): Promise<User> {
+export async function updateUser(item: User): 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,13 +6,9 @@ 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,13 +5,9 @@ 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,13 +8,15 @@ export function ErrorNotFound() {
 	return (
 		<div className="container-tight py-4">
 			<div className="empty">
-				<p className="empty-title">{intl.formatMessage({ id: "notfound.title" })}</p>
+				<p className="empty-title">
+					<T id="notfound.title" />
+				</p>
 				<p className="empty-subtitle text-secondary">
-					{intl.formatMessage({ id: "notfound.text" })}
+					<T id="notfound.text" />
 				</p>
 				<div className="empty-action">
 					<Button type="button" size="md" onClick={() => navigate("/")}>
-						{intl.formatMessage({ id: "notfound.action" })}
+						<T id="notfound.action" />
 					</Button>
 				</div>
 			</div>

frontend/src/components/Form/AccessField.tsx

@@ -0,0 +1,99 @@
+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

@@ -0,0 +1,36 @@
+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

@@ -0,0 +1,8 @@
+.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

@@ -0,0 +1,119 @@
+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

@@ -0,0 +1,82 @@
+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

@@ -0,0 +1,40 @@
+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>
+	);
+}