Skip to content
This repository has been archived by the owner on Oct 4, 2023. It is now read-only.

Support opaque id routes #10

Merged
merged 8 commits into from
Aug 27, 2020
Merged

Support opaque id routes #10

merged 8 commits into from
Aug 27, 2020

Conversation

raymondjacobson
Copy link
Member

@raymondjacobson raymondjacobson commented Aug 27, 2020

Trello Card Link

https://trello.com/c/5Y8RA0Vm/1497-api-expose-audius-client-track-route-to-handle-opaque-ids

Description

There's currently no way to go from API result => audius link. This PR adds support for

/tracks/{hashid}
/users/{hashid}
/playlists/{hashid}

Dragons

Is there anything the reviewer should be on the lookout for? Are there any dangerous changes?

This touches page load for tracks, users, and playlists which is a BFD. I tried to be very thorough in testing and I will continue to do so, but extra care in review would be great.

How Has This Been Tested?

Please describe the tests that you ran to verify your changes. Provide repro instructions & any configuration.

New unit tests as well as manual testing (local pointed @staging):

tracks
/tracks/DOg1D

  • load track page with normal track route
  • load track page with hashed track route
  • set a remix of a track
  • load track page with normal track route and view remixes
  • load track page with hashed track route and view remixes
  • load track page that should 404 (/handle/track-asdf)
  • load a track page that should 404 (/tracks/invalid)
  • rename a track
  • for an unlisted track, ensure that it 404s if trying to reach it by its hashed id
  • for an unlisted track, ensure that it 404s if trying to reach it by the correct id but incorrect track name/route id

users
/users/5epYn

  • load user page with normal handle route
  • load user page with hashed id route

playlists
/playlists/naZEL

  • load playlist page with normal playlist route
  • load playlist page with hashed playlist route
  • load album page with normal album route
  • load album page with hashed playlist route
  • create playlist and wait for confirmation
  • create playlist and leave before confirmation
  • rename playlist

misc

  • upload a track & visit page immediately

@audius-infra
Copy link
Collaborator

Preview this change https://frontend-demo.audius.co/rj-opaque-id-routes

@raymondjacobson
Copy link
Member Author

Note two bugs i'm still working out that i've caught w/ testing

  • profile page => other base route causes page breaking
  • mobile track page other artist tracks not loading

will fix these before merge. PR otherwise should be fine to review from a code persp.

Copy link
Contributor

@piazzatron piazzatron left a comment

Choose a reason for hiding this comment

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

Looks great - didn't find any issues with it in my testing. Besides the code level comments, the only other thing I can think that we need to do are block the playlists/tracks/users handles. Some fairly inactive user already grabbed playlists unfortunately, but what can you do (I guess we could call it collections?).

One more thing to test - does this all work with the app-redirect system? I'm not sure why it would cause that to break, but worth testing.

src/utils/route/trackRouteParser.ts Outdated Show resolved Hide resolved
src/utils/route/trackRouteParser.test.js Show resolved Hide resolved
src/utils/route/trackRouteParser.test.js Show resolved Hide resolved
src/utils/route/userRouteParser.ts Outdated Show resolved Hide resolved
src/utils/route/trackRouteParser.ts Outdated Show resolved Hide resolved
src/containers/track-page/TrackPageProvider.tsx Outdated Show resolved Hide resolved
src/containers/track-page/store/sagas.js Outdated Show resolved Hide resolved
src/containers/collection-page/CollectionPageProvider.tsx Outdated Show resolved Hide resolved
@raymondjacobson raymondjacobson merged commit 21766e9 into master Aug 27, 2020
@raymondjacobson raymondjacobson deleted the rj-opaque-id-routes branch August 27, 2020 22:59
sddioulde pushed a commit that referenced this pull request Sep 29, 2021
sliptype pushed a commit that referenced this pull request Feb 11, 2022
sliptype pushed a commit that referenced this pull request Feb 12, 2022
sliptype pushed a commit that referenced this pull request Feb 12, 2022
* Support /tracks/{hashid}

* Support /users/{hashid}

* Support /playlists/{hashid}

* Fix mock

* Make sure unlisted tracks redirect to 404

* Fix bug: user page => other non user page

* Address comments

* Fix mobile track page bug
Kyle-Shanks pushed a commit that referenced this pull request Jun 8, 2022
* Add handle color override

* 0.2.3

* Rework font support and fix inclusion of global vars
Kyle-Shanks added a commit that referenced this pull request Jun 9, 2022
* init create-react-library@2.6.7

* Initial commit

* Add storybook and Scrubber

* Update readme

* Fixups

* Update readme

* Update image size

* Update scrubber to fix staleness while dragging bug

* Fixup example app

* Fix scrubber and rollup config

* Clean up

* Clean up hook

* Update readme

* Cleanup scrubber

* Rename uniqueKey

* Clean up and fix scrubber touch events/safari issues

* Add isDisabled back

* Bump version

* Fix scrubber timestamps (#2)

* Fix scrubber for longer than one hour

* 0.1.2

* Reformat

* Add window focus event listener to fix scrubber (#3)

* Add window focus event listener to fix scrubber

* 0.1.3

* Add timeData ref

* Remove usecallback

* Add dark mode to stems (#4)

* Add dark mode to stems

* 0.1.4

* Bedtime (#5)

* Scrubber changes for bedtime

* Fix bedtime styles

* Add disabled check

Co-authored-by: Michael Piazza <michael.piazza.mp@gmail.com>

* Add button & icons (#6)

* Add Button Component

* Clean up and fix lint

* Fix iconShare

* Export ButtonProps

* 0.1.6-dev.0

* Add memo and remove listener

* Fix lint situation

* Clean up styles and add hooks

* Remove memo

* 0.1.6

* Extract css (#7)

* Extract css separately

* 0.2.0

* Add website and donate icons (#8)

* Add dwebsite and donate icons

* 0.2.1

* Added Trending & campfire icons & udpated pkg lock

* 0.2.2

* Updated campfire/trending icons

* Add handle color override & fix global var support (#10)

* Add handle color override

* 0.2.3

* Rework font support and fix inclusion of global vars

* Remove logo

* Update README.md (#12)

* Update README.md

* Bold notice text

* Add LICENSE (#13)

* Fix button animations, exposing animation vars (#14)

* 0.2.4 (#15)

* Adds modal and tab slider component (#16)

* Adds modal and tab slider

* Nest modal in another div

* 0.2.5 (#17)

* Add token value slider and input (#18)

* 0.2.6 (#19)

* Fix btn and slider (#20)

* Fix btn and slider

* 0.2.7

* Allow styling of TokenValueSlider bar (#21)

* Allow styling of slider bar

* 0.2.8

* Add specific color overrides for TokenValueSlider (#22)

* Add specific color overrides for TokenValueSlider

* 0.2.9

* Fix css var identifier

* 0.2.10

* Numeric check in TokenValueInput (#23)

* Update numeric check in TokenValueInput

* 0.2.11

* Add z-index prop to modal (#24)

* Add z-index to modal

* 0.2.12

* Fix bug in modal (#25)

* Rework modal to support all client use cases (#26)

* Add scroll counter to modal itself

* Fix up modal to support dapp

* Fix useClickOutside catch and useGlobal for scroll count

* Use useEffect to set initial

* Add useEffect and lint

* 0.3.0 (#27)

* Fix click outside bug in modal (#28)

* 0.3.1 (#29)

* [AUD-17] useGlobal fix (#31)

* 0.3.2-dev.0

* 0.3.2

* [AUD-17] Fix use global memoization

* [AUD-9] Fix modal multi-line title on Safari (#30)

* Use modal absolute position only on ios safari (#32)

* Use absolute position only on ios safari

* 0.3.3

* Fix typo

* [AUD-112] Fix scrollable modals on iOS (#33)

* Fix modal cleaup bg overflow (#35)

* Fix modal cleaup bg overflow

* Update comment on modal cleanup

* 0.3.4 (#34)

* Matrix Button Fix (#36)

* Matrix fix

* 0.3.5

* Additional changes

* Add crown icon (#37)

* Add crown

* 0.3.6

* Slider Changes (#38)

* Tab Slider changes

* 0.3.7

* Change overflow to auto instead of scroll to hide if not needed (#39)

* 0.3.8 (#40)

* Expose shadow (#41)

* Expose shadow

* Update slider vars

* 0.3.9

* Update storybook (#42)

* Add deployer cut and minimum icons (#43)

* 0.3.10 (#44)

* Add TikTok icons (#45)

* Add TikTok icons

* Update inverted icon

* 0.3.11 (#46)

* Add Popup and PopupMenu (#47)

* Update storybook

* Update directory structure, nesting components

* Add linting for import order and default exports

* Add Popup

* Add PopupMenu

* Fix icon styling

* Update paths

* [WIP] Update PopupMenu

* Minor tweaks to popup

* Improve popup styling and logic

* Remove duplicate Button.stories.tsx

* Remove duplicate Scrubber.stories.tsx

* Implement changes from PR comments

* Add listener to close Popup on escape

* Add back missing scrubber handle height (#48)

* Add forward refs to Popup and PopupMenu (#49)

* Add a forward ref to Popup and PopupMenu

* Use named functions so ref-forwarded components are named in dev tools

* 0.3.12 (#50)

* Add eth and sol logos (#51)

* 0.3.13 (#52)

* Use react-spring transition config to animate popup (#53)

* Add ProgressBar component (#54)

* Add ProgressBar component

* Update ProgressBar component to support BN and use BN under the hood

* Add ref to Modal (#55)

* 0.3.14 (#56)

* Export ProgressBar component and bump version to 0.3.15 (#57)

* Update TabSlider component (#58)

* Add lock icon (#60)

* Update LICENSE (#59)

* 0.3.16 (#61)

* [AUD-1026] Prevent escape from doing anything when a modal is closed (#63)

* Update icon verified to have a path for the check mark (#62)

* [AUD-900] Improve popup component (#64)

* [AUD-900] Improve popup component

* Address comments

* 0.3.17 (#65)

* Fix null types (#69)

* 0.3.18 (#70)

* Pin react version (#71)

* Pin react version

* Update react scripts

* Upgrade to react@17.0.2 (#77)

* [AUD-1351] Improve bundle size (#78)

* Fix disabled button, update install instructions (#81)

* 0.3.19 (#83)

* [AUD-1359] Fix button label and buttonType (#84)

* [AUD-1362] Fix modal a11y (#85)

- Adds dialog role
- Adds aria-labelledby and aria-describedby for title and subtitle

* 0.3.20 (#86)

[f2c470b] [AUD-1362] Fix modal a11y (#85) Dylan Jeffers
[5d78444] [AUD-1359] Fix button label and buttonType (#84) Dylan Jeffers

* Add gradient colors to theme vars (#87)

* [AUD-1394] Fix window resize modal bug (#88)

* 0.3.21 (#89)

* Add Icons and Svg Backgrounds stories (#92)

* add icons story

* add source

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* Rename Tabslider -> SegmentedControl; add Modal sub components (#93)

* rename tabslider to segmentedcontrol

* add modal story and modalContent component

* file name fix

* decomp Modal into sub components

* changes to modal design, add icon folder

* review

* get rid of extra lines

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* small primary button update (#94)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.22 (#95)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* fix icons fill colors (#100)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.23 (#101)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* fix icons fill colors and add outlined variant of folder icon (#103)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.24 (#104)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* Add Scrollbar component (#107)

* add scrollbar component

* fix import

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.25 (#109)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* Add polyfill for resize observer (#110)

* add polyfill for resize observer

* add dep

* pin dep

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.26 (#111)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* smoll css changes for scrollbar (#112)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.27 (#115)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* modal changes and add icon button (#113)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* Upgrade storybook and add A11y add on (#114)

* upgrade storybook and add a11y

* run prettier eslintrc

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.28 (#116)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* Add on blur callback and isWhole prop for whole numbers (#118)

Co-authored-by: Saliou Diallo <saliou@audius.co>

* 0.3.29 (#119)

Co-authored-by: Saliou Diallo <saliou@audius.co>

* Set button text to be static white on hover and add button icon transition (#122)

* 0.3.30 (#123)

* Add primary-secondary-text-color and update PopupMenu and Button text and icon colors to use it (#124)

* 0.3.31 (#125)

* Add role and aria-valuenow attributes to ProgressBar (#126)

* 0.3.32 (#127)

* add at sign icon (#128)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.33 (#129)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* fix disabled button states (#130)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.34 (#131)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* add transforms file to dist css (#132)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.35 (#133)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* Hide scrollbar after delay [C-550] (#134)

* hide scrollbar after delay

* change transition

* more specificity

* fix id

* remove comment

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* 0.3.36 (#135)

Co-authored-by: Nikki Kang <kangaroo233@gmail.com>

* Use click instead of mousedown for listener (#136)

* Use click instead of mousedown for listener

* Only dismiss on click outside if modal is open

* Fix boolean logic, add comment

* edit comment

* 0.3.37 (#137)

* Add stems link to the readme

Co-authored-by: Raymond Jacobson <ray@audius.co>
Co-authored-by: Michael Piazza <michael.piazza.mp@gmail.com>
Co-authored-by: jowlee <joeylee0925@gmail.com>
Co-authored-by: Sebastian Klingler <sliptype@gmail.com>
Co-authored-by: Marcus Pasell <rickyrombo@users.noreply.github.com>
Co-authored-by: Dylan Jeffers <dylan@audius.co>
Co-authored-by: nicoback2 <36916764+nicoback2@users.noreply.github.com>
Co-authored-by: Nikki Kang <kangaroo233@gmail.com>
Co-authored-by: Saliou Diallo <sddioulde@hotmail.com>
Co-authored-by: Saliou Diallo <saliou@audius.co>
sliptype pushed a commit that referenced this pull request Mar 14, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants