Navigate to collection from movie page #9399
Conversation
github-actions
bot
added
the
Area: UI
| @@ -9,7 +9,7 @@ import { Link as RouterLink } from 'react-router-dom'; | |||
| import styles from './Link.css'; | |||
|
|
|||
| interface ReactRouterLinkProps { | |||
| to?: string; | |||
| to?: any; | |||
There was a problem hiding this comment.
This needs an undo.
There was a problem hiding this comment.
I did a bit of a rework on this component that I'll commit up soon. Turns out how we are using this intermittent Link makes the type of to somewhat challenging.
|
@mynameisbogdan any particular color you suggest for the link? |
To be honest, I think keeping it white as the rest of the content on that line would be also nice. |
It should now be inheriting its color to be the same as the other labels on the same page. |
|
Any update on this? |
|
@mynameisbogdan I'm good with this if you are |
|
AFAIK it's not working, since id for collection is 0 for all movies at the moment. |
|
Ah, hence the other issue? For this purpose we can use collection selector with the collection tmdbid from the movie object. All the collections are loaded into the UI at page load. |
|
Yeah, I was thinking about tmdbid as well to avoid pulling collection data into the resource mapper. |
|
Yea, we should do that. That's what the monitor toggle already does. |
|
@mynameisbogdan Ok I think I did this correctly, but please let me know if I missed something. Thanks for reviewing this |
|
Hello, just tried it locally and the link works. But if you scroll on the collections page and refresh the page, it's sending you back to the initial collection. Same if you try to jump to another letter by clicking multiple times. |
| @@ -53,7 +53,8 @@ class CollectionOverviews extends Component { | |||
| columnCount: 1, | |||
| posterWidth: 162, | |||
| posterHeight: 238, | |||
| rowHeight: calculateRowHeight(238, null, props.isSmallScreen, {}) | |||
| rowHeight: calculateRowHeight(238, null, props.isSmallScreen, {}), | |||
| navigateToId: props.location.state ? props.location.state.navigateToId : 0 | |||
There was a problem hiding this comment.
| navigateToId: props.location.state ? props.location.state.navigateToId : 0 | |
| navigateToId: props.location.state?.navigateToId ?? 0 |
| @@ -40,7 +50,8 @@ class MovieCollectionLabel extends Component { | |||
| MovieCollectionLabel.propTypes = { | |||
| title: PropTypes.string.isRequired, | |||
| monitored: PropTypes.bool.isRequired, | |||
| onMonitorTogglePress: PropTypes.func.isRequired | |||
| onMonitorTogglePress: PropTypes.func.isRequired, | |||
| tmdbId: PropTypes.string.isRequired | |||
There was a problem hiding this comment.
| tmdbId: PropTypes.string.isRequired | |
| tmdbId: PropTypes.number.isRequired |
|
@mynameisbogdan Should be all fixed and I applied your code suggestions |
|
Forgot one little thing, should be good after my last commit |
|
Any update on this? Are we able to get this into a release? |
|
We should be able, but I want to try the changes again which I didn't had the time to do so yet. |
|
Any update? :) |
Database Migration
NO
Description
Adds the ability to click the collection name on a specific movie which will take the user to the specific collection on the collections page
Screenshot (if UI related)
Todos
Issues Fixed or Closed by this PR