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.

frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewEnvironments/FeatureOverviewEnvironment/EnvironmentAccordionBody/EnvironmentAccordionBody.tsx

@@ -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,10 +263,10 @@ export const EnvironmentAccordionBody = ({
                                     !manyStrategiesPagination
                                 }
                                 show={
-                                    <>
+                                    <StyledStrategyList>
                                         {strategies.map((strategy, index) => (
+                                            <li key={strategy.id}>
                                                 <NewStrategyDraggableItem
-                                                key={strategy.id}
                                                     strategy={strategy}
                                                     index={index}
                                                     environmentName={
@@ -270,16 +276,20 @@ export const EnvironmentAccordionBody = ({
                                                         otherEnvironments
                                                     }
                                                     isDragging={
-                                                    dragItem?.id === strategy.id
+                                                        dragItem?.id ===
+                                                        strategy.id
+                                                    }
+                                                    onDragStartRef={
+                                                        onDragStartRef
                                                     }
-                                                onDragStartRef={onDragStartRef}
                                                     onDragOver={onDragOver(
                                                         strategy.id,
                                                     )}
                                                     onDragEnd={onDragEnd}
                                                 />
+                                            </li>
                                         ))}
-                                    </>
+                                    </StyledStrategyList>
                                 }
                                 elseShow={
                                     <>
@@ -291,12 +301,14 @@ export const EnvironmentAccordionBody = ({
                                             segments.
                                         </Alert>
                                         <br />
+                                        <StyledStrategyList>
                                             {page.map((strategy, index) => (
+                                                <li key={strategy.id}>
                                                     <StrategyDraggableItem
-                                                key={strategy.id}
                                                         strategy={strategy}
                                                         index={
-                                                    index + pageIndex * pageSize
+                                                            index +
+                                                            pageIndex * pageSize
                                                         }
                                                         environmentName={
                                                             featureEnvironment.name
@@ -308,10 +320,16 @@ export const EnvironmentAccordionBody = ({
                                                         onDragStartRef={
                                                             (() => {}) as any
                                                         }
-                                                onDragOver={(() => {}) as any}
+                                                        onDragOver={
-                                                onDragEnd={(() => {}) as any}
+                                                            (() => {}) as any
+                                                        }
+                                                        onDragEnd={
+                                                            (() => {}) as any
+                                                        }
                                                     />
+                                                </li>
                                             ))}
+                                        </StyledStrategyList>
                                         <br />
                                         <Pagination
                                             count={pages.length}