feat: variables support to pass current selected time for URL drilldown #3693
Conversation
WalkthroughRecent updates to the project enhance the functionality of the dashboard components by improving the handling of time selections and user documentation. The Changes
Possibly related PRs
Tip OpenAI O1 model for chat
Recent review detailsConfiguration used: CodeRabbit UI Files selected for processing (2)
Additional comments not posted (5)
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Additional comments not posted (3)
web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (2)
54-71: Ensure the new instructions are clear and accurate.The added instructions for using the current selected time period variables (
${start_time}and${end_time}) are clear and well-documented. This should help users effectively utilize these variables in their drilldown configurations.
Line range hint
72-102: Review the added instructions for series name, value, and table chart drilldown variables.The instructions for using series name and value variables, as well as table chart drilldown variables, are comprehensive and well-explained. This addition will enhance user understanding of how to apply these variables in different contexts.
web/src/components/dashboards/PanelSchemaRenderer.vue (1)
560-567: Validate the conversion of selected time to milliseconds.The conversion of
selectedTimeObjto milliseconds forstart_timeandend_timeis implemented correctly. This ensures that the time values are accurately passed to the drilldown URLs, which is crucial for maintaining the integrity of time-based data in drilldown scenarios.
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (1)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
Files skipped from review as they are similar to previous changes (1)
- web/src/components/dashboards/PanelSchemaRenderer.vue
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
83ad470
to
e4221bf
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review as they are similar to previous changes (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
e4221bf
to
222b366
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review as they are similar to previous changes (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
222b366
to
b77fde6
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review as they are similar to previous changes (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
b77fde6
to
1a4d4a4
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review as they are similar to previous changes (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
1a4d4a4
to
3528314
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review as they are similar to previous changes (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
3528314
to
9430dae
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review as they are similar to previous changes (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
ktx-vaidehi
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
9430dae
to
ae2b171
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review as they are similar to previous changes (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
ae2b171
to
f165fe6
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review as they are similar to previous changes (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
f165fe6
to
69d70b5
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review as they are similar to previous changes (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
69d70b5
to
61a89c0
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review due to trivial changes (1)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
Additional comments not posted (2)
web/src/components/dashboards/PanelSchemaRenderer.vue (2)
563-571: Ensure proper date validation and conversion for start time.The logic correctly checks if
selectedTimeObj?.value?.start_timeis a valid date and converts it to a Unix timestamp. This ensures that only valid dates are processed.
573-580: Ensure proper date validation and conversion for end time.The logic correctly checks if
selectedTimeObj?.value?.end_timeis a valid date and converts it to a Unix timestamp. This ensures that only valid dates are processed.
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
61a89c0
to
b86a18a
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review due to trivial changes (1)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
b86a18a
to
265acfb
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Files skipped from review as they are similar to previous changes (1)
- web/src/components/dashboards/PanelSchemaRenderer.vue
Additional comments not posted (4)
web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (4)
54-71: Clear and informative section on using the current selected time period.The addition of this section enhances the user guide by explaining how to use dynamic variables for time periods in URL drilldowns. The examples provided are clear and should help users understand how to implement this feature.
Line range hint
72-82: Well-structured section on using series name and value.This section effectively communicates how to use series name and value variables in drilldowns. The format is consistent with other parts of the guide, and the examples are practical and easy to understand.
Line range hint
83-102: Detailed section for table chart drilldown.The explanations and examples in this section are thorough and provide clear guidance on how to use row field and index for table chart drilldowns. This should be very helpful for users working with table charts.
Line range hint
102-120: Comprehensive guide for Sankey chart drilldown.This section is well-structured and offers detailed instructions on how to utilize edge and node variables in Sankey chart drilldowns. The format and examples align well with the rest of the guide, ensuring a seamless user experience.
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
265acfb
to
549aa9d
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Additional comments not posted (3)
web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3)
52-70: LGTM! Documentation on using current selected time period is clear and informative.The added documentation effectively explains how to reference the current selected time period using
${start_time}and${end_time}.
Line range hint
72-83:
LGTM! Documentation on using series name and value is clear and informative.The added documentation effectively explains how to reference the series name and value using
${series.__name}and${series.__value}.
101-102: LGTM! Documentation on using row field and index for table chart drilldown is clear and informative.The added documentation effectively explains how to reference the row field and index using
${row.field["field_label"]},${row.field.field_label}, and${row.index}.
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
549aa9d
to
ad0f8e7
Compare
There was a problem hiding this comment.
Actionable comments posted: 1
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Additional comments not posted (1)
web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (1)
52-70: LGTM! The added section is clear and informative.The instructions, examples, and notes are well-integrated and enhance the usability of the guide.
| // selected start time and end time | ||
| if ( | ||
| selectedTimeObj?.value?.start_time && | ||
| selectedTimeObj?.value?.start_time != "Invalid Date" | ||
| ) { | ||
| drilldownVariables.start_time = new Date( | ||
| selectedTimeObj?.value?.start_time?.toISOString() | ||
| ).getTime(); | ||
| } | ||
|
|
||
| if ( | ||
| selectedTimeObj?.value?.end_time && | ||
| selectedTimeObj?.value?.end_time != "Invalid Date" | ||
| ) { | ||
| drilldownVariables.end_time = new Date( | ||
| selectedTimeObj?.value?.end_time?.toISOString() | ||
| ).getTime(); | ||
| } |
There was a problem hiding this comment.
Optimize the conditions for setting start and end times.
The conditions for checking and converting start and end times can be combined to reduce redundancy.
- if (
- selectedTimeObj?.value?.start_time &&
- selectedTimeObj?.value?.start_time != "Invalid Date"
- ) {
- drilldownVariables.start_time = new Date(
- selectedTimeObj?.value?.start_time?.toISOString()
- ).getTime();
- }
-
- if (
- selectedTimeObj?.value?.end_time &&
- selectedTimeObj?.value?.end_time != "Invalid Date"
- ) {
- drilldownVariables.end_time = new Date(
- selectedTimeObj?.value?.end_time?.toISOString()
- ).getTime();
- }
+ const { start_time, end_time } = selectedTimeObj?.value ?? {};
+ if (start_time && start_time != "Invalid Date") {
+ drilldownVariables.start_time = new Date(start_time.toISOString()).getTime();
+ }
+ if (end_time && end_time != "Invalid Date") {
+ drilldownVariables.end_time = new Date(end_time.toISOString()).getTime();
+ }Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| // selected start time and end time | |
| if ( | |
| selectedTimeObj?.value?.start_time && | |
| selectedTimeObj?.value?.start_time != "Invalid Date" | |
| ) { | |
| drilldownVariables.start_time = new Date( | |
| selectedTimeObj?.value?.start_time?.toISOString() | |
| ).getTime(); | |
| } | |
| if ( | |
| selectedTimeObj?.value?.end_time && | |
| selectedTimeObj?.value?.end_time != "Invalid Date" | |
| ) { | |
| drilldownVariables.end_time = new Date( | |
| selectedTimeObj?.value?.end_time?.toISOString() | |
| ).getTime(); | |
| } | |
| // selected start time and end time | |
| const { start_time, end_time } = selectedTimeObj?.value ?? {}; | |
| if (start_time && start_time != "Invalid Date") { | |
| drilldownVariables.start_time = new Date(start_time.toISOString()).getTime(); | |
| } | |
| if (end_time && end_time != "Invalid Date") { | |
| drilldownVariables.end_time = new Date(end_time.toISOString()).getTime(); | |
| } |
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
ad0f8e7
to
13526ae
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Additional comments not posted (2)
web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (1)
54-70: Documentation improvements look great!The added sections clearly explain how to use the
${start_time}and${end_time}variables. The examples and notes improve user understanding.web/src/components/dashboards/PanelSchemaRenderer.vue (1)
588-605: Optimize the conditions for setting start and end times.The conditions for checking and converting start and end times can be combined to reduce redundancy.
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
13526ae
to
e9676f3
Compare
There was a problem hiding this comment.
Actionable comments posted: 0
Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files selected for processing (2)
- web/src/components/dashboards/PanelSchemaRenderer.vue (1 hunks)
- web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (3 hunks)
Additional comments not posted (5)
web/src/components/dashboards/addPanel/DrilldownUserGuide.vue (4)
54-70: Documentation update is clear and helpful.The explanation of
${start_time}and${end_time}variables is well-written and provides a clear example for users. The formatting enhances readability.
Line range hint
72-80: Series name and value documentation is clear.The instructions for using
${series.__name}and${series.__value}are well-explained and consistent with the rest of the guide.
Line range hint
82-100: Table chart drilldown instructions are well-explained.The examples for using
${row.field["field_label"]}and${row.index}are clear and provide effective guidance for users.
Line range hint
102-119: Sankey chart drilldown documentation is comprehensive.The instructions for using
${edge.__source},${edge.__target},${node.__name}, etc., are detailed and consistent with the document's style.web/src/components/dashboards/PanelSchemaRenderer.vue (1)
588-605: Optimize the conditions for setting start and end times.The existing logic is correct, but as previously suggested, the conditions can be combined to reduce redundancy. Consider implementing the suggested optimization.
ktx-abhay
force-pushed
the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
from
e9676f3
to
5b03ce2
Compare
ktx-abhay
deleted the
feat/variables-support-to-pass-current-selected-time-for-drilldown
branch
User Guide
Example:
Summary by CodeRabbit
New Features
Bug Fixes