1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-28 00:17:12 +01:00

chore(1-3420): wrap strategy list in an ordered list (#9377)

Improves the semantic correctness of the strategy list by wrapping it
in an `ol` tag.

Strategy order matters (due to variant resolution etc), so the order
is important (hence the `ol` instead of a `ul`).

Dragging still works and it's visually the same.
This commit is contained in:
Thomas Heartman 2025-02-27 09:15:08 +01:00 committed by GitHub
parent be3fa73244
commit 0c6ef912d4
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -60,6 +60,12 @@ const AdditionalStrategiesDiv = styled('div')(({ theme }) => ({
marginBottom: theme.spacing(2),
}));
const StyledStrategyList = styled('ol')({
listStyle: 'none',
padding: 0,
margin: 0,
});
export const EnvironmentAccordionBody = ({
featureEnvironment,
isDisabled,
@ -257,29 +263,33 @@ export const EnvironmentAccordionBody = ({
!manyStrategiesPagination
}
show={
<>
<StyledStrategyList>
{strategies.map((strategy, index) => (
<NewStrategyDraggableItem
key={strategy.id}
strategy={strategy}
index={index}
environmentName={
featureEnvironment.name
}
otherEnvironments={
otherEnvironments
}
isDragging={
dragItem?.id === strategy.id
}
onDragStartRef={onDragStartRef}
onDragOver={onDragOver(
strategy.id,
)}
onDragEnd={onDragEnd}
/>
<li key={strategy.id}>
<NewStrategyDraggableItem
strategy={strategy}
index={index}
environmentName={
featureEnvironment.name
}
otherEnvironments={
otherEnvironments
}
isDragging={
dragItem?.id ===
strategy.id
}
onDragStartRef={
onDragStartRef
}
onDragOver={onDragOver(
strategy.id,
)}
onDragEnd={onDragEnd}
/>
</li>
))}
</>
</StyledStrategyList>
}
elseShow={
<>
@ -291,27 +301,35 @@ export const EnvironmentAccordionBody = ({
segments.
</Alert>
<br />
{page.map((strategy, index) => (
<StrategyDraggableItem
key={strategy.id}
strategy={strategy}
index={
index + pageIndex * pageSize
}
environmentName={
featureEnvironment.name
}
otherEnvironments={
otherEnvironments
}
isDragging={false}
onDragStartRef={
(() => {}) as any
}
onDragOver={(() => {}) as any}
onDragEnd={(() => {}) as any}
/>
))}
<StyledStrategyList>
{page.map((strategy, index) => (
<li key={strategy.id}>
<StrategyDraggableItem
strategy={strategy}
index={
index +
pageIndex * pageSize
}
environmentName={
featureEnvironment.name
}
otherEnvironments={
otherEnvironments
}
isDragging={false}
onDragStartRef={
(() => {}) as any
}
onDragOver={
(() => {}) as any
}
onDragEnd={
(() => {}) as any
}
/>
</li>
))}
</StyledStrategyList>
<br />
<Pagination
count={pages.length}