Skip to content

OU-1389: Update Import Linting#1062

Open
PeterYurkovich wants to merge 2 commits into
openshift:mainfrom
PeterYurkovich:ou-1389-9
Open

OU-1389: Update Import Linting#1062
PeterYurkovich wants to merge 2 commits into
openshift:mainfrom
PeterYurkovich:ou-1389-9

Conversation

@PeterYurkovich

@PeterYurkovich PeterYurkovich commented Jul 15, 2026

Copy link
Copy Markdown
Contributor

This PR adds 2 primary rules to the eslint config, then updates all files to align with those rules.

  1. Creates a new @shared alias to the shared directory and enforces usage in imports by not allowing /shared/ in import paths
  2. Creates a deterministic import order which has the following groups with a new line between each
  • external modules
  • imports containing @shared
  • relative imports

The 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

  • Refactor
    • Standardized shared-module imports across the web interface with a consistent alias.
    • Improved import ordering and formatting throughout the application.
  • Tooling
    • Added consistent alias resolution for development, testing, bundling, and TypeScript tooling.
    • Prevented unsupported relative imports into shared modules by enforcing lint rules and updating test mappings.

@openshift-ci-robot openshift-ci-robot added the jira/valid-reference Indicates that this PR references a valid Jira ticket of any type. label Jul 15, 2026
@openshift-ci-robot

openshift-ci-robot commented Jul 15, 2026

Copy link
Copy Markdown

@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.

Details

In response to this:

This PR adds 2 primary rules to the eslint config, then updates all files to align with those rules.

  1. Creates a new @shared alias to the shared directory and enforces usage in imports by not allowing /shared/ in import paths
  2. Creates a deterministic import order which has the following groups with a new line between each
  • external modules
  • imports containing @shared
  • relative imports

The 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

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.

@openshift-ci openshift-ci Bot requested review from etmurasaki and zhuje July 15, 2026 18:18
@openshift-ci

openshift-ci Bot commented Jul 15, 2026

Copy link
Copy Markdown
Contributor

[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

Details Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

@openshift-ci openshift-ci Bot added the approved Indicates a PR has been approved by an approver from all required OWNERS files. label Jul 15, 2026
@PeterYurkovich

Copy link
Copy Markdown
Contributor Author

/test e2e-monitoring

@coderabbitai

coderabbitai Bot commented Jul 15, 2026

Copy link
Copy Markdown

Walkthrough

The web project adds the @shared path alias across TypeScript, Webpack, Jest, and ESLint, then migrates feature and shared-module imports from deep relative paths to the alias while normalizing import ordering.

Changes

Shared alias migration

Layer / File(s) Summary
Alias resolution and lint rules
web/tsconfig.json, web/webpack.config.ts, web/jest.config.js, web/eslint.config.ts
Adds @shared resolution for TypeScript, Webpack, and Jest, plus ESLint import ordering and relative shared-import restrictions.
Feature import migration
web/src/features/alerts/*, web/src/features/incidents/*, web/src/features/legacy-dashboards/*, web/src/features/metrics/*, web/src/features/targets/*
Replaces relative shared imports with @shared imports and reorganizes import blocks without changing feature logic.
Perses dashboard migration
web/src/features/perses-dashboards/*
Updates shared import paths and import grouping across Perses components, hooks, pages, and utilities.
Shared module normalization
web/src/shared/*
Reorders and formats imports across shared modules; useSafeFetch also uses an abort controller and disables client-side request timeouts with NO_TIMEOUT.

Estimated code review effort: 3 (Moderate) | ~25 minutes

Possibly related PRs

Suggested reviewers: etmurasaki, zhuje

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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 win

Initialize the AbortController during render. controller.current is undefined until the effect runs, so any early call can throw on .signal (for example from a child useLayoutEffect). 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 win

Avoid the any escape 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 win

Use 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: use type ReactNode.
  • web/src/features/perses-dashboards/components/emptystates/DashboardEmptyState.tsx#L3-L3: use import type { ReactElement }.
  • web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx#L26-L26: mark ReactElement and ReactNode as types.
  • web/src/features/perses-dashboards/pages/dashboard-page/dashboard-toolbar.tsx#L20-L20: mark ReactElement and ReactNode as types.
  • web/src/features/perses-dashboards/utils/datasource-api.ts#L7-L7: use import 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 win

Use 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: split ReactNode and FC into import type.
  • web/src/features/perses-dashboards/components/dashboard-action-modals.tsx#L25-L26: split CSSProperties and SubmitHandler into type-only imports.
  • web/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list.tsx#L25-L26: import DashboardResource and ReactNode with import 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 win

Use import type for 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: split FC, SubmitHandler, and CreateDashboardValidationType.
  • web/src/features/perses-dashboards/components/dashboard-actions-menu.tsx#L10-L17: split FC and Ref.
  • web/src/features/perses-dashboards/ols-tool-ui/helpers/AddToDashboardButton.tsx#L1-L12: split StyledComponent, IconButtonProps, Theme, and FC.
  • 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 win

Use type-only React imports for type-only symbols.

  • web/src/features/perses-dashboards/components/emptystates/ProjectEmptyState.tsx#L3-L3: import ReactElement with import type.
  • web/src/features/perses-dashboards/ols-tool-ui/ShowTimeseries.tsx#L3-L3: import FC with import 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 win

Use 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: mark DataSource and CustomDataSource as type-only while retaining isDataSource as a value import.
  • web/src/features/legacy-dashboards/components/legacy-dashboard.tsx#L46-L49: mark MonitoringState and Variable as type-only.
  • web/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsx#L8-L11: mark DataSource as type-only while retaining isDataSource as a value import.
  • web/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsx#L37-L38: mark MonitoringState as type-only.
  • web/src/features/legacy-dashboards/components/panels/bar-chart.tsx#L1-L1: mark CustomDataSource as type-only.
  • web/src/features/legacy-dashboards/components/panels/graph.tsx#L1-L8: mark CustomDataSource, FormatSeriesTitle, and GraphUnits as type-only.
  • web/src/features/legacy-dashboards/components/panels/single-stat.tsx#L49-L50: mark Panel as type-only.
  • web/src/features/legacy-dashboards/components/panels/table.tsx#L2-L2: mark CustomDataSource as type-only.
  • web/src/features/legacy-dashboards/components/panels/table.tsx#L28-L29: mark ColumnStyle and Panel as 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 win

Use a type-only import for MonitoringState.

MonitoringState is used only as a type. Change this to import 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 win

Use type-only imports for type symbols.

Alert, Rule, Silence, and ThunkDispatch are used as types and should be imported with import 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 win

Use the centralized DataTestIDs definition.

This import resolves to web/src/shared/constants/data-test, but the guideline requires DataTestIDs from web/src/components/data-test.ts.

As per coding guidelines, use the centralized DataTestIDs object from web/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 win

Use import type consistently 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: import CombinedDashboardMetadata with import type.
  • web/src/shared/components/labels.tsx#L1-L1: import PrometheusLabels with import type.
  • web/src/shared/components/table/TableCheckboxFilter.tsx#L14-L14: separate FC and ReactMouseEvent.
  • web/src/shared/components/table/TableFilters.tsx#L14-L16: separate ReactNode and CustomDataViewCheckboxFilterProps.
  • web/src/shared/components/table/TableTextFilter.tsx#L3-L3: separate FC.
🤖 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 win

Use the @shared alias in the Jest mock too.

The test imports buildPrometheusUrl from @shared/utils/utils, but Line 16 still mocks ../../../shared/utils/utils. Change the mock specifier to @shared/utils/utils so 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 win

Use import type consistently for type-only symbols.

  • web/src/features/incidents/components/IncidentAlertStateIcon.tsx#L3-L3: change FC to a type-only import.
  • web/src/features/incidents/components/IncidentsDetailsRowTable.tsx#L11-L14: split RuleResource, Alert, and IncidentsDetailsAlert into type-only imports.
  • web/src/features/incidents/components/ToolbarItemFilter.tsx#L10-L16: split the React event/component types and IncidentFiltersCombined into 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 win

Use type-only imports for type-only symbols.

  • web/src/features/alerts/components/AlertUtils.tsx#L57-L57: import AlertSource with import type.
  • web/src/features/alerts/components/SilencedByTable.tsx#L1-L1: import Silence with import type.
  • web/src/features/alerts/components/SilencedByTable.tsx#L3-L7: split DataViewTr and DataViewTh into a type-only import.
  • web/src/features/alerts/components/SilencedByTable.tsx#L8-L8: split IAction into a type-only import.
  • web/src/features/alerts/pages/AlertsDetailsPage.tsx#L76-L76: import MonitoringState with import 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 win

Use type-only imports for type-only symbols in both files.

  • web/src/features/alerts/pages/alert-rules-page/filter-rules.ts#L4-L4: change AlertSource to import type.
  • web/src/features/alerts/pages/alert-rules-page/filter-rules.spec.ts#L15-L15: split AlertRulesFilters into a separate import type statement.

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 win

Use type-only imports throughout the migrated alert files.

The listed declarations mix runtime and type-only symbols. Split the type-only symbols into import type declarations.

  • web/src/features/alerts/pages/alerts-page/AlertsPage.tsx#L17-L22: split TableFilterProps.
  • web/src/features/alerts/pages/alerts-page/AlertsPage.tsx#L33-L37: split AlertSource and AggregatedAlert.
  • web/src/features/alerts/pages/alerts-page/AggregateAlertTableRow.tsx#L14-L15: split AggregatedAlert and AggregatedAlertFilters.
  • web/src/features/alerts/pages/alerts-page/filter-alerts.spec.ts#L16-L16: split AggregatedAlertFilters.
  • web/src/features/alerts/pages/alerts-page/filter-alerts.ts#L3-L6: split Perspective and AggregatedAlertFilters.

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 win

Split type-only imports from runtime imports.

These changed import blocks bring type-only symbols in through regular imports. Use import type for the erased symbols:

  • web/src/features/alerts/pages/alerts-page/LabelFilter.tsx#L1-L7: FC, FormEvent, SearchInputProps, and ToolbarFilterProps.
  • 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

📥 Commits

Reviewing files that changed from the base of the PR and between 0d9faac and 35a6fc4.

📒 Files selected for processing (145)
  • web/eslint.config.ts
  • web/jest.config.js
  • web/src/features/alerts/components/AlertUtils.tsx
  • web/src/features/alerts/components/SilenceForm.tsx
  • web/src/features/alerts/components/SilencedByTable.tsx
  • web/src/features/alerts/components/SilencesUtils.tsx
  • web/src/features/alerts/pages/AlertRulesDetailsPage.tsx
  • web/src/features/alerts/pages/AlertingPage.tsx
  • web/src/features/alerts/pages/AlertsDetailsPage.tsx
  • web/src/features/alerts/pages/SilenceCreatePage.tsx
  • web/src/features/alerts/pages/SilenceEditPage.tsx
  • web/src/features/alerts/pages/SilencesDetailsPage.tsx
  • web/src/features/alerts/pages/alert-rules-page/AlertRulesPage.tsx
  • web/src/features/alerts/pages/alert-rules-page/filter-rules.spec.ts
  • web/src/features/alerts/pages/alert-rules-page/filter-rules.ts
  • web/src/features/alerts/pages/alerts-page/AggregateAlertTableRow.tsx
  • web/src/features/alerts/pages/alerts-page/AlertTableRow.tsx
  • web/src/features/alerts/pages/alerts-page/AlertsPage.tsx
  • web/src/features/alerts/pages/alerts-page/DownloadCSVButton.tsx
  • web/src/features/alerts/pages/alerts-page/LabelFilter.tsx
  • web/src/features/alerts/pages/alerts-page/agentic-runs/alert-identifier.spec.ts
  • web/src/features/alerts/pages/alerts-page/agentic-runs/alert-identifier.ts
  • web/src/features/alerts/pages/alerts-page/agentic-runs/useAgenticRunCheck.ts
  • web/src/features/alerts/pages/alerts-page/filter-alerts.spec.ts
  • web/src/features/alerts/pages/alerts-page/filter-alerts.ts
  • web/src/features/alerts/pages/silences-page/SilencesPage.tsx
  • web/src/features/alerts/pages/silences-page/filter-silences.spec.ts
  • web/src/features/alerts/pages/silences-page/filter-silences.ts
  • web/src/features/incidents/components/AlertsChart.tsx
  • web/src/features/incidents/components/IncidentAlertStateIcon.tsx
  • web/src/features/incidents/components/IncidentsChart.tsx
  • web/src/features/incidents/components/IncidentsDetailsRowTable.tsx
  • web/src/features/incidents/components/IncidentsTable.tsx
  • web/src/features/incidents/components/ToolbarItemFilter.tsx
  • web/src/features/incidents/pages/IncidentsPage.tsx
  • web/src/features/incidents/utils/api.spec.ts
  • web/src/features/incidents/utils/api.ts
  • web/src/features/incidents/utils/processAlerts.spec.ts
  • web/src/features/incidents/utils/processAlerts.ts
  • web/src/features/incidents/utils/processIncidents.spec.ts
  • web/src/features/incidents/utils/processIncidents.ts
  • web/src/features/incidents/utils/utils.ts
  • web/src/features/legacy-dashboards/components/custom-time-range-modal.tsx
  • web/src/features/legacy-dashboards/components/dashboard-skeleton-legacy.tsx
  • web/src/features/legacy-dashboards/components/error.tsx
  • web/src/features/legacy-dashboards/components/legacy-dashboard.tsx
  • web/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsx
  • web/src/features/legacy-dashboards/components/panels/bar-chart.tsx
  • web/src/features/legacy-dashboards/components/panels/graph.tsx
  • web/src/features/legacy-dashboards/components/panels/single-stat.tsx
  • web/src/features/legacy-dashboards/components/panels/table.tsx
  • web/src/features/legacy-dashboards/components/time-dropdowns.tsx
  • web/src/features/legacy-dashboards/hooks/useLegacyDashboards.ts
  • web/src/features/legacy-dashboards/hooks/useLegacyDashboardsProject.ts
  • web/src/features/legacy-dashboards/pages/legacy-dashboard-page.tsx
  • web/src/features/legacy-dashboards/utils/variable-utils.spec.ts
  • web/src/features/legacy-dashboards/utils/variable-utils.ts
  • web/src/features/metrics/components/promql-expression-input.tsx
  • web/src/features/metrics/pages/MetricsPage.tsx
  • web/src/features/metrics/pages/PrometheusRedirectPage.tsx
  • web/src/features/perses-dashboards/components/PersesWrapper.tsx
  • web/src/features/perses-dashboards/components/ToastProvider.tsx
  • web/src/features/perses-dashboards/components/dashboard-action-modals.tsx
  • web/src/features/perses-dashboards/components/dashboard-actions-menu.tsx
  • web/src/features/perses-dashboards/components/dashboard-create-dialog.tsx
  • web/src/features/perses-dashboards/components/dashboard-dialog-helpers.tsx
  • web/src/features/perses-dashboards/components/dashboard-header.tsx
  • web/src/features/perses-dashboards/components/dashboard-import-dialog.tsx
  • web/src/features/perses-dashboards/components/emptystates/DashboardEmptyState.tsx
  • web/src/features/perses-dashboards/components/emptystates/ProjectEmptyState.tsx
  • web/src/features/perses-dashboards/components/project/ProjectBar.tsx
  • web/src/features/perses-dashboards/components/project/ProjectDropdown.tsx
  • web/src/features/perses-dashboards/components/project/ProjectMenuToggle.tsx
  • web/src/features/perses-dashboards/components/project/useActiveProject.tsx
  • web/src/features/perses-dashboards/hooks/useDashboardsData.ts
  • web/src/features/perses-dashboards/hooks/useEditableProjects.ts
  • web/src/features/perses-dashboards/hooks/useOcpProjects.ts
  • web/src/features/perses-dashboards/hooks/usePerses.ts
  • web/src/features/perses-dashboards/hooks/usePersesRefreshInterval.ts
  • web/src/features/perses-dashboards/hooks/usePersesTimeRange.ts
  • web/src/features/perses-dashboards/ols-tool-ui/ShowTimeseries.tsx
  • web/src/features/perses-dashboards/ols-tool-ui/helpers/AddToDashboardButton.tsx
  • web/src/features/perses-dashboards/ols-tool-ui/helpers/OlsToolUIPersesWrapper.tsx
  • web/src/features/perses-dashboards/ols-tool-ui/helpers/useTimeRange.ts
  • web/src/features/perses-dashboards/pages/dashboard-list-page/DashboardListPage.tsx
  • web/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list-frame.tsx
  • web/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list.tsx
  • web/src/features/perses-dashboards/pages/dashboard-page/DashboardPage.tsx
  • web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx
  • web/src/features/perses-dashboards/pages/dashboard-page/dashboard-frame.tsx
  • web/src/features/perses-dashboards/pages/dashboard-page/dashboard-toolbar.tsx
  • web/src/features/perses-dashboards/pages/dashboard-page/external-panel-addition.tsx
  • web/src/features/perses-dashboards/utils/dashboard-action-validations.ts
  • web/src/features/perses-dashboards/utils/dashboard-api.ts
  • web/src/features/perses-dashboards/utils/datasource-api.ts
  • web/src/features/perses-dashboards/utils/migrate-api.ts
  • web/src/features/perses-dashboards/utils/perses-client.ts
  • web/src/features/perses-dashboards/utils/perses/datasource-client.ts
  • web/src/features/perses-dashboards/utils/perses/global-datasource-client.ts
  • web/src/features/targets/pages/targets-page.tsx
  • web/src/features/targets/utils/filter-targets.spec.ts
  • web/src/features/targets/utils/filter-targets.ts
  • web/src/shared/components/DropdownPollInterval.tsx
  • web/src/shared/components/KebabDropdown.tsx
  • web/src/shared/components/TypeaheadSelect.tsx
  • web/src/shared/components/dashboard-dropdown.tsx
  • web/src/shared/components/labels.tsx
  • web/src/shared/components/query-browser/query-browser.tsx
  • web/src/shared/components/table/TableCheckboxFilter.tsx
  • web/src/shared/components/table/TableFilters.tsx
  • web/src/shared/components/table/TableLabelFilter.tsx
  • web/src/shared/components/table/TableTextFilter.tsx
  • web/src/shared/console/console-shared/error/fallbacks/withFallback.tsx
  • web/src/shared/console/console-shared/hooks/useDocumentListener.ts
  • web/src/shared/console/console-shared/src/components/empty-state/AccessDenied.tsx
  • web/src/shared/console/console-shared/src/components/empty-state/ConsoleEmptyState.tsx
  • web/src/shared/console/console-shared/src/components/empty-state/EmptyBox.tsx
  • web/src/shared/console/console-shared/src/components/loading/LoadError.tsx
  • web/src/shared/console/console-shared/src/components/loading/LoadingBox.tsx
  • web/src/shared/console/console-shared/src/components/loading/LoadingInline.tsx
  • web/src/shared/console/console-shared/src/components/query-browser/QueryBrowserTooltip.tsx
  • web/src/shared/console/console-shared/src/components/status/StatusBox.tsx
  • web/src/shared/console/graphs/bar.tsx
  • web/src/shared/console/graphs/graph-empty.tsx
  • web/src/shared/console/graphs/helpers.ts
  • web/src/shared/console/graphs/promethues-graph.tsx
  • web/src/shared/console/public/components/autocomplete.tsx
  • web/src/shared/console/public/components/factory/text-filter.tsx
  • web/src/shared/console/utils/async.tsx
  • web/src/shared/console/utils/link.tsx
  • web/src/shared/console/utils/safe-fetch-hook.ts
  • web/src/shared/console/utils/single-typeahead-dropdown.tsx
  • web/src/shared/contexts/MonitoringContext.tsx
  • web/src/shared/hooks/useAlerts.ts
  • web/src/shared/hooks/useFeatures.ts
  • web/src/shared/hooks/useMonitoring.ts
  • web/src/shared/hooks/usePerspective.tsx
  • web/src/shared/store/actions.ts
  • web/src/shared/store/reducers.ts
  • web/src/shared/store/store.ts
  • web/src/shared/store/thunks.ts
  • web/src/shared/utils/utils.spec.ts
  • web/src/shared/utils/utils.ts
  • web/tsconfig.json
  • web/webpack.config.ts

Comment thread web/eslint.config.ts
Comment thread web/eslint.config.ts
Comment thread web/src/features/incidents/components/AlertsChart.tsx
Comment thread web/src/features/incidents/components/AlertsChart.tsx
Comment thread web/src/features/incidents/components/IncidentsDetailsRowTable.tsx
Comment thread web/src/features/metrics/pages/MetricsPage.tsx
Comment thread web/src/shared/components/query-browser/query-browser.tsx
Comment thread web/src/shared/console/graphs/bar.tsx
Comment thread web/src/shared/console/public/components/autocomplete.tsx
@PeterYurkovich

Copy link
Copy Markdown
Contributor Author

/test e2e-monitoring

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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 win

Separate 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: import DashboardResource and EphemeralDashboardResource with import type.
  • web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx#L25-L33: split ReactElement and ReactNode into a type-only React import.
  • web/src/features/incidents/components/IncidentAlertStateIcon.tsx#L3-L4: change FC to a type-only import.
  • web/src/features/perses-dashboards/hooks/useEditableProjects.ts#L1-L6: verify whether K8sResourceKind and PersesUserPermissions are type-only, then split them if so.
  • web/src/features/perses-dashboards/utils/perses/datasource-client.ts#L14-L17: import DatasourceResource with import 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

📥 Commits

Reviewing files that changed from the base of the PR and between 35a6fc4 and bb8faeb.

📒 Files selected for processing (142)
  • web/eslint.config.ts
  • web/src/features/alerts/components/AlertUtils.tsx
  • web/src/features/alerts/components/SilenceForm.tsx
  • web/src/features/alerts/components/SilencedByTable.tsx
  • web/src/features/alerts/components/SilencesUtils.tsx
  • web/src/features/alerts/pages/AlertRulesDetailsPage.tsx
  • web/src/features/alerts/pages/AlertingPage.tsx
  • web/src/features/alerts/pages/AlertsDetailsPage.tsx
  • web/src/features/alerts/pages/SilenceCreatePage.tsx
  • web/src/features/alerts/pages/SilenceEditPage.tsx
  • web/src/features/alerts/pages/SilencesDetailsPage.tsx
  • web/src/features/alerts/pages/alert-rules-page/AlertRulesPage.tsx
  • web/src/features/alerts/pages/alert-rules-page/filter-rules.spec.ts
  • web/src/features/alerts/pages/alert-rules-page/filter-rules.ts
  • web/src/features/alerts/pages/alerts-page/AggregateAlertTableRow.tsx
  • web/src/features/alerts/pages/alerts-page/AlertTableRow.tsx
  • web/src/features/alerts/pages/alerts-page/AlertsPage.tsx
  • web/src/features/alerts/pages/alerts-page/DownloadCSVButton.tsx
  • web/src/features/alerts/pages/alerts-page/LabelFilter.tsx
  • web/src/features/alerts/pages/alerts-page/agentic-runs/alert-identifier.spec.ts
  • web/src/features/alerts/pages/alerts-page/agentic-runs/alert-identifier.ts
  • web/src/features/alerts/pages/alerts-page/agentic-runs/useAgenticRunCheck.ts
  • web/src/features/alerts/pages/alerts-page/filter-alerts.spec.ts
  • web/src/features/alerts/pages/alerts-page/filter-alerts.ts
  • web/src/features/alerts/pages/silences-page/SilencesPage.tsx
  • web/src/features/alerts/pages/silences-page/filter-silences.spec.ts
  • web/src/features/alerts/pages/silences-page/filter-silences.ts
  • web/src/features/incidents/components/AlertsChart.tsx
  • web/src/features/incidents/components/IncidentAlertStateIcon.tsx
  • web/src/features/incidents/components/IncidentsChart.tsx
  • web/src/features/incidents/components/IncidentsDetailsRowTable.tsx
  • web/src/features/incidents/components/IncidentsTable.tsx
  • web/src/features/incidents/components/ToolbarItemFilter.tsx
  • web/src/features/incidents/pages/IncidentsPage.tsx
  • web/src/features/incidents/utils/api.spec.ts
  • web/src/features/incidents/utils/api.ts
  • web/src/features/incidents/utils/processAlerts.spec.ts
  • web/src/features/incidents/utils/processAlerts.ts
  • web/src/features/incidents/utils/processIncidents.spec.ts
  • web/src/features/incidents/utils/processIncidents.ts
  • web/src/features/incidents/utils/utils.ts
  • web/src/features/legacy-dashboards/components/custom-time-range-modal.tsx
  • web/src/features/legacy-dashboards/components/dashboard-skeleton-legacy.tsx
  • web/src/features/legacy-dashboards/components/error.tsx
  • web/src/features/legacy-dashboards/components/legacy-dashboard.tsx
  • web/src/features/legacy-dashboards/components/legacy-variable-dropdowns.tsx
  • web/src/features/legacy-dashboards/components/panels/bar-chart.tsx
  • web/src/features/legacy-dashboards/components/panels/graph.tsx
  • web/src/features/legacy-dashboards/components/panels/single-stat.tsx
  • web/src/features/legacy-dashboards/components/panels/table.tsx
  • web/src/features/legacy-dashboards/components/time-dropdowns.tsx
  • web/src/features/legacy-dashboards/hooks/useLegacyDashboards.ts
  • web/src/features/legacy-dashboards/hooks/useLegacyDashboardsProject.ts
  • web/src/features/legacy-dashboards/pages/legacy-dashboard-page.tsx
  • web/src/features/legacy-dashboards/utils/variable-utils.spec.ts
  • web/src/features/legacy-dashboards/utils/variable-utils.ts
  • web/src/features/metrics/components/promql-expression-input.tsx
  • web/src/features/metrics/pages/MetricsPage.tsx
  • web/src/features/metrics/pages/PrometheusRedirectPage.tsx
  • web/src/features/perses-dashboards/components/PersesWrapper.tsx
  • web/src/features/perses-dashboards/components/ToastProvider.tsx
  • web/src/features/perses-dashboards/components/dashboard-action-modals.tsx
  • web/src/features/perses-dashboards/components/dashboard-actions-menu.tsx
  • web/src/features/perses-dashboards/components/dashboard-create-dialog.tsx
  • web/src/features/perses-dashboards/components/dashboard-dialog-helpers.tsx
  • web/src/features/perses-dashboards/components/dashboard-header.tsx
  • web/src/features/perses-dashboards/components/dashboard-import-dialog.tsx
  • web/src/features/perses-dashboards/components/emptystates/DashboardEmptyState.tsx
  • web/src/features/perses-dashboards/components/emptystates/ProjectEmptyState.tsx
  • web/src/features/perses-dashboards/components/project/ProjectBar.tsx
  • web/src/features/perses-dashboards/components/project/ProjectDropdown.tsx
  • web/src/features/perses-dashboards/components/project/ProjectMenuToggle.tsx
  • web/src/features/perses-dashboards/components/project/useActiveProject.tsx
  • web/src/features/perses-dashboards/hooks/useDashboardsData.ts
  • web/src/features/perses-dashboards/hooks/useEditableProjects.ts
  • web/src/features/perses-dashboards/hooks/useOcpProjects.ts
  • web/src/features/perses-dashboards/hooks/usePerses.ts
  • web/src/features/perses-dashboards/hooks/usePersesRefreshInterval.ts
  • web/src/features/perses-dashboards/hooks/usePersesTimeRange.ts
  • web/src/features/perses-dashboards/ols-tool-ui/ShowTimeseries.tsx
  • web/src/features/perses-dashboards/ols-tool-ui/helpers/AddToDashboardButton.tsx
  • web/src/features/perses-dashboards/ols-tool-ui/helpers/OlsToolUIPersesWrapper.tsx
  • web/src/features/perses-dashboards/ols-tool-ui/helpers/useTimeRange.ts
  • web/src/features/perses-dashboards/pages/dashboard-list-page/DashboardListPage.tsx
  • web/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list-frame.tsx
  • web/src/features/perses-dashboards/pages/dashboard-list-page/dashboard-list.tsx
  • web/src/features/perses-dashboards/pages/dashboard-page/DashboardPage.tsx
  • web/src/features/perses-dashboards/pages/dashboard-page/dashboard-app.tsx
  • web/src/features/perses-dashboards/pages/dashboard-page/dashboard-frame.tsx
  • web/src/features/perses-dashboards/pages/dashboard-page/dashboard-toolbar.tsx
  • web/src/features/perses-dashboards/pages/dashboard-page/external-panel-addition.tsx
  • web/src/features/perses-dashboards/utils/dashboard-action-validations.ts
  • web/src/features/perses-dashboards/utils/dashboard-api.ts
  • web/src/features/perses-dashboards/utils/datasource-api.ts
  • web/src/features/perses-dashboards/utils/migrate-api.ts
  • web/src/features/perses-dashboards/utils/perses-client.ts
  • web/src/features/perses-dashboards/utils/perses/datasource-client.ts
  • web/src/features/perses-dashboards/utils/perses/global-datasource-client.ts
  • web/src/features/targets/pages/targets-page.tsx
  • web/src/features/targets/utils/filter-targets.spec.ts
  • web/src/features/targets/utils/filter-targets.ts
  • web/src/shared/components/DropdownPollInterval.tsx
  • web/src/shared/components/KebabDropdown.tsx
  • web/src/shared/components/TypeaheadSelect.tsx
  • web/src/shared/components/dashboard-dropdown.tsx
  • web/src/shared/components/labels.tsx
  • web/src/shared/components/query-browser/query-browser.tsx
  • web/src/shared/components/table/TableCheckboxFilter.tsx
  • web/src/shared/components/table/TableFilters.tsx
  • web/src/shared/components/table/TableLabelFilter.tsx
  • web/src/shared/components/table/TableTextFilter.tsx
  • web/src/shared/console/console-shared/error/fallbacks/withFallback.tsx
  • web/src/shared/console/console-shared/hooks/useDocumentListener.ts
  • web/src/shared/console/console-shared/src/components/empty-state/AccessDenied.tsx
  • web/src/shared/console/console-shared/src/components/empty-state/ConsoleEmptyState.tsx
  • web/src/shared/console/console-shared/src/components/empty-state/EmptyBox.tsx
  • web/src/shared/console/console-shared/src/components/loading/LoadError.tsx
  • web/src/shared/console/console-shared/src/components/loading/LoadingBox.tsx
  • web/src/shared/console/console-shared/src/components/loading/LoadingInline.tsx
  • web/src/shared/console/console-shared/src/components/query-browser/QueryBrowserTooltip.tsx
  • web/src/shared/console/console-shared/src/components/status/StatusBox.tsx
  • web/src/shared/console/graphs/bar.tsx
  • web/src/shared/console/graphs/graph-empty.tsx
  • web/src/shared/console/graphs/helpers.ts
  • web/src/shared/console/graphs/promethues-graph.tsx
  • web/src/shared/console/public/components/autocomplete.tsx
  • web/src/shared/console/public/components/factory/text-filter.tsx
  • web/src/shared/console/utils/async.tsx
  • web/src/shared/console/utils/link.tsx
  • web/src/shared/console/utils/safe-fetch-hook.ts
  • web/src/shared/console/utils/single-typeahead-dropdown.tsx
  • web/src/shared/contexts/MonitoringContext.tsx
  • web/src/shared/hooks/useAlerts.ts
  • web/src/shared/hooks/useFeatures.ts
  • web/src/shared/hooks/useMonitoring.ts
  • web/src/shared/hooks/usePerspective.tsx
  • web/src/shared/store/actions.ts
  • web/src/shared/store/reducers.ts
  • web/src/shared/store/store.ts
  • web/src/shared/store/thunks.ts
  • web/src/shared/utils/utils.spec.ts
  • web/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

Comment thread web/src/features/incidents/components/IncidentsTable.tsx
Comment thread web/src/shared/components/query-browser/query-browser.tsx
Comment thread web/src/shared/components/query-browser/query-browser.tsx
@openshift-ci

openshift-ci Bot commented Jul 15, 2026

Copy link
Copy Markdown
Contributor

@PeterYurkovich: all tests passed!

Full PR test history. Your PR dashboard.

Details

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 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';

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we differentiate between actual packages starting with @ like Patternfly vs local references by using:

Suggested change
import { FormatSeriesTitle, QueryBrowser } from '@shared/components/query-browser/query-browser';
import { FormatSeriesTitle, QueryBrowser } from '@/shared/components/query-browser/query-browser';

?

Comment thread web/tsconfig.json
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@shared/*": ["src/shared/*"]

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should we alias src instead?

Suggested change
"@shared/*": ["src/shared/*"]
"@/*": ["src/*"]

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

approved Indicates a PR has been approved by an approver from all required OWNERS files. jira/valid-reference Indicates that this PR references a valid Jira ticket of any type.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants