OU-1389: Update Import Linting#1062
Conversation
|
@PeterYurkovich: This pull request references OU-1389 which is a valid jira issue. Warning: The referenced jira issue has an invalid target version for the target branch this PR targets: expected the task to target the "5.0.0" version, but no target version was set. DetailsIn response to this:
Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the openshift-eng/jira-lifecycle-plugin repository. |
|
[APPROVALNOTIFIER] This PR is APPROVED This pull-request has been approved by: PeterYurkovich The full list of commands accepted by this bot can be found here. The pull request process is described here DetailsNeeds approval from an approver in each of these files:
Approvers can indicate their approval by writing |
|
/test e2e-monitoring |
WalkthroughThe web project adds the ChangesShared alias migration
Estimated code review effort: 3 (Moderate) | ~25 minutes Possibly related PRs
Suggested reviewers: ✨ Finishing Touches🧪 Generate unit tests (beta)
|
There was a problem hiding this comment.
Actionable comments posted: 11
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
web/src/shared/console/utils/safe-fetch-hook.ts (1)
7-16: 🩺 Stability & Availability | 🟠 Major | ⚡ Quick winInitialize the AbortController during render.
controller.currentis undefined until the effect runs, so any early call can throw on.signal(for example from a childuseLayoutEffect). Create the controller synchronously and abort that same instance in cleanup.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/shared/console/utils/safe-fetch-hook.ts` around lines 7 - 16, Update useSafeFetch so the AbortController is created synchronously during render before the returned fetch callback can be invoked. Preserve that same controller instance for consoleFetchJSON and abort it during the useEffect cleanup, avoiding access to an uninitialized controller.current.
🧹 Nitpick comments (16)
web/eslint.config.ts (1)
103-103: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winAvoid the
anyescape hatch in the ESLint configuration.Use the plugin’s declared type or a narrowly scoped compatibility adapter. If the cast is required by the installed ESLint package typings, document and verify that version-specific constraint.
As per coding guidelines, “Avoid
any; use proper domain types instead.”🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/eslint.config.ts` at line 103, Update the ESLint plugin configuration around fixupPluginRules and importPlugin to remove the any cast, using the plugin’s declared type or a narrowly scoped compatibility adapter; if the installed ESLint typings require the cast, document and verify that version-specific constraint without broadening the workaround.Source: Coding guidelines
web/src/features/perses-dashboards/components/PersesWrapper.tsx (1)
47-47: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse type-only imports consistently across the Perses dashboard files.
These changed imports expose type-only symbols as runtime bindings. Update each site:
web/src/features/perses-dashboards/components/PersesWrapper.tsx#L47-L47: usetype ReactNode.web/src/features/perses-dashboards/components/emptystates/DashboardEmptyState.tsx#L3-L3: useimport type { ReactElement }.web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx#L26-L26: markReactElementandReactNodeas types.web/src/features/perses-dashboards/pages/dashboard-page/dashboard-toolbar.tsx#L20-L20: markReactElementandReactNodeas types.web/src/features/perses-dashboards/utils/datasource-api.ts#L7-L7: useimport type { TFunction }.As per coding guidelines, use type-only imports for symbols used only for type checking.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/perses-dashboards/components/PersesWrapper.tsx` at line 47, Type-only symbols are imported as runtime bindings across the Perses dashboard files. Update ReactNode in web/src/features/perses-dashboards/components/PersesWrapper.tsx:47, ReactElement in web/src/features/perses-dashboards/components/emptystates/DashboardEmptyState.tsx:3, ReactElement and ReactNode in web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx:26 and dashboard-toolbar.tsx:20, and TFunction in web/src/features/perses-dashboards/utils/datasource-api.ts:7 to use type-only import syntax; no other changes are required.Source: Coding guidelines
web/src/features/perses-dashboards/components/ToastProvider.tsx (1)
8-8: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse type-only imports consistently across the changed files.
The affected import blocks place type-only symbols in runtime imports:
web/src/features/perses-dashboards/components/ToastProvider.tsx#L8-L8: splitReactNodeandFCintoimport type.web/src/features/perses-dashboards/components/dashboard-action-modals.tsx#L25-L26: splitCSSPropertiesandSubmitHandlerinto type-only imports.web/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list.tsx#L25-L26: importDashboardResourceandReactNodewithimport type.As per coding guidelines, use type-only imports (
import type) for symbols used only for type checking.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/perses-dashboards/components/ToastProvider.tsx` at line 8, Use type-only imports for symbols used only as types: in web/src/features/perses-dashboards/components/ToastProvider.tsx lines 8-8, split ReactNode and FC from the runtime import; in web/src/features/perses-dashboards/components/dashboard-action-modals.tsx lines 25-26, split CSSProperties and SubmitHandler; and in web/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list.tsx lines 25-26, import DashboardResource and ReactNode with import type.Source: Coding guidelines
web/src/features/perses-dashboards/components/dashboard-create-dialog.tsx (1)
20-39: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse
import typefor type-only symbols.Split type-only symbols from runtime imports to comply with the repository guideline and keep emitted imports explicit.
web/src/features/perses-dashboards/components/dashboard-create-dialog.tsx#L20-L39: splitFC,SubmitHandler, andCreateDashboardValidationType.web/src/features/perses-dashboards/components/dashboard-actions-menu.tsx#L10-L17: splitFCandRef.web/src/features/perses-dashboards/ols-tool-ui/helpers/AddToDashboardButton.tsx#L1-L12: splitStyledComponent,IconButtonProps,Theme, andFC.web/src/features/perses-dashboards/ols-tool-ui/helpers/OlsToolUIPersesWrapper.tsx#L3-L6: make the React import type-only.As per coding guidelines, use type-only imports (
import type) for symbols used only for type checking.Proposed import adjustment
-import { FC, Ref, useState } from 'react'; +import { useState } from 'react'; +import type { FC, Ref } from 'react'; -import { FC, useEffect } from 'react'; -import { Controller, FormProvider, SubmitHandler, useForm } from 'react-hook-form'; +import { useEffect } from 'react'; +import type { FC } from 'react'; +import { Controller, FormProvider, useForm } from 'react-hook-form'; +import type { SubmitHandler } from 'react-hook-form'; -import { StyledComponent } from '`@emotion/styled`'; -import { IconButton, IconButtonProps, styled } from '`@mui/material`'; -import { Theme } from '`@mui/material/styles`'; +import type { StyledComponent } from '`@emotion/styled`'; +import { IconButton, styled } from '`@mui/material`'; +import type { IconButtonProps } from '`@mui/material`'; +import type { Theme } from '`@mui/material/styles`'; -import { FC, useCallback } from 'react'; +import { useCallback } from 'react'; +import type { FC } from 'react'; -import { FC, ReactNode } from 'react'; +import type { FC, ReactNode } from 'react';🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/perses-dashboards/components/dashboard-create-dialog.tsx` around lines 20 - 39, Update imports in web/src/features/perses-dashboards/components/dashboard-create-dialog.tsx#L20-L39 to use import type for FC, SubmitHandler, and CreateDashboardValidationType while retaining runtime imports separately; apply the same type-only split for FC and Ref in web/src/features/perses-dashboards/components/dashboard-actions-menu.tsx#L10-L17 and StyledComponent, IconButtonProps, Theme, and FC in web/src/features/perses-dashboards/ols-tool-ui/helpers/AddToDashboardButton.tsx#L1-L12. Make the React import type-only in web/src/features/perses-dashboards/ols-tool-ui/helpers/OlsToolUIPersesWrapper.tsx#L3-L6.Source: Coding guidelines
web/src/features/perses-dashboards/components/emptystates/ProjectEmptyState.tsx (1)
3-3: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse type-only React imports for type-only symbols.
web/src/features/perses-dashboards/components/emptystates/ProjectEmptyState.tsx#L3-L3: importReactElementwithimport type.web/src/features/perses-dashboards/ols-tool-ui/ShowTimeseries.tsx#L3-L3: importFCwithimport type.As per coding guidelines, use type-only imports (
import type) for symbols used only for type checking.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/perses-dashboards/components/emptystates/ProjectEmptyState.tsx` at line 3, Use type-only imports for the type symbols ReactElement in ProjectEmptyState.tsx and FC in ShowTimeseries.tsx; update both imports to use import type while leaving runtime imports unchanged.Source: Coding guidelines
web/src/features/legacy-dashboards/components/legacy-dashboard.tsx (1)
5-9: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse type-only imports consistently across the migration.
The same guideline violation appears throughout the changed import blocks: symbols used only for typing are imported as values.
web/src/features/legacy-dashboards/components/legacy-dashboard.tsx#L5-L9: markDataSourceandCustomDataSourceas type-only while retainingisDataSourceas a value import.web/src/features/legacy-dashboards/components/legacy-dashboard.tsx#L46-L49: markMonitoringStateandVariableas type-only.web/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsx#L8-L11: markDataSourceas type-only while retainingisDataSourceas a value import.web/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsx#L37-L38: markMonitoringStateas type-only.web/src/features/legacy-dashboards/components/panels/bar-chart.tsx#L1-L1: markCustomDataSourceas type-only.web/src/features/legacy-dashboards/components/panels/graph.tsx#L1-L8: markCustomDataSource,FormatSeriesTitle, andGraphUnitsas type-only.web/src/features/legacy-dashboards/components/panels/single-stat.tsx#L49-L50: markPanelas type-only.web/src/features/legacy-dashboards/components/panels/table.tsx#L2-L2: markCustomDataSourceas type-only.web/src/features/legacy-dashboards/components/panels/table.tsx#L28-L29: markColumnStyleandPanelas type-only.As per coding guidelines, use type-only imports (
import type) for symbols used only for type checking.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/legacy-dashboards/components/legacy-dashboard.tsx` around lines 5 - 9, Convert the type-only imports to import type across all listed sites: web/src/features/legacy-dashboards/components/legacy-dashboard.tsx lines 5-9 and 46-49; web/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsx lines 8-11 and 37-38; web/src/features/legacy-dashboards/components/panels/bar-chart.tsx line 1; graph.tsx lines 1-8; single-stat.tsx lines 49-50; and table.tsx lines 2 and 28-29. Mark DataSource, CustomDataSource, MonitoringState, Variable, FormatSeriesTitle, GraphUnits, Panel, and ColumnStyle as type-only while retaining isDataSource as a value import.Source: Coding guidelines
web/src/features/legacy-dashboards/hooks/useLegacyDashboardsProject.ts (1)
11-11: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse a type-only import for
MonitoringState.
MonitoringStateis used only as a type. Change this toimport type { MonitoringState } from '@shared/store/store';.As per coding guidelines, “Use type-only imports (
import type) for symbols used only for type checking.”🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/legacy-dashboards/hooks/useLegacyDashboardsProject.ts` at line 11, Update the MonitoringState import to a type-only import using the existing `@shared/store/store` module path, since it is used only for type checking.Source: Coding guidelines
web/src/shared/store/actions.ts (1)
1-3: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse type-only imports for type symbols.
Alert,Rule,Silence, andThunkDispatchare used as types and should be imported withimport type.As per coding guidelines, use type-only imports for symbols used only for type checking.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/shared/store/actions.ts` around lines 1 - 3, Update the imports in actions.ts so Alert, Rule, Silence, and ThunkDispatch use type-only import declarations, while preserving the existing PanelDefinition type import and runtime imports unchanged.Source: Coding guidelines
web/src/shared/components/TypeaheadSelect.tsx (1)
17-17: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse the centralized
DataTestIDsdefinition.This import resolves to
web/src/shared/constants/data-test, but the guideline requiresDataTestIDsfromweb/src/components/data-test.ts.As per coding guidelines, use the centralized
DataTestIDsobject fromweb/src/components/data-test.ts.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/shared/components/TypeaheadSelect.tsx` at line 17, Update the DataTestIDs import in TypeaheadSelect to use the centralized definition from the components data-test module instead of the shared constants module; leave the component’s existing DataTestIDs usage unchanged.Source: Coding guidelines
web/src/shared/components/dashboard-dropdown.tsx (1)
16-16: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse
import typeconsistently for type-only symbols.The reordered imports still mix type-only symbols into regular imports, contrary to the repository guideline.
web/src/shared/components/dashboard-dropdown.tsx#L16-L16: importCombinedDashboardMetadatawithimport type.web/src/shared/components/labels.tsx#L1-L1: importPrometheusLabelswithimport type.web/src/shared/components/table/TableCheckboxFilter.tsx#L14-L14: separateFCandReactMouseEvent.web/src/shared/components/table/TableFilters.tsx#L14-L16: separateReactNodeandCustomDataViewCheckboxFilterProps.web/src/shared/components/table/TableTextFilter.tsx#L3-L3: separateFC.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/shared/components/dashboard-dropdown.tsx` at line 16, Update type-only imports consistently: in web/src/shared/components/dashboard-dropdown.tsx#L16-L16 and web/src/shared/components/labels.tsx#L1-L1, use import type for CombinedDashboardMetadata and PrometheusLabels; in web/src/shared/components/table/TableCheckboxFilter.tsx#L14-L14, web/src/shared/components/table/TableFilters.tsx#L14-L16, and web/src/shared/components/table/TableTextFilter.tsx#L3-L3, separate FC, ReactMouseEvent, ReactNode, and CustomDataViewCheckboxFilterProps from runtime imports using type-only import declarations.Source: Coding guidelines
web/src/features/incidents/utils/api.spec.ts (1)
3-5: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse the
@sharedalias in the Jest mock too.The test imports
buildPrometheusUrlfrom@shared/utils/utils, but Line 16 still mocks../../../shared/utils/utils. Change the mock specifier to@shared/utils/utilsso the test consistently follows the new alias rule.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/incidents/utils/api.spec.ts` around lines 3 - 5, Update the Jest mock for buildPrometheusUrl in the test to use the `@shared/utils/utils` module specifier instead of the relative ../../../shared/utils/utils path, matching the existing import alias.web/src/features/incidents/components/IncidentAlertStateIcon.tsx (1)
3-3: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse
import typeconsistently for type-only symbols.
web/src/features/incidents/components/IncidentAlertStateIcon.tsx#L3-L3: changeFCto a type-only import.web/src/features/incidents/components/IncidentsDetailsRowTable.tsx#L11-L14: splitRuleResource,Alert, andIncidentsDetailsAlertinto type-only imports.web/src/features/incidents/components/ToolbarItemFilter.tsx#L10-L16: split the React event/component types andIncidentFiltersCombinedinto type-only imports.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/incidents/components/IncidentAlertStateIcon.tsx` at line 3, Use type-only imports for all type symbols: update IncidentAlertStateIcon.tsx line 3 for FC, split RuleResource, Alert, and IncidentsDetailsAlert in IncidentsDetailsRowTable.tsx lines 11-14, and split the React event/component types plus IncidentFiltersCombined in ToolbarItemFilter.tsx lines 10-16; leave runtime imports unchanged.Source: Coding guidelines
web/src/features/alerts/components/AlertUtils.tsx (1)
57-57: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse type-only imports for type-only symbols.
web/src/features/alerts/components/AlertUtils.tsx#L57-L57: importAlertSourcewithimport type.web/src/features/alerts/components/SilencedByTable.tsx#L1-L1: importSilencewithimport type.web/src/features/alerts/components/SilencedByTable.tsx#L3-L7: splitDataViewTrandDataViewThinto a type-only import.web/src/features/alerts/components/SilencedByTable.tsx#L8-L8: splitIActioninto a type-only import.web/src/features/alerts/pages/AlertsDetailsPage.tsx#L76-L76: importMonitoringStatewithimport type.As per coding guidelines, use type-only imports (
import type) for symbols used only for type checking.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/alerts/components/AlertUtils.tsx` at line 57, Convert the type-only imports to `import type`: `AlertSource` in web/src/features/alerts/components/AlertUtils.tsx:57-57, `Silence`, `DataViewTr`, `DataViewTh`, and `IAction` in web/src/features/alerts/components/SilencedByTable.tsx:1-1, 3-7, and 8-8 respectively, and `MonitoringState` in web/src/features/alerts/pages/AlertsDetailsPage.tsx:76-76. Split mixed imports where needed while leaving runtime imports unchanged.Source: Coding guidelines
web/src/features/alerts/pages/alert-rules-page/filter-rules.ts (1)
4-4: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse type-only imports for type-only symbols in both files.
web/src/features/alerts/pages/alert-rules-page/filter-rules.ts#L4-L4: changeAlertSourcetoimport type.web/src/features/alerts/pages/alert-rules-page/filter-rules.spec.ts#L15-L15: splitAlertRulesFiltersinto a separateimport typestatement.As per coding guidelines, use type-only imports for symbols used only for type checking.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/alerts/pages/alert-rules-page/filter-rules.ts` at line 4, Use type-only imports for type-checking-only symbols: update AlertSource in web/src/features/alerts/pages/alert-rules-page/filter-rules.ts:4-4 to an import type declaration, and split AlertRulesFilters into a separate import type statement in web/src/features/alerts/pages/alert-rules-page/filter-rules.spec.ts:15-15.Source: Coding guidelines
web/src/features/alerts/pages/alerts-page/AlertsPage.tsx (1)
17-22: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winUse type-only imports throughout the migrated alert files.
The listed declarations mix runtime and type-only symbols. Split the type-only symbols into
import typedeclarations.
web/src/features/alerts/pages/alerts-page/AlertsPage.tsx#L17-L22: splitTableFilterProps.web/src/features/alerts/pages/alerts-page/AlertsPage.tsx#L33-L37: splitAlertSourceandAggregatedAlert.web/src/features/alerts/pages/alerts-page/AggregateAlertTableRow.tsx#L14-L15: splitAggregatedAlertandAggregatedAlertFilters.web/src/features/alerts/pages/alerts-page/filter-alerts.spec.ts#L16-L16: splitAggregatedAlertFilters.web/src/features/alerts/pages/alerts-page/filter-alerts.ts#L3-L6: splitPerspectiveandAggregatedAlertFilters.As per coding guidelines, use type-only imports (
import type) for symbols used only for type checking.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/alerts/pages/alerts-page/AlertsPage.tsx` around lines 17 - 22, Use type-only imports for declarations used exclusively as types across the migrated alert files: in web/src/features/alerts/pages/alerts-page/AlertsPage.tsx lines 17-22 split TableFilterProps, and lines 33-37 split AlertSource and AggregatedAlert; in AggregateAlertTableRow.tsx lines 14-15 split AggregatedAlert and AggregatedAlertFilters; in filter-alerts.spec.ts line 16 split AggregatedAlertFilters; and in filter-alerts.ts lines 3-6 split Perspective and AggregatedAlertFilters, while keeping runtime imports unchanged.Source: Coding guidelines
web/src/features/alerts/pages/alerts-page/LabelFilter.tsx (1)
1-7: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winSplit type-only imports from runtime imports.
These changed import blocks bring type-only symbols in through regular imports. Use
import typefor the erased symbols:
web/src/features/alerts/pages/alerts-page/LabelFilter.tsx#L1-L7:FC,FormEvent,SearchInputProps, andToolbarFilterProps.web/src/features/alerts/pages/silences-page/SilencesPage.tsx#L41-L46:TableFilterProps.web/src/features/alerts/pages/silences-page/filter-silences.ts#L3-L3:Perspective.As per coding guidelines, use type-only imports for symbols used only for type checking.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/alerts/pages/alerts-page/LabelFilter.tsx` around lines 1 - 7, Split erased symbols into type-only imports: in web/src/features/alerts/pages/alerts-page/LabelFilter.tsx lines 1-7, import FC, FormEvent, SearchInputProps, and ToolbarFilterProps with import type while retaining runtime imports; in web/src/features/alerts/pages/silences-page/SilencesPage.tsx lines 41-46, import TableFilterProps as type-only; and in web/src/features/alerts/pages/silences-page/filter-silences.ts line 3, import Perspective as type-only.Source: Coding guidelines
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@web/eslint.config.ts`:
- Around line 143-154: Update the no-restricted-imports pattern in the ESLint
configuration to match both shared directory imports and parent-directory index
imports by using the `shared(?:/|$)` suffix while retaining the existing
repeated parent-directory prefix.
- Around line 106-108: Add a TypeScript-aware resolver configuration alongside
the existing node resolver in the import/resolver settings so ESLint resolves
the `@shared/`* alias according to tsconfig.json. Use
eslint-import-resolver-typescript or provide the requested lint fixture, while
preserving the existing Node extensions configuration.
In `@web/src/features/incidents/components/AlertsChart.tsx`:
- Around line 34-37: Convert the type-only imports to import type in
AlertsChart.tsx, IncidentsPage.tsx, processAlerts.spec.ts, processAlerts.ts,
processIncidents.ts, and utils.ts at the specified ranges, preserving all
runtime imports and existing usage.
- Around line 36-37: Reorder the relative imports to place parent-path imports
before sibling-path imports in AlertsChart.tsx (lines 36-37),
processAlerts.spec.ts (lines 3-5), processAlerts.ts (lines 5-10), and
processIncidents.ts (lines 5-6), without changing the imported symbols or
behavior.
In `@web/src/features/incidents/components/IncidentsDetailsRowTable.tsx`:
- Around line 13-14: Update the imports in IncidentsDetailsRowTable.tsx by
placing the ../types/model import before the local IncidentAlertStateIcon
import, and mark Alert and IncidentsDetailsAlert as type-only imports using
import type.
In `@web/src/features/metrics/pages/MetricsPage.tsx`:
- Around line 13-17: Split migrated imports into value and type-only bindings:
in web/src/features/metrics/pages/MetricsPage.tsx lines 13-17, make
CustomDataSource and DataSource type-only while keeping isDataSource as a value
import; in lines 113-118, make MonitoringState, PrometheusAPIError, and
GraphUnits type-only while keeping ALL_NAMESPACES_KEY, getPrometheusBasePath,
buildPrometheusUrl, and isGraphUnit as value imports. In
web/src/features/targets/pages/targets-page.tsx line 72, keep AlertSource as a
value import and make PrometheusAPIError and Target type-only. Make Target
type-only in web/src/features/targets/utils/filter-targets.spec.ts line 5 and
web/src/features/targets/utils/filter-targets.ts line 1.
In `@web/src/features/perses-dashboards/components/dashboard-import-dialog.tsx`:
- Around line 20-23: Convert the listed type-only symbols to type-only imports
across all affected dashboard modules: in
web/src/features/perses-dashboards/components/dashboard-import-dialog.tsx lines
20-23, split DashboardResource, ChangeEvent, FC, and SubmitHandler; in
web/src/features/perses-dashboards/pages/dashboard-page/external-panel-addition.tsx
line 2, ReactElement; in
web/src/features/perses-dashboards/utils/dashboard-action-validations.ts line 2,
TFunction; in web/src/features/perses-dashboards/utils/dashboard-api.ts lines
4-5, DashboardResource, ProjectResource, StatusError, UseMutationResult,
UseQueryOptions, and UseQueryResult; in
web/src/features/perses-dashboards/utils/migrate-api.ts line 3,
DashboardResource and UseMutationResult; in
web/src/features/perses-dashboards/utils/perses/datasource-client.ts line 15,
DatasourceResource; and in
web/src/features/perses-dashboards/utils/perses/global-datasource-client.ts line
15, GlobalDatasourceResource.
In `@web/src/shared/components/query-browser/query-browser.tsx`:
- Around line 87-92: Reorder the imports in the query-browser module so the
parent relative imports from ../../../features and ../../constants and
../../hooks appear before the sibling ./query-browser-theme and
./query-browser.scss imports, preserving the existing import group and symbols.
- Line 84: Update the imports in query-browser.tsx and QueryBrowserTooltip.tsx
to use type-only imports for TimeRange and PrometheusLabels, respectively; leave
the runtime PrometheusAPIError import unchanged.
In `@web/src/shared/console/graphs/bar.tsx`:
- Around line 13-17: Reorder the imports in bar.tsx so the parent ../utils
imports, including useRefWidth and humanizeNumber, appear before the sibling ./
imports. Keep a blank line between the parent-import group and the local
sibling-import group to satisfy import/order.
In `@web/src/shared/console/public/components/autocomplete.tsx`:
- Around line 11-13: Reorder the imports in autocomplete.tsx according to the
configured import/order rule, placing the deeper parent imports before the
sibling ./factory/text-filter import and alphabetizing the relative imports
within their group.
---
Outside diff comments:
In `@web/src/shared/console/utils/safe-fetch-hook.ts`:
- Around line 7-16: Update useSafeFetch so the AbortController is created
synchronously during render before the returned fetch callback can be invoked.
Preserve that same controller instance for consoleFetchJSON and abort it during
the useEffect cleanup, avoiding access to an uninitialized controller.current.
---
Nitpick comments:
In `@web/eslint.config.ts`:
- Line 103: Update the ESLint plugin configuration around fixupPluginRules and
importPlugin to remove the any cast, using the plugin’s declared type or a
narrowly scoped compatibility adapter; if the installed ESLint typings require
the cast, document and verify that version-specific constraint without
broadening the workaround.
In `@web/src/features/alerts/components/AlertUtils.tsx`:
- Line 57: Convert the type-only imports to `import type`: `AlertSource` in
web/src/features/alerts/components/AlertUtils.tsx:57-57, `Silence`,
`DataViewTr`, `DataViewTh`, and `IAction` in
web/src/features/alerts/components/SilencedByTable.tsx:1-1, 3-7, and 8-8
respectively, and `MonitoringState` in
web/src/features/alerts/pages/AlertsDetailsPage.tsx:76-76. Split mixed imports
where needed while leaving runtime imports unchanged.
In `@web/src/features/alerts/pages/alert-rules-page/filter-rules.ts`:
- Line 4: Use type-only imports for type-checking-only symbols: update
AlertSource in
web/src/features/alerts/pages/alert-rules-page/filter-rules.ts:4-4 to an import
type declaration, and split AlertRulesFilters into a separate import type
statement in
web/src/features/alerts/pages/alert-rules-page/filter-rules.spec.ts:15-15.
In `@web/src/features/alerts/pages/alerts-page/AlertsPage.tsx`:
- Around line 17-22: Use type-only imports for declarations used exclusively as
types across the migrated alert files: in
web/src/features/alerts/pages/alerts-page/AlertsPage.tsx lines 17-22 split
TableFilterProps, and lines 33-37 split AlertSource and AggregatedAlert; in
AggregateAlertTableRow.tsx lines 14-15 split AggregatedAlert and
AggregatedAlertFilters; in filter-alerts.spec.ts line 16 split
AggregatedAlertFilters; and in filter-alerts.ts lines 3-6 split Perspective and
AggregatedAlertFilters, while keeping runtime imports unchanged.
In `@web/src/features/alerts/pages/alerts-page/LabelFilter.tsx`:
- Around line 1-7: Split erased symbols into type-only imports: in
web/src/features/alerts/pages/alerts-page/LabelFilter.tsx lines 1-7, import FC,
FormEvent, SearchInputProps, and ToolbarFilterProps with import type while
retaining runtime imports; in
web/src/features/alerts/pages/silences-page/SilencesPage.tsx lines 41-46, import
TableFilterProps as type-only; and in
web/src/features/alerts/pages/silences-page/filter-silences.ts line 3, import
Perspective as type-only.
In `@web/src/features/incidents/components/IncidentAlertStateIcon.tsx`:
- Line 3: Use type-only imports for all type symbols: update
IncidentAlertStateIcon.tsx line 3 for FC, split RuleResource, Alert, and
IncidentsDetailsAlert in IncidentsDetailsRowTable.tsx lines 11-14, and split the
React event/component types plus IncidentFiltersCombined in
ToolbarItemFilter.tsx lines 10-16; leave runtime imports unchanged.
In `@web/src/features/incidents/utils/api.spec.ts`:
- Around line 3-5: Update the Jest mock for buildPrometheusUrl in the test to
use the `@shared/utils/utils` module specifier instead of the relative
../../../shared/utils/utils path, matching the existing import alias.
In `@web/src/features/legacy-dashboards/components/legacy-dashboard.tsx`:
- Around line 5-9: Convert the type-only imports to import type across all
listed sites: web/src/features/legacy-dashboards/components/legacy-dashboard.tsx
lines 5-9 and 46-49;
web/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsx
lines 8-11 and 37-38;
web/src/features/legacy-dashboards/components/panels/bar-chart.tsx line 1;
graph.tsx lines 1-8; single-stat.tsx lines 49-50; and table.tsx lines 2 and
28-29. Mark DataSource, CustomDataSource, MonitoringState, Variable,
FormatSeriesTitle, GraphUnits, Panel, and ColumnStyle as type-only while
retaining isDataSource as a value import.
In `@web/src/features/legacy-dashboards/hooks/useLegacyDashboardsProject.ts`:
- Line 11: Update the MonitoringState import to a type-only import using the
existing `@shared/store/store` module path, since it is used only for type
checking.
In `@web/src/features/perses-dashboards/components/dashboard-create-dialog.tsx`:
- Around line 20-39: Update imports in
web/src/features/perses-dashboards/components/dashboard-create-dialog.tsx#L20-L39
to use import type for FC, SubmitHandler, and CreateDashboardValidationType
while retaining runtime imports separately; apply the same type-only split for
FC and Ref in
web/src/features/perses-dashboards/components/dashboard-actions-menu.tsx#L10-L17
and StyledComponent, IconButtonProps, Theme, and FC in
web/src/features/perses-dashboards/ols-tool-ui/helpers/AddToDashboardButton.tsx#L1-L12.
Make the React import type-only in
web/src/features/perses-dashboards/ols-tool-ui/helpers/OlsToolUIPersesWrapper.tsx#L3-L6.
In
`@web/src/features/perses-dashboards/components/emptystates/ProjectEmptyState.tsx`:
- Line 3: Use type-only imports for the type symbols ReactElement in
ProjectEmptyState.tsx and FC in ShowTimeseries.tsx; update both imports to use
import type while leaving runtime imports unchanged.
In `@web/src/features/perses-dashboards/components/PersesWrapper.tsx`:
- Line 47: Type-only symbols are imported as runtime bindings across the Perses
dashboard files. Update ReactNode in
web/src/features/perses-dashboards/components/PersesWrapper.tsx:47, ReactElement
in
web/src/features/perses-dashboards/components/emptystates/DashboardEmptyState.tsx:3,
ReactElement and ReactNode in
web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx:26 and
dashboard-toolbar.tsx:20, and TFunction in
web/src/features/perses-dashboards/utils/datasource-api.ts:7 to use type-only
import syntax; no other changes are required.
In `@web/src/features/perses-dashboards/components/ToastProvider.tsx`:
- Line 8: Use type-only imports for symbols used only as types: in
web/src/features/perses-dashboards/components/ToastProvider.tsx lines 8-8, split
ReactNode and FC from the runtime import; in
web/src/features/perses-dashboards/components/dashboard-action-modals.tsx lines
25-26, split CSSProperties and SubmitHandler; and in
web/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list.tsx
lines 25-26, import DashboardResource and ReactNode with import type.
In `@web/src/shared/components/dashboard-dropdown.tsx`:
- Line 16: Update type-only imports consistently: in
web/src/shared/components/dashboard-dropdown.tsx#L16-L16 and
web/src/shared/components/labels.tsx#L1-L1, use import type for
CombinedDashboardMetadata and PrometheusLabels; in
web/src/shared/components/table/TableCheckboxFilter.tsx#L14-L14,
web/src/shared/components/table/TableFilters.tsx#L14-L16, and
web/src/shared/components/table/TableTextFilter.tsx#L3-L3, separate FC,
ReactMouseEvent, ReactNode, and CustomDataViewCheckboxFilterProps from runtime
imports using type-only import declarations.
In `@web/src/shared/components/TypeaheadSelect.tsx`:
- Line 17: Update the DataTestIDs import in TypeaheadSelect to use the
centralized definition from the components data-test module instead of the
shared constants module; leave the component’s existing DataTestIDs usage
unchanged.
In `@web/src/shared/store/actions.ts`:
- Around line 1-3: Update the imports in actions.ts so Alert, Rule, Silence, and
ThunkDispatch use type-only import declarations, while preserving the existing
PanelDefinition type import and runtime imports unchanged.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository YAML (base), Central YAML (inherited)
Review profile: CHILL
Plan: Enterprise
Run ID: 129a09c7-cef6-432d-860a-f9241f6b6e06
📒 Files selected for processing (145)
web/eslint.config.tsweb/jest.config.jsweb/src/features/alerts/components/AlertUtils.tsxweb/src/features/alerts/components/SilenceForm.tsxweb/src/features/alerts/components/SilencedByTable.tsxweb/src/features/alerts/components/SilencesUtils.tsxweb/src/features/alerts/pages/AlertRulesDetailsPage.tsxweb/src/features/alerts/pages/AlertingPage.tsxweb/src/features/alerts/pages/AlertsDetailsPage.tsxweb/src/features/alerts/pages/SilenceCreatePage.tsxweb/src/features/alerts/pages/SilenceEditPage.tsxweb/src/features/alerts/pages/SilencesDetailsPage.tsxweb/src/features/alerts/pages/alert-rules-page/AlertRulesPage.tsxweb/src/features/alerts/pages/alert-rules-page/filter-rules.spec.tsweb/src/features/alerts/pages/alert-rules-page/filter-rules.tsweb/src/features/alerts/pages/alerts-page/AggregateAlertTableRow.tsxweb/src/features/alerts/pages/alerts-page/AlertTableRow.tsxweb/src/features/alerts/pages/alerts-page/AlertsPage.tsxweb/src/features/alerts/pages/alerts-page/DownloadCSVButton.tsxweb/src/features/alerts/pages/alerts-page/LabelFilter.tsxweb/src/features/alerts/pages/alerts-page/agentic-runs/alert-identifier.spec.tsweb/src/features/alerts/pages/alerts-page/agentic-runs/alert-identifier.tsweb/src/features/alerts/pages/alerts-page/agentic-runs/useAgenticRunCheck.tsweb/src/features/alerts/pages/alerts-page/filter-alerts.spec.tsweb/src/features/alerts/pages/alerts-page/filter-alerts.tsweb/src/features/alerts/pages/silences-page/SilencesPage.tsxweb/src/features/alerts/pages/silences-page/filter-silences.spec.tsweb/src/features/alerts/pages/silences-page/filter-silences.tsweb/src/features/incidents/components/AlertsChart.tsxweb/src/features/incidents/components/IncidentAlertStateIcon.tsxweb/src/features/incidents/components/IncidentsChart.tsxweb/src/features/incidents/components/IncidentsDetailsRowTable.tsxweb/src/features/incidents/components/IncidentsTable.tsxweb/src/features/incidents/components/ToolbarItemFilter.tsxweb/src/features/incidents/pages/IncidentsPage.tsxweb/src/features/incidents/utils/api.spec.tsweb/src/features/incidents/utils/api.tsweb/src/features/incidents/utils/processAlerts.spec.tsweb/src/features/incidents/utils/processAlerts.tsweb/src/features/incidents/utils/processIncidents.spec.tsweb/src/features/incidents/utils/processIncidents.tsweb/src/features/incidents/utils/utils.tsweb/src/features/legacy-dashboards/components/custom-time-range-modal.tsxweb/src/features/legacy-dashboards/components/dashboard-skeleton-legacy.tsxweb/src/features/legacy-dashboards/components/error.tsxweb/src/features/legacy-dashboards/components/legacy-dashboard.tsxweb/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsxweb/src/features/legacy-dashboards/components/panels/bar-chart.tsxweb/src/features/legacy-dashboards/components/panels/graph.tsxweb/src/features/legacy-dashboards/components/panels/single-stat.tsxweb/src/features/legacy-dashboards/components/panels/table.tsxweb/src/features/legacy-dashboards/components/time-dropdowns.tsxweb/src/features/legacy-dashboards/hooks/useLegacyDashboards.tsweb/src/features/legacy-dashboards/hooks/useLegacyDashboardsProject.tsweb/src/features/legacy-dashboards/pages/legacy-dashboard-page.tsxweb/src/features/legacy-dashboards/utils/variable-utils.spec.tsweb/src/features/legacy-dashboards/utils/variable-utils.tsweb/src/features/metrics/components/promql-expression-input.tsxweb/src/features/metrics/pages/MetricsPage.tsxweb/src/features/metrics/pages/PrometheusRedirectPage.tsxweb/src/features/perses-dashboards/components/PersesWrapper.tsxweb/src/features/perses-dashboards/components/ToastProvider.tsxweb/src/features/perses-dashboards/components/dashboard-action-modals.tsxweb/src/features/perses-dashboards/components/dashboard-actions-menu.tsxweb/src/features/perses-dashboards/components/dashboard-create-dialog.tsxweb/src/features/perses-dashboards/components/dashboard-dialog-helpers.tsxweb/src/features/perses-dashboards/components/dashboard-header.tsxweb/src/features/perses-dashboards/components/dashboard-import-dialog.tsxweb/src/features/perses-dashboards/components/emptystates/DashboardEmptyState.tsxweb/src/features/perses-dashboards/components/emptystates/ProjectEmptyState.tsxweb/src/features/perses-dashboards/components/project/ProjectBar.tsxweb/src/features/perses-dashboards/components/project/ProjectDropdown.tsxweb/src/features/perses-dashboards/components/project/ProjectMenuToggle.tsxweb/src/features/perses-dashboards/components/project/useActiveProject.tsxweb/src/features/perses-dashboards/hooks/useDashboardsData.tsweb/src/features/perses-dashboards/hooks/useEditableProjects.tsweb/src/features/perses-dashboards/hooks/useOcpProjects.tsweb/src/features/perses-dashboards/hooks/usePerses.tsweb/src/features/perses-dashboards/hooks/usePersesRefreshInterval.tsweb/src/features/perses-dashboards/hooks/usePersesTimeRange.tsweb/src/features/perses-dashboards/ols-tool-ui/ShowTimeseries.tsxweb/src/features/perses-dashboards/ols-tool-ui/helpers/AddToDashboardButton.tsxweb/src/features/perses-dashboards/ols-tool-ui/helpers/OlsToolUIPersesWrapper.tsxweb/src/features/perses-dashboards/ols-tool-ui/helpers/useTimeRange.tsweb/src/features/perses-dashboards/pages/dashboard-list-page/DashboardListPage.tsxweb/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list-frame.tsxweb/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list.tsxweb/src/features/perses-dashboards/pages/dashboard-page/DashboardPage.tsxweb/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsxweb/src/features/perses-dashboards/pages/dashboard-page/dashboard-frame.tsxweb/src/features/perses-dashboards/pages/dashboard-page/dashboard-toolbar.tsxweb/src/features/perses-dashboards/pages/dashboard-page/external-panel-addition.tsxweb/src/features/perses-dashboards/utils/dashboard-action-validations.tsweb/src/features/perses-dashboards/utils/dashboard-api.tsweb/src/features/perses-dashboards/utils/datasource-api.tsweb/src/features/perses-dashboards/utils/migrate-api.tsweb/src/features/perses-dashboards/utils/perses-client.tsweb/src/features/perses-dashboards/utils/perses/datasource-client.tsweb/src/features/perses-dashboards/utils/perses/global-datasource-client.tsweb/src/features/targets/pages/targets-page.tsxweb/src/features/targets/utils/filter-targets.spec.tsweb/src/features/targets/utils/filter-targets.tsweb/src/shared/components/DropdownPollInterval.tsxweb/src/shared/components/KebabDropdown.tsxweb/src/shared/components/TypeaheadSelect.tsxweb/src/shared/components/dashboard-dropdown.tsxweb/src/shared/components/labels.tsxweb/src/shared/components/query-browser/query-browser.tsxweb/src/shared/components/table/TableCheckboxFilter.tsxweb/src/shared/components/table/TableFilters.tsxweb/src/shared/components/table/TableLabelFilter.tsxweb/src/shared/components/table/TableTextFilter.tsxweb/src/shared/console/console-shared/error/fallbacks/withFallback.tsxweb/src/shared/console/console-shared/hooks/useDocumentListener.tsweb/src/shared/console/console-shared/src/components/empty-state/AccessDenied.tsxweb/src/shared/console/console-shared/src/components/empty-state/ConsoleEmptyState.tsxweb/src/shared/console/console-shared/src/components/empty-state/EmptyBox.tsxweb/src/shared/console/console-shared/src/components/loading/LoadError.tsxweb/src/shared/console/console-shared/src/components/loading/LoadingBox.tsxweb/src/shared/console/console-shared/src/components/loading/LoadingInline.tsxweb/src/shared/console/console-shared/src/components/query-browser/QueryBrowserTooltip.tsxweb/src/shared/console/console-shared/src/components/status/StatusBox.tsxweb/src/shared/console/graphs/bar.tsxweb/src/shared/console/graphs/graph-empty.tsxweb/src/shared/console/graphs/helpers.tsweb/src/shared/console/graphs/promethues-graph.tsxweb/src/shared/console/public/components/autocomplete.tsxweb/src/shared/console/public/components/factory/text-filter.tsxweb/src/shared/console/utils/async.tsxweb/src/shared/console/utils/link.tsxweb/src/shared/console/utils/safe-fetch-hook.tsweb/src/shared/console/utils/single-typeahead-dropdown.tsxweb/src/shared/contexts/MonitoringContext.tsxweb/src/shared/hooks/useAlerts.tsweb/src/shared/hooks/useFeatures.tsweb/src/shared/hooks/useMonitoring.tsweb/src/shared/hooks/usePerspective.tsxweb/src/shared/store/actions.tsweb/src/shared/store/reducers.tsweb/src/shared/store/store.tsweb/src/shared/store/thunks.tsweb/src/shared/utils/utils.spec.tsweb/src/shared/utils/utils.tsweb/tsconfig.jsonweb/webpack.config.ts
35a6fc4 to
bb8faeb
Compare
|
/test e2e-monitoring |
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (1)
web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx (1)
1-7: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winSeparate type-only imports from runtime imports across the migrated files.
The import migration leaves type-only symbols in value imports, contrary to the repository TypeScript guideline.
web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx#L1-L7: importDashboardResourceandEphemeralDashboardResourcewithimport type.web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx#L25-L33: splitReactElementandReactNodeinto a type-only React import.web/src/features/incidents/components/IncidentAlertStateIcon.tsx#L3-L4: changeFCto a type-only import.web/src/features/perses-dashboards/hooks/useEditableProjects.ts#L1-L6: verify whetherK8sResourceKindandPersesUserPermissionsare type-only, then split them if so.web/src/features/perses-dashboards/utils/perses/datasource-client.ts#L14-L17: importDatasourceResourcewithimport type.As per coding guidelines, “Use type-only imports (
import type) for symbols used only for type checking.”🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx` around lines 1 - 7, Separate type-only symbols from runtime imports across all listed sites: in web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx lines 1-7, move DashboardResource and EphemeralDashboardResource to an import type declaration; at lines 25-33, split ReactElement and ReactNode into a type-only React import; in web/src/features/incidents/components/IncidentAlertStateIcon.tsx lines 3-4, make FC type-only; in web/src/features/perses-dashboards/hooks/useEditableProjects.ts lines 1-6, verify K8sResourceKind and PersesUserPermissions are used only as types and split them into import type if so; and in web/src/features/perses-dashboards/utils/perses/datasource-client.ts lines 14-17, import DatasourceResource with import type while preserving runtime imports.Source: Coding guidelines
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@web/src/features/incidents/components/IncidentsTable.tsx`:
- Around line 17-19: Convert the MonitoringState import in IncidentsTable.tsx
and the CustomDataSource import in bar-chart.tsx to type-only imports,
preserving their existing usage and import paths.
In `@web/src/shared/components/query-browser/query-browser.tsx`:
- Around line 88-92: The relative imports violate the import/order
alphabetization rule. In
web/src/shared/components/query-browser/query-browser.tsx (lines 88-92), move
the ../../ imports before the ./ imports; apply the same relative-import
ordering in web/src/shared/store/reducers.ts (lines 4-13).
- Line 9: Change the type-only imports to use import type: CustomDataSource in
web/src/shared/components/query-browser/query-browser.tsx:9-9, ToolbarLabel in
web/src/shared/components/table/TableLabelFilter.tsx:1-1, FC in
web/src/shared/components/table/TableTextFilter.tsx:3-3, and FC plus
PropsWithChildren in web/src/shared/contexts/MonitoringContext.tsx:2-2. Preserve
any runtime imports from those modules separately.
---
Nitpick comments:
In `@web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx`:
- Around line 1-7: Separate type-only symbols from runtime imports across all
listed sites: in
web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx lines
1-7, move DashboardResource and EphemeralDashboardResource to an import type
declaration; at lines 25-33, split ReactElement and ReactNode into a type-only
React import; in
web/src/features/incidents/components/IncidentAlertStateIcon.tsx lines 3-4, make
FC type-only; in web/src/features/perses-dashboards/hooks/useEditableProjects.ts
lines 1-6, verify K8sResourceKind and PersesUserPermissions are used only as
types and split them into import type if so; and in
web/src/features/perses-dashboards/utils/perses/datasource-client.ts lines
14-17, import DatasourceResource with import type while preserving runtime
imports.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository YAML (base), Central YAML (inherited)
Review profile: CHILL
Plan: Enterprise
Run ID: b376877f-00b8-4e03-a70a-2c21a6b7b509
📒 Files selected for processing (142)
web/eslint.config.tsweb/src/features/alerts/components/AlertUtils.tsxweb/src/features/alerts/components/SilenceForm.tsxweb/src/features/alerts/components/SilencedByTable.tsxweb/src/features/alerts/components/SilencesUtils.tsxweb/src/features/alerts/pages/AlertRulesDetailsPage.tsxweb/src/features/alerts/pages/AlertingPage.tsxweb/src/features/alerts/pages/AlertsDetailsPage.tsxweb/src/features/alerts/pages/SilenceCreatePage.tsxweb/src/features/alerts/pages/SilenceEditPage.tsxweb/src/features/alerts/pages/SilencesDetailsPage.tsxweb/src/features/alerts/pages/alert-rules-page/AlertRulesPage.tsxweb/src/features/alerts/pages/alert-rules-page/filter-rules.spec.tsweb/src/features/alerts/pages/alert-rules-page/filter-rules.tsweb/src/features/alerts/pages/alerts-page/AggregateAlertTableRow.tsxweb/src/features/alerts/pages/alerts-page/AlertTableRow.tsxweb/src/features/alerts/pages/alerts-page/AlertsPage.tsxweb/src/features/alerts/pages/alerts-page/DownloadCSVButton.tsxweb/src/features/alerts/pages/alerts-page/LabelFilter.tsxweb/src/features/alerts/pages/alerts-page/agentic-runs/alert-identifier.spec.tsweb/src/features/alerts/pages/alerts-page/agentic-runs/alert-identifier.tsweb/src/features/alerts/pages/alerts-page/agentic-runs/useAgenticRunCheck.tsweb/src/features/alerts/pages/alerts-page/filter-alerts.spec.tsweb/src/features/alerts/pages/alerts-page/filter-alerts.tsweb/src/features/alerts/pages/silences-page/SilencesPage.tsxweb/src/features/alerts/pages/silences-page/filter-silences.spec.tsweb/src/features/alerts/pages/silences-page/filter-silences.tsweb/src/features/incidents/components/AlertsChart.tsxweb/src/features/incidents/components/IncidentAlertStateIcon.tsxweb/src/features/incidents/components/IncidentsChart.tsxweb/src/features/incidents/components/IncidentsDetailsRowTable.tsxweb/src/features/incidents/components/IncidentsTable.tsxweb/src/features/incidents/components/ToolbarItemFilter.tsxweb/src/features/incidents/pages/IncidentsPage.tsxweb/src/features/incidents/utils/api.spec.tsweb/src/features/incidents/utils/api.tsweb/src/features/incidents/utils/processAlerts.spec.tsweb/src/features/incidents/utils/processAlerts.tsweb/src/features/incidents/utils/processIncidents.spec.tsweb/src/features/incidents/utils/processIncidents.tsweb/src/features/incidents/utils/utils.tsweb/src/features/legacy-dashboards/components/custom-time-range-modal.tsxweb/src/features/legacy-dashboards/components/dashboard-skeleton-legacy.tsxweb/src/features/legacy-dashboards/components/error.tsxweb/src/features/legacy-dashboards/components/legacy-dashboard.tsxweb/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsxweb/src/features/legacy-dashboards/components/panels/bar-chart.tsxweb/src/features/legacy-dashboards/components/panels/graph.tsxweb/src/features/legacy-dashboards/components/panels/single-stat.tsxweb/src/features/legacy-dashboards/components/panels/table.tsxweb/src/features/legacy-dashboards/components/time-dropdowns.tsxweb/src/features/legacy-dashboards/hooks/useLegacyDashboards.tsweb/src/features/legacy-dashboards/hooks/useLegacyDashboardsProject.tsweb/src/features/legacy-dashboards/pages/legacy-dashboard-page.tsxweb/src/features/legacy-dashboards/utils/variable-utils.spec.tsweb/src/features/legacy-dashboards/utils/variable-utils.tsweb/src/features/metrics/components/promql-expression-input.tsxweb/src/features/metrics/pages/MetricsPage.tsxweb/src/features/metrics/pages/PrometheusRedirectPage.tsxweb/src/features/perses-dashboards/components/PersesWrapper.tsxweb/src/features/perses-dashboards/components/ToastProvider.tsxweb/src/features/perses-dashboards/components/dashboard-action-modals.tsxweb/src/features/perses-dashboards/components/dashboard-actions-menu.tsxweb/src/features/perses-dashboards/components/dashboard-create-dialog.tsxweb/src/features/perses-dashboards/components/dashboard-dialog-helpers.tsxweb/src/features/perses-dashboards/components/dashboard-header.tsxweb/src/features/perses-dashboards/components/dashboard-import-dialog.tsxweb/src/features/perses-dashboards/components/emptystates/DashboardEmptyState.tsxweb/src/features/perses-dashboards/components/emptystates/ProjectEmptyState.tsxweb/src/features/perses-dashboards/components/project/ProjectBar.tsxweb/src/features/perses-dashboards/components/project/ProjectDropdown.tsxweb/src/features/perses-dashboards/components/project/ProjectMenuToggle.tsxweb/src/features/perses-dashboards/components/project/useActiveProject.tsxweb/src/features/perses-dashboards/hooks/useDashboardsData.tsweb/src/features/perses-dashboards/hooks/useEditableProjects.tsweb/src/features/perses-dashboards/hooks/useOcpProjects.tsweb/src/features/perses-dashboards/hooks/usePerses.tsweb/src/features/perses-dashboards/hooks/usePersesRefreshInterval.tsweb/src/features/perses-dashboards/hooks/usePersesTimeRange.tsweb/src/features/perses-dashboards/ols-tool-ui/ShowTimeseries.tsxweb/src/features/perses-dashboards/ols-tool-ui/helpers/AddToDashboardButton.tsxweb/src/features/perses-dashboards/ols-tool-ui/helpers/OlsToolUIPersesWrapper.tsxweb/src/features/perses-dashboards/ols-tool-ui/helpers/useTimeRange.tsweb/src/features/perses-dashboards/pages/dashboard-list-page/DashboardListPage.tsxweb/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list-frame.tsxweb/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list.tsxweb/src/features/perses-dashboards/pages/dashboard-page/DashboardPage.tsxweb/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsxweb/src/features/perses-dashboards/pages/dashboard-page/dashboard-frame.tsxweb/src/features/perses-dashboards/pages/dashboard-page/dashboard-toolbar.tsxweb/src/features/perses-dashboards/pages/dashboard-page/external-panel-addition.tsxweb/src/features/perses-dashboards/utils/dashboard-action-validations.tsweb/src/features/perses-dashboards/utils/dashboard-api.tsweb/src/features/perses-dashboards/utils/datasource-api.tsweb/src/features/perses-dashboards/utils/migrate-api.tsweb/src/features/perses-dashboards/utils/perses-client.tsweb/src/features/perses-dashboards/utils/perses/datasource-client.tsweb/src/features/perses-dashboards/utils/perses/global-datasource-client.tsweb/src/features/targets/pages/targets-page.tsxweb/src/features/targets/utils/filter-targets.spec.tsweb/src/features/targets/utils/filter-targets.tsweb/src/shared/components/DropdownPollInterval.tsxweb/src/shared/components/KebabDropdown.tsxweb/src/shared/components/TypeaheadSelect.tsxweb/src/shared/components/dashboard-dropdown.tsxweb/src/shared/components/labels.tsxweb/src/shared/components/query-browser/query-browser.tsxweb/src/shared/components/table/TableCheckboxFilter.tsxweb/src/shared/components/table/TableFilters.tsxweb/src/shared/components/table/TableLabelFilter.tsxweb/src/shared/components/table/TableTextFilter.tsxweb/src/shared/console/console-shared/error/fallbacks/withFallback.tsxweb/src/shared/console/console-shared/hooks/useDocumentListener.tsweb/src/shared/console/console-shared/src/components/empty-state/AccessDenied.tsxweb/src/shared/console/console-shared/src/components/empty-state/ConsoleEmptyState.tsxweb/src/shared/console/console-shared/src/components/empty-state/EmptyBox.tsxweb/src/shared/console/console-shared/src/components/loading/LoadError.tsxweb/src/shared/console/console-shared/src/components/loading/LoadingBox.tsxweb/src/shared/console/console-shared/src/components/loading/LoadingInline.tsxweb/src/shared/console/console-shared/src/components/query-browser/QueryBrowserTooltip.tsxweb/src/shared/console/console-shared/src/components/status/StatusBox.tsxweb/src/shared/console/graphs/bar.tsxweb/src/shared/console/graphs/graph-empty.tsxweb/src/shared/console/graphs/helpers.tsweb/src/shared/console/graphs/promethues-graph.tsxweb/src/shared/console/public/components/autocomplete.tsxweb/src/shared/console/public/components/factory/text-filter.tsxweb/src/shared/console/utils/async.tsxweb/src/shared/console/utils/link.tsxweb/src/shared/console/utils/safe-fetch-hook.tsweb/src/shared/console/utils/single-typeahead-dropdown.tsxweb/src/shared/contexts/MonitoringContext.tsxweb/src/shared/hooks/useAlerts.tsweb/src/shared/hooks/useFeatures.tsweb/src/shared/hooks/useMonitoring.tsweb/src/shared/hooks/usePerspective.tsxweb/src/shared/store/actions.tsweb/src/shared/store/reducers.tsweb/src/shared/store/store.tsweb/src/shared/store/thunks.tsweb/src/shared/utils/utils.spec.tsweb/src/shared/utils/utils.ts
🚧 Files skipped from review as they are similar to previous changes (121)
- web/src/features/alerts/pages/alerts-page/agentic-runs/useAgenticRunCheck.ts
- web/src/features/perses-dashboards/utils/perses/global-datasource-client.ts
- web/src/features/perses-dashboards/ols-tool-ui/ShowTimeseries.tsx
- web/src/features/perses-dashboards/hooks/usePersesTimeRange.ts
- web/src/features/perses-dashboards/ols-tool-ui/helpers/useTimeRange.ts
- web/src/features/alerts/pages/alert-rules-page/filter-rules.ts
- web/src/features/perses-dashboards/utils/dashboard-api.ts
- web/src/features/legacy-dashboards/utils/variable-utils.spec.ts
- web/src/features/perses-dashboards/components/project/useActiveProject.tsx
- web/src/features/alerts/pages/SilenceEditPage.tsx
- web/src/features/alerts/pages/alerts-page/filter-alerts.ts
- web/src/shared/store/store.ts
- web/src/features/incidents/utils/processIncidents.ts
- web/src/features/alerts/pages/alerts-page/agentic-runs/alert-identifier.ts
- web/src/features/alerts/pages/SilenceCreatePage.tsx
- web/src/features/alerts/pages/alerts-page/filter-alerts.spec.ts
- web/src/features/alerts/pages/alerts-page/DownloadCSVButton.tsx
- web/src/shared/hooks/useMonitoring.ts
- web/src/features/perses-dashboards/hooks/usePersesRefreshInterval.ts
- web/src/features/perses-dashboards/pages/dashboard-list-page/DashboardListPage.tsx
- web/src/features/alerts/pages/alerts-page/AggregateAlertTableRow.tsx
- web/src/features/incidents/utils/api.spec.ts
- web/src/features/perses-dashboards/components/emptystates/DashboardEmptyState.tsx
- web/src/features/incidents/utils/processAlerts.ts
- web/src/features/perses-dashboards/ols-tool-ui/helpers/AddToDashboardButton.tsx
- web/src/features/perses-dashboards/utils/datasource-api.ts
- web/src/features/perses-dashboards/ols-tool-ui/helpers/OlsToolUIPersesWrapper.tsx
- web/src/features/perses-dashboards/hooks/usePerses.ts
- web/src/features/metrics/pages/PrometheusRedirectPage.tsx
- web/src/features/alerts/pages/silences-page/filter-silences.ts
- web/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list-frame.tsx
- web/src/shared/console/public/components/factory/text-filter.tsx
- web/src/features/alerts/components/SilenceForm.tsx
- web/src/features/alerts/pages/AlertingPage.tsx
- web/src/shared/console/console-shared/error/fallbacks/withFallback.tsx
- web/src/features/incidents/utils/processAlerts.spec.ts
- web/src/features/perses-dashboards/hooks/useOcpProjects.ts
- web/src/features/alerts/pages/alerts-page/agentic-runs/alert-identifier.spec.ts
- web/src/features/perses-dashboards/components/ToastProvider.tsx
- web/src/shared/utils/utils.spec.ts
- web/src/features/alerts/pages/silences-page/SilencesPage.tsx
- web/src/features/legacy-dashboards/components/dashboard-skeleton-legacy.tsx
- web/src/features/incidents/utils/api.ts
- web/src/features/targets/utils/filter-targets.spec.ts
- web/src/features/perses-dashboards/pages/dashboard-page/dashboard-frame.tsx
- web/src/shared/components/DropdownPollInterval.tsx
- web/src/features/targets/utils/filter-targets.ts
- web/src/features/alerts/components/SilencedByTable.tsx
- web/src/features/perses-dashboards/components/project/ProjectBar.tsx
- web/src/features/perses-dashboards/hooks/useDashboardsData.ts
- web/src/features/alerts/pages/alerts-page/AlertsPage.tsx
- web/src/features/incidents/utils/processIncidents.spec.ts
- web/src/shared/console/public/components/autocomplete.tsx
- web/src/features/perses-dashboards/utils/dashboard-action-validations.ts
- web/src/shared/console/utils/async.tsx
- web/src/features/perses-dashboards/components/dashboard-dialog-helpers.tsx
- web/src/features/legacy-dashboards/hooks/useLegacyDashboards.ts
- web/src/features/targets/pages/targets-page.tsx
- web/src/features/alerts/pages/alerts-page/LabelFilter.tsx
- web/src/features/legacy-dashboards/components/custom-time-range-modal.tsx
- web/src/shared/console/utils/link.tsx
- web/src/shared/console/console-shared/src/components/loading/LoadingInline.tsx
- web/src/features/perses-dashboards/pages/dashboard-page/DashboardPage.tsx
- web/src/shared/utils/utils.ts
- web/src/features/alerts/components/AlertUtils.tsx
- web/src/features/legacy-dashboards/components/panels/graph.tsx
- web/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list.tsx
- web/src/shared/console/console-shared/src/components/empty-state/AccessDenied.tsx
- web/src/features/perses-dashboards/pages/dashboard-page/dashboard-toolbar.tsx
- web/src/shared/components/table/TableCheckboxFilter.tsx
- web/src/features/alerts/pages/SilencesDetailsPage.tsx
- web/src/features/legacy-dashboards/pages/legacy-dashboard-page.tsx
- web/src/features/perses-dashboards/components/project/ProjectDropdown.tsx
- web/src/features/legacy-dashboards/hooks/useLegacyDashboardsProject.ts
- web/src/shared/components/labels.tsx
- web/src/features/perses-dashboards/components/dashboard-create-dialog.tsx
- web/src/shared/console/console-shared/src/components/query-browser/QueryBrowserTooltip.tsx
- web/src/shared/components/dashboard-dropdown.tsx
- web/src/features/legacy-dashboards/components/panels/single-stat.tsx
- web/src/shared/console/graphs/helpers.ts
- web/src/features/metrics/pages/MetricsPage.tsx
- web/src/shared/components/KebabDropdown.tsx
- web/src/features/incidents/components/AlertsChart.tsx
- web/src/shared/hooks/usePerspective.tsx
- web/src/features/alerts/components/SilencesUtils.tsx
- web/src/features/alerts/pages/silences-page/filter-silences.spec.ts
- web/src/features/incidents/components/ToolbarItemFilter.tsx
- web/src/features/perses-dashboards/utils/migrate-api.ts
- web/src/features/perses-dashboards/components/dashboard-header.tsx
- web/src/features/legacy-dashboards/components/time-dropdowns.tsx
- web/src/shared/console/console-shared/src/components/loading/LoadError.tsx
- web/src/shared/store/thunks.ts
- web/src/shared/console/console-shared/src/components/empty-state/EmptyBox.tsx
- web/src/shared/console/console-shared/src/components/empty-state/ConsoleEmptyState.tsx
- web/src/shared/console/console-shared/hooks/useDocumentListener.ts
- web/src/shared/console/utils/safe-fetch-hook.ts
- web/src/features/legacy-dashboards/components/panels/table.tsx
- web/eslint.config.ts
- web/src/shared/console/utils/single-typeahead-dropdown.tsx
- web/src/features/perses-dashboards/components/dashboard-action-modals.tsx
- web/src/features/perses-dashboards/pages/dashboard-page/external-panel-addition.tsx
- web/src/shared/console/graphs/graph-empty.tsx
- web/src/features/incidents/pages/IncidentsPage.tsx
- web/src/features/legacy-dashboards/components/legacy-dashboard.tsx
- web/src/features/perses-dashboards/components/dashboard-actions-menu.tsx
- web/src/shared/console/graphs/bar.tsx
- web/src/features/perses-dashboards/components/PersesWrapper.tsx
- web/src/shared/components/table/TableFilters.tsx
- web/src/features/perses-dashboards/components/emptystates/ProjectEmptyState.tsx
- web/src/features/incidents/utils/utils.ts
- web/src/features/alerts/pages/AlertRulesDetailsPage.tsx
- web/src/features/alerts/pages/alert-rules-page/filter-rules.spec.ts
- web/src/features/perses-dashboards/components/dashboard-import-dialog.tsx
- web/src/shared/hooks/useAlerts.ts
- web/src/shared/console/console-shared/src/components/status/StatusBox.tsx
- web/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsx
- web/src/features/alerts/pages/AlertsDetailsPage.tsx
- web/src/features/perses-dashboards/utils/perses-client.ts
- web/src/shared/store/actions.ts
- web/src/shared/console/graphs/promethues-graph.tsx
- web/src/features/metrics/components/promql-expression-input.tsx
|
@PeterYurkovich: all tests passed! Full PR test history. Your PR dashboard. DetailsInstructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository. I understand the commands that are listed here. |
| import { AlertSource } from '../../../shared/types/types'; | ||
| import { SeverityBadge } from '../../../shared/components/SeverityBadge'; | ||
|
|
||
| import { FormatSeriesTitle, QueryBrowser } from '@shared/components/query-browser/query-browser'; |
There was a problem hiding this comment.
Should we differentiate between actual packages starting with @ like Patternfly vs local references by using:
| import { FormatSeriesTitle, QueryBrowser } from '@shared/components/query-browser/query-browser'; | |
| import { FormatSeriesTitle, QueryBrowser } from '@/shared/components/query-browser/query-browser'; |
?
| "compilerOptions": { | ||
| "baseUrl": ".", | ||
| "paths": { | ||
| "@shared/*": ["src/shared/*"] |
There was a problem hiding this comment.
Should we alias src instead?
| "@shared/*": ["src/shared/*"] | |
| "@/*": ["src/*"] |
This PR adds 2 primary rules to the eslint config, then updates all files to align with those rules.
@sharedalias to the shared directory and enforces usage in imports by not allowing/shared/in import paths@sharedThe 2 changes are placed into separate commits. If desired I can make separate PR's but I thought it would be easier to get this done at the same time
Summary by CodeRabbit