Skip to content

upcoming: [DI-22916] - Added group by drawer component - #12843

Merged
nikhagra-akamai merged 26 commits into
linode:developfrom
nikhagra-akamai:feature/group-by
Sep 11, 2025
Merged

upcoming: [DI-22916] - Added group by drawer component#12843
nikhagra-akamai merged 26 commits into
linode:developfrom
nikhagra-akamai:feature/group-by

Conversation

@nikhagra-akamai

@nikhagra-akamai nikhagra-akamai commented Sep 9, 2025

Copy link
Copy Markdown
Contributor

Description 📝

Added a group by drawer component for ACLP Metric UI

Changes 🔄

List any change(s) relevant to the reviewer.

  1. Created a CloudPulseGroupByDrawer component
  2. Created a useGroupByDimension hook to fetch the options

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 🗓️

23rd September

Preview 📷

Note

This PR does not contains any visual changes. But added a component for new functionality that will be added in next PRs
This is the mockup for this feature: https://www.figma.com/design/2x7VRVdgrjegSJ5lFxoKMv/Standard-Dashboards?node-id=12858-53465&t=Hi2JXFU1Se2Vhlc4-0

How to test 🧪

  1. Switch to mock user and go to metrics tab
  2. Use below piece of code anywhere in GlobalFilters component to visualize the drawer
  3. You can use useGlobalDimensions hook to generate the options from mock data.

<CloudPulseGroupByDrawer defaultValue={[]} message={'Message'} onApply={(value) => {}} onCancel={() => {}} open={true} options={[]} serviceType="dbaas" subtitle="SubTitle" title="Global Group By" />

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

@nikhagra-akamai
nikhagra-akamai requested a review from a team as a code owner September 9, 2025 14:17
@nikhagra-akamai
nikhagra-akamai requested review from cpathipa and mjac0bs and removed request for a team September 9, 2025 14:17
return { options: [], defaultValue: [], isLoading: true };
}

const metricDimensions: GroupByOption[] =

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.

@nikhagra-akamai , lets add describing comments for the methods in this hook

@venkymano-akamai venkymano-akamai left a comment

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.

LGTM, Lets add describing comments for the methods in the hook that is created

Comment thread packages/manager/src/features/CloudPulse/GroupBy/CloudPulseGroupByDrawer.tsx Outdated
Comment thread packages/manager/src/features/CloudPulse/GroupBy/CloudPulseGroupByDrawer.tsx Outdated
Comment thread packages/manager/src/features/CloudPulse/GroupBy/CloudPulseGroupByDrawer.tsx Outdated
Comment thread packages/manager/src/features/CloudPulse/GroupBy/useGroupByDimension.ts Outdated

@mjac0bs mjac0bs left a comment

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.

Thanks for addressing feedback, @nikhagra-akamai.

>
{subtitle}
</Typography>
<Typography sx={(theme) => ({ font: theme.font.normal })}>

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.

Suggested change
<Typography sx={(theme) => ({ font: theme.font.normal })}>
<Typography>

nit: The font is already normal-sized without this styling rule since it's regular Typography text.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

updated thanks

@github-project-automation github-project-automation Bot moved this from Review to Approved in Cloud Manager Sep 11, 2025
@mjac0bs mjac0bs added Approved Multiple approvals and ready to merge! and removed Ready for Review labels Sep 11, 2025
@linode-gh-bot

Copy link
Copy Markdown

Cloud Manager UI test results

🎉 746 passing tests on test run #11 ↗︎

❌ Failing✅ Passing↪️ Skipped🕐 Duration
0 Failing746 Passing9 Skipped39m 26s

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

Labels

Approved Multiple approvals and ready to merge! Cloud Pulse - Dashboards Cloud Pulse

Projects

Archived in project

Development

Successfully merging this pull request may close these issues.

4 participants