Dashboard V2: main screen #1760

meeh0w · 2022-02-23T11:30:19Z

Overview

Visual overview

👣 Commit-by-commit review is recommended :)

Composes most of the main dashboard screen (with mocked data)
Makes top navigation bar responsive
Adds a CSS helper to make media queries easier inside Styled Components. Also allows referencing computed Tailwind config from javascript, by using babel-preval-plugin (config is evaluated on build time, not in the browser).
Some styling fixes / improvements to generic components (Tabs / Panel / Table).
Adds gatsby-plugin-styled-components, as without it adding custom CSS only works in gatsby develop mode, but not in a production build (gatsby build).
Adds back gatsby-ssr.js file -- it's needed for gatsby build followed by gatsby serve flow (seems like SSR is enabled with gatsby serve).

github-actions · 2022-02-23T12:17:40Z

Deployed to https://200fntmfgsihlijo74u1pcjq24713bbpq5kav3gccvm9spqsi5tm1r8.siasky.net/
Skylink: sia://EAD79s-HJRrKeDk8HLJ6EQ4RrXnRaK-ODGfsnmdckXtg7Q

packages/dashboard-v2/src/components/CurrentUsage/GraphBar.js

peterjan

LGTM 👍

packages/dashboard-v2/src/components/Slider/Bullets.js

packages/dashboard-v2/src/components/Slider/Slider.js

packages/dashboard-v2/src/components/CurrentUsage/CurrentUsage.js

packages/dashboard-v2/src/components/CurrentUsage/GraphBar.js

packages/dashboard-v2/gatsby-ssr.js

packages/dashboard-v2/src/components/Tabs/ActiveTabIndicator.js

packages/dashboard-v2/src/components/NavBar/NavBar.js

…creased on the last slide

github-actions · 2022-02-26T11:33:52Z

Deployed to https://200fntmfgsihlijo74u1pcjq24713bbpq5kav3gccvm9spqsi5tm1r8.siasky.net/
Skylink: sia://EAD79s-HJRrKeDk8HLJ6EQ4RrXnRaK-ODGfsnmdckXtg7Q

…lider props

github-actions · 2022-02-26T11:50:24Z

Deployed to https://200fntmfgsihlijo74u1pcjq24713bbpq5kav3gccvm9spqsi5tm1r8.siasky.net/
Skylink: sia://EAD79s-HJRrKeDk8HLJ6EQ4RrXnRaK-ODGfsnmdckXtg7Q

github-actions · 2022-02-26T11:57:15Z

Deployed to https://20000fakj9cqr4igpcugevvejmpmtnlfpkh2fnilpefcti43nfv5ri0.siasky.net/
Skylink: sia://EAAAPVSaWa2SUMs9B3_unbNu3q_NIifeVcuezsiDu_5dyA

github-actions · 2022-02-26T12:36:16Z

Deployed to https://20000fakj9cqr4igpcugevvejmpmtnlfpkh2fnilpefcti43nfv5ri0.siasky.net/
Skylink: sia://EAAAPVSaWa2SUMs9B3_unbNu3q_NIifeVcuezsiDu_5dyA

github-actions · 2022-02-26T12:50:09Z

Deployed to https://20071n70me6pnd0tmel3rk7oufogo7cr75rcbpd0idmgh59rkt4n110.siasky.net/
Skylink: sia://EABw3OCzjZu0HbOqPdD48_EMHZs5dsXloJNtCJU7p0lwhA

This reverts commit 4429e4e.

github-actions · 2022-02-28T09:17:31Z

Deployed to https://2002k017nkcva1egqjjs0ja9b3vs9om5g5prhnt1vc1alliki00v54g.siasky.net/
Skylink: sia://EAAqACe9GfUF0NTnwE1JWP_E4sWBc7jfofsCqtZUkAHykg

github-actions · 2022-02-28T10:25:14Z

Deployed to https://2002k017nkcva1egqjjs0ja9b3vs9om5g5prhnt1vc1alliki00v54g.siasky.net/
Skylink: sia://EAAqACe9GfUF0NTnwE1JWP_E4sWBc7jfofsCqtZUkAHykg

kwypchlo · 2022-02-28T10:39:33Z

there seems to be some issue with navigation bar @meeh0w

meeh0w · 2022-02-28T15:40:30Z

Hey @kwypchlo @peterjan, I updated the PR with the division-by-zero code, can you take a final look please?

2653de6

github-actions · 2022-02-28T15:49:01Z

Deployed to https://2002k017nkcva1egqjjs0ja9b3vs9om5g5prhnt1vc1alliki00v54g.siasky.net/
Skylink: sia://EAAqACe9GfUF0NTnwE1JWP_E4sWBc7jfofsCqtZUkAHykg

meeh0w added 11 commits February 23, 2022 12:14

feat(dashboard-v2): add css media query helper

cb0ff7a

feat(dashboard-v2): allow passing custom elements as panel title

143c6a9

fix(dashboard-v2): fix active tab indicator after window resize

0c275a8

feat(dashboard-v2): make top navigation bar responsive

ae5c668

fix(dashboard-v2): fix table cell paddings

fad846e

feat(dashboard-v2): add Slider component

f6496f0

feat(dashboard-v2): add ActivityTable component

0c59cc2

feat(dashboard-v2): add CurrentUsage component

92c2860

fix(dashboard-v2): fix Slider bullets showing unnecessarily

279bd8c

feat(dashboard-v2): compose main page

d366552

fix(dashboard-v2): fix Gatsby build & serve flow

c3a2f7f

meeh0w requested review from peterjan and kwypchlo February 23, 2022 11:30

fix(dashboard-v2): fix NavBar not loading in Storybook

92892bf

peterjan reviewed Feb 23, 2022

View reviewed changes

packages/dashboard-v2/src/components/CurrentUsage/GraphBar.js Outdated Show resolved Hide resolved

peterjan previously approved these changes Feb 23, 2022

View reviewed changes

kwypchlo suggested changes Feb 24, 2022

View reviewed changes

meeh0w added 2 commits February 26, 2022 12:25

fix(dashboard-v2): fix slider scrolling to far when window size is in…

7adbc4b

…creased on the last slide

style(dashboard-v2): simplify 'key' props

7681287

meeh0w dismissed peterjan’s stale review via 7681287 February 26, 2022 11:31

refactor(dashboard-v2): use breakpoint names instead of minWidth in S…

278ab69

…lider props

meeh0w added 2 commits February 26, 2022 12:50

style(dashboard-v2): use tailwind classes for width

8dcd688

style(dashboard-v2): use PropTypes.elementType

4429e4e

chore(dashboard-v2): replace byte-size with pretty-bytes

aaaa9c1

chore(dashboard-v2): add storybook-addon-gatsby

5123a23

meeh0w requested review from kwypchlo and peterjan February 26, 2022 12:53

Revert "style(dashboard-v2): use PropTypes.elementType"

7f26c95

This reverts commit 4429e4e.

Merge branch 'master' into dashboard-v2-main-screen

e9c3cfc

kwypchlo previously approved these changes Feb 28, 2022

View reviewed changes

fix(dashboard-v2): prevent division by zero

2653de6

meeh0w dismissed kwypchlo’s stale review via 2653de6 February 28, 2022 15:38

kwypchlo approved these changes Feb 28, 2022

View reviewed changes

kwypchlo enabled auto-merge February 28, 2022 15:47

Merge branch 'master' into dashboard-v2-main-screen

fa7354f

peterjan approved these changes Mar 1, 2022

View reviewed changes

Merge branch 'master' into dashboard-v2-main-screen

1c3ec14

kwypchlo merged commit 8e648a3 into master Mar 1, 2022

kwypchlo deleted the dashboard-v2-main-screen branch March 1, 2022 10:18

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Dashboard V2: main screen #1760

Dashboard V2: main screen #1760

meeh0w commented Feb 23, 2022

github-actions bot commented Feb 23, 2022

peterjan left a comment

github-actions bot commented Feb 26, 2022

github-actions bot commented Feb 26, 2022

github-actions bot commented Feb 26, 2022

github-actions bot commented Feb 26, 2022

github-actions bot commented Feb 26, 2022

github-actions bot commented Feb 28, 2022

github-actions bot commented Feb 28, 2022

kwypchlo commented Feb 28, 2022

meeh0w commented Feb 28, 2022 •

edited

Loading

github-actions bot commented Feb 28, 2022

Dashboard V2: main screen #1760

Dashboard V2: main screen #1760

Conversation

meeh0w commented Feb 23, 2022

Overview

👣 Commit-by-commit review is recommended :)

github-actions bot commented Feb 23, 2022

peterjan left a comment

Choose a reason for hiding this comment

github-actions bot commented Feb 26, 2022

github-actions bot commented Feb 26, 2022

github-actions bot commented Feb 26, 2022

github-actions bot commented Feb 26, 2022

github-actions bot commented Feb 26, 2022

github-actions bot commented Feb 28, 2022

github-actions bot commented Feb 28, 2022

kwypchlo commented Feb 28, 2022

meeh0w commented Feb 28, 2022 • edited Loading

github-actions bot commented Feb 28, 2022

meeh0w commented Feb 28, 2022 •

edited

Loading