Skip to content

upcoming: [DI-27317] - Onboarding Object Storage service to Alerts UI#12910

Merged
nikhagra-akamai merged 7 commits intolinode:developfrom
santoshp210-akamai:feature/alerts-objectstorage-onboarding
Sep 30, 2025
Merged

upcoming: [DI-27317] - Onboarding Object Storage service to Alerts UI#12910
nikhagra-akamai merged 7 commits intolinode:developfrom
santoshp210-akamai:feature/alerts-objectstorage-onboarding

Conversation

@santoshp210-akamai
Copy link
Contributor

Description 📝

Object storage service integration for Alerts UI

Changes 🔄

List any change(s) relevant to the reviewer.

  • Util to offline filter object storage resources to have the supportedRegions
  • New component : AlertsEndpointFilter
  • Necessary changes to integrate object storage with the existing AlertsResources component
  • UTs for the utils

Scope 🚢

Upon production release, changes in this PR will be visible to:

  • All customers
  • Some customers (e.g. in Beta or Limited Availability)
  • No customers / Not applicable

Target release date 🗓️

October 1st

Preview 📷

Alert Flow Screen Recording
Create Flow
ObjectStorage-Alert-UI.mp4
Show-Details Flow
ObjectStorage-Alert-ShowDetails.mp4
Edit Flow
ObjectStorage-Alert-Edit.mp4

Object Storage Alert Creation Payload

image

How to test 🧪

Prerequisites

(How to setup test environment)

  • Enable MSW and choose Legacy MSW Handler as Base Preset
  • Go to Alerts , under Monitor
  • Click on Create Alert to test the behaviour in Create flow
  • Search for Object Storage - testing alert in the Alerts List . Click on Show-Details/Edit to test the show-details and edit flow respectively.

The current mocks only mock the serviceType, endpoints and buckets API Calls. The metric-definitions call for object-storage is not updated in mocks, it will be done in the upcoming object-storage related PRs.

Reproduction steps

(How to reproduce the issue, if applicable)

  • ...
  • ...

Verification steps

(How to verify changes)

  • Create Flow is working as show-cased in the recording
  • Show Details Flow is working as show-cased in the recording
  • Edit Flow is working as show-cased in the recording
Author Checklists

As an Author, to speed up the review process, I considered 🤔

👀 Doing a self review
❔ Our contribution guidelines
🤏 Splitting feature into small PRs
➕ Adding a changeset
🧪 Providing/improving test coverage
🔐 Removing all sensitive information from the code and PR description
🚩 Using a feature flag to protect the release
👣 Providing comprehensive reproduction steps
📑 Providing or updating our documentation
🕛 Scheduling a pair reviewing session
📱 Providing mobile support
♿ Providing accessibility support


  • I have read and considered all applicable items listed above.

As an Author, before moving this PR from Draft to Open, I confirmed ✅

  • All tests and CI checks are passing
  • TypeScript compilation succeeded without errors
  • Code passes all linting rules

@santoshp210-akamai
Copy link
Contributor Author

santoshp210-akamai commented Sep 24, 2025

This PR may contains some changes that were introduced in previous ACLP PRs. Please prioritize these PRs before this PR is merged: #12891, #12905, #12912

Some of the code changes in this PR might be dependent on future PRs for Metrics-Object Storage Onboarding, Alerts - Object Storage Dimension Filters, etc

type: AlertFilterKey
) => void;
}

Copy link
Contributor

Choose a reason for hiding this comment

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

Suggested change
interface EndpointOption {
label: string;
}

(props: AlertsEndpointFilterProps) => {
const { handleFilterChange: handleSelection, endpointOptions } = props;
const [selectedEndpoints, setSelectedEndpoints] = React.useState<
{ label: string }[]
Copy link
Contributor

Choose a reason for hiding this comment

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

Suggested change
{ label: string }[]
EndpointOption[]

}));

const handleFilterSelection = React.useCallback(
(_: React.SyntheticEvent, endpoints: { label: string }[]) => {
Copy link
Contributor

Choose a reason for hiding this comment

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

Suggested change
(_: React.SyntheticEvent, endpoints: { label: string }[]) => {
(_: React.SyntheticEvent, endpoints: EndpointOption[]) => {

const [selectedEndpoints, setSelectedEndpoints] = React.useState<
{ label: string }[]
>([]);
const endpointBuiltOptions = endpointOptions.map((option) => ({
Copy link
Contributor

Choose a reason for hiding this comment

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

Suggested change
const endpointBuiltOptions = endpointOptions.map((option) => ({
const endpointBuiltOptions: EndpointOption[] = endpointOptions.map((option) => ({

) => void;
}

export const AlertsEndpointFilter = React.memo(
Copy link
Contributor

Choose a reason for hiding this comment

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

are we not handling any error state in this component?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

@nikhagra-akamai , We are creating the endpoints from the buckets API call in AlertsResources. If we receive error AlertsResources component will show the error state.

@github-project-automation github-project-automation bot moved this from Review to Changes Requested in Cloud Manager Sep 29, 2025
@github-project-automation github-project-automation bot moved this from Changes Requested to Approved in Cloud Manager Sep 29, 2025
queryFn: () => getAllBuckets(),
queryKey: [
...objectStorageQueries.endpoints.queryKey,
objectStorageQueries.buckets.queryKey[1],
Copy link
Contributor

Choose a reason for hiding this comment

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

This is a bit confusing -- objectStorageQueries.buckets.queryKey is null?

Copy link
Contributor Author

@santoshp210-akamai santoshp210-akamai Sep 30, 2025

Choose a reason for hiding this comment

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

@dwiley-akamai , Yeah it is confusing. In the queryKeyFactory they are keeping both the queryFn and queryKey as null. But in useObjectStorageBuckets hook. They are passing objectStorageQueryies.buckets.queryKey as the queryKey.

So we also are using the similar approach.

image

As shown in the screenshot here, the key value is as expected.

@linode-gh-bot
Copy link
Collaborator

Cloud Manager UI test results

🔺 1 failing test on test run #7 ↗︎

❌ Failing✅ Passing↪️ Skipped🕐 Duration
1 Failing827 Passing11 Skipped42m 56s

Details

Failing Tests
SpecTest
clone-linode.spec.tsCloud Manager Cypress Tests→clone linode » can clone a Linode from Linode details page

Troubleshooting

Use this command to re-run the failing tests:

pnpm cy:run -s "cypress/e2e/core/linodes/clone-linode.spec.ts"

@nikhagra-akamai nikhagra-akamai merged commit ea3390a into linode:develop Sep 30, 2025
34 of 35 checks passed
@github-project-automation github-project-automation bot moved this from Approved to Merged in Cloud Manager Sep 30, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

Archived in project

Development

Successfully merging this pull request may close these issues.

5 participants