piyushraj001 opened a new pull request, #45520: URL: https://github.com/apache/superset/pull/45520
## SUMMARY Extends the HTML-based `TimeseriesLegend`, introduced in #43314 for Top/Bottom orientations, to support Left and Right orientations when the legend type is List (Plain). Previously, Left and Right List legends used the ECharts canvas legend, which could wrap into multiple columns and overlap the chart plot and y-axis labels when many series were present. **What changed:** - Updated the `usesCustomLegend` condition in `transformProps.ts` to include Left and Right orientations for Plain legends. - Extended `TimeseriesCustomLegend` to support all four `LegendOrientation` values. - Added a `maxWidth` prop to `TimeseriesLegend` and implemented a vertical layout with label truncation for Left/Right legends. - Added `getTimeseriesLegendMaxWidth()` in `EchartsTimeseries` to cap the width of Left/Right legends at 40% of the chart width. Fixes #45490 ## BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF **Before:** Left/Right List legends could wrap into multiple columns and overlap the chart plot and y-axis labels. <img width="1880" height="980" alt="678292167-14da274c-61f9-4c16-8eb6-42c9b26c5931" src="https://github.com/user-attachments/assets/72e6c57c-ffc2-4810-9ddf-c673e627e1a5"; /> <img width="1880" height="980" alt="678292356-24fa90bd-c6ed-4d12-a6bb-636bda75166e" src="https://github.com/user-attachments/assets/201b6ed9-d0f9-470d-adeb-9dcad1022765"; /> **After:** The custom HTML legend renders in a bounded vertical column beside the plot, with truncated labels and scrolling. <img width="585" height="385" alt="after list + right" src="https://github.com/user-attachments/assets/4a1853a5-15f2-46ad-9699-285515f6697b"; /> <img width="556" height="370" alt="after list + left" src="https://github.com/user-attachments/assets/971ba22d-5f36-4f9a-a0d3-56b8db9c364b"; /> ## TESTING INSTRUCTIONS 1. TypeScript check passed. 2. EchartsTimeseries tests: 59 passed. 3. Legend layout / series tests: 122 passed. 4. Some transformers.test.ts tests encountered a jsdom ECharts canvas mock issue (measureText not implemented); these were not counted among the passing tests. ## ADDITIONAL INFORMATION - [x] Has associated issue: Fixes #45490 - [ ] Required feature flags - [x] Changes UI - [ ] Includes DB Migration - [ ] Introduces new feature or API - [ ] Removes existing feature or API -- This is an automated message from the Apache Git Service. To respond to the message, please log on to GitHub and use the URL above to go to the specific comment. To unsubscribe, e-mail: [email protected] For queries about this service, please contact Infrastructure at: [email protected] --------------------------------------------------------------------- To unsubscribe, e-mail: [email protected] For additional commands, e-mail: [email protected]
