Skip to content

[vtadmin-web] Add Button + Icon components#7350

Merged
rohit-nayak-ps merged 2 commits intovitessio:masterfrom
tinyspeck:sarabee-vtadmin-components
Jan 23, 2021
Merged

[vtadmin-web] Add Button + Icon components#7350
rohit-nayak-ps merged 2 commits intovitessio:masterfrom
tinyspeck:sarabee-vtadmin-components

Conversation

@doeg
Copy link
Contributor

@doeg doeg commented Jan 22, 2021

Signed-off-by: Sara Bee 855595+doeg@users.noreply.github.com

Description

✨ Staged at http://vtadmin.puppy.software/debug

Buttons! Icons! Dark mode (sorta)!

Screen Shot 2021-01-22 at 5 50 38 PM

Screen Shot 2021-01-22 at 5 50 35 PM

Related Issue(s)

N/A

Checklist

  • Should this PR be backported?
  • Tests were added or are not required N/A
  • Documentation was added or is not required

Deployment Notes

N/A

Impacted Areas in Vitess

Components that this PR will affect:

  • Query Serving
  • VReplication
  • Cluster Management
  • Build
  • VTAdmin

Signed-off-by: Sara Bee <855595+doeg@users.noreply.github.com>
@doeg doeg requested review from ajm188 and rohit-nayak-ps January 22, 2021 22:58

// All icons are from the VTAdmin Figma icon library:
// https://www.figma.com/file/By3SoETBRHpOirv3Ctfxdq/Designs
export const Icon = ({ icon, ...props }: Props) => {
Copy link
Contributor Author

@doeg doeg Jan 22, 2021

Choose a reason for hiding this comment

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

Between the SVGs and the Icons enum, it's a lot of boilerplate BUT I'm... happy with this implementation. Mostly? It's one of the best SVG/icon implementations I've worked with, but it's still pretty clunky. 😕 The trade-off here is verbosity for type-safety.

It's possible we could reduce almost all of this boilerplate through some cheeky codegen, but that's not particularly well-supported in TypeScript (compared to Go) so it'll take some exploration.

@doeg doeg force-pushed the sarabee-vtadmin-components branch 2 times, most recently from 5216321 to 559c1c9 Compare January 22, 2021 23:24
Signed-off-by: Sara Bee <855595+doeg@users.noreply.github.com>
@doeg doeg force-pushed the sarabee-vtadmin-components branch from 559c1c9 to 1d7481a Compare January 22, 2021 23:37
Copy link
Contributor

@ajm188 ajm188 left a comment

Choose a reason for hiding this comment

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

nice!

@rohit-nayak-ps rohit-nayak-ps merged commit 40200cc into vitessio:master Jan 23, 2021
@askdba askdba added the Component: VTAdmin VTadmin interface label Jan 25, 2021
@askdba askdba added this to the v9.0 milestone Jan 25, 2021
@doeg doeg changed the title Add Button + Icon components [vtadmin-web] Add Button + Icon components Mar 16, 2021
@doeg doeg deleted the sarabee-vtadmin-components branch November 1, 2021 19:46
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Component: VTAdmin VTadmin interface

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants