Skip to content

Commit 9732762

Browse files
tblivettblivet
authored
Merge pull request #903 from tblivet/feat/mail-alert-and-config
Refactor emailalerts and psgdpr modules
2 parents 6e25ec5 + 35e2c69 commit 9732762

File tree

21 files changed

+630
-91
lines changed

21 files changed

+630
-91
lines changed

‎modules/productcomments/views/templates/hook/product-additional-info.tpl‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,11 @@
1313
</div>
1414
{else}
1515
{if $post_allowed}
16-
<button class="btn btn-outline-primary post-product-comment" id="product-additional-info-review-button" type="button" data-bs-toggle="modal" data-bs-target="#post-product-comment-modal" data-ps-ref="product-post-review-button">
17-
{l s='Write your review' d='Modules.Productcomments.Shop'}
18-
</button>
16+
<div class="product-comments-additional-info">
17+
<button class="btn btn-outline-primary post-product-comment" id="product-additional-info-review-button" type="button" data-bs-toggle="modal" data-bs-target="#post-product-comment-modal" data-ps-ref="product-post-review-button">
18+
{l s='Write your review' d='Modules.Productcomments.Shop'}
19+
</button>
20+
</div>
1921
{/if}
2022
{/if}
2123
{/if}

‎modules/ps_emailalerts/js/mailalert.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
/* mailalert.js */

‎modules/ps_emailalerts/views/templates/front/mailalerts-account-line.tpl‎

Lines changed: 31 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -2,23 +2,35 @@
22
* For the full copyright and license information, please view the LICENSE
33
* file that was distributed with this source code.
44
*}
5-
{$componentName = 'mailalerts-account-line'}
6-
7-
<div class="{$componentName} d-flex flex-column position-relative">
8-
<a href="{$mailAlert.link}" class="text-center">
9-
<img src="{$mailAlert.cover_url}" alt="" />
10-
</a>
11-
<a class="mt-2" href="{$mailAlert.link}">
12-
<div class="{$componentName}__product d-flex flex-column">
13-
<span class="{$componentName}__product__name">{$mailAlert.name}</span>
14-
<span class="{$componentName}__product__attributes mt-1">{$mailAlert.attributes_small}</span>
15-
</div>
5+
<li class="ps-emailalerts__product" data-ps-ref="emailalerts-product">
6+
<a href="{$mailAlert.link}" class="ps-emailalerts__product-image-link" rel="nofollow">
7+
<img class="ps-emailalerts__product-image img-fluid" src="{$mailAlert.cover_url}" alt="{$mailAlert.name}" loading="lazy">
168
</a>
17-
<a href="#"
18-
title="{l s='Remove mail alert' d='Modules.Emailalerts.Shop'}"
19-
class="js-remove-email-alert btn btn-link {$componentName}__remove"
20-
rel="js-id-emailalerts-{$mailAlert.id_product|intval}-{$mailAlert.id_product_attribute|intval}"
21-
data-url="{url entity='module' name='ps_emailalerts' controller='actions' params=['process' => 'remove']}">
22-
<i class="material-icons" aria-label="{l s='Delete' d='Modules.Emailalerts.Shop'}">&#xE872;</i>
23-
</a>
24-
</div>
9+
10+
<div class="ps-emailalerts__product-content">
11+
<a href="{$mailAlert.link}">
12+
<span class="ps-emailalerts__product-name">{$mailAlert.name}</span>
13+
</a>
14+
15+
{if $mailAlert.attributes_small}
16+
<span class="ps-emailalerts__product-attributes">
17+
{l s='Attributes: %attributes%' sprintf=['%attributes%' => $mailAlert.attributes_small] d='Modules.Emailalerts.Shop'}
18+
</span>
19+
{/if}
20+
21+
{capture name='deleteData'}{strip}{ldelim}
22+
"id_product": "{$mailAlert.id_product|intval}",
23+
"id_product_attribute": "{$mailAlert.id_product_attribute|intval}",
24+
"url": "{url entity='module' name='ps_emailalerts' controller='actions' params=['process' => 'remove']}"
25+
{rdelim}{/strip}{/capture}
26+
27+
<button type="button"
28+
aria-label="{l s='Delete %productName% mail alert' sprintf=['%productName%' => $mailAlert.name] d='Modules.Emailalerts.Shop'}"
29+
class="link-danger ps-emailalerts__product-delete"
30+
data-ps-action="emailalerts-delete"
31+
data-ps-data="{$smarty.capture.deleteData}"
32+
>
33+
{l s='Delete' d='Modules.Emailalerts.Shop'}
34+
</button>
35+
</div>
36+
</li>

‎modules/ps_emailalerts/views/templates/front/mailalerts-account.tpl‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,17 @@
99
{/block}
1010

1111
{block name='page_content'}
12+
<p>{l s='Manage your mail alerts to stay informed about product availability and updates.' d='Modules.Emailalerts.Shop'}</p>
13+
1214
{if $mailAlerts}
13-
<ul class="row">
15+
<ul class="ps-emailalerts__product-list" data-ps-ref="emailalerts-product-list">
1416
{foreach from=$mailAlerts item=mailAlert}
15-
<li class="col-sm-6 col-md-3">{include 'module:ps_emailalerts/views/templates/front/mailalerts-account-line.tpl' mailAlert=$mailAlert}</li>
17+
{include 'module:ps_emailalerts/views/templates/front/mailalerts-account-line.tpl' mailAlert=$mailAlert}
1618
{/foreach}
1719
</ul>
20+
21+
<div class="alert alert-info d-none" role="alert" data-ps-ref="emailalerts-account-no-alerts">{l s='You do not have any mail alerts.' d='Modules.Emailalerts.Shop'}</div>
1822
{else}
19-
<div class="alert alert-info" role="alert" data-alert="info">{l s='No mail alerts yet.' d='Modules.Emailalerts.Shop'}</div>
23+
<div class="alert alert-info" role="alert" data-ps-ref="emailalerts-account-no-alerts">{l s='You do not have any mail alerts.' d='Modules.Emailalerts.Shop'}</div>
2024
{/if}
2125
{/block}

‎modules/ps_emailalerts/views/templates/hook/my-account-footer.tpl‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
*}
55

66
<li>
7-
<a href="{url entity='module' name='ps_emailalerts' controller='account'}" title="{l s='My alerts' d='Shop.Theme.Catalog'}">
7+
<a href="{url entity='module' name='ps_emailalerts' controller='account'}" rel="nofollow">
88
{l s='My alerts' d='Shop.Theme.Catalog'}
99
</a>
1010
</li>

‎modules/ps_emailalerts/views/templates/hook/product.tpl‎

Lines changed: 48 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -23,27 +23,59 @@
2323
* International Registered Trademark & Property of PrestaShop SA
2424
*}
2525

26-
<div class="card card-body text-center js-mailalert mb-3 mt-3 bg-light" data-url="{url entity='module' name='ps_emailalerts' controller='actions' params=['process' => 'add']}">
26+
<div class="ps-emailalerts ps-emailalerts--product"
27+
data-ps-ref="emailalerts"
28+
data-ps-component="gdpr"
29+
data-url="{url entity='module' name='ps_emailalerts' controller='actions' params=['process' => 'add']}">
30+
<div class="ps-emailalerts__content" data-ps-ref="emailalerts-content">
31+
<p class="h4 mb-0">
32+
{l s='Notify me when available' d='Modules.Emailalerts.Shop'}
33+
</p>
34+
2735
{if isset($email) AND $email}
28-
<p>{l s='Interested in this product? Drop us an email and we will let you know when it\'s available for order.' d='Modules.Emailalerts.Shop'}</p>
29-
<input class="form-control" type="email" placeholder="{l s='your@email.com' d='Modules.Emailalerts.Shop'}"/>
36+
<p class="mb-0">
37+
{l s='Interested in this product? Drop us an email and we will let you know when it\'s available for order.' d='Modules.Emailalerts.Shop'}
38+
</p>
39+
40+
<input class="form-control"
41+
type="email"
42+
name="email"
43+
data-ps-ref="emailalerts-email"
44+
placeholder="{l s='Your email address' d='Modules.Emailalerts.Shop'}"
45+
aria-label="{l s='Your email address' d='Modules.Emailalerts.Shop'}"
46+
autocomplete="email"
47+
>
3048
{else}
31-
<p>{l s='Interested in this product? Click below and we will let you know when it\'s available for order.' d='Modules.Emailalerts.Shop'}</p>
49+
<p class="mb-0">
50+
{l s='Interested in this product? Click below and we will let you know when it\'s available for order.' d='Modules.Emailalerts.Shop'}
51+
</p>
3252
{/if}
3353

54+
{capture name='subscribeData'}{strip}{ldelim}
55+
"id_product": "{$product.id_product|intval}",
56+
"id_product_attribute": "{$product.id_product_attribute|intval}"
57+
{rdelim}{/strip}{/capture}
58+
59+
<button data-ps-action="emailalerts-subscribe"
60+
data-ps-ref="gdpr-submit"
61+
data-ps-data="{$smarty.capture.subscribeData}"
62+
class="btn btn-primary"
63+
rel="nofollow"
64+
role="button"
65+
>
66+
{l s='Notify me when available' d='Modules.Emailalerts.Shop'}
67+
</button>
68+
3469
{if !empty($id_module)}
35-
{capture name='gdprContent'}{hook h='displayGDPRConsent' id_module=$id_module}{/capture}
36-
{if $smarty.capture.gdprContent != ''}
37-
<div class="gdpr_consent_wrapper mt-1">{$smarty.capture.gdprContent nofilter}</div>
38-
{/if}
70+
{capture name='gdprContent'}{hook h='displayGDPRConsent' id_module=$id_module}{/capture}
71+
72+
{if $smarty.capture.gdprContent}
73+
<div class="fs-6 text-body-secondary">
74+
{$smarty.capture.gdprContent nofilter}
75+
</div>
76+
{/if}
3977
{/if}
78+
</div>
4079

41-
<button
42-
data-product="{$product.id_product}"
43-
data-product-attribute="{$product.id_product_attribute}"
44-
class="btn btn-primary js-mailalert-add mt-1"
45-
rel="nofollow">
46-
{l s='Notify me when available' d='Modules.Emailalerts.Shop'}
47-
</button>
48-
<div class="js-mailalert-alerts d-none"></div>
80+
<div class="d-none" data-ps-target="emailalerts-alerts" aria-live="assertive"></div>
4981
</div>

‎modules/psgdpr/views/templates/hook/displayGDPRConsent.tpl‎

Lines changed: 22 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -16,12 +16,30 @@
1616
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
1717
* International Registered Trademark & Property of PrestaShop SA
1818
*}
19-
{extends file='modules/psgdpr/views/templates/hook/displayGDPRConsent.tpl'}
19+
2020
{block name='gdpr_checkbox'}
21-
<div id="gdpr_consent" class="mt-2 gdpr_module_{$psgdpr_id_module|escape:'htmlall':'UTF-8'}">
21+
{capture name='gdprData'}{strip}{ldelim}
22+
"id_module": "{$psgdpr_id_module|escape:'htmlall':'UTF-8'}",
23+
"front_controller": "{$psgdpr_front_controller|escape:'htmlall':'UTF-8'}",
24+
"id_customer": "{$psgdpr_id_customer|escape:'htmlall':'UTF-8'}",
25+
"customer_token": "{$psgdpr_customer_token|escape:'htmlall':'UTF-8'}",
26+
"id_guest": "{$psgdpr_id_guest|escape:'htmlall':'UTF-8'}",
27+
"guest_token": "{$psgdpr_guest_token|escape:'htmlall':'UTF-8'}"
28+
{rdelim}{/strip}{/capture}
29+
30+
<div id="gdpr_consent_{$psgdpr_id_module|escape:'htmlall':'UTF-8'}"
31+
class="gdpr-consent"
32+
data-ps-ref="gdpr-consent"
33+
data-ps-data="{$smarty.capture.gdprData}"
34+
>
2235
<span class="form-check">
23-
<input id="psgdpr_consent_checkbox_{$psgdpr_id_module|escape:'htmlall':'UTF-8'}" name="psgdpr_consent_checkbox" type="checkbox" value="1" class="form-check-input psgdpr_consent_checkboxes_{$psgdpr_id_module|escape:'htmlall':'UTF-8'}">
24-
<label class="form-check-label psgdpr_consent_message">
36+
<input id="psgdpr_consent_checkbox_{$psgdpr_id_module|escape:'htmlall':'UTF-8'}"
37+
name="psgdpr_consent_checkbox"
38+
type="checkbox"
39+
value="1"
40+
class="form-check-input"
41+
data-ps-ref="gdpr-checkbox">
42+
<label class="form-check-label" for="psgdpr_consent_checkbox_{$psgdpr_id_module|escape:'htmlall':'UTF-8'}">
2543
{$psgdpr_consent_message nofilter}{* html data *}
2644
</label>
2745
</span>

‎src/js/constants/selectors-map.ts‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -127,6 +127,25 @@ export const visiblePassword = {
127127
visiblePassword: '[data-ps-action="toggle-password"]',
128128
};
129129

130+
export const gdpr = {
131+
consent: '[data-ps-ref="gdpr-consent"]',
132+
consentWrapper: '[data-ps-component="gdpr"]',
133+
checkbox: '[data-ps-ref="gdpr-checkbox"]',
134+
submitButton: '[data-ps-ref="gdpr-submit"]',
135+
};
136+
137+
export const emailAlerts = {
138+
wrapper: '[data-ps-ref="emailalerts"]',
139+
content: '[data-ps-ref="emailalerts-content"]',
140+
submitButton: '[data-ps-action="emailalerts-subscribe"]',
141+
emailInput: '[data-ps-ref="emailalerts-email"]',
142+
alertsContainer: '[data-ps-target="emailalerts-alerts"]',
143+
deleteButton: '[data-ps-action="emailalerts-delete"]',
144+
product: '[data-ps-ref="emailalerts-product"]',
145+
productList: '[data-ps-ref="emailalerts-product-list"]',
146+
noAlerts: '[data-ps-ref="emailalerts-account-no-alerts"]',
147+
};
148+
130149
export const desktopMenu = {
131150
container: '[data-ps-ref="desktop-menu-container"]',
132151
menuTree: '[data-ps-ref="desktop-menu-tree"]',
@@ -240,6 +259,8 @@ const selectorsMap = {
240259
desktopMenu,
241260
formValidation,
242261
passwordPolicy,
262+
emailAlerts,
263+
gdpr,
243264
};
244265

245266
export default selectorsMap;

‎src/js/helpers/parseData.ts‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
/**
2+
* For the full copyright and license information, please view the LICENSE
3+
* file that was distributed with this source code.
4+
*/
5+
6+
const parseData = <T>(
7+
element: HTMLElement,
8+
validator: Validator<T>,
9+
): T | null => {
10+
if (!('psData' in element.dataset)) {
11+
return null;
12+
}
13+
14+
const rawData = element.dataset.psData;
15+
16+
if (rawData === undefined) {
17+
console.warn('Attribute data-ps-data is not defined.');
18+
return null;
19+
}
20+
21+
try {
22+
const parsedData = JSON.parse(rawData);
23+
24+
if (validator(parsedData)) {
25+
return parsedData;
26+
}
27+
28+
console.warn('Attribute data-ps-data has validation error.');
29+
return null;
30+
} catch (error) {
31+
console.error('Attribute data-ps-data is not a valid JSON format.', error);
32+
return null;
33+
}
34+
};
35+
36+
export default parseData;

0 commit comments

Comments
 (0)