feat: added celery task feature - with task graphs and details #6840

SagarRajput-7 · 2025-01-17T03:22:21Z

Summary

Added Celery Task Page

Related Issues / PR's

Screenshots

Screen.Recording.2025-01-27.at.4.25.44.AM.mov

Affected Areas and Manually Tested Areas

Important

Adds Celery task management feature with new components, routes, and styles for task configuration, detail view, and graph display.

Behavior:
- Adds CeleryTask page with task graphs and details in CeleryTask.tsx.
- Introduces CeleryTaskConfigOptions, CeleryTaskDetail, and CeleryTaskGraphGrid components for task configuration, detail view, and graph display.
- Implements task filtering and URL query management in CeleryUtils.ts.
Routing:
- Adds new route MESSAGING_QUEUES_CELERY_TASK in routes.ts and integrates it into AppLayout and SideNav.
- Updates MessagingQueuesMainPage.tsx to include a tab for Celery tasks.
Styles:
- Adds styles for Celery task components in CeleryTask.styles.scss.
- Updates MessagingQueues.styles.scss and MessagingQueuesMainPage.styles.scss for new layout.
Misc:
- Updates GridCard, PanelWrapper, and GridTableComponent to support new graph and table functionalities.
- Adds permissions for new route in permission/index.ts.

^{This description was created by}^{for acb2731. It will automatically update as commits are pushed.}

github-actions · 2025-01-17T03:22:36Z

Build Error! No Linked Issue found. Please link an issue or mention it in the body using #<issue_id>

github-actions · 2025-01-17T03:22:53Z

Build Error! No Linked Issue found. Please link an issue or mention it in the body using #<issue_id>

ellipsis-dev

❌ Changes requested. Reviewed everything up to 593d666 in 1 minute and 18 seconds

More details

Looked at 1154 lines of code in 22 files
Skipped 0 files when reviewing.
Skipped posting 3 drafted comments based on config settings.

1. frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskGraph.tsx:57

Draft comment:
Remove the console.log statement to clean up the code for production.

```

Reason this comment was not posted:
Marked as duplicate.

2. frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskGraph.tsx:47

Draft comment:
Avoid using inline styles for the Card component. Use external stylesheets or styled components instead.
Reason this comment was not posted:
Marked as duplicate.

3. frontend/src/components/CeleryTask/CeleryTaskConfigOptions/CeleryTaskConfigOptions.tsx:66

Draft comment:
Avoid using inline styles for the Button component. Use external stylesheets or styled components instead.
Reason this comment was not posted:
Marked as duplicate.

Workflow ID: wflow_G1Qngh0GJjKTSYsC

Want Ellipsis to fix these issues? Tag @ellipsis-dev in a comment. You can customize Ellipsis with 👍 / 👎 feedback, review rules, user-specific overrides, quiet mode, and more.

frontend/src/components/CeleryTask/CeleryTaskDetail/CeleryTaskDetail.tsx

github-actions · 2025-01-17T05:46:40Z

Build Error! No Linked Issue found. Please link an issue or mention it in the body using #<issue_id>

github-actions · 2025-01-17T05:47:32Z

Build Error! No Linked Issue found. Please link an issue or mention it in the body using #<issue_id>

ellipsis-dev

👍 Looks good to me! Incremental review on 69988a1 in 1 minute and 2 seconds

More details

Looked at 184 lines of code in 4 files
Skipped 0 files when reviewing.
Skipped posting 3 drafted comments based on config settings.

1. frontend/src/components/CeleryTask/CeleryTaskDetail/CeleryTaskDetail.tsx:28

Draft comment:
Remove the console.log statement to clean up the code.

Reason this comment was not posted:
Comment looked like it was already resolved.

2. frontend/src/components/CeleryTask/CeleryTaskDetail/CeleryTaskDetail.tsx:26

Draft comment:
Avoid using inline styles. Consider using external stylesheets, CSS classes, or styled components instead.
Reason this comment was not posted:
Comment was not on a valid diff hunk.

3. frontend/src/components/CeleryTask/CeleryTaskGraph/CeleryTaskGraph.style.scss:64

Draft comment:
Use design tokens or predefined color constants instead of hardcoding color values to maintain consistency in design and theming. This is also applicable to lines 51, 60, 75, 82, and 92.
Reason this comment was not posted:
Comment looked like it was already resolved.

Workflow ID: wflow_STQTbl1b8q63NvaN

You can customize Ellipsis with 👍 / 👎 feedback, review rules, user-specific overrides, quiet mode, and more.

shivanshuraj1333 · 2025-01-23T19:06:09Z

Let's remove the attributes, and only show values

shivanshuraj1333 · 2025-01-23T19:06:40Z

Also, can we use the color theme according to design for different states?

github-actions · 2025-01-23T19:27:58Z

Build Error! No Linked Issue found. Please link an issue or mention it in the body using #<issue_id>

github-actions · 2025-01-26T22:59:28Z

Build Error! No Linked Issue found. Please link an issue or mention it in the body using #<issue_id>

github-actions · 2025-01-26T23:03:42Z

Build Error! No Linked Issue found. Please link an issue or mention it in the body using #<issue_id>

ellipsis-dev

👍 Looks good to me! Reviewed everything up to 10812f5 in 1 minute and 38 seconds

More details

Looked at 3377 lines of code in 45 files
Skipped 0 files when reviewing.
Skipped posting 5 drafted comments based on config settings.

1. frontend/src/AppRoutes/routes.ts:3

Draft comment:

import MessagingQueuesMainPage from 'pages/MessagingQueues';

Reason this comment was not posted:
Marked as duplicate.

2. frontend/src/AppRoutes/routes.ts:28

Draft comment:

	MessagingQueuesMainPage,

Reason this comment was not posted:
Marked as duplicate.

3. frontend/src/AppRoutes/pageComponents.ts:229

Draft comment:

export const MessagingQueuesMainPage = Loadable(
  () =>
    import(/* webpackChunkName: "MessagingQueues" */ 'pages/MessagingQueues/MessagingQueuesMainPage'),
);

Reason this comment was not posted:
Comment was on unchanged code.

4. frontend/src/pages/Celery/CeleryTask/CeleryTask.styles.scss:17

Draft comment:
Use design tokens or predefined color constants instead of hardcoding color values for consistency. This is also applicable in other parts of the stylesheet.
Reason this comment was not posted:
Comment looked like it was already resolved.

5. frontend/src/pages/MessagingQueues/MessagingQueuesMainPage.styles.scss:16

Draft comment:
Use design tokens or predefined color constants instead of hardcoding color values for consistency. This is also applicable in other parts of the stylesheet.
Reason this comment was not posted:
Marked as duplicate.

Workflow ID: wflow_2uxlzWLc4pOPA8x1

You can customize Ellipsis with 👍 / 👎 feedback, review rules, user-specific overrides, quiet mode, and more.

github-actions · 2025-01-26T23:13:26Z

Build Error! No Linked Issue found. Please link an issue or mention it in the body using #<issue_id>

ellipsis-dev

👍 Looks good to me! Incremental review on acb2731 in 37 seconds

More details

Looked at 13 lines of code in 1 files
Skipped 0 files when reviewing.
Skipped posting 2 drafted comments based on config settings.

1. frontend/src/pages/MessagingQueues/MessagingQueues.styles.scss:96

Draft comment:
Avoid using !important as it can lead to specificity issues. Consider refactoring the CSS to achieve the desired styling without it.
Reason this comment was not posted:
Decided after close inspection that this draft comment was likely wrong and/or not actionable:
The comment raises a valid CSS best practice about avoiding !important. However, sometimes !important is necessary to override third-party styles or deal with specificity conflicts. Without seeing why this !important was added or what styles it's overriding, we can't be certain it's incorrect. The author likely had a specific reason for adding it.
I may be too quick to assume the !important is justified - it could be masking a deeper architectural issue that should be fixed properly. Also, this is a UI-related change which the rules say to generally trust the author on.
While the comment raises a valid point, the rules specifically state to trust the author on UI changes and not to make purely informative comments. The author likely had a reason for using !important here.
Delete this comment since it relates to UI styling which we should trust the author on, and is more of an informative best practice than a clear issue requiring change.

2. frontend/src/pages/MessagingQueues/MessagingQueues.styles.scss:96

Draft comment:
Avoid using !important in CSS as it makes styles difficult to override and maintain.
Reason this comment was not posted:
Marked as duplicate.

Workflow ID: wflow_AxpQKsOPAR2mezGI

You can customize Ellipsis with 👍 / 👎 feedback, review rules, user-specific overrides, quiet mode, and more.

SagarRajput-7 requested a review from YounixM as a code owner January 17, 2025 03:22

github-actions bot added docs required enhancement New feature or request labels Jan 17, 2025

ellipsis-dev bot reviewed Jan 17, 2025

View reviewed changes

frontend/src/components/CeleryTask/CeleryTaskDetail/CeleryTaskDetail.tsx Outdated Show resolved Hide resolved

frontend/src/components/CeleryTask/CeleryTaskDetail/CeleryTaskDetail.tsx Show resolved Hide resolved

ellipsis-dev bot reviewed Jan 17, 2025

View reviewed changes

SagarRajput-7 marked this pull request as draft January 20, 2025 06:24

SagarRajput-7 force-pushed the celery-task branch from 7a6b6be to 5516cd5 Compare January 23, 2025 18:02

SagarRajput-7 force-pushed the celery-task branch from 84d4b4e to bbd651c Compare January 24, 2025 04:08

SagarRajput-7 added 7 commits January 26, 2025 22:29

feat: added celery task feature - with task garphs and details

bfc920a

feat: added celery bar graph toggle states UI

04a8b6f

feat: added histogram charts and right panel

e982607

feat: added task latency graph with different states

01793f0

feat: added right panel trace navigation

a9fe7cc

feat: added navigateToTrace logic

a0e059e

feat: added value graph and global filter logic

e784fba

SagarRajput-7 force-pushed the celery-task branch from cbd4221 to e784fba Compare January 26, 2025 16:59

SagarRajput-7 added 5 commits January 26, 2025 23:53

feat: added dynamic stepinterval based on timerange

bf1102c

feat: changed histogram occurences to bar

42f9afd

feat: onclick right panels for celery state bar graphs

ac9f2cf

feat: pagesetup and tabs with kafka setup

b3dc0dc

feat: custom series for bar for color generation

0bf2a84

feat: fixed test cases

10812f5

SagarRajput-7 marked this pull request as ready for review January 26, 2025 23:03

SagarRajput-7 requested a review from srikanthccv as a code owner January 26, 2025 23:03

SagarRajput-7 added docs not required and removed docs required labels Jan 26, 2025

ellipsis-dev bot reviewed Jan 26, 2025

View reviewed changes

feat: update styles

acb2731

ellipsis-dev bot reviewed Jan 26, 2025

View reviewed changes

amlannandy approved these changes Jan 27, 2025

View reviewed changes

SagarRajput-7 merged commit e83e691 into main Jan 27, 2025
16 of 18 checks passed

SagarRajput-7 deleted the celery-task branch January 27, 2025 03:23

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: added celery task feature - with task graphs and details #6840

feat: added celery task feature - with task graphs and details #6840

SagarRajput-7 commented Jan 17, 2025 •

edited by ellipsis-dev bot

Loading

github-actions bot commented Jan 17, 2025

github-actions bot commented Jan 17, 2025

ellipsis-dev bot left a comment

github-actions bot commented Jan 17, 2025

github-actions bot commented Jan 17, 2025

ellipsis-dev bot left a comment

shivanshuraj1333 commented Jan 23, 2025

shivanshuraj1333 commented Jan 23, 2025

github-actions bot commented Jan 23, 2025

github-actions bot commented Jan 26, 2025

github-actions bot commented Jan 26, 2025

ellipsis-dev bot left a comment

github-actions bot commented Jan 26, 2025

ellipsis-dev bot left a comment

feat: added celery task feature - with task graphs and details #6840

feat: added celery task feature - with task graphs and details #6840

Conversation

SagarRajput-7 commented Jan 17, 2025 • edited by ellipsis-dev bot Loading

Summary

Related Issues / PR's

Screenshots

Affected Areas and Manually Tested Areas

github-actions bot commented Jan 17, 2025

github-actions bot commented Jan 17, 2025

ellipsis-dev bot left a comment

Choose a reason for hiding this comment

github-actions bot commented Jan 17, 2025

github-actions bot commented Jan 17, 2025

ellipsis-dev bot left a comment

Choose a reason for hiding this comment

shivanshuraj1333 commented Jan 23, 2025

shivanshuraj1333 commented Jan 23, 2025

github-actions bot commented Jan 23, 2025

github-actions bot commented Jan 26, 2025

github-actions bot commented Jan 26, 2025

ellipsis-dev bot left a comment

Choose a reason for hiding this comment

github-actions bot commented Jan 26, 2025

ellipsis-dev bot left a comment

Choose a reason for hiding this comment

SagarRajput-7 commented Jan 17, 2025 •

edited by ellipsis-dev bot

Loading