Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Waitp 1316 Chart table #4720

Merged
merged 10 commits into from
Jul 12, 2023
Merged

Conversation

alexd-bes
Copy link
Contributor

Issue WAITP-1316: Chart table

Changes:

  • Updated Chart component to have toggle buttons and table option when enlarged
  • Removed forced heights of responsive recharts containers, to let it be handled by recharts

Screenshots:

Screenshot 2023-07-11 at 2 09 49 pm

(dashboard: DashboardsResponse) => dashboard.dashboardName === dashboardName,
) || dashboards[0];
data?.find((dashboard: DashboardsResponse) => dashboard.dashboardName === dashboardName) ||
data[0];
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This was because I was getting some weird TS errors, and this fixed it

${({ theme }) => {
let hexString = theme.palette.text.primary.replace('#', '');
hexString = hexString.length === 3 ? hexString.replace(/(.)/g, '$1$1') : hexString;
return `#${hexString}33`;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This seems a bit clunky to me and maybe a bit fragile too as the primary text color could be 3 digit hex, 6 digit hex or also rgba which is what it is actually by default in the default theme. Maybe we could use lighten instead?

display: flex;
position: relative;
align-content: stretch;
-webkit-box-align: stretch;
align-items: stretch;
height: ${({ $isEnlarged, $hasData }) => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this line is fine- just noticed that webkit selector above which is now redundant.

Copy link
Contributor

@tcaiger tcaiger left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice work. I left a tiny suggestion about the color on the tabs but that's an optional change

@alexd-bes alexd-bes merged commit 8079aa2 into epic-frontend-rewrite Jul 12, 2023
@alexd-bes alexd-bes deleted the waitp-1316-map-flippa-table branch July 12, 2023 01:25
tcaiger pushed a commit that referenced this pull request Jul 12, 2023
* WAITP-1216: tab buttons

* WIP

* Rename files

* rearrange files

* Remove unused types

* Update Chart.tsx

* Fix colors
tcaiger pushed a commit that referenced this pull request Jul 12, 2023
* WAITP-1216: tab buttons

* WIP

* Rename files

* rearrange files

* Remove unused types

* Update Chart.tsx

* Fix colors
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants