sso-manager-node/nodejs/views/conf.ejs

<%- include('top') %>
<script type="text/javascript">
	app.auth.forceLogin(['admin', 'app_sso_admin']);

	$(document).ready(function() {
		loadConf();
	});

	async function loadConf() {
		try {
			const data = await app.api.get('conf');
			// Populate SMTP
			if (data.smtp) {
				$('#smtp-host').val(data.smtp.host || '');
				$('#smtp-port').val(data.smtp.port || 587);
				$('#smtp-user').val(data.smtp.user || '');
				$('#smtp-pass').val(data.smtp.pass || '');
				$('#smtp-from').val(data.smtp.from || '');
				$('#smtp-secure').prop('checked', !!data.smtp.secure);
			}
			
			// Populate OAuth
			if (data.oauth) {
				$('#oauth-issuer').val(data.oauth.issuer || '');
				$('#oauth-jwtsecret').val(data.oauth.jwtSecret || '');
				if (data.oauth.token_lifetime) {
					$('#oauth-token-access').val(data.oauth.token_lifetime.access_token || 3600);
					$('#oauth-token-refresh').val(data.oauth.token_lifetime.refresh_token || 2592000);
				}
			}
		} catch (error) {
			app.messages.toast('Failed to load configuration: ' + (error.message || 'Unknown error'), 'danger');
		}
	}

	async function saveConf() {
		const btn = $('#btn-save');
		btn.prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Saving...');
		
		const payload = {
			smtp: {
				host: $('#smtp-host').val(),
				port: parseInt($('#smtp-port').val(), 10) || 587,
				user: $('#smtp-user').val(),
				pass: $('#smtp-pass').val(),
				from: $('#smtp-from').val(),
				secure: $('#smtp-secure').is(':checked')
			},
			oauth: {
				issuer: $('#oauth-issuer').val(),
				jwtSecret: $('#oauth-jwtsecret').val(),
				token_lifetime: {
					access_token: parseInt($('#oauth-token-access').val(), 10) || 3600,
					refresh_token: parseInt($('#oauth-token-refresh').val(), 10) || 2592000
				}
			}
		};

		try {
			await app.api.post('conf', payload);
			app.messages.toast('Configuration saved successfully! It will take effect immediately.', 'success');
		} catch (error) {
			app.messages.toast('Failed to save configuration: ' + error.message, 'danger');
		} finally {
			btn.prop('disabled', false).html('<i class="fas fa-save"></i> Save Configuration');
		}
	}
	
	function togglePassword(id) {
		const el = document.getElementById(id);
		if (el.type === 'password') {
			el.type = 'text';
		} else {
			el.type = 'password';
		}
	}
</script>

<div class="container py-4">
	<div class="row mb-4">
		<div class="col d-flex justify-content-between align-items-center">
			<div>
				<h2><i class="fas fa-cogs"></i> System Configuration</h2>
				<p class="text-muted mb-0">
					Manage runtime configuration such as SMTP settings and OAuth parameters.
					These are stored securely in OpenBao and take effect immediately. Secret fields
					(the SMTP password and OAuth JWT secret) are masked — leave them unchanged to
					keep the stored value.
				</p>
			</div>
			<div>
				<button class="btn btn-secondary me-2" onclick="loadConf()"><i class="fas fa-undo"></i> Reset</button>
				<button id="btn-save" class="btn btn-primary" onclick="saveConf()"><i class="fas fa-save"></i> Save Configuration</button>
			</div>
		</div>
	</div>

	<div class="row">
		<div class="col-md-6 mb-4">
			<div class="card shadow-sm border-0 h-100">
				<div class="card-header bg-white border-bottom-0 pt-4 pb-0">
					<h5 class="mb-0"><i class="fas fa-envelope text-primary me-2"></i> SMTP Settings</h5>
				</div>
				<div class="card-body">
					<div class="mb-3">
						<label class="form-label">Host</label>
						<input type="text" class="form-control" id="smtp-host">
					</div>
					<div class="mb-3">
						<label class="form-label">Port</label>
						<input type="number" class="form-control" id="smtp-port">
					</div>
					<div class="mb-3">
						<label class="form-label">User</label>
						<input type="text" class="form-control" id="smtp-user">
					</div>
					<div class="mb-3">
						<label class="form-label">Password</label>
						<div class="input-group">
							<input type="password" class="form-control" id="smtp-pass" placeholder="********">
							<button class="btn btn-outline-secondary" type="button" onclick="togglePassword('smtp-pass')"><i class="fas fa-eye"></i></button>
						</div>
						<div class="form-text">Leave unchanged to keep the current password stored in OpenBao. Clear and type a new value to replace it.</div>
					</div>
					<div class="mb-3">
						<label class="form-label">From Address</label>
						<input type="text" class="form-control" id="smtp-from">
					</div>
					<div class="form-check">
						<input class="form-check-input" type="checkbox" id="smtp-secure">
						<label class="form-check-label">Use Secure (TLS)</label>
					</div>
				</div>
			</div>
		</div>

		<div class="col-md-6 mb-4">
			<div class="card shadow-sm border-0 h-100">
				<div class="card-header bg-white border-bottom-0 pt-4 pb-0">
					<h5 class="mb-0"><i class="fas fa-key text-success me-2"></i> OAuth & JWT Settings</h5>
				</div>
				<div class="card-body">
					<div class="mb-3">
						<label class="form-label">Issuer URL</label>
						<input type="text" class="form-control" id="oauth-issuer">
					</div>
					<div class="mb-3">
						<label class="form-label">JWT Secret</label>
						<div class="input-group">
							<input type="password" class="form-control" id="oauth-jwtsecret" placeholder="********">
							<button class="btn btn-outline-secondary" type="button" onclick="togglePassword('oauth-jwtsecret')"><i class="fas fa-eye"></i></button>
						</div>
						<div class="form-text">Leave unchanged to keep the current secret stored in OpenBao. Clear and type a new value to replace it.</div>
					</div>
					<div class="mb-3">
						<label class="form-label">Access Token Lifetime (seconds)</label>
						<input type="number" class="form-control" id="oauth-token-access">
					</div>
					<div class="mb-3">
						<label class="form-label">Refresh Token Lifetime (seconds)</label>
						<input type="number" class="form-control" id="oauth-token-refresh">
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<%- include('bottom') %>