Skip to content

Commit b81ac4e

Browse files
nileshgulia1nileshgulia1
authored
Merge pull request #39 from eea/develop
Release
2 parents 7b320e2 + cdfafbe commit b81ac4e

File tree

6 files changed

+93
-55
lines changed

6 files changed

+93
-55
lines changed

‎CHANGELOG.md

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,24 @@ All notable changes to this project will be documented in this file. Dates are d
44

55
Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
66

7-
### [6.2.0](https://github.com/eea/volto-block-toc/compare/6.1.0...6.2.0) - 11 November 2024
7+
### [7.0.0](https://github.com/eea/volto-block-toc/compare/6.2.0...7.0.0) - 19 May 2025
8+
9+
#### :bug: Bug Fixes
10+
11+
- fix: list rendering [nileshgulia1 - [`29c09cb`](https://github.com/eea/volto-block-toc/commit/29c09cba1900a628caef9de627af83c5ee928da3)]
12+
- fix(accordion): fix list item alignment and styling [nileshgulia1 - [`9e3563c`](https://github.com/eea/volto-block-toc/commit/9e3563cc1695219cb9b75d45bae5d4ff8d924369)]
13+
14+
#### :nail_care: Enhancements
15+
16+
- refactor: remove comments [nileshgulia1 - [`35c040a`](https://github.com/eea/volto-block-toc/commit/35c040ab77378c1fc8695beb53cf182e301e3837)]
17+
- refactor: apply special class to accordion-item [nileshgulia1 - [`2cc03de`](https://github.com/eea/volto-block-toc/commit/2cc03deecbfe08a70f7c229ffc7f355a1cc0814c)]
18+
19+
#### :hammer_and_wrench: Others
20+
21+
- bump 7.0.0 [nileshgulia1 - [`accce50`](https://github.com/eea/volto-block-toc/commit/accce506b9944307158ec9fb264457165f6673cc)]
22+
- fix schema enhancer [nileshgulia1 - [`a50db34`](https://github.com/eea/volto-block-toc/commit/a50db34acba6bd5fd0b8b96899cb9a3f83c98057)]
23+
- WIP: refactor accordion variation to inlcude lists [nileshgulia1 - [`3d26225`](https://github.com/eea/volto-block-toc/commit/3d26225e9cbbbffa95f7d1f1c11636fba30edc0f)]
24+
### [6.2.0](https://github.com/eea/volto-block-toc/compare/6.1.0...6.2.0) - 14 November 2024
825

926
#### :hammer_and_wrench: Others
1027

‎Jenkinsfile

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ pipeline {
88
environment {
99
GIT_NAME = "volto-block-toc"
1010
NAMESPACE = "@eeacms"
11-
SONARQUBE_TAGS = "volto.eea.europa.eu,biodiversity.europa.eu,water.europa.eu-freshwater,insitu.copernicus.eu,land.copernicus.eu,climate-adapt.eea.europa.eu,demo-www.eea.europa.eu,www.eea.europa.eu-en,water.europa.eu-marine,climate-advisory-board.europa.eu,forest.eea.europa.eu"
11+
SONARQUBE_TAGS = "volto.eea.europa.eu,biodiversity.europa.eu,water.europa.eu-freshwater,insitu.copernicus.eu,land.copernicus.eu,climate-adapt.eea.europa.eu,demo-www.eea.europa.eu,www.eea.europa.eu-en,water.europa.eu-marine,climate-advisory-board.europa.eu,forest.eea.europa.eu,industry.eea.europa.eu,www.industry.eea.europa.eu,ask.copernicus.eu"
1212
DEPENDENCIES = ""
1313
BACKEND_PROFILES = "eea.kitkat:testing"
1414
BACKEND_ADDONS = ""

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@eeacms/volto-block-toc",
3-
"version": "6.2.0",
3+
"version": "7.0.0",
44
"description": "volto-block-toc: Volto add-on",
55
"main": "src/index.js",
66
"author": "European Environment Agency: IDM2 A-Team",

‎src/Block/schema.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ const TableOfContentsSchema = ({ data }) => {
1313
...(variation === 'default' ? ['ordered'] : []),
1414
...(variation === 'horizontalMenu' ? ['sticky'] : []),
1515
...(variation === 'accordionMenu' ? ['sticky'] : []),
16+
...(variation === 'accordionMenu' ? ['bulleted_list'] : []),
1617
'levels',
1718
],
1819
},
@@ -45,6 +46,11 @@ const TableOfContentsSchema = ({ data }) => {
4546
title: 'Ordered',
4647
type: 'boolean',
4748
},
49+
bulleted_list: {
50+
title: 'Use bullet list',
51+
type: 'boolean',
52+
description: 'Bullet point for child items',
53+
},
4854
},
4955
required: [],
5056
};

‎src/Block/variations/AccordionMenu.jsx

Lines changed: 58 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -5,67 +5,26 @@
55

66
import React, { useEffect, useState, useRef } from 'react';
77
import PropTypes from 'prop-types';
8+
import cx from 'classnames';
89
import { FormattedMessage, injectIntl } from 'react-intl';
910
import AnchorLink from 'react-anchor-link-smooth-scroll';
1011
import { Accordion, Icon } from 'semantic-ui-react';
1112
import Slugger from 'github-slugger';
13+
14+
import { MaybeWrap } from '@plone/volto/components';
1215
import { normalizeString } from './helpers';
1316
import './less/accordion-menu.less';
1417

15-
const RenderAccordionItems = ({ items }) => {
16-
const [activeItems, setActiveItems] = useState({});
17-
18-
const handleClick = (index, hasSubItems) => {
19-
if (hasSubItems) {
20-
setActiveItems((prevActiveItems) => ({
21-
...prevActiveItems,
22-
[index]: !prevActiveItems[index],
23-
}));
24-
}
25-
};
26-
27-
return (
28-
<Accordion fluid styled>
29-
{items.map((item, index) => {
30-
const { title, override_toc, plaintext, items: subItems } = item;
31-
const slug = override_toc
32-
? Slugger.slug(normalizeString(plaintext))
33-
: Slugger.slug(normalizeString(title));
34-
35-
const isActive = !!activeItems[index];
36-
const hasSubItems = subItems && subItems.length > 0;
37-
38-
return (
39-
<React.Fragment key={index}>
40-
<Accordion.Title
41-
active={isActive}
42-
onClick={() => handleClick(index, hasSubItems)}
43-
>
44-
{subItems && subItems.length > 0 && (
45-
<Icon name={isActive ? 'angle up' : 'angle right'} />
46-
)}
47-
<AnchorLink href={`#${slug}`}>{title}</AnchorLink>
48-
</Accordion.Title>
49-
<Accordion.Content active={isActive}>
50-
{subItems && subItems.length > 0 && (
51-
<RenderAccordionItems items={subItems} />
52-
)}
53-
</Accordion.Content>
54-
</React.Fragment>
55-
);
56-
})}
57-
</Accordion>
58-
);
59-
};
60-
6118
/**
6219
* View toc block class.
6320
* @class View
6421
* @extends Component
6522
*/
6623
const View = ({ data, tocEntries }) => {
24+
const { bulleted_list = false } = data;
6725
const tocRef = useRef(); // Ref for the ToC component
6826
const spacerRef = useRef(); // Ref for the spacer div
27+
const [activeItems, setActiveItems] = useState({});
6928
//get relative offsetTop of an element
7029
function getOffsetTop(elem) {
7130
let offsetTop = 0;
@@ -130,6 +89,58 @@ const View = ({ data, tocEntries }) => {
13089
}
13190
}, [data.sticky]);
13291

92+
const RenderAccordionItems = ({ item }) => {
93+
const handleClick = (id, hasSubItems) => {
94+
if (hasSubItems) {
95+
setActiveItems((prevActiveItems) => ({
96+
...prevActiveItems,
97+
[id]: !prevActiveItems[id],
98+
}));
99+
}
100+
};
101+
102+
const { title, override_toc, plaintext, items: subItems, id, level } = item;
103+
const slug = override_toc
104+
? Slugger.slug(normalizeString(plaintext))
105+
: Slugger.slug(normalizeString(title));
106+
107+
const isActive = !!activeItems[id];
108+
const hasSubItems = subItems && subItems.length > 0;
109+
110+
return (
111+
<MaybeWrap
112+
className={cx(`list-item level-${level}`, {
113+
'accordion-item': level > 2 && hasSubItems,
114+
})}
115+
condition={level > 2}
116+
as={(props) => <li key={id} {...props} />}
117+
>
118+
<Accordion fluid styled>
119+
<Accordion.Title
120+
active={isActive}
121+
onClick={() => handleClick(id, hasSubItems)}
122+
>
123+
{subItems && subItems.length > 0 && (
124+
<Icon name={isActive ? 'angle up' : 'angle right'} />
125+
)}
126+
<AnchorLink href={`#${slug}`}>{title}</AnchorLink>
127+
</Accordion.Title>
128+
{hasSubItems && (
129+
<Accordion.Content active={isActive}>
130+
<ul
131+
className={cx('accordion-list', {
132+
'accordion-list-bulleted': bulleted_list,
133+
})}
134+
>
135+
{subItems.map((child) => RenderAccordionItems({ item: child }))}
136+
</ul>
137+
</Accordion.Content>
138+
)}
139+
</Accordion>
140+
</MaybeWrap>
141+
);
142+
};
143+
133144
return (
134145
<>
135146
{data.title && !data.hide_title && (
@@ -144,7 +155,7 @@ const View = ({ data, tocEntries }) => {
144155
)}
145156
<div ref={spacerRef} /> {/* Spacer div */}
146157
<div ref={tocRef} className="accordionMenu">
147-
<RenderAccordionItems items={tocEntries} data={data} />
158+
{tocEntries.map((item) => RenderAccordionItems({ item }))}
148159
</div>
149160
</>
150161
);

‎src/Block/variations/less/accordion-menu.less

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,22 @@
33
font-size: 1.2rem !important;
44
}
55

6+
.accordion-list {
7+
list-style: none;
8+
}
9+
610
.content.active {
7-
padding: 0 !important;
11+
padding: 0 !important ;
812
margin: 0 !important;
913

14+
.accordion-list-bulleted {
15+
list-style: disc;
16+
}
17+
1018
.title {
1119
padding: 4px !important;
1220
border: none !important;
1321
background-color: #f9f9f9 !important;
14-
15-
a {
16-
padding-left: 15% !important;
17-
}
1822
}
1923
}
2024

0 commit comments

Comments
 (0)