Sidebar shortcuts to built-in lists

Ticket: 1107
This commit is contained in:
infinite-persistence 2022-03-18 18:47:07 +08:00 committed by Thomas Zarebczan
parent bc3c56b84b
commit 5297978526
2 changed files with 30 additions and 6 deletions

View file

@ -4,7 +4,7 @@ import * as PAGES from 'constants/pages';
import * as ICONS from 'constants/icons'; import * as ICONS from 'constants/icons';
import * as KEYCODES from 'constants/keycodes'; import * as KEYCODES from 'constants/keycodes';
import { SIDEBAR_SUBS_DISPLAYED } from 'constants/subscriptions'; import { SIDEBAR_SUBS_DISPLAYED } from 'constants/subscriptions';
import React, { useEffect } from 'react'; import React from 'react';
import Button from 'component/button'; import Button from 'component/button';
import ClaimPreviewTitle from 'component/claimPreviewTitle'; import ClaimPreviewTitle from 'component/claimPreviewTitle';
import classnames from 'classnames'; import classnames from 'classnames';
@ -64,6 +64,20 @@ const NOTIFICATIONS = {
hideForUnauth: true, hideForUnauth: true,
}; };
const WATCH_LATER = {
title: 'Watch Later',
link: `/$/${PAGES.LIST}/watchlater`,
icon: ICONS.TIME,
hideForUnauth: true,
};
const FAVORITES = {
title: 'Favorites',
link: `/$/${PAGES.LIST}/favorites`,
icon: ICONS.STAR,
hideForUnauth: true,
};
const PLAYLISTS = { const PLAYLISTS = {
title: 'Lists', title: 'Lists',
link: `/$/${PAGES.LISTS}`, link: `/$/${PAGES.LISTS}`,
@ -421,7 +435,7 @@ function SideNavigation(props: Props) {
return () => window.removeEventListener('keydown', handleKeydown); return () => window.removeEventListener('keydown', handleKeydown);
}, [sidebarOpen, setSidebarOpen, isAbsolute]); }, [sidebarOpen, setSidebarOpen, isAbsolute]);
useEffect(() => { React.useEffect(() => {
if (!window.Optanon) { if (!window.Optanon) {
const gdprDiv = document.getElementById('gdprSidebarLink'); const gdprDiv = document.getElementById('gdprSidebarLink');
if (gdprDiv) { if (gdprDiv) {
@ -502,10 +516,20 @@ function SideNavigation(props: Props) {
> >
{getLink(getHomeButton(doClearClaimSearch))} {getLink(getHomeButton(doClearClaimSearch))}
{getLink(RECENT_FROM_FOLLOWING)} {getLink(RECENT_FROM_FOLLOWING)}
{getLink(PLAYLISTS)}
{!odyseeMembership && getLink(PREMIUM)} {!odyseeMembership && getLink(PREMIUM)}
</ul> </ul>
<ul
className={classnames('navigation-links', {
'navigation-links--micro': showMicroMenu,
'navigation-links--absolute': shouldRenderLargeMenu,
})}
>
{!showMicroMenu && getLink(WATCH_LATER)}
{!showMicroMenu && getLink(FAVORITES)}
{getLink(PLAYLISTS)}
</ul>
<ul <ul
className={classnames('navigation-links', { className={classnames('navigation-links', {
'navigation-links--micro': showMicroMenu, 'navigation-links--micro': showMicroMenu,
@ -514,7 +538,7 @@ function SideNavigation(props: Props) {
> >
{EXTRA_SIDEBAR_LINKS && ( {EXTRA_SIDEBAR_LINKS && (
<> <>
{/* $FlowFixMe -- GetLinksData should fix it's data type */} {/* $FlowFixMe: GetLinksData type needs an update */}
{EXTRA_SIDEBAR_LINKS.map((linkProps) => getLink(linkProps))} {EXTRA_SIDEBAR_LINKS.map((linkProps) => getLink(linkProps))}
{!wildWestDisabled && getLink(WILD_WEST)} {!wildWestDisabled && getLink(WILD_WEST)}
</> </>
@ -546,7 +570,7 @@ function SideNavigation(props: Props) {
type SubItemProps = { type SubItemProps = {
subscription: Subscription, subscription: Subscription,
odyseeMembershipByUri: (uri: string) => string, odyseeMembershipByUri: (uri: string) => string,
} };
function SubscriptionListItem(props: SubItemProps) { function SubscriptionListItem(props: SubItemProps) {
const { subscription, odyseeMembershipByUri } = props; const { subscription, odyseeMembershipByUri } = props;

View file

@ -129,7 +129,7 @@
transform: translateX(calc(var(--side-nav-width--micro) - var(--side-nav-width))); transform: translateX(calc(var(--side-nav-width--micro) - var(--side-nav-width)));
.navigation-inner-container { .navigation-inner-container {
ul:nth-child(3) { ul:nth-child(4) {
border-bottom: unset; border-bottom: unset;
} }
} }