1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-08-27 13:49:10 +02: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), marginBottom: theme.spacing(2),
})); }));
const StyledStrategyList = styled('ol')({
listStyle: 'none',
padding: 0,
margin: 0,
});
export const EnvironmentAccordionBody = ({ export const EnvironmentAccordionBody = ({
featureEnvironment, featureEnvironment,
isDisabled, isDisabled,
@ -257,29 +263,33 @@ export const EnvironmentAccordionBody = ({
!manyStrategiesPagination !manyStrategiesPagination
} }
show={ show={
<> <StyledStrategyList>
{strategies.map((strategy, index) => ( {strategies.map((strategy, index) => (
<NewStrategyDraggableItem <li key={strategy.id}>
key={strategy.id} <NewStrategyDraggableItem
strategy={strategy} strategy={strategy}
index={index} index={index}
environmentName={ environmentName={
featureEnvironment.name featureEnvironment.name
} }
otherEnvironments={ otherEnvironments={
otherEnvironments otherEnvironments
} }
isDragging={ isDragging={
dragItem?.id === strategy.id dragItem?.id ===
} strategy.id
onDragStartRef={onDragStartRef} }
onDragOver={onDragOver( onDragStartRef={
strategy.id, onDragStartRef
)} }
onDragEnd={onDragEnd} onDragOver={onDragOver(
/> strategy.id,
)}
onDragEnd={onDragEnd}
/>
</li>
))} ))}
</> </StyledStrategyList>
} }
elseShow={ elseShow={
<> <>
@ -291,27 +301,35 @@ export const EnvironmentAccordionBody = ({
segments. segments.
</Alert> </Alert>
<br /> <br />
{page.map((strategy, index) => ( <StyledStrategyList>
<StrategyDraggableItem {page.map((strategy, index) => (
key={strategy.id} <li key={strategy.id}>
strategy={strategy} <StrategyDraggableItem
index={ strategy={strategy}
index + pageIndex * pageSize index={
} index +
environmentName={ pageIndex * pageSize
featureEnvironment.name }
} environmentName={
otherEnvironments={ featureEnvironment.name
otherEnvironments }
} otherEnvironments={
isDragging={false} otherEnvironments
onDragStartRef={ }
(() => {}) as any isDragging={false}
} onDragStartRef={
onDragOver={(() => {}) as any} (() => {}) as any
onDragEnd={(() => {}) as any} }
/> onDragOver={
))} (() => {}) as any
}
onDragEnd={
(() => {}) as any
}
/>
</li>
))}
</StyledStrategyList>
<br /> <br />
<Pagination <Pagination
count={pages.length} count={pages.length}