Metric editor fix

src/Components/Layout/SettingsComponents/MetricRangeEditor.jsx

@@ -269,30 +269,19 @@ const MetricRangeEditor = ({ onSave }) => {
 
           <Divider sx={{ mb: 3 }} />
 
-          <Box sx={{ height: '60vh', width: '100%' }}>
-            <AutoSizer>
-              {({ height, width }) => (
-                <List
-                  height={height}
-                  width={width}
-                  itemSize={getItemSize}
-                  itemCount={filtered.length}
-                >
-                  {({ index, style }) => (
-                    <Box style={style} sx={{ p: 1 }}>
+          <Box sx={{ maxHeight: '60vh', overflowY: 'auto', pr: 1 }}>
+            {filtered.map((metric, index) => (
               <MetricItem
-                        metric={filtered[index]}
+                key={metric.name}
+                metric={metric}
                 index={index}
                 updateRange={updateRange}
                 addRange={addRange}
                 deleteRange={deleteRange}
               />
+            ))}
           </Box>
-                  )}
-                </List>
-              )}
-            </AutoSizer>
-          </Box>
+
 
           {filtered.length === 0 && (
             <Typography color="text.secondary" textAlign="center" py={3}>