[youtube][watch]: Display playlist runtime in playlist panel of watch page

[DarhkVoyd]

Issue Type

• Feature Request

Description

Currently, the playlist runtime information is displayed in the metadata section of the playlist page. However, it would be great to also show this information in the playlist panel of the watch video page for that playlist. This feature would provide easier access to playlist runtime details without the need to navigate to the playlist page.

Expected Behavior

When viewing a video within a playlist, the runtime information for that playlist should be displayed within the playlist panel on the watch page.

Current Behavior

At present, the playlist runtime information is only visible in the metadata section of the playlist page. Users must navigate to this playlist page to view playlist runtime details.

[yakatyansh]

I would like to work on it

[DarhkVoyd]

Hey @yakatyansh,

Thank you for showing interest in contributing to Toppings. However, I want to inform you that this particular issue is currently on hold as we're waiting to address some design-related changes, and it's not part of our Hacktoberfest goals this year.

We appreciate your enthusiasm, and we encourage you to keep an eye on our project for future opportunities to contribute.

I am removing the "ready to take" label to reflect that.

[yakatyansh]

We appreciate your enthusiasm, and we encourage you to keep an eye on our project for future opportunities to contribute.

I am removing the "ready to take" label to reflect that.

sure, will keep an eye on this issue and would love to create issues if I find any on testing

[Sandesh-03]

assign this issue to me

[DarhkVoyd]

@yakatyansh This issue is now ready to take, If you are still interested in working on it.

[yakatyansh]

Yes would love to

[DarhkVoyd]

@yakatyansh I've assigned the issue to you. If you have any questions or need assistance along the way, feel free to ask.

[yakatyansh]

so sorry it is taking time, am sick lately, but working on the issue rn

[DarhkVoyd]

@yakatyansh No problem at all! Your health comes first. Just keep us informed when you're back at it, and take all the time you need. We appreciate your efforts and look forward to your updates.

[yakatyansh]

Hey, I am better after a series of festivals and sickness, from today I will work on it properly, I just wanted to know that how to access the metadata section

[DarhkVoyd]

Hey, you could possibly start by looking at the implementation of addMetadataToppings in routeType/playlist to better understand how it was implemented there and then similarly implement for routeType/watch.
https://github.com/enrich-platforms/toppings/blob/e6e9070788afe8a412f57c5aa8cebee1647e225c/src/scripts/youtube/routeType/playlist/addMetadataToppings.ts#L20
You could also use these css styles implemented here or write your own to better blend into YouTube's native UI.

Since, this will be a new feature in routeType/watch, you might also need to extract the playlist id from the webApp and pass it down to watch page component and fetch API there.

If you have any further questions, feel free to ask.

[yakatyansh]

Thank you for the great explaination, I am now quite clear about what to do here

so, this piece of UI

needs to go here,

[DarhkVoyd]

@yakatyansh Yes, exactly. You should make sure that the styles blend seamlessly in YouTube's UI, so instead of a card like in the metadata section, you could do try and test various styles such as simply just adding it as plain information below title. Or some other styles and go with what suits best here.

[yakatyansh]

what do you think about this implementation ?, I am trying new things, because it is my first time implementing something on the YouTube UI

[DarhkVoyd]

@yakatyansh, could you please create a draft pull request (PR) for your changes? This will make it easier for us to review your code. Additionally, since the codebase has recently undergone significant refactoring and restructuring, I recommend syncing your fork if you haven't already. Thanks!

[yakatyansh]

yes regularily syncing the fork, and working on the draft pr, actually somehow I lost my progress, so will have to do it again 🥲