Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Feature/metrics plots in experiment tracking (#1102)
* Add top-level tabs and logic to switch the content Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Position sticky the tabs for horizontal visibility Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update component comments; small refactor; hide accordion header in Plots tab Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add a MetricsPlots component with the chart-types tab system Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Create query for tracking metrics (#1150) * Add MetricPlotType Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add MetricPlotType as a strawberry enum type Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add option to limit results for get_all_runs Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add endpoint for metric data Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add implementations for formatting metrics data Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Refactor run_metrics_data query to return a MetricDataset Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add MetricDataset type Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Remove MetricPlotType type Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Refactor format_run_metric_data Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add run_metrics_data to schema Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add doc strings Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add MetricDataset to schema Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add pylint ignore Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Modify runs and metrics initialisation to use .values() Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Remove unused import Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Refactor metric naming not to account for dataset name 'root' Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add end-to-end test for the runMetricsData query Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Rename MetricDataset to MetricPlotDataset to avoid confusion with MetricsDataSet Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Rename MetricDataset to MetricPlotDataset in schema Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Add type hints for runs and metrics in _initialise_metric_data_template Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> * Refactor return type of runMetricsData query Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * Add metric plot data query on front-end (#1176) * Feature/parallel chart (#1152) * mock-data Signed-off-by: huongg <huongg1409@gmail.com> * base for parallel metrics chart Signed-off-by: huongg <huongg1409@gmail.com> * linePath component Signed-off-by: huongg <huongg1409@gmail.com> * pass selectedId from the run list Signed-off-by: huongg <huongg1409@gmail.com> * useContext to control hover state Signed-off-by: huongg <huongg1409@gmail.com> * simplify hover Context Signed-off-by: huongg <huongg1409@gmail.com> * move ticks and marker to component Signed-off-by: huongg <huongg1409@gmail.com> * install d3 v7 Signed-off-by: huongg <huongg1409@gmail.com> * remove unused comment Signed-off-by: huongg <huongg1409@gmail.com> * move yAxis to be inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * use d3 hook in linePath instead Signed-off-by: huongg <huongg1409@gmail.com> * include comments for hooks and context Signed-off-by: huongg <huongg1409@gmail.com> * remove disable eslint Signed-off-by: huongg <huongg1409@gmail.com> * use css colour variables Signed-off-by: huongg <huongg1409@gmail.com> * set up ignore pattern for jest test with d3 Signed-off-by: huongg <huongg1409@gmail.com> * testing rendering yAxis inside component Signed-off-by: huongg <huongg1409@gmail.com> * render axisG inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * hover vertical line Signed-off-by: huongg <huongg1409@gmail.com> * use graph to render ticks Signed-off-by: huongg <huongg1409@gmail.com> * dont render ticks if selected Signed-off-by: huongg <huongg1409@gmail.com> * resiale for svg Signed-off-by: huongg <huongg1409@gmail.com> * tooltip for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update styling Signed-off-by: huongg <huongg1409@gmail.com> * render ticks on the left side Signed-off-by: huongg <huongg1409@gmail.com> * remove tooltip Signed-off-by: huongg <huongg1409@gmail.com> * highlight value over line Signed-off-by: huongg <huongg1409@gmail.com> * set viewbox for svg container Signed-off-by: huongg <huongg1409@gmail.com> * draw another line on the top when highlight Signed-off-by: huongg <huongg1409@gmail.com> * mock context for run-list-card tests Signed-off-by: huongg <huongg1409@gmail.com> * test for run-list Signed-off-by: huongg <huongg1409@gmail.com> * increase stroke width for line path Signed-off-by: huongg <huongg1409@gmail.com> * update props names and comments Signed-off-by: huongg <huongg1409@gmail.com> * tidy up styling for the chart Signed-off-by: huongg <huongg1409@gmail.com> * include unique key Signed-off-by: huongg <huongg1409@gmail.com> * assign uuid for fragment Signed-off-by: huongg <huongg1409@gmail.com> * increase the gap between header and the yaxis Signed-off-by: huongg <huongg1409@gmail.com> * Use d3.selection.raise to avoid redrawing lines; adjust spacing of svg Signed-off-by: Tynan DeBold <thdebold@gmail.com> * group colours into variable Signed-off-by: huongg <huongg1409@gmail.com> * removed unused unhoveredData Signed-off-by: huongg <huongg1409@gmail.com> * put back the insertZeroWidthSpace(text) for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * fixing the gap between y-axis Signed-off-by: huongg <huongg1409@gmail.com> * center the text vs the line Signed-off-by: huongg <huongg1409@gmail.com> * render ticks first Signed-off-by: huongg <huongg1409@gmail.com> * useMouseLeave instead mouseOut Signed-off-by: huongg <huongg1409@gmail.com> * render unique values for Yaxis Signed-off-by: huongg <huongg1409@gmail.com> * render line first then value for ticks later Signed-off-by: huongg <huongg1409@gmail.com> * dont render line if value is null Signed-off-by: huongg <huongg1409@gmail.com> * remove line stroke to be 1.5 Signed-off-by: huongg <huongg1409@gmail.com> * remove selected values as no longer needs it Signed-off-by: huongg <huongg1409@gmail.com> * increase the bottom gap for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update colour according to the design Signed-off-by: huongg <huongg1409@gmail.com> * update the right colour code in line-path Signed-off-by: huongg <huongg1409@gmail.com> * Size the chart to the available area; axis labels being drawn twice though (need to fix) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Yaxis ompimization Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Better default values for state to fix console error Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add a jest.config.js file to the test-lib app Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove that config; add transformIgnorePatterns object to jest object in package file of test project Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add more patterns to transformIgnorePatterns Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Slight edit to the pattern Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Document error: d3 or plain JS? Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Revert (not a problem with plain document) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Memoize the graphKeys value Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove transformIgnorePatterns in test lib Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add jest property back to package.json Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update bg colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Wire up the query to get the real data Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Don't pad the yAxis top and bottom; round the numbers to four sig. digits Signed-off-by: Tynan DeBold <thdebold@gmail.com> * dont render the first and last line of value Signed-off-by: huongg <huongg1409@gmail.com> * Style fixes Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update light-theme colors with new design Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Cursor: pointer on metric lines; cleanup Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Feature/parallel chart tooltip (#1186) * first draft of the tooltip Signed-off-by: huongg <huongg1409@gmail.com> * create share tooltip for chart Signed-off-by: huongg <huongg1409@gmail.com> * set timeout to show tooltip Signed-off-by: huongg <huongg1409@gmail.com> * remove LinePath component as it no longer needs Signed-off-by: huongg <huongg1409@gmail.com> * remove unused styling Signed-off-by: huongg <huongg1409@gmail.com> * styling sorting Signed-off-by: huongg <huongg1409@gmail.com> * set default props for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * use css to fadein tooltip instead timeout Signed-off-by: huongg <huongg1409@gmail.com> * not to reset opacity after the animation Signed-off-by: huongg <huongg1409@gmail.com> * sorting Co-authored-by: Tynan DeBold <thdebold@gmail.com> * sorting props Co-authored-by: Tynan DeBold <thdebold@gmail.com> * set tooltip to default value on mouseout Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * pull the latest changes Signed-off-by: huongg <huongg1409@gmail.com> * formate date Signed-off-by: huongg <huongg1409@gmail.com> * use sidebarWidth from the config Signed-off-by: huongg <huongg1409@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * Slight refactor and improvements to D3 element groupings Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Tooltip light theme colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Clearer variable naming Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Clearer naming; use real data again Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: rashidakanchwala <37628668+rashidakanchwala@users.noreply.github.com> * Intergrate time series (#1181) * Time series tooltip (#1192) * mock-data Signed-off-by: huongg <huongg1409@gmail.com> * base for parallel metrics chart Signed-off-by: huongg <huongg1409@gmail.com> * linePath component Signed-off-by: huongg <huongg1409@gmail.com> * pass selectedId from the run list Signed-off-by: huongg <huongg1409@gmail.com> * useContext to control hover state Signed-off-by: huongg <huongg1409@gmail.com> * simplify hover Context Signed-off-by: huongg <huongg1409@gmail.com> * move ticks and marker to component Signed-off-by: huongg <huongg1409@gmail.com> * install d3 v7 Signed-off-by: huongg <huongg1409@gmail.com> * remove unused comment Signed-off-by: huongg <huongg1409@gmail.com> * move yAxis to be inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * use d3 hook in linePath instead Signed-off-by: huongg <huongg1409@gmail.com> * include comments for hooks and context Signed-off-by: huongg <huongg1409@gmail.com> * remove disable eslint Signed-off-by: huongg <huongg1409@gmail.com> * use css colour variables Signed-off-by: huongg <huongg1409@gmail.com> * set up ignore pattern for jest test with d3 Signed-off-by: huongg <huongg1409@gmail.com> * testing rendering yAxis inside component Signed-off-by: huongg <huongg1409@gmail.com> * render axisG inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * hover vertical line Signed-off-by: huongg <huongg1409@gmail.com> * use graph to render ticks Signed-off-by: huongg <huongg1409@gmail.com> * dont render ticks if selected Signed-off-by: huongg <huongg1409@gmail.com> * resiale for svg Signed-off-by: huongg <huongg1409@gmail.com> * tooltip for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update styling Signed-off-by: huongg <huongg1409@gmail.com> * render ticks on the left side Signed-off-by: huongg <huongg1409@gmail.com> * remove tooltip Signed-off-by: huongg <huongg1409@gmail.com> * highlight value over line Signed-off-by: huongg <huongg1409@gmail.com> * set viewbox for svg container Signed-off-by: huongg <huongg1409@gmail.com> * draw another line on the top when highlight Signed-off-by: huongg <huongg1409@gmail.com> * mock context for run-list-card tests Signed-off-by: huongg <huongg1409@gmail.com> * test for run-list Signed-off-by: huongg <huongg1409@gmail.com> * increase stroke width for line path Signed-off-by: huongg <huongg1409@gmail.com> * update props names and comments Signed-off-by: huongg <huongg1409@gmail.com> * tidy up styling for the chart Signed-off-by: huongg <huongg1409@gmail.com> * include unique key Signed-off-by: huongg <huongg1409@gmail.com> * assign uuid for fragment Signed-off-by: huongg <huongg1409@gmail.com> * increase the gap between header and the yaxis Signed-off-by: huongg <huongg1409@gmail.com> * Use d3.selection.raise to avoid redrawing lines; adjust spacing of svg Signed-off-by: Tynan DeBold <thdebold@gmail.com> * group colours into variable Signed-off-by: huongg <huongg1409@gmail.com> * removed unused unhoveredData Signed-off-by: huongg <huongg1409@gmail.com> * put back the insertZeroWidthSpace(text) for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * fixing the gap between y-axis Signed-off-by: huongg <huongg1409@gmail.com> * center the text vs the line Signed-off-by: huongg <huongg1409@gmail.com> * render ticks first Signed-off-by: huongg <huongg1409@gmail.com> * useMouseLeave instead mouseOut Signed-off-by: huongg <huongg1409@gmail.com> * render unique values for Yaxis Signed-off-by: huongg <huongg1409@gmail.com> * render line first then value for ticks later Signed-off-by: huongg <huongg1409@gmail.com> * dont render line if value is null Signed-off-by: huongg <huongg1409@gmail.com> * remove line stroke to be 1.5 Signed-off-by: huongg <huongg1409@gmail.com> * remove selected values as no longer needs it Signed-off-by: huongg <huongg1409@gmail.com> * increase the bottom gap for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update colour according to the design Signed-off-by: huongg <huongg1409@gmail.com> * update the right colour code in line-path Signed-off-by: huongg <huongg1409@gmail.com> * Size the chart to the available area; axis labels being drawn twice though (need to fix) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Yaxis ompimization Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Better default values for state to fix console error Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add a jest.config.js file to the test-lib app Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove that config; add transformIgnorePatterns object to jest object in package file of test project Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add more patterns to transformIgnorePatterns Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Slight edit to the pattern Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Document error: d3 or plain JS? Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Revert (not a problem with plain document) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Memoize the graphKeys value Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove transformIgnorePatterns in test lib Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add jest property back to package.json Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update bg colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Wire up the query to get the real data Signed-off-by: Tynan DeBold <thdebold@gmail.com> * WIP * Don't pad the yAxis top and bottom; round the numbers to four sig. digits Signed-off-by: Tynan DeBold <thdebold@gmail.com> * call-yaxis-on-parellel * dont render the first and last line of value Signed-off-by: huongg <huongg1409@gmail.com> * hovering and all * Style fixes Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update light-theme colors with new design Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Cursor: pointer on metric lines; cleanup Signed-off-by: Tynan DeBold <thdebold@gmail.com> * first draft of the tooltip Signed-off-by: huongg <huongg1409@gmail.com> * Add scroll and reposition the charts Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * css and hovering * create share tooltip for chart Signed-off-by: huongg <huongg1409@gmail.com> * clean-up * set timeout to show tooltip Signed-off-by: huongg <huongg1409@gmail.com> * remove LinePath component as it no longer needs Signed-off-by: huongg <huongg1409@gmail.com> * remove unused styling Signed-off-by: huongg <huongg1409@gmail.com> * styling sorting Signed-off-by: huongg <huongg1409@gmail.com> * now tooltip left * set default props for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * Feature/parallel chart tooltip (#1186) * first draft of the tooltip Signed-off-by: huongg <huongg1409@gmail.com> * create share tooltip for chart Signed-off-by: huongg <huongg1409@gmail.com> * set timeout to show tooltip Signed-off-by: huongg <huongg1409@gmail.com> * remove LinePath component as it no longer needs Signed-off-by: huongg <huongg1409@gmail.com> * remove unused styling Signed-off-by: huongg <huongg1409@gmail.com> * styling sorting Signed-off-by: huongg <huongg1409@gmail.com> * set default props for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * use css to fadein tooltip instead timeout Signed-off-by: huongg <huongg1409@gmail.com> * not to reset opacity after the animation Signed-off-by: huongg <huongg1409@gmail.com> * sorting Co-authored-by: Tynan DeBold <thdebold@gmail.com> * sorting props Co-authored-by: Tynan DeBold <thdebold@gmail.com> * set tooltip to default value on mouseout Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * pull the latest changes Signed-off-by: huongg <huongg1409@gmail.com> * formate date Signed-off-by: huongg <huongg1409@gmail.com> * use sidebarWidth from the config Signed-off-by: huongg <huongg1409@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * Slight refactor and improvements to D3 element groupings Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Tooltip light theme colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * connected to real data * tooltip in time series Signed-off-by: huongg <huongg1409@gmail.com> * util func to get position Signed-off-by: huongg <huongg1409@gmail.com> * adjust the left and right gap Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: rashidakanchwala <37628668+rashidakanchwala@users.noreply.github.com> Co-authored-by: Rashida Kanchwala <rashida_kanchwala@mckinsey.com> Co-authored-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Feature/final touches on metrics plots (#1195) * Raise parallel coordinates plot lines; start on runs list cards active indicators Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update runs-list-card.test.js Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Show matching indicators in runs list cards Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update metric line color, dark theme, par. coords Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Metric axis hover tweaks, par. coords. Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add run selection indicators to run metadata area Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Rearrange order of colors for selected runs on time series Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Metric label shortening and tooltip text lengthening Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Limit the number of runs when displaying metrics plots Signed-off-by: Tynan DeBold <thdebold@gmail.com> * fix for wrong highlight on value and tick Signed-off-by: huongg <huongg1409@gmail.com> * Typo fix and comment improvement Signed-off-by: Tynan DeBold <thdebold@gmail.com> * eliminating all the lines, values, ticks that are not highlighted Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Co-authored-by: huongg <huongg1409@gmail.com> * update the right colour code for selectedMarkerColors Signed-off-by: huongg <huongg1409@gmail.com> * Add zoom to timeseries (#1191) * mock-data Signed-off-by: huongg <huongg1409@gmail.com> * base for parallel metrics chart Signed-off-by: huongg <huongg1409@gmail.com> * linePath component Signed-off-by: huongg <huongg1409@gmail.com> * pass selectedId from the run list Signed-off-by: huongg <huongg1409@gmail.com> * useContext to control hover state Signed-off-by: huongg <huongg1409@gmail.com> * simplify hover Context Signed-off-by: huongg <huongg1409@gmail.com> * move ticks and marker to component Signed-off-by: huongg <huongg1409@gmail.com> * install d3 v7 Signed-off-by: huongg <huongg1409@gmail.com> * remove unused comment Signed-off-by: huongg <huongg1409@gmail.com> * move yAxis to be inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * use d3 hook in linePath instead Signed-off-by: huongg <huongg1409@gmail.com> * include comments for hooks and context Signed-off-by: huongg <huongg1409@gmail.com> * remove disable eslint Signed-off-by: huongg <huongg1409@gmail.com> * use css colour variables Signed-off-by: huongg <huongg1409@gmail.com> * set up ignore pattern for jest test with d3 Signed-off-by: huongg <huongg1409@gmail.com> * testing rendering yAxis inside component Signed-off-by: huongg <huongg1409@gmail.com> * render axisG inside useEffect Signed-off-by: huongg <huongg1409@gmail.com> * hover vertical line Signed-off-by: huongg <huongg1409@gmail.com> * use graph to render ticks Signed-off-by: huongg <huongg1409@gmail.com> * dont render ticks if selected Signed-off-by: huongg <huongg1409@gmail.com> * resiale for svg Signed-off-by: huongg <huongg1409@gmail.com> * tooltip for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update styling Signed-off-by: huongg <huongg1409@gmail.com> * render ticks on the left side Signed-off-by: huongg <huongg1409@gmail.com> * remove tooltip Signed-off-by: huongg <huongg1409@gmail.com> * highlight value over line Signed-off-by: huongg <huongg1409@gmail.com> * set viewbox for svg container Signed-off-by: huongg <huongg1409@gmail.com> * draw another line on the top when highlight Signed-off-by: huongg <huongg1409@gmail.com> * mock context for run-list-card tests Signed-off-by: huongg <huongg1409@gmail.com> * test for run-list Signed-off-by: huongg <huongg1409@gmail.com> * increase stroke width for line path Signed-off-by: huongg <huongg1409@gmail.com> * update props names and comments Signed-off-by: huongg <huongg1409@gmail.com> * tidy up styling for the chart Signed-off-by: huongg <huongg1409@gmail.com> * include unique key Signed-off-by: huongg <huongg1409@gmail.com> * assign uuid for fragment Signed-off-by: huongg <huongg1409@gmail.com> * increase the gap between header and the yaxis Signed-off-by: huongg <huongg1409@gmail.com> * Use d3.selection.raise to avoid redrawing lines; adjust spacing of svg Signed-off-by: Tynan DeBold <thdebold@gmail.com> * group colours into variable Signed-off-by: huongg <huongg1409@gmail.com> * removed unused unhoveredData Signed-off-by: huongg <huongg1409@gmail.com> * put back the insertZeroWidthSpace(text) for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * fixing the gap between y-axis Signed-off-by: huongg <huongg1409@gmail.com> * center the text vs the line Signed-off-by: huongg <huongg1409@gmail.com> * render ticks first Signed-off-by: huongg <huongg1409@gmail.com> * useMouseLeave instead mouseOut Signed-off-by: huongg <huongg1409@gmail.com> * render unique values for Yaxis Signed-off-by: huongg <huongg1409@gmail.com> * render line first then value for ticks later Signed-off-by: huongg <huongg1409@gmail.com> * dont render line if value is null Signed-off-by: huongg <huongg1409@gmail.com> * remove line stroke to be 1.5 Signed-off-by: huongg <huongg1409@gmail.com> * remove selected values as no longer needs it Signed-off-by: huongg <huongg1409@gmail.com> * increase the bottom gap for the chart Signed-off-by: huongg <huongg1409@gmail.com> * update colour according to the design Signed-off-by: huongg <huongg1409@gmail.com> * update the right colour code in line-path Signed-off-by: huongg <huongg1409@gmail.com> * Size the chart to the available area; axis labels being drawn twice though (need to fix) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Yaxis ompimization Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Better default values for state to fix console error Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add a jest.config.js file to the test-lib app Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove that config; add transformIgnorePatterns object to jest object in package file of test project Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add more patterns to transformIgnorePatterns Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Slight edit to the pattern Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Document error: d3 or plain JS? Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Revert (not a problem with plain document) Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Memoize the graphKeys value Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove transformIgnorePatterns in test lib Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add jest property back to package.json Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update bg colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Wire up the query to get the real data Signed-off-by: Tynan DeBold <thdebold@gmail.com> * WIP * Don't pad the yAxis top and bottom; round the numbers to four sig. digits Signed-off-by: Tynan DeBold <thdebold@gmail.com> * call-yaxis-on-parellel * dont render the first and last line of value Signed-off-by: huongg <huongg1409@gmail.com> * hovering and all * Style fixes Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update light-theme colors with new design Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Cursor: pointer on metric lines; cleanup Signed-off-by: Tynan DeBold <thdebold@gmail.com> * first draft of the tooltip Signed-off-by: huongg <huongg1409@gmail.com> * Add scroll and reposition the charts Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * css and hovering * create share tooltip for chart Signed-off-by: huongg <huongg1409@gmail.com> * clean-up * set timeout to show tooltip Signed-off-by: huongg <huongg1409@gmail.com> * remove LinePath component as it no longer needs Signed-off-by: huongg <huongg1409@gmail.com> * remove unused styling Signed-off-by: huongg <huongg1409@gmail.com> * styling sorting Signed-off-by: huongg <huongg1409@gmail.com> * now tooltip left * set default props for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * Feature/parallel chart tooltip (#1186) * first draft of the tooltip Signed-off-by: huongg <huongg1409@gmail.com> * create share tooltip for chart Signed-off-by: huongg <huongg1409@gmail.com> * set timeout to show tooltip Signed-off-by: huongg <huongg1409@gmail.com> * remove LinePath component as it no longer needs Signed-off-by: huongg <huongg1409@gmail.com> * remove unused styling Signed-off-by: huongg <huongg1409@gmail.com> * styling sorting Signed-off-by: huongg <huongg1409@gmail.com> * set default props for tooltip Signed-off-by: huongg <huongg1409@gmail.com> * use css to fadein tooltip instead timeout Signed-off-by: huongg <huongg1409@gmail.com> * not to reset opacity after the animation Signed-off-by: huongg <huongg1409@gmail.com> * sorting Co-authored-by: Tynan DeBold <thdebold@gmail.com> * sorting props Co-authored-by: Tynan DeBold <thdebold@gmail.com> * set tooltip to default value on mouseout Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * declare variable on the top Co-authored-by: Tynan DeBold <thdebold@gmail.com> * pull the latest changes Signed-off-by: huongg <huongg1409@gmail.com> * formate date Signed-off-by: huongg <huongg1409@gmail.com> * use sidebarWidth from the config Signed-off-by: huongg <huongg1409@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update label name Co-authored-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * Slight refactor and improvements to D3 element groupings Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Tooltip light theme colors Signed-off-by: Tynan DeBold <thdebold@gmail.com> * connected to real data * Add zoom to timeseries Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * call zoom on x-axis Signed-off-by: huongg <huongg1409@gmail.com> * Add path on zoom update Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * reference line zoom -WIP * Add dottedLinePath to updateZoom Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * SelectedLine add to zoom Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add id to path for selectedLine Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Zoom functionality finally works with all chart elements Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add brush to zoom Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add transition on xAxis values Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Fix default position to be above xAxis - selected area Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * fix merge issue * Use selectAll instead of select - brush to be applied on all charts Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add selectAll to one more place Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * fixes for zoom * Reset zoom when new run is selected Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Clear comments Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Chnaged color and class renamed Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Format the component Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add default value to rangeSelection Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add minified d3 build to jest Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Changed jest transformIgnorePatterns Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * change it back as it was jest - transformIgnorePatterns Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add d3-brush to jest Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add d3-zoom to jest Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * add all Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * revert last changes Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Repositioned brush Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: rashidakanchwala <37628668+rashidakanchwala@users.noreply.github.com> Co-authored-by: Rashida Kanchwala <rashida_kanchwala@mckinsey.com> Co-authored-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * bring brush to back so hover functionality works * handle nulls (#1199) * Dynamically set the width of parallel coords plot when there are many metrics Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Demo data with more metrics (#1202) * added more metrics for nicer looking data * Update rf_score.json * Update rf_score.json * Take metric name from end instead of beginning Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * Hook up the query again for parallel coordinates Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Add spacing to last time series chart Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Feature/parallel coords tests (#1200) * tests use cases Signed-off-by: huongg <huongg1409@gmail.com> * test for graph metrics Signed-off-by: huongg <huongg1409@gmail.com> * create util function to get unique values Signed-off-by: huongg <huongg1409@gmail.com> * test for hover interaction Signed-off-by: huongg <huongg1409@gmail.com> * tests for single and comparison mode run Signed-off-by: huongg <huongg1409@gmail.com> * test for hovering metric Signed-off-by: huongg <huongg1409@gmail.com> * test for showing tooltip Signed-off-by: huongg <huongg1409@gmail.com> * text is highlighted once from the metrics Signed-off-by: huongg <huongg1409@gmail.com> * move setChartWidth and Height to the parents component Signed-off-by: huongg <huongg1409@gmail.com> * include mock selected Runs Signed-off-by: huongg <huongg1409@gmail.com> * set default value to 0 if xScale or yScale returns a NaN Signed-off-by: huongg <huongg1409@gmail.com> * use metricsLimit for the tests Signed-off-by: huongg <huongg1409@gmail.com> * update variable name Co-authored-by: Tynan DeBold <thdebold@gmail.com> * update variable names Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> Co-authored-by: Tynan DeBold <thdebold@gmail.com> * include ignore pattern in the package.json inside test-lib/react-app (#1203) Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: huongg <huongg1409@gmail.com> * Use mock data so Mackay can test Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Fix small SCSS warning messages Signed-off-by: Tynan DeBold <thdebold@gmail.com> * fix-color-names * Time series - tests (#1198) * First test case scenarios - wip Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * add test for 'renders without crashing' - wip Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add tests Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * update tests descriptions Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add test for the tooltip Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add test for 'blend' class Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Use mockData for selectedRuns Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add variable for hoveredMockValue and update test descriptions Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Fix test scenarios for '--blend' class when hoveredElementId is null Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add test for ordered selectedGroup Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add default chart width to remove the errors Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Update tests for 'blend' class Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Update hovered run line test Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add one more test case for applied blend class Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add test for dblclick event Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Clear code Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Formatted code Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Add clipPath for selected zoom area (#1204) * Add clipPath for selected zoom area Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Fix brush clipPath dimensions Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Sorted props Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> * Improve the Demo Data so it can show a better metric timeline (#1209) * Small refactor and update Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Style update on run comparison to ensure hidden title can't be selected Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove dummy data Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Remove session store before merge Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update release notes Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Update session store with Rashida's nice examples Signed-off-by: Tynan DeBold <thdebold@gmail.com> * Max metrics to 50; small warning added for runs without plots Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: Tynan DeBold <thdebold@gmail.com> Signed-off-by: Jannic Holzer <jannic.holzer@quantumblack.com> Signed-off-by: huongg <huongg1409@gmail.com> Signed-off-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Co-authored-by: Jannic <37243923+jmholzer@users.noreply.github.com> Co-authored-by: rashidakanchwala <37628668+rashidakanchwala@users.noreply.github.com> Co-authored-by: Huong Nguyen <32060364+Huongg@users.noreply.github.com> Co-authored-by: Rashida Kanchwala <rashida_kanchwala@mckinsey.com> Co-authored-by: Cvetanka <cventanka_nechevska@external.mckinsey.com> Co-authored-by: huongg <huongg1409@gmail.com> Co-authored-by: Cvetanka Nechevska <88193161+cvetankanechevska@users.noreply.github.com>
- Loading branch information
8 people
authored
Jan 18, 2023
1 parent
7a3672c
commit 193cbb9
