From 709ae9e69089f5df987e1a8263a6a3ba74b8c89a Mon Sep 17 00:00:00 2001
From: Sam Poyigi <6567634+sampoyigi@users.noreply.github.com>
Date: Sat, 15 Jul 2023 12:31:18 +0100
Subject: [PATCH] Improve flashmessage exception
Signed-off-by: Sam Poyigi <6567634+sampoyigi@users.noreply.github.com>
---
resources/js/partials/flashmessage.js | 50 +++++++++++++------
resources/js/partials/request.js | 4 +-
resources/lang/en/admin.php | 2 +-
resources/scss/components/_alert.scss | 7 ++-
.../views/admin/_partials/flash.blade.php | 2 +-
src/Flame/Exception/ErrorHandler.php | 2 +-
src/Flame/Exception/FlashException.php | 10 ++++
7 files changed, 53 insertions(+), 24 deletions(-)
diff --git a/resources/js/partials/flashmessage.js b/resources/js/partials/flashmessage.js
index c1e45a82..86dc88b0 100644
--- a/resources/js/partials/flashmessage.js
+++ b/resources/js/partials/flashmessage.js
@@ -22,17 +22,23 @@
return FlashMessage.overlay(options)
}
- options = $.extend(options, FlashMessage.TOAST_DEFAULTS, FlashMessage.getIcon(options))
+ options = $.extend(FlashMessage.TOAST_DEFAULTS, options, FlashMessage.getIcon(options))
return Swal.fire(FlashMessage.parseOptions(options))
}
FlashMessage.overlay = function (options) {
- options = $.extend({}, FlashMessage.DEFAULTS, FlashMessage.SWAL_DEFAULTS, options)
+ options = $.extend({},
+ FlashMessage.DEFAULTS,
+ FlashMessage.SWAL_DEFAULTS,
+ options, FlashMessage.getIcon(options)
+ )
- options = $.extend(options, FlashMessage.getIcon(options))
-
- return Swal.fire(FlashMessage.parseOptions(options))
+ return Swal.fire(FlashMessage.parseOptions(options)).then((result) => {
+ if (result.isConfirmed && options.actionUrl) {
+ window.location.assign(options.actionUrl)
+ }
+ })
}
FlashMessage.confirm = function (message, confirmCallback, cancelCallback) {
@@ -49,7 +55,6 @@
cancelCallback()
}
})
-
}
FlashMessage.getIcon = function (options) {
@@ -80,20 +85,30 @@
didOpen: (toast) => {
toast.addEventListener('mouseenter', Swal.stopTimer)
toast.addEventListener('mouseleave', Swal.resumeTimer)
- }
+ },
+ customClass: {
+ popup: 'bg-light',
+ },
}
FlashMessage.SWAL_DEFAULTS = {
position: 'top',
timerProgressBar: true,
+ reverseButtons: true,
+ buttonsStyling: false,
customClass: {
container: 'modal-backdrop',
- confirmButton: 'btn btn-primary',
- cancelButton: 'btn btn-secondary',
+ confirmButton: 'btn btn-primary mx-2',
+ cancelButton: 'btn btn-light mx-2',
+ closeButton: 'btn btn-danger mx-2',
+ denyButton: 'btn btn-danger mx-2',
},
showClass: {
popup: 'animated fadeInDown'
},
+ hideClass: {
+ popup: 'animated fadeOutUp'
+ },
}
FlashMessage.DEFAULTS = {
@@ -104,28 +119,29 @@
class: 'success',
interval: 5,
allowDismiss: true,
+ actionUrl: undefined,
}
FlashMessage.ICONS = {
warning: {
icon: 'warning',
- iconHtml: '',
+ iconHtml: '',
},
danger: {
icon: 'error',
- iconHtml: '',
+ iconHtml: '',
},
success: {
icon: 'success',
- iconHtml: '',
+ iconHtml: '',
},
info: {
icon: 'info',
- iconHtml: '',
+ iconHtml: '',
},
question: {
icon: 'question',
- iconHtml: '',
+ iconHtml: '',
},
}
@@ -141,16 +157,18 @@
// ===============
$(document).render(function () {
- $('[data-control="flash-message"]').each(function (index, element) {
+ $('[data-control="flash-message"]:not(.loaded)').each(function (index, element) {
setTimeout(function () {
$.ti.flashMessage($(element).data(), element)
}, (index + 1) * 500)
+ $(element).addClass('loaded')
})
- $('[data-control="flash-overlay"]').each(function (index, element) {
+ $('[data-control="flash-overlay"]:not(.loaded)').each(function (index, element) {
$.ti.flashMessage.overlay($.extend({}, $(element).data(), $(element).data('closeOnEsc') === true ? {
timer: (index + 1) * 3000
} : {}))
+ $(element).addClass('loaded')
})
})
diff --git a/resources/js/partials/request.js b/resources/js/partials/request.js
index 7c7183a5..f4598365 100644
--- a/resources/js/partials/request.js
+++ b/resources/js/partials/request.js
@@ -199,7 +199,9 @@ if (window.jQuery.request !== undefined)
var _event = jQuery.Event('ajaxErrorMessage')
$(window).trigger(_event, [message])
if (_event.isDefaultPrevented()) return
- if (message) alert(message)
+ if (message) {
+ $.ti.flashMessage({text: message, class: 'danger'})
+ }
},
handleValidationMessage: function (message, fields) {
diff --git a/resources/lang/en/admin.php b/resources/lang/en/admin.php
index 440256ac..1265eb4e 100644
--- a/resources/lang/en/admin.php
+++ b/resources/lang/en/admin.php
@@ -100,7 +100,7 @@
'alert_user_restricted' => 'Warning: You do not have the right permission to view this page, please contact the system administrator.',
'alert_location_restricted' => 'Warning: You do not have the right permission to access context outside your location, please contact the system administrator.',
'alert_warning_locationable_delete' => 'Warning: You do not have the right permission to delete record(s) attached to multiple locations, please contact the system administrator.',
- 'alert_form_error_message' => 'Please correct the errors below.',
+ 'alert_form_error_message' => 'Sorry, there seems to be an error with your submission, Check the highlighted fields and try again.',
'alert_error_set_default' => '"%s" is disabled and cannot be set as default.',
'alert_missing_method' => 'Missing method [%s] in %s.',
'alert_missing_model_definition' => "Model '%s' does not contain a definition for '%s'.",
diff --git a/resources/scss/components/_alert.scss b/resources/scss/components/_alert.scss
index 44f68fcc..aee5126d 100644
--- a/resources/scss/components/_alert.scss
+++ b/resources/scss/components/_alert.scss
@@ -38,8 +38,6 @@
body.swal2-toast-shown {
.swal2-container {
- width: 420px;
-
&.swal2-top-end {
top: 65px !important;
right: 15px !important;
@@ -58,14 +56,15 @@ body:not(.swal2-toast-shown) {
background-color: $gray-200;
border: 0;
- .swal2-toast {
- background-color: $gray-100;
+ &.swal2-toast {
+ padding: 0.6em 1em;
.swal2-icon {
width: 1.5em;
min-width: 1.5em;
height: 1.5em;
margin: 0;
+ border-width: 0;
}
}
diff --git a/resources/views/admin/_partials/flash.blade.php b/resources/views/admin/_partials/flash.blade.php
index c1a61871..17c0d658 100644
--- a/resources/views/admin/_partials/flash.blade.php
+++ b/resources/views/admin/_partials/flash.blade.php
@@ -13,7 +13,7 @@
@class(['alert alert-'.$message['level'], 'alert-important' => $message['important']])
data-control="flash-message"
data-icon="{{ $message['level'] }}"
- data-title="{!! array_get($message, 'message') !!}"
+ data-text="{!! array_get($message, 'message') !!}"
data-allow-dismiss="{{ $message['important'] ? 'false' : 'true' }}"
role="alert"
>{!! $message['message'] !!}
diff --git a/src/Flame/Exception/ErrorHandler.php b/src/Flame/Exception/ErrorHandler.php
index 003527b8..93d69f31 100644
--- a/src/Flame/Exception/ErrorHandler.php
+++ b/src/Flame/Exception/ErrorHandler.php
@@ -40,7 +40,7 @@ public function __construct(ExceptionHandler $handler)
$handler->map(TokenMismatchException::class, function (TokenMismatchException $e) {
return (new FlashException(
lang('igniter::admin.alert_invalid_csrf_token'), 'danger', 419, $e->getPrevious()
- ))->important()->overlay();
+ ))->important()->overlay()->actionUrl(url()->current());
});
}
diff --git a/src/Flame/Exception/FlashException.php b/src/Flame/Exception/FlashException.php
index dc441aa6..0173ebec 100644
--- a/src/Flame/Exception/FlashException.php
+++ b/src/Flame/Exception/FlashException.php
@@ -16,6 +16,8 @@ class FlashException extends Exception
protected bool $shouldReport = false;
+ protected ?string $actionUrl;
+
public function __construct($message, protected string $type = 'danger', $code = 406, Exception $previous = null)
{
$this->message = $message;
@@ -69,6 +71,13 @@ public function important(): self
return $this;
}
+ public function actionUrl(string $url): self
+ {
+ $this->actionUrl = $url;
+
+ return $this;
+ }
+
public function shouldReport(): self
{
$this->shouldReport = true;
@@ -84,6 +93,7 @@ public function getContents()
'text' => $this->message,
'important' => $this->important,
'overlay' => $this->overlay,
+ 'actionUrl' => $this->actionUrl,
];
}