compact comments

Author: arielvino

src/pages/components/LineSelector.test.tsx

@@ -3,8 +3,6 @@ import { useAllRoutes } from 'src/hooks/useAllRoutes'
 import i18n from 'src/locale/allTranslations'
 import LineSelector from './LineSelector'
 
-// Keep the real API client / gtfsService out of the test: LineSelector only
-// reads `line` and `suffix` off each route, so a mocked hook is enough.
 vi.mock('src/hooks/useAllRoutes', () => ({ useAllRoutes: vi.fn() }))
 const mockUseAllRoutes = vi.mocked(useAllRoutes)
 
@@ -26,7 +24,6 @@ const route = (line: number, suffix = ''): RouteItem => ({
   routeKey: `${line}${suffix}-key`,
 })
 
-// useAllRoutes already returns routes sorted by line number; mirror that here.
 const setRoutes = (routes: RouteItem[], isLoading = false) =>
   mockUseAllRoutes.mockReturnValue({ routes, isLoading, error: false })
 
@@ -80,7 +77,7 @@ describe('LineSelector', () => {
     fireEvent.change(screen.getByRole('combobox', { name: LINE_LABEL }), {
       target: { value: '42' },
     })
-    expect(setLineNumber).not.toHaveBeenCalled() // debounced, not immediate
+    expect(setLineNumber).not.toHaveBeenCalled()
 
     act(() => {
       vi.advanceTimersByTime(DEBOUNCE_MS)
@@ -92,20 +89,15 @@ describe('LineSelector', () => {
     setRoutes([route(1)])
     renderSelector()
 
-    // `MuiAutocomplete-inputRoot` carries the compact vertical padding that keeps
-    // this field the same height as the other selectors — its absence was the
-    // 74px-vs-56px regression. `forcePopupIcon` keeps the dropdown arrow so it
-    // looks like OperatorSelector / RouteSelector rather than a bare text field.
+    // `MuiAutocomplete-inputRoot` keeps this field the same height as the other selectors.
     expect(
       screen.getByRole('combobox', { name: LINE_LABEL }).closest(AUTOCOMPLETE_INPUT_ROOT),
     ).not.toBeNull()
     expect(screen.getByRole('button', { name: OPEN_BUTTON })).toBeInTheDocument()
   })
 
   it('tags the clear button with the `clear-indicator` class the e2e helper relies on', () => {
-    // The `clearInputField` Playwright helper (clearButton.spec.ts) finds the
-    // clear button by the repo-wide `.clear-indicator` class. MUI's built-in
-    // clear indicator only renders once the field has a value to clear.
+    // MUI only renders its clear indicator once the field has a value to clear.
     setRoutes([route(5)])
     renderSelector({ lineNumber: '5' })
 

src/pages/components/LineSelector.tsx

@@ -28,8 +28,7 @@ const LineSelector = ({
     setValue(lineNumber ?? '')
   }, [])
 
-  // Distinct line numbers running for the selected operator + date. `routes` is
-  // already sorted by line number in useAllRoutes, so a Set preserves that order.
+  // `routes` is already sorted by line number in useAllRoutes, so a Set preserves that order.
   const options = useMemo(() => {
     const seen = new Set<string>()
     const result: string[] = []
@@ -53,9 +52,8 @@ const LineSelector = ({
       disabled={disabled}
       loading={isLoading}
       options={options}
-      // Tag MUI's built-in clear button with the repo-wide `clear-indicator`
-      // class (the same hook VehicleSelector's ClearButton and Selector.scss use)
-      // so the e2e `clearInputField` helper can find it.
+      // The e2e `clearInputField` helper finds the clear button by the repo-wide
+      // `clear-indicator` class, which MUI's built-in one doesn't carry.
       slotProps={{ clearIndicator: { className: 'clear-indicator' } }}
       inputValue={value}
       onInputChange={(_event, newValue, reason) => {