Skip to content

Commit

Permalink
WebClient: add toast notifications
Browse files Browse the repository at this point in the history
Signed-off-by: Nicola Murino <[email protected]>
  • Loading branch information
drakkan committed Dec 14, 2023
1 parent cec6420 commit fe41109
Show file tree
Hide file tree
Showing 6 changed files with 59 additions and 70 deletions.
2 changes: 1 addition & 1 deletion go.mod
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ module github.com/drakkan/sftpgo/v2
go 1.21

require (
cloud.google.com/go/storage v1.35.1
cloud.google.com/go/storage v1.36.0
github.com/Azure/azure-sdk-for-go/sdk/azcore v1.9.1
github.com/Azure/azure-sdk-for-go/sdk/storage/azblob v1.2.0
github.com/GehirnInc/crypt v0.0.0-20230320061759-8cc1b52080c5
Expand Down
4 changes: 2 additions & 2 deletions go.sum
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ cloud.google.com/go/iam v1.1.5 h1:1jTsCu4bcsNsE4iiqNT5SHwrDRCfRmIaaaVFhRveTJI=
cloud.google.com/go/iam v1.1.5/go.mod h1:rB6P/Ic3mykPbFio+vo7403drjlgvoWfYpJhMXEbzv8=
cloud.google.com/go/kms v1.15.5 h1:pj1sRfut2eRbD9pFRjNnPNg/CzJPuQAzUujMIM1vVeM=
cloud.google.com/go/kms v1.15.5/go.mod h1:cU2H5jnp6G2TDpUGZyqTCoy1n16fbubHZjmVXSMtwDI=
cloud.google.com/go/storage v1.35.1 h1:B59ahL//eDfx2IIKFBeT5Atm9wnNmj3+8xG/W4WB//w=
cloud.google.com/go/storage v1.35.1/go.mod h1:M6M/3V/D3KpzMTJyPOR/HU6n2Si5QdaXYEsng2xgOs8=
cloud.google.com/go/storage v1.36.0 h1:P0mOkAcaJxhCTvAkMhxMfrTKiNcub4YmmPBtlhAyTr8=
cloud.google.com/go/storage v1.36.0/go.mod h1:M6M/3V/D3KpzMTJyPOR/HU6n2Si5QdaXYEsng2xgOs8=
github.com/Azure/azure-sdk-for-go v68.0.0+incompatible h1:fcYLmCpyNYRnvJbPerq7U0hS+6+I79yEDJBqVNcqUzU=
github.com/Azure/azure-sdk-for-go/sdk/azcore v1.9.1 h1:lGlwhPtrX6EVml1hO0ivjkUxsSyl4dsiw9qcA1k/3IQ=
github.com/Azure/azure-sdk-for-go/sdk/azcore v1.9.1/go.mod h1:RKUqNu35KJYcVG/fqTRqmuXJZYNhYkBrnC/hX7yGbTA=
Expand Down
24 changes: 24 additions & 0 deletions templates/webclient/base.html
Original file line number Diff line number Diff line change
Expand Up @@ -294,6 +294,25 @@
</div>
</div>

<div class="toast-container position-fixed top-0 end-0 p-3">
<div id="toast_container" class="toast" role="alert" aria-live="assertive" aria-atomic="true" data-bs-autohide="false">
<div class="toast-body border-0 d-flex align-items-center">
<i class="ki-duotone ki-information fs-3x text-warning me-5">
<span class="path1"></span>
<span class="path2"></span>
<span class="path3"></span>
</i>
<span id="toast_msg" class="fs-5 fw-semibold text-gray-800 me-auto"></span>
<button data-i18n="[aria-label]general.close" type="button" class="btn btn-icon btn-sm btn-close position-absolute position-sm-relative m-2 m-sm-0 top-0 end-0 ms-sm-auto" data-bs-dismiss="toast" aria-label="Close">
<i class="ki-duotone ki-cross fs-2x text-primary">
<span class="path1"></span>
<span class="path2"></span>
</i>
</button>
</div>
</div>
</div>

{{- block "modals" .}}{{- end}}
<script {{- if .CSPNonce}} nonce="{{.CSPNonce}}"{{- end}} src="{{.StaticURL}}/assets/plugins/global/plugins.bundle.js"></script>
<script {{- if .CSPNonce}} nonce="{{.CSPNonce}}"{{- end}} src="{{.StaticURL}}/assets/js/scripts.bundle.js"></script>
Expand Down Expand Up @@ -393,6 +412,11 @@
}
}();

function showToast(msg, options) {
const toast = bootstrap.Toast.getOrCreateInstance(document.getElementById('toast_container'));
setI18NData($('#toast_msg'), msg, options)
toast.show();
}

function doLogout() {
ModalAlert.fire({
Expand Down
61 changes: 24 additions & 37 deletions templates/webclient/files.html
Original file line number Diff line number Diff line change
Expand Up @@ -31,21 +31,21 @@
<div class="card-toolbar">
<div class="d-flex justify-content-end" data-kt-filemanager-table-toolbar="base">
{{- if .CanCreateDirs}}
<button id="id_create_dir_button" data-i18n="fs.new_folder" type="button" class="btn btn-flex btn-light-primary me-3">
<button id="id_create_dir_button" type="button" class="btn btn-flex btn-light-primary me-3">
<i class="ki-duotone ki-add-folder fs-2">
<span class="path1"></span>
<span class="path2"></span>
</i>
New Folder
<span data-i18n="fs.new_folder">New Folder</span>
</button>
{{- end}}
{{- if .CanAddFiles}}
<button type="button" data-i18n="fs.upload.text" class="btn btn-flex btn-primary" data-bs-toggle="modal" data-bs-target="#modal_upload">
<button type="button" class="btn btn-flex btn-primary" data-bs-toggle="modal" data-bs-target="#modal_upload">
<i class="ki-duotone ki-folder-up fs-2">
<span class="path1"></span>
<span class="path2"></span>
</i>
Upload Files
<span data-i18n="fs.upload.text">Upload Files</span>
</button>
{{- end}}
</div>
Expand All @@ -61,8 +61,8 @@
</div>
{{- if or .CanDownload .CanDelete}}
<div>
<button data-i18n="fs.actions" type="button" class="btn btn-light-primary rotate" data-kt-menu-trigger="click" data-kt-menu-placement="bottom">
Actions
<button type="button" class="btn btn-light-primary rotate" data-kt-menu-trigger="click" data-kt-menu-placement="bottom">
<span data-i18n="fs.actions">Actions</span>
<i class="ki-duotone ki-down fs-3 rotate-180 ms-3 me-0"></i>
</button>
<div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-800 menu-state-bg-light-primary fw-semibold w-auto min-w-200 mw-300px py-4" data-kt-menu="true">
Expand Down Expand Up @@ -1163,17 +1163,14 @@ <h4 class="gslide-title"></h4>
}

function doCopy() {
$('#errorMsg').addClass("d-none");
let items = getMoveOrCopyItems();
if (items.length == 0){
return;
}
let errDivEl = $('#errorMsg');
let errTxtEl = $('#errorTxt');
errDivEl.addClass("d-none");
items = checkMoveCopyItems(items)
if (items.length == 0){
setI18NData(errTxtEl, "fs.invalid_name");
errDivEl.removeClass("d-none");
showToast("fs.invalid_name");
return;
}
keepAlive();
Expand Down Expand Up @@ -1245,8 +1242,7 @@ <h4 class="gslide-title"></h4>
if (!errorMessage){
errorMessage = "fs.copy.err_generic";
}
setI18NData(errTxtEl, errorMessage);
errDivEl.removeClass("d-none");
showToast(errorMessage);
copyItem();
});
}
Expand All @@ -1255,17 +1251,14 @@ <h4 class="gslide-title"></h4>
}

function doMove() {
$('#errorMsg').addClass("d-none");
let items = getMoveOrCopyItems();
if (items.length == 0){
return;
}
let errDivEl = $('#errorMsg');
let errTxtEl = $('#errorTxt');
errDivEl.addClass("d-none");
items = checkMoveCopyItems(items)
if (items.length == 0){
setI18NData(errTxtEl, "fs.invalid_name");
errDivEl.removeClass("d-none");
showToast("fs.invalid_name");
return;
}
keepAlive();
Expand Down Expand Up @@ -1337,8 +1330,7 @@ <h4 class="gslide-title"></h4>
if (!errorMessage){
errorMessage = "fs.move.err_generic";
}
setI18NData(errTxtEl, errorMessage);
errDivEl.removeClass("d-none");
showToast(errorMessage);
moveItem();
});
}
Expand All @@ -1363,9 +1355,7 @@ <h4 class="gslide-title"></h4>
}

function deleteItem(meta) {
let errDivEl = $('#errorMsg');
let errTxtEl = $('#errorTxt');
errDivEl.addClass("d-none");
$('#errorMsg').addClass("d-none");
let itemName = getNameFromMeta(meta);

ModalAlert.fire({
Expand Down Expand Up @@ -1409,8 +1399,7 @@ <h4 class="gslide-title"></h4>
if (!errorMessage){
errorMessage = "fs.delete.err_generic";
}
setI18NData(errTxtEl, errorMessage, {name: itemName});
errDivEl.removeClass("d-none");
showToast(errorMessage, {name: itemName});
});
}
});
Expand Down Expand Up @@ -1439,21 +1428,16 @@ <h4 class="gslide-title"></h4>
let meta = $('#rename_old_name').val();
let oldName = getNameFromMeta(meta);
let newName = $('#rename_new_name').val();
let errDivEl = $('#errorMsg');
let errTxtEl = $('#errorTxt');
if (!newName){
setI18NData(errTxtEl, "general.name_required");
errDivEl.removeClass("d-none");
showToast("general.name_required");
return;
}
if (newName == oldName){
setI18NData(errTxtEl, "general.name_different");
errDivEl.removeClass("d-none");
showToast("general.name_different");
return;
}
if (newName.includes("/")){
setI18NData(errTxtEl, "fs.invalid_name");
errDivEl.removeClass("d-none");
showToast("fs.invalid_name");
return;
}
let path = '{{.FileActionsURL}}/move';
Expand Down Expand Up @@ -1483,8 +1467,7 @@ <h4 class="gslide-title"></h4>
if (!errorMessage){
errorMessage = "fs.rename.err_generic";
}
setI18NData(errTxtEl, errorMessage, {name: oldName});
errDivEl.removeClass("d-none");
showToast(errorMessage, {name: oldName});
});
}

Expand Down Expand Up @@ -2052,10 +2035,14 @@ <h3 data-i18n="general.choose_target_folder" class="modal-title">
</div>
<div class="modal-footer border-0">
{{- if .CanAddFiles }}
<button data-i18n="fs.copy.msg" id="id_copy_button" type="button" class="btn btn-light-primary me-5" data-bs-dismiss="modal">Copy</button>
<button id="id_copy_button" type="button" class="btn btn-light-primary me-5" data-bs-dismiss="modal">
<span data-i18n="fs.copy.msg">Copy</span>
</button>
{{- end}}
{{- if .CanRename }}
<button data-i18n="fs.move.msg" id="id_move_button" type="button" class="btn btn-primary" data-bs-dismiss="modal">Move</button>
<button id="id_move_button" type="button" class="btn btn-primary" data-bs-dismiss="modal">
<span data-i18n="fs.move.msg">Move</span>
</button>
{{- end}}
</div>
</div>
Expand Down
30 changes: 7 additions & 23 deletions templates/webclient/mfa.html
Original file line number Diff line number Diff line change
Expand Up @@ -56,8 +56,6 @@ <h4 class="text-gray-900 fw-bold">
</div>
</div>

{{- template "errmsg" ""}}

<div class="form-group row mt-10">
<label for="id_config" data-i18n="general.configuration" class="col-md-3 col-form-label">Configuration</label>
<div class="col-md-9">
Expand Down Expand Up @@ -470,18 +468,13 @@ <h3 data-i18n="2fa.setup_title" class="modal-title">Set up two-factor authentica
return;
}

let errDivEl = $('#errorMsg');
let errTxtEl = $('#errorTxt');
if ($('#id_protocols').find('option:selected').length == 0){
setI18NData(errTxtEl, '2fa.no_protocol');
errDivEl.removeClass("d-none");
showToast('2fa.no_protocol');
return;
}

let errorMessage = '2fa.auth_secret_gen_err';

$('#id_secret').text("");
errDivEl.addClass("d-none");
el.setAttribute('data-kt-indicator', 'on');
el.disabled = true;

Expand All @@ -499,8 +492,7 @@ <h3 data-i18n="2fa.setup_title" class="modal-title">Set up two-factor authentica
el.removeAttribute('data-kt-indicator');
el.disabled = false;
if (!response.data.secret) {
setI18NData(errTxtEl, errorMessage);
errDivEl.removeClass("d-none");
showToast(errorMessage);
return;
}
$('#id_secret').text(response.data.secret);
Expand All @@ -517,8 +509,7 @@ <h3 data-i18n="2fa.setup_title" class="modal-title">Set up two-factor authentica
}).catch(function (error){
el.removeAttribute('data-kt-indicator');
el.disabled = false;
setI18NData(errTxtEl, errorMessage);
errDivEl.removeClass("d-none");
showToast(errorMessage);
});
}

Expand All @@ -529,22 +520,18 @@ <h3 data-i18n="2fa.setup_title" class="modal-title">Set up two-factor authentica
if (!configName) {
configName = $('#id_config option:selected').val();
}
let errDivEl = $('#errorMsg');
let errTxtEl = $('#errorTxt');
let errorMessage = '2fa.save_err';
let protocolsArray = [];
$('#id_protocols').find('option:selected').each(function(){
protocolsArray.push($(this).val());
});
if (protocolsArray.length == 0){
setI18NData(errTxtEl, '2fa.no_protocol');
errDivEl.removeClass("d-none");
showToast('2fa.no_protocol');
return;
}
for (let i = 0; i < requiredProtocols.length > 0; i++){
if (!protocolsArray.includes(requiredProtocols[i])){
setI18NData(errTxtEl, '2fa.required_protocols', {val: requiredProtocols.join(', ')});
errDivEl.removeClass("d-none");
showToast('2fa.required_protocols', {val: requiredProtocols.join(', ')});
return;
}
}
Expand All @@ -563,7 +550,6 @@ <h3 data-i18n="2fa.setup_title" class="modal-title">Set up two-factor authentica
} else {
postData.enabled = true;
}
errDivEl.addClass("d-none");
el.setAttribute('data-kt-indicator', 'on');
el.disabled = true;

Expand All @@ -579,8 +565,7 @@ <h3 data-i18n="2fa.setup_title" class="modal-title">Set up two-factor authentica
el.removeAttribute('data-kt-indicator');
el.disabled = false;
if (!response.data.message) {
setI18NData(errTxtEl, errorMessage);
errDivEl.removeClass("d-none");
showToast(errorMessage);
return;
}
ModalAlert.fire({
Expand All @@ -598,8 +583,7 @@ <h3 data-i18n="2fa.setup_title" class="modal-title">Set up two-factor authentica
}).catch(function (error) {
el.removeAttribute('data-kt-indicator');
el.disabled = false;
setI18NData(errTxtEl, errorMessage);
errDivEl.removeClass("d-none");
showToast(errorMessage);
});

}
Expand Down
8 changes: 1 addition & 7 deletions templates/webclient/shares.html
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,6 @@
<h3 data-i18n="share.view_manage" class="card-title text-primary">View and manage shares</h3>
</div>
<div id="card_body" class="card-body">
{{- template "errmsg" ""}}
<div id="loader" class="align-items-center text-center my-10">
<span class="spinner-border w-15px h-15px text-muted align-middle me-2"></span>
<span data-i18n="general.loading" class="text-gray-600">Loading...</span>
Expand Down Expand Up @@ -107,10 +106,6 @@ <h3 class="modal-title">
<script type="text/javascript" {{- if .CSPNonce}} nonce="{{.CSPNonce}}"{{- end}}>

function deleteAction(shareID) {
let errDivEl = $('#errorMsg');
let errTxtEl = $('#errorTxt');
errDivEl.addClass("d-none");

ModalAlert.fire({
text: $.t('general.delete_confirm_generic'),
icon: "warning",
Expand Down Expand Up @@ -152,8 +147,7 @@ <h3 class="modal-title">
if (!errorMessage){
errorMessage = "general.delete_error_generic";
}
setI18NData(errTxtEl, errorMessage);
errDivEl.removeClass("d-none");
showToast(errorMessage);
});
}
});
Expand Down

0 comments on commit fe41109

Please sign in to comment.