refactor: Tweak Harmony button API by DejayJD · Pull Request #6430 · AudiusProject/apps

DejayJD · 2023-10-23T20:37:21Z

Description

Harmony button API tweak + refactoring usage to support it

Button now uses children instead of text API. We had a discussion on the client team about it and went back and forth on children for a couple reasons. More conventional (matches HTML API) + more flexible for things like this:

and works for cases like asChild components.
The tradeoff is we get looser typing and rely on devs to not use it as a footgun like this:

<Button><Text> Click Me </Text></Button>

Whenever we tune up our Storybook docs in the near-future we should add a section mentioning some dos/donts

How Has This Been Tested?

Locally in storybook

audius-infra · 2023-10-23T23:00:21Z

Preview this change https://demo.audius.co/jd/harmony-tweaks

…jd/harmony-tweaks

audius-infra · 2023-10-23T23:22:29Z

Preview this change https://demo.audius.co/jd/harmony-tweaks

amendelsohn

Looks great! Just pull in the stories updates before you merge this

amendelsohn · 2023-10-24T00:30:33Z

 export const Destructive: Story = { args: { variant: ButtonType.DESTRUCTIVE } }
+
+// Hiding at certain widths
+export const HiddenMobileText: Story = { args: { widthToHideText: 900 } }


this is not strictly for mobile, right?

True, my intent was to give it a name that kind of implied what the use case is, but I think that may be better served for documentation paired with it whenever we upgrade our docs

audius-infra · 2023-10-24T16:38:34Z

Preview this change https://demo.audius.co/jd/harmony-tweaks

audius-infra · 2023-10-24T18:26:10Z

Preview this change https://demo.audius.co/jd/harmony-tweaks

…lytics * origin/main: (21 commits) Fix triggering patch-release workflow (#6447) Fix cooldown summary table (#6445) Fix $AUDIO purchase (#6446) Fix notifications (#6444) refactor: Tweak Harmony button API (#6430) [PAY-2063] Fix border colors (#6437) Bump version to 0.5.1 Add Harmony completion check C-3246 (#6414) [PAY-2061] Hide table if no challenges summary (#6438) Add CI workflow to patch a SHA outside of release (#6439) Filter out usdc create notifs from endpoint (#6436) [C-3196] Add testing-library to harmony and harmony-native (#6432) Push dashboard in release workflow (#6433) Fix jupiter buy-audio flow (#6429) Fix setup-dev.sh for users without .bashrc (#6428) SummaryTable don't gray out last row if no SummaryItem (#6427) Upgrade to 0.5.0 (#6426) [PAY-2012] Add analytics for purchase start/success/failure (#6425) Fix failing root npm install (#6424) [C-3235] Fix rotating cover art (#6379) ...

[38ac1b7] [C-3255] Sub-route logic & redirects for sign up flow (#6489) JD Francis [815df8b] [PAY-2090] Manual USDC Transfer Mobile UI (#6494) Reed [4fdd2dd] [C-3283] Improve harmony bundle (#6493) Dylan Jeffers [ca6e15e] [C-3261] Add mobile web signin UI (#6490) Andrew Mendelsohn [924c027] Add personal counts to DN aggregate routes metrics (#6484) Michelle Brier [1fc8456] [C-3271] Implement new sign up flow email page (desktop web) (#6464) JD Francis [4262e71] [PAY-1708] Update ToS/Learn More/early access links (#6491) Raymond Jacobson [157d8b7] [PAY-2043] Stop preview when purchase succeeds (#6472) Raymond Jacobson [e6027ff] [PROTO-1357] Add health UI and redirect root to it (#6482) Theo Ilie [a78356f] Filter out 0-amount challenges (#6488) Reed [086aa20] [PAY-2089] Add analytics events for users opening rewards claim modal (#6486) Randy Schott [f848217] Update iOS purchase unavailable copy (#6487) Reed [10997b6] [PAY-2013] Send event when purchase TOS clicked (#6485) Randy Schott [e176fec] Bump version to 0.5.4 audius-infra [b6da96f] Fix cooldown schedule (#6480) Reed [2bd883d] [Proposal] Add media query hook (#6469) Andrew Mendelsohn [42819cd] Hide ToS when purchase is in progress (#6479) Reed [e5de495] [PAY-1943] Separate feature flag for IOS USDC Purchase (#6478) Reed [7fab506] [PAY-2014] Add detailed purchase flow analytics (#6477) Randy Schott [3f1459c] Implement SocialButton in Harmony (#6473) JD Francis [a8fe47b] [PAY-2052] Disabled TOS while purchase in progress (#6476) Reed [7d51cfe] Use self-hosted runners for pushing images (#6467) Danny [260cd05] Harmony Text Input tweaks (design requests) (#6474) JD Francis [97cdcda] [PAY-2076][PAY-2075][PAY-2073][PAY-2026][PAY-2072][PAY-2074] Address landing page QA (#6459) Raymond Jacobson [7a222b4] [PAY-1986] Lock wallet address during stripe session creation (#6471) Randy Schott [0a5e0c0] [PAY-2051] Show preview UI when playing your own preview (#6468) Raymond Jacobson [76b14ce] [PAY-2041] Connect stripe session creation errors to analytics (#6465) Randy Schott [28a4800] Bump version to 0.5.3 audius-infra [3a176a2] Add fallbacks to SDK upload (#5970) Theo Ilie [2c71673] [C-2892 C-3253 C-3254] Add harmony-native typography (#6457) Dylan Jeffers [a9bae99] Add stylelint to harmony (#6456) Dylan Jeffers [084127a] chore: Fix chromatic args not being passed thru (#6466) JD Francis [75e517d] [C-3263] Add asChild to harmony Button (#6460) Dylan Jeffers [2add6e8] [PAY-2064] Fix misc mobile access & sale ui (#6463) Raymond Jacobson [7c58442] Update local stack postgres version (#6462) Raymond Jacobson [f6906d3] [PAY-2041] Return extended error information when stripe session creation fails (#6461) Randy Schott [f134b28] [PAY-1972] Filter out spammy accounts from explore premium tracks page (#6452) Reed [424d798] de-partition ops table (#6458) Steve Perkins [33604f8] Bump version to 0.5.2 audius-infra [fcd7dbd] [PAY-2032] Clean up userbank analytics events (#6450) Randy Schott [45a1509] [PAY-2015] Add USDC upload/edit analytics (#6449) Randy Schott [3482fe3] [C-3260, C-3236] Layout for SignIn page (web) (#6440) Andrew Mendelsohn [b81d1a2] [C-3266] Partially fix upload probers (#6451) Andrew Mendelsohn [4da1f79] Move psuedoselectors into class definition (#6455) Dylan Jeffers [049947d] Fix governance proposal release script (#6454) Raymond Jacobson [b195766] [C-3267] Use css color mixing instead of overlay/margin hack (#6453) Andrew Mendelsohn [f441b2d] [PAY-1998] Hide feed tip tile when USDC purchases is on (#6434) Raymond Jacobson [d5b7c69] [PROTO-1375] Proto dash QoL (modernization + bug fixes + performance) (#6442) Theo Ilie [de11917] Delete patch-release workflow (#6448) Theo Ilie [553bdce] [PAY-1962] Disable selectable pills during purchase (#6435) Reed [fb7f05b] Fix triggering patch-release workflow (#6447) Theo Ilie [fdcddf0] Fix cooldown summary table (#6445) Reed [d790864] Fix $AUDIO purchase (#6446) Raymond Jacobson [95792bc] Fix notifications (#6444) Raymond Jacobson [63d3c7f] refactor: Tweak Harmony button API (#6430) JD Francis [f03b0c0] [PAY-2063] Fix border colors (#6437) Raymond Jacobson [fbebfe4] Bump version to 0.5.1 audius-infra [a4047bd] Add Harmony completion check C-3246 (#6414) nicoback2 [58768e1] [PAY-2061] Hide table if no challenges summary (#6438) Raymond Jacobson [fdc4989] Add CI workflow to patch a SHA outside of release (#6439) Theo Ilie [02d767a] Filter out usdc create notifs from endpoint (#6436) Raymond Jacobson [fe53cfc] [C-3196] Add testing-library to harmony and harmony-native (#6432) Dylan Jeffers [4d9a7a5] Push dashboard in release workflow (#6433) Michelle Brier [25c7403] Fix jupiter buy-audio flow (#6429) Raymond Jacobson [25aec8b] Fix setup-dev.sh for users without .bashrc (#6428) Dylan Jeffers [f30664e] SummaryTable don't gray out last row if no SummaryItem (#6427) Reed [abbe592] Upgrade to 0.5.0 (#6426) Raymond Jacobson [428ba1a] [PAY-2012] Add analytics for purchase start/success/failure (#6425) Randy Schott [8dc22a7] Fix failing root npm install (#6424) Theo Ilie [8e2ed73] [C-3235] Fix rotating cover art (#6379) Dylan Jeffers [56f2217] Bump version to 0.4.39 audius-infra [8afa18c] [PAY-2045] Wire up content price and purchase limits (#6417) Randy Schott

pull-request-sizeBot added the size/M label Oct 23, 2023

DejayJD requested review from amendelsohn and dylanjeffers and removed request for dylanjeffers October 23, 2023 20:39

Tweak Harmony Button API
8d11ac8

DejayJD force-pushed the jd/harmony-tweaks branch from 2439462 to 8d11ac8Compare October 23, 2023 20:41

DejayJD changed the title ~~Proposal: Tweak Harmony button & divider~~Proposal: Tweak Harmony button Oct 23, 2023

DejayJD commented Oct 23, 2023
View reviewed changes

Comment threadpackages/harmony/src/components/button/BaseButton.tsx

DejayJD added 2 commits October 23, 2023 17:47

restore the aria label logic
9c14f8f

Update usage
dda0160

pull-request-sizeBot added size/L and removed size/M labels Oct 23, 2023

DejayJD marked this pull request as ready for review October 23, 2023 22:49

Merge branch 'main' of github.com:AudiusProject/audius-protocol into …
4e12bfa
…jd/harmony-tweaks

DejayJD changed the title ~~Proposal: Tweak Harmony button~~ Proposal: Tweak Harmony button APIOct 23, 2023

amendelsohn approved these changes Oct 24, 2023
View reviewed changes

DejayJD changed the title ~~Proposal: Tweak Harmony button API~~Tweak Harmony button APIOct 24, 2023

DejayJD added 2 commits October 24, 2023 11:17

fix story file
d3130ac

remove else
338923f

remove loading
93d683f

DejayJD changed the title ~~Tweak Harmony button API~~refactor: Tweak Harmony button APIOct 24, 2023

DejayJD merged commit 63d3c7f into mainOct 24, 2023

DejayJD deleted the jd/harmony-tweaks branch October 24, 2023 18:36

Navigation Menu

Uh oh!

refactor: Tweak Harmony button API - #6430

refactor: Tweak Harmony button API#6430
DejayJD merged 7 commits into
mainfrom
jd/harmony-tweaks

DejayJD commented Oct 23, 2023•
edited
Loading

Uh oh!

Uh oh!

audius-infra commented Oct 23, 2023

Uh oh!

audius-infra commented Oct 23, 2023

Uh oh!

amendelsohn left a comment

Uh oh!

Uh oh!

Uh oh!

amendelsohnOct 24, 2023

Uh oh!

DejayJDOct 24, 2023•
edited
Loading

Uh oh!

audius-infra commented Oct 24, 2023

Uh oh!

audius-infra commented Oct 24, 2023

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Uh oh!

Conversation

DejayJD commented Oct 23, 2023• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

How Has This Been Tested?

Uh oh!

Uh oh!

audius-infra commented Oct 23, 2023

Uh oh!

audius-infra commented Oct 23, 2023

Uh oh!

amendelsohn left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

amendelsohnOct 24, 2023

Choose a reason for hiding this comment

Uh oh!

DejayJDOct 24, 2023• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

audius-infra commented Oct 24, 2023

Uh oh!

audius-infra commented Oct 24, 2023

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

DejayJD commented Oct 23, 2023•
edited
Loading

DejayJDOct 24, 2023•
edited
Loading