mirror of
https://github.com/dani-garcia/vaultwarden
synced 2024-06-14 18:08:21 +02:00
338756550a
- Fixed a bug in JavaScript which caused no messages to be shown to the user in-case of an error send by the server. - Changed mail error handling for better error messages - Changed user/org actions from a to buttons, this should prevent strange issues in-case of javascript issues and the page does re-load. - Added Alpine and Debian info for the running docker image During the mail error testing i encountered a bug which caused lettre to panic. This panic only happens on debug builds and not release builds, so no need to update anything on that part. This bug is also already fixed. See https://github.com/lettre/lettre/issues/678 and https://github.com/lettre/lettre/pull/679 Resolves #2021 Could also fix the issue reported here #2022, or at least no hash `#` in the url.
257 lines
12 KiB
Handlebars
257 lines
12 KiB
Handlebars
<main class="container-xl">
|
|
<div id="config-block" class="align-items-center p-3 mb-3 bg-secondary rounded shadow">
|
|
<div>
|
|
<h6 class="text-white mb-3">Configuration</h6>
|
|
<div class="small text-white mb-3">
|
|
<span class="font-weight-bolder">NOTE:</span> The settings here override the environment variables. Once saved, it's recommended to stop setting them to avoid confusion.<br>
|
|
This does not apply to the read-only section, which can only be set via environment variables.<br>
|
|
Settings which are overridden are shown with <span class="is-overridden-true">double underscores</span>.
|
|
</div>
|
|
|
|
<form class="form needs-validation" id="config-form" onsubmit="saveConfig(); return false;" novalidate>
|
|
{{#each config}}
|
|
{{#if groupdoc}}
|
|
<div class="card bg-light mb-3">
|
|
<button id="b_{{group}}" type="button" class="card-header text-start btn btn-link text-decoration-none" aria-expanded="false" aria-controls="g_{{group}}" data-bs-toggle="collapse" data-bs-target="#g_{{group}}">{{groupdoc}}</button>
|
|
<div id="g_{{group}}" class="card-body collapse">
|
|
{{#each elements}}
|
|
{{#if editable}}
|
|
<div class="row my-2 align-items-center is-overridden-{{overridden}}" title="[{{name}}] {{doc.description}}">
|
|
{{#case type "text" "number" "password"}}
|
|
<label for="input_{{name}}" class="col-sm-3 col-form-label">{{doc.name}}</label>
|
|
<div class="col-sm-8">
|
|
<div class="input-group">
|
|
<input class="form-control conf-{{type}}" id="input_{{name}}" type="{{type}}"
|
|
name="{{name}}" value="{{value}}" {{#if default}} placeholder="Default: {{default}}"{{/if}}>
|
|
{{#case type "password"}}
|
|
<button class="btn btn-outline-secondary input-group-text" type="button" onclick="toggleVis('input_{{name}}');">Show/hide</button>
|
|
{{/case}}
|
|
</div>
|
|
</div>
|
|
{{/case}}
|
|
{{#case type "checkbox"}}
|
|
<div class="col-sm-3 col-form-label">{{doc.name}}</div>
|
|
<div class="col-sm-8">
|
|
<div class="form-check">
|
|
<input class="form-check-input conf-{{type}}" type="checkbox" id="input_{{name}}"
|
|
name="{{name}}" {{#if value}} checked {{/if}}>
|
|
|
|
<label class="form-check-label" for="input_{{name}}"> Default: {{default}} </label>
|
|
</div>
|
|
</div>
|
|
{{/case}}
|
|
</div>
|
|
{{/if}}
|
|
{{/each}}
|
|
{{#case group "smtp"}}
|
|
<div class="row my-2 align-items-center pt-3 border-top" title="Send a test email to given email address">
|
|
<label for="smtp-test-email" class="col-sm-3 col-form-label">Test SMTP</label>
|
|
<div class="col-sm-8 input-group">
|
|
<input class="form-control" id="smtp-test-email" type="email" placeholder="Enter test email" required>
|
|
<button type="button" class="btn btn-outline-primary input-group-text" onclick="smtpTest(); return false;">Send test email</button>
|
|
<div class="invalid-tooltip">Please provide a valid email address</div>
|
|
</div>
|
|
</div>
|
|
{{/case}}
|
|
</div>
|
|
</div>
|
|
{{/if}}
|
|
{{/each}}
|
|
|
|
<div class="card bg-light mb-3">
|
|
<button id="b_readonly" type="button" class="card-header text-start btn btn-link text-decoration-none" aria-expanded="false" aria-controls="g_readonly"
|
|
data-bs-toggle="collapse" data-bs-target="#g_readonly">Read-Only Config</button>
|
|
<div id="g_readonly" class="card-body collapse">
|
|
<div class="small mb-3">
|
|
NOTE: These options can't be modified in the editor because they would require the server
|
|
to be restarted. To modify them, you need to set the correct environment variables when
|
|
launching the server. You can check the variable names in the tooltips of each option.
|
|
</div>
|
|
|
|
{{#each config}}
|
|
{{#each elements}}
|
|
{{#unless editable}}
|
|
<div class="row my-2 align-items-center" title="[{{name}}] {{doc.description}}">
|
|
{{#case type "text" "number" "password"}}
|
|
<label for="input_{{name}}" class="col-sm-3 col-form-label">{{doc.name}}</label>
|
|
<div class="col-sm-8">
|
|
<div class="input-group">
|
|
<input readonly class="form-control" id="input_{{name}}" type="{{type}}"
|
|
value="{{value}}" {{#if default}} placeholder="Default: {{default}}" {{/if}}>
|
|
{{#case type "password"}}
|
|
<button class="btn btn-outline-secondary" type="button" onclick="toggleVis('input_{{name}}');">Show/hide</button>
|
|
{{/case}}
|
|
</div>
|
|
</div>
|
|
{{/case}}
|
|
{{#case type "checkbox"}}
|
|
<div class="col-sm-3 col-form-label">{{doc.name}}</div>
|
|
<div class="col-sm-8">
|
|
<div class="form-check align-middle">
|
|
<input disabled class="form-check-input" type="checkbox" id="input_{{name}}"
|
|
{{#if value}} checked {{/if}}>
|
|
|
|
<label class="form-check-label" for="input_{{name}}"> Default: {{default}} </label>
|
|
</div>
|
|
</div>
|
|
{{/case}}
|
|
</div>
|
|
{{/unless}}
|
|
{{/each}}
|
|
{{/each}}
|
|
|
|
</div>
|
|
</div>
|
|
|
|
{{#if can_backup}}
|
|
<div class="card bg-light mb-3">
|
|
<button id="b_database" type="button" class="card-header text-start btn btn-link text-decoration-none" aria-expanded="false" aria-controls="g_database"
|
|
data-bs-toggle="collapse" data-bs-target="#g_database">Backup Database</button>
|
|
<div id="g_database" class="card-body collapse">
|
|
<div class="small mb-3">
|
|
WARNING: This function only creates a backup copy of the SQLite database.
|
|
This does not include any configuration or file attachment data that may
|
|
also be needed to fully restore a vaultwarden instance. For details on
|
|
how to perform complete backups, refer to the wiki page on
|
|
<a href="https://github.com/dani-garcia/vaultwarden/wiki/Backing-up-your-vault">backups</a>.
|
|
</div>
|
|
<button type="button" class="btn btn-primary" onclick="backupDatabase();">Backup Database</button>
|
|
</div>
|
|
</div>
|
|
{{/if}}
|
|
|
|
<button type="submit" class="btn btn-primary">Save</button>
|
|
<button type="button" class="btn btn-danger float-end" onclick="deleteConf();">Reset defaults</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<style>
|
|
#config-block ::placeholder {
|
|
/* Most modern browsers support this now. */
|
|
color: orangered;
|
|
}
|
|
|
|
.is-overridden-true {
|
|
text-decoration: underline double;
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
'use strict';
|
|
|
|
function smtpTest() {
|
|
if (formHasChanges(config_form)) {
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
alert("Config has been changed but not yet saved.\nPlease save the changes first before sending a test email.");
|
|
return false;
|
|
}
|
|
|
|
let test_email = document.getElementById("smtp-test-email");
|
|
|
|
// Do a very very basic email address check.
|
|
if (test_email.value.match(/\S+@\S+/i) === null) {
|
|
test_email.parentElement.classList.add('was-validated');
|
|
event.preventDefault();
|
|
event.stopPropagation();
|
|
return false;
|
|
}
|
|
|
|
const data = JSON.stringify({ "email": test_email.value });
|
|
_post("{{urlpath}}/admin/test/smtp/",
|
|
"SMTP Test email sent correctly",
|
|
"Error sending SMTP test email", data, false);
|
|
return false;
|
|
}
|
|
function getFormData() {
|
|
let data = {};
|
|
|
|
document.querySelectorAll(".conf-checkbox").forEach(function (e) {
|
|
data[e.name] = e.checked;
|
|
});
|
|
|
|
document.querySelectorAll(".conf-number").forEach(function (e) {
|
|
data[e.name] = e.value ? +e.value : null;
|
|
});
|
|
|
|
document.querySelectorAll(".conf-text, .conf-password").forEach(function (e) {
|
|
data[e.name] = e.value || null;
|
|
});
|
|
return data;
|
|
}
|
|
function saveConfig() {
|
|
const data = JSON.stringify(getFormData());
|
|
_post("{{urlpath}}/admin/config/", "Config saved correctly",
|
|
"Error saving config", data);
|
|
return false;
|
|
}
|
|
function deleteConf() {
|
|
var input = prompt("This will remove all user configurations, and restore the defaults and the " +
|
|
"values set by the environment. This operation could be dangerous. Type 'DELETE' to proceed:");
|
|
if (input === "DELETE") {
|
|
_post("{{urlpath}}/admin/config/delete",
|
|
"Config deleted correctly",
|
|
"Error deleting config");
|
|
} else {
|
|
alert("Wrong input, please try again")
|
|
}
|
|
|
|
return false;
|
|
}
|
|
function backupDatabase() {
|
|
_post("{{urlpath}}/admin/config/backup_db",
|
|
"Backup created successfully",
|
|
"Error creating backup", null, false);
|
|
return false;
|
|
}
|
|
function masterCheck(check_id, inputs_query) {
|
|
function onChanged(checkbox, inputs_query) {
|
|
return function _fn() {
|
|
document.querySelectorAll(inputs_query).forEach(function (e) { e.disabled = !checkbox.checked; });
|
|
checkbox.disabled = false;
|
|
};
|
|
}
|
|
|
|
const checkbox = document.getElementById(check_id);
|
|
const onChange = onChanged(checkbox, inputs_query);
|
|
onChange(); // Trigger the event initially
|
|
checkbox.addEventListener("change", onChange);
|
|
}
|
|
|
|
{{#each config}} {{#if grouptoggle}}
|
|
masterCheck("input_{{grouptoggle}}", "#g_{{group}} input");
|
|
{{/if}} {{/each}}
|
|
|
|
// Two functions to help check if there were changes to the form fields
|
|
// Useful for example during the smtp test to prevent people from clicking save before testing there new settings
|
|
function initChangeDetection(form) {
|
|
const ignore_fields = ["smtp-test-email"];
|
|
Array.from(form).forEach((el) => {
|
|
if (! ignore_fields.includes(el.id)) {
|
|
el.dataset.origValue = el.value
|
|
}
|
|
});
|
|
}
|
|
function formHasChanges(form) {
|
|
return Array.from(form).some(el => 'origValue' in el.dataset && ( el.dataset.origValue !== el.value));
|
|
}
|
|
|
|
// Trigger Form Change Detection
|
|
const config_form = document.getElementById('config-form');
|
|
initChangeDetection(config_form);
|
|
|
|
// Colorize some settings which are high risk
|
|
const risk_items = document.getElementsByClassName('col-form-label');
|
|
function colorRiskSettings(risk_el) {
|
|
Array.from(risk_el).forEach((el) => {
|
|
if (el.innerText.toLowerCase().includes('risks') ) {
|
|
el.parentElement.className += ' alert-danger'
|
|
}
|
|
});
|
|
}
|
|
colorRiskSettings(risk_items);
|
|
|
|
</script>
|