Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(storefront): BCTHEME-1043 Remove sweetAlert #2189

Merged
merged 2 commits into from
Apr 28, 2022
Merged

fix(storefront): BCTHEME-1043 Remove sweetAlert #2189

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
ea89f6e
fix(storefront): BCTHEME-1043 Remove sweetAlert
Mar 29, 2022
4b65bac
Merge branch 'master' into BCTHEME-1043
bc-yevhenii-buliuk Apr 28, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).

## Draft
- Remove sweetAlert. [#2189](https://github.com/bigcommerce/cornerstone/issues/2189)
- Apply security updates (April 2022) [#2200](https://github.com/bigcommerce/cornerstone/issues/2200)
- Reviews form not submitting after quick view opening on PDP. [#2201](https://github.com/bigcommerce/cornerstone/issues/2201)
- Social media icons failing wave scan with "Empty Link". [#2202](https://github.com/bigcommerce/cornerstone/issues/2202)
Expand Down
17 changes: 4 additions & 13 deletions assets/js/theme/account.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import {
} from './common/utils/form-utils';
import { createTranslationDictionary } from './common/utils/translations-utils';
import { creditCardType, storeInstrument, Validators as CCValidators, Formatters as CCFormatters } from './common/payment-method';
import swal from './global/sweet-alert';
import { showAlertModal } from './global/modal';
import compareProducts from './global/compare-products';

export default class Account extends PageManager {
Expand Down Expand Up @@ -131,10 +131,7 @@ export default class Account extends PageManager {

if (!submitForm) {
event.preventDefault();
swal.fire({
text: this.context.selectItem,
icon: 'error',
});
showAlertModal(this.context.selectItem);
}
});
}
Expand Down Expand Up @@ -209,10 +206,7 @@ export default class Account extends PageManager {
return true;
}

swal.fire({
text: errorMessage,
icon: 'error',
});
showAlertModal(errorMessage);

return event.preventDefault();
});
Expand Down Expand Up @@ -313,10 +307,7 @@ export default class Account extends PageManager {
storeInstrument(this.context, data, () => {
window.location.href = this.context.paymentMethodsUrl;
}, () => {
swal.fire({
text: this.context.generic_error,
icon: 'error',
});
showAlertModal(this.context.generic_error);
});
}
});
Expand Down
78 changes: 18 additions & 60 deletions assets/js/theme/cart.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,7 @@ import checkIsGiftCertValid from './common/gift-certificate-validator';
import { createTranslationDictionary } from './common/utils/translations-utils';
import utils from '@bigcommerce/stencil-utils';
import ShippingEstimator from './cart/shipping-estimator';
import { defaultModal, ModalEvents } from './global/modal';
import swal from './global/sweet-alert';
import { defaultModal, showAlertModal, ModalEvents } from './global/modal';
import CartItemDetails from './common/cart-item-details';

export default class Cart extends PageManager {
Expand Down Expand Up @@ -45,15 +44,9 @@ export default class Cart extends PageManager {
const newQty = $target.data('action') === 'inc' ? oldQty + 1 : oldQty - 1;
// Does not quality for min/max quantity
if (newQty < minQty) {
return swal.fire({
text: minError,
icon: 'error',
});
return showAlertModal(minError);
} else if (maxQty > 0 && newQty > maxQty) {
return swal.fire({
text: maxError,
icon: 'error',
});
return showAlertModal(maxError);
}

this.$overlay.show();
Expand All @@ -68,10 +61,7 @@ export default class Cart extends PageManager {
this.refreshContent(remove);
} else {
$el.val(oldQty);
swal.fire({
text: response.data.errors.join('\n'),
icon: 'error',
});
showAlertModal(response.data.errors.join('\n'));
}
});
}
Expand All @@ -91,22 +81,13 @@ export default class Cart extends PageManager {
if (!newQty) {
invalidEntry = $el.val();
$el.val(oldQty);
return swal.fire({
text: this.context.invalidEntryMessage.replace('[ENTRY]', invalidEntry),
icon: 'error',
});
return showAlertModal(this.context.invalidEntryMessage.replace('[ENTRY]', invalidEntry));
} else if (newQty < minQty) {
$el.val(oldQty);
return swal.fire({
text: minError,
icon: 'error',
});
return showAlertModal(minError);
} else if (maxQty > 0 && newQty > maxQty) {
$el.val(oldQty);
return swal.fire({
text: maxError,
icon: 'error',
});
return showAlertModal(maxError);
}

this.$overlay.show();
Expand All @@ -120,10 +101,8 @@ export default class Cart extends PageManager {
this.refreshContent(remove);
} else {
$el.val(oldQty);
swal.fire({
text: response.data.errors.join('\n'),
icon: 'error',
});

return showAlertModal(response.data.errors.join('\n'));
}
});
}
Expand All @@ -134,10 +113,7 @@ export default class Cart extends PageManager {
if (response.data.status === 'succeed') {
this.refreshContent(true);
} else {
swal.fire({
text: response.data.errors.join('\n'),
icon: 'error',
});
showAlertModal(response.data.errors.join('\n'));
}
});
}
Expand Down Expand Up @@ -188,10 +164,7 @@ export default class Cart extends PageManager {
const data = result.data || {};

if (err) {
swal.fire({
text: err,
icon: 'error',
});
showAlertModal(err);
return false;
}

Expand Down Expand Up @@ -284,16 +257,13 @@ export default class Cart extends PageManager {
$('.cart-remove', this.$cartContent).on('click', event => {
const itemId = $(event.currentTarget).data('cartItemid');
const string = $(event.currentTarget).data('confirmDelete');
swal.fire({
text: string,
showAlertModal(string, {
icon: 'warning',
showCancelButton: true,
cancelButtonText: this.context.cancelButtonText,
}).then((result) => {
if (result.value) {
onConfirm: () => {
// remove item from cart
cartRemoveItem(itemId);
}
},
});
event.preventDefault();
});
Expand Down Expand Up @@ -336,20 +306,14 @@ export default class Cart extends PageManager {

// Empty code
if (!code) {
return swal.fire({
text: $codeInput.data('error'),
icon: 'error',
});
return showAlertModal($codeInput.data('error'));
}

utils.api.cart.applyCode(code, (err, response) => {
if (response.data.status === 'success') {
this.refreshContent();
} else {
swal.fire({
html: response.data.errors.join('\n'),
icon: 'error',
});
showAlertModal(response.data.errors.join('\n'));
}
});
});
Expand Down Expand Up @@ -381,20 +345,14 @@ export default class Cart extends PageManager {

if (!checkIsGiftCertValid(code)) {
const validationDictionary = createTranslationDictionary(this.context);
return swal.fire({
text: validationDictionary.invalid_gift_certificate,
icon: 'error',
});
return showAlertModal(validationDictionary.invalid_gift_certificate);
}

utils.api.cart.applyGiftCertificate(code, (err, resp) => {
if (resp.data.status === 'success') {
this.refreshContent();
} else {
swal.fire({
html: resp.data.errors.join('\n'),
icon: 'error',
});
showAlertModal(resp.data.errors.join('\n'));
}
});
});
Expand Down
8 changes: 2 additions & 6 deletions assets/js/theme/cart/shipping-estimator.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import nod from '../common/nod';
import utils from '@bigcommerce/stencil-utils';
import { Validators, announceInputErrorMessage } from '../common/utils/form-utils';
import collapsibleFactory from '../common/collapsible';
import swal from '../global/sweet-alert';
import { showAlertModal } from '../global/modal';

export default class ShippingEstimator {
constructor($element, shippingErrorMessages) {
Expand Down Expand Up @@ -114,11 +114,7 @@ export default class ShippingEstimator {
// Requests the states for a country with AJAX
stateCountry(this.$state, this.context, { useIdForStates: true }, (err, field) => {
if (err) {
swal.fire({
text: err,
icon: 'error',
});

showAlertModal(err);
throw new Error(err);
}

Expand Down
20 changes: 9 additions & 11 deletions assets/js/theme/global/currency-selector.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import swal from './sweet-alert';
import { showAlertModal } from './modal';
import utils from '@bigcommerce/stencil-utils';

let currencySelectorCalled = false;
Expand All @@ -21,11 +21,7 @@ export default function (cartId) {
}).done(() => {
window.location.reload();
}).fail((e) => {
swal.fire({
text: JSON.parse(e.responseText).error,
icon: 'warning',
showCancelButton: true,
});
showAlertModal(JSON.parse(e.responseText).error);
});
}

Expand All @@ -43,14 +39,16 @@ export default function (cartId) {
response.lineItems.giftCertificates.length > 0;

if (showWarning) {
swal.fire({
text: $(event.target).data('warning'),
const text = $(event.target).data('warning');
const $preModalFocusedEl = $('.navUser-action--currencySelector');

showAlertModal(text, {
icon: 'warning',
showCancelButton: true,
}).then(result => {
if (result.value && result.value === true) {
$preModalFocusedEl,
onConfirm: () => {
changeCurrency($(event.target).data('cart-currency-switch-url'), $(event.target).data('currency-code'));
}
},
});
} else {
changeCurrency($(event.target).data('cart-currency-switch-url'), $(event.target).data('currency-code'));
Expand Down
32 changes: 31 additions & 1 deletion assets/js/theme/global/modal.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -296,8 +296,38 @@ export function alertModal() {
/*
* Display the given message in the default alert modal
*/
export function showAlertModal(message) {
export function showAlertModal(message, options = {}) {
const modal = alertModal();
const cancelBtn = modal.$modal.find('.cancel');
const {
icon = 'error',
$preModalFocusedEl = null,
showCancelButton,
onConfirm,
} = options;

if ($preModalFocusedEl) {
modal.$preModalFocusedEl = $preModalFocusedEl;
}

modal.open();
modal.$modal.find('.alert-icon').hide();

if (icon === 'error') {
modal.$modal.find('.error-icon').show();
} else if (icon === 'warning') {
modal.$modal.find('.warning-icon').show();
}

modal.updateContent(`<span>${message}</span>`);

if (onConfirm) {
modal.$modal.find('.confirm').on('click', onConfirm);
}

if (showCancelButton) {
cancelBtn.show();
} else {
cancelBtn.hide();
}
}
16 changes: 0 additions & 16 deletions assets/js/theme/global/sweet-alert.js
View file
Open in desktop

This file was deleted.

3 changes: 0 additions & 3 deletions assets/scss/components/_components.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,9 +12,6 @@
// Nanobar Ajax loading progress bar
@import "vendor/nanobar/component";

// SweetAlert2 replacement for JavaScript alert/confirmations
@import "vendor/sweetalert2/component";


// Foundation components
// -----------------------------------------------------------------------------
Expand Down
Loading