Resize comparison table with slider #3480
Conversation
sroy3
changed the title
![codeclimate[bot]](https://avatars.githubusercontent.com/in/9403?s=60&v=4){kind=small}
| import { PlotsContainer } from '../PlotsContainer' | ||
| import { PlotsState } from '../../store' | ||
|
|
||
| export const ComparisonTableWrapper: React.FC = () => { | ||
| const { nbItemsPerRow, isCollapsed, height } = useSelector( | ||
| const { width, isCollapsed, height, plots } = useSelector( |
There was a problem hiding this comment.
Similar blocks of code found in 3 locations. Consider refactoring.
| @@ -6,6 +6,12 @@ export const withScale = (scale: number) => | |||
| HTMLDivElement | |||
| >) | |||
|
|
|||
| export const withVariant = (variant: number) => | |||
There was a problem hiding this comment.
Similar blocks of code found in 2 locations. Consider refactoring.
|
Sorry for the renaming, it just made more sense that way. The main parts of the change are found in |
|
Sticky slider collides with comparison header:
Can the slider/ribbon fill the space on the RHS?
Will both of the above be fixed by the section having its own scrollbar? Edit: With pinned column
|
| @@ -56,7 +56,7 @@ export type CustomPlotsOrderValue = { metric: string; param: string } | |||
| export class PlotsModel extends ModelWithPersistence { | |||
| private readonly experiments: Experiments | |||
|
|
|||
| private nbItemsPerRow: Record<PlotsSection, number> | |||
| private nbItemsPerRowOrWidth: Record<PlotsSection, number> | |||
There was a problem hiding this comment.
[Q] Do these need to be stored together?
There was a problem hiding this comment.
Was debating this, but they function the exact same way it's just that one cannot be called nbItemsPerRow. Separating them would probably mean checking whether it has one property or another multiple times.
The sticky header colliding is easy to fix now. Same for the pinned column. The header taking the full width will be easier with the local scrollbar (next item on my list), else we'll end up with sliders past smaller sections. |
|
Code Climate has analyzed commit b524c59 and detected 7 issues on this pull request. Here's the issue category breakdown:
The test coverage on the diff in this pull request is 86.9% (85% is the threshold). This pull request will bring the total coverage in the repository to 95.7% (0.0% change). View more on Code Climate. |
Part of #2585
Screen.Recording.2023-03-16.at.1.04.03.PM.mov