Skip to content
This repository has been archived by the owner on May 2, 2023. It is now read-only.

fix(pagination): Fixing markup for links without icons - front-1574 #557

Merged
merged 2 commits into from
Sep 10, 2020
Merged

fix(pagination): Fixing markup for links without icons - front-1574 #557

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
15dc0b8
fix(pagination): fixing markup for links whithout icons - front-1574
planctus Sep 8, 2020
2b850bc
fix(pagination): forgot the adapter file - front-1574
planctus Sep 9, 2020
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: 0 additions & 1 deletion src/ec/packages/ec-component-hero-banner/hero-banner.story.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,6 @@ let imageGradientData = { ...bannerDataImageGradient };
const simplePrimaryDescBtnToggler = () => {
if (simplePrimaryData.description) {
delete simplePrimaryData.description;
console.log(simplePrimaryData);
} else {
simplePrimaryData.description = bannerDataSimplePrimary.description;
}
Expand Down
176 changes: 48 additions & 128 deletions src/ec/packages/ec-component-pagination/__snapshots__/pagination.test.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,26 +70,18 @@ exports[`EC - Pagination Default With missing input data returns the right warni
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
24
</span>
24
</a>
<span
class="ecl-u-type-color-green ecl-compliance-inner ecl-compliance-success ecl-u-ma-2xs"
title="[link--standalone] - ecl compliant"
<!-- ecl2-compliance: link--standalone -->
<div
class="ecl2-compliance ecl-u-border-width-1 ecl-u-border-color-green ecl-u-border-style-solid ecl-u-ma-xs ecl-u-pr-s ecl-u-bg-white"
>
<svg
aria-hidden="true"
class="ecl-icon ecl-icon--xs"
focusable="false"
<p
class="ecl-u-type-color-grey ecl-u-ml-s ecl-u-type-xs"
>
<use
xlink:href="/icons.svg#notifications--success"
/>
</svg>
</span>
[link--standalone] - ecl compliant
</p>
</div>
</li>
<li
class="ecl-pagination__item"
Expand All @@ -99,26 +91,18 @@ exports[`EC - Pagination Default With missing input data returns the right warni
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
25
</span>
25
</a>
<span
class="ecl-u-type-color-green ecl-compliance-inner ecl-compliance-success ecl-u-ma-2xs"
title="[link--standalone] - ecl compliant"
<!-- ecl2-compliance: link--standalone -->
<div
class="ecl2-compliance ecl-u-border-width-1 ecl-u-border-color-green ecl-u-border-style-solid ecl-u-ma-xs ecl-u-pr-s ecl-u-bg-white"
>
<svg
aria-hidden="true"
class="ecl-icon ecl-icon--xs"
focusable="false"
<p
class="ecl-u-type-color-grey ecl-u-ml-s ecl-u-type-xs"
>
<use
xlink:href="/icons.svg#notifications--success"
/>
</svg>
</span>
[link--standalone] - ecl compliant
</p>
</div>
</li>
<li
class="ecl-pagination__item ecl-pagination__item--current"
Expand All @@ -145,26 +129,18 @@ exports[`EC - Pagination Default With missing input data returns the right warni
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
27
</span>
27
</a>
<span
class="ecl-u-type-color-green ecl-compliance-inner ecl-compliance-success ecl-u-ma-2xs"
title="[link--standalone] - ecl compliant"
<!-- ecl2-compliance: link--standalone -->
<div
class="ecl2-compliance ecl-u-border-width-1 ecl-u-border-color-green ecl-u-border-style-solid ecl-u-ma-xs ecl-u-pr-s ecl-u-bg-white"
>
<svg
aria-hidden="true"
class="ecl-icon ecl-icon--xs"
focusable="false"
<p
class="ecl-u-type-color-grey ecl-u-ml-s ecl-u-type-xs"
>
<use
xlink:href="/icons.svg#notifications--success"
/>
</svg>
</span>
[link--standalone] - ecl compliant
</p>
</div>
</li>
<li
class="ecl-pagination__item"
Expand All @@ -174,26 +150,18 @@ exports[`EC - Pagination Default With missing input data returns the right warni
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
28
</span>
28
</a>
<span
class="ecl-u-type-color-green ecl-compliance-inner ecl-compliance-success ecl-u-ma-2xs"
title="[link--standalone] - ecl compliant"
<!-- ecl2-compliance: link--standalone -->
<div
class="ecl2-compliance ecl-u-border-width-1 ecl-u-border-color-green ecl-u-border-style-solid ecl-u-ma-xs ecl-u-pr-s ecl-u-bg-white"
>
<svg
aria-hidden="true"
class="ecl-icon ecl-icon--xs"
focusable="false"
<p
class="ecl-u-type-color-grey ecl-u-ml-s ecl-u-type-xs"
>
<use
xlink:href="/icons.svg#notifications--success"
/>
</svg>
</span>
[link--standalone] - ecl compliant
</p>
</div>
</li>
<li
class="ecl-pagination__item ecl-pagination__item--next"
Expand Down Expand Up @@ -305,11 +273,7 @@ exports[`EC - Pagination Default renders correctly 1`] = `
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
24
</span>
24
</a>
</li>
<li
Expand All @@ -320,11 +284,7 @@ exports[`EC - Pagination Default renders correctly 1`] = `
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
25
</span>
25
</a>
</li>
<li
Expand Down Expand Up @@ -352,11 +312,7 @@ exports[`EC - Pagination Default renders correctly 1`] = `
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
27
</span>
27
</a>
</li>
<li
Expand All @@ -367,11 +323,7 @@ exports[`EC - Pagination Default renders correctly 1`] = `
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
28
</span>
28
</a>
</li>
<li
Expand Down Expand Up @@ -448,11 +400,7 @@ exports[`EC - Pagination Default renders correctly with extra attributes 1`] = `
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
24
</span>
24
</a>
</li>
<li
Expand All @@ -463,11 +411,7 @@ exports[`EC - Pagination Default renders correctly with extra attributes 1`] = `
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
25
</span>
25
</a>
</li>
<li
Expand Down Expand Up @@ -495,11 +439,7 @@ exports[`EC - Pagination Default renders correctly with extra attributes 1`] = `
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
27
</span>
27
</a>
</li>
<li
Expand All @@ -510,11 +450,7 @@ exports[`EC - Pagination Default renders correctly with extra attributes 1`] = `
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
28
</span>
28
</a>
</li>
<li
Expand Down Expand Up @@ -589,11 +525,7 @@ exports[`EC - Pagination Default renders correctly with extra class names 1`] =
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
24
</span>
24
</a>
</li>
<li
Expand All @@ -604,11 +536,7 @@ exports[`EC - Pagination Default renders correctly with extra class names 1`] =
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
25
</span>
25
</a>
</li>
<li
Expand Down Expand Up @@ -636,11 +564,7 @@ exports[`EC - Pagination Default renders correctly with extra class names 1`] =
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
27
</span>
27
</a>
</li>
<li
Expand All @@ -651,11 +575,7 @@ exports[`EC - Pagination Default renders correctly with extra class names 1`] =
class="ecl-link ecl-link--standalone ecl-pagination__link"
href="/example"
>
<span
class="ecl-link__label"
>
28
</span>
28
</a>
</li>
<li
Expand Down
38 changes: 38 additions & 0 deletions src/ec/packages/ec-component-pagination/adapter.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
import { formatLink } from '@ecl-twig/data-utils';

function formatItem(i) {
let type = '';
if (i.isCurrent) {
type = 'current';
}
if (i.isPrevious) {
type = 'previous';
}
if (i.isNext) {
type = 'next';
}

const item = {
type,
label: i.label,
aria_label: i.ariaLabel,
};

if (i.link) {
i.link.ariaLabel = i.ariaLabel;
item.link = formatLink(i.link);
}

return item;
}

const adapter = (initialData) => {
// Copy reference specification demo adaptedData.
const adaptedData = JSON.parse(JSON.stringify(initialData));
adaptedData.items = adaptedData.items.map((item) => formatItem(item));
adaptedData.icon_path = '/icons.svg';

return adaptedData;
};

export default adapter;
36 changes: 2 additions & 34 deletions src/ec/packages/ec-component-pagination/demo/data.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,36 +1,4 @@
/* eslint-disable import/no-extraneous-dependencies */
import specData from '@ecl/ec-specs-pagination/demo/data';
import { formatLink } from '@ecl-twig/data-utils';
import adapter from '../adapter';

function formatItem(i) {
let type = '';
if (i.isCurrent) {
type = 'current';
}
if (i.isPrevious) {
type = 'previous';
}
if (i.isNext) {
type = 'next';
}

const item = {
type,
label: i.label,
aria_label: i.ariaLabel,
};

if (i.link) {
item.link = formatLink(i.link);
}

return item;
}

const data = {
label: specData.label,
items: specData.items.map((item) => formatItem(item)),
icon_path: '/icons.svg',
};

export default data;
export default adapter(specData);
Loading