Show upload menu for no-auth but redirect to sign up

This commit is contained in:
Rafael 2022-04-27 09:54:02 -03:00 committed by Thomas Zarebczan
parent b693925fe5
commit 0e8b7d6b4a
2 changed files with 38 additions and 18 deletions

View file

@ -1,17 +1,30 @@
// @flow // @flow
import * as PAGES from 'constants/pages';
import React from 'react'; import React from 'react';
import { Link } from 'react-router-dom'; import { Link, useHistory } from 'react-router-dom';
import { MenuLink } from '@reach/menu-button'; import { MenuLink, MenuItem } from '@reach/menu-button';
import Icon from 'component/common/icon'; import Icon from 'component/common/icon';
type Props = { type Props = {
icon: string, icon: string,
name: string, name: string,
page: string, page: string,
requiresAuth?: boolean,
}; };
export default function HeaderMenuLink(props: Props) { export default function HeaderMenuLink(props: Props) {
const { icon, name, page } = props; const { icon, name, page, requiresAuth } = props;
const { push } = useHistory();
if (requiresAuth) {
return (
<MenuItem className="menu__link" onSelect={() => push(`/$/${PAGES.AUTH}`)}>
<Icon aria-hidden icon={icon} />
{name}
</MenuItem>
);
}
return ( return (
<MenuLink className="menu__link" as={Link} to={`/$/${page}`}> <MenuLink className="menu__link" as={Link} to={`/$/${page}`}>

View file

@ -30,24 +30,31 @@ export default function HeaderMenuButtons(props: HeaderMenuButtonProps) {
const notificationsEnabled = ENABLE_UI_NOTIFICATIONS || (user && user.experimental_ui); const notificationsEnabled = ENABLE_UI_NOTIFICATIONS || (user && user.experimental_ui);
const livestreamEnabled = Boolean(ENABLE_NO_SOURCE_CLAIMS && user && !user.odysee_live_disabled); const livestreamEnabled = Boolean(ENABLE_NO_SOURCE_CLAIMS && user && !user.odysee_live_disabled);
const uploadProps = { requiresAuth: !authenticated };
return ( return (
<div className="header__buttons"> <div className="header__buttons">
{authenticated && ( <Menu>
<Menu> <Tooltip title={__('Publish a file, or create a channel')}>
<Tooltip title={__('Publish a file, or create a channel')}> <MenuButton className="header__navigationItem--icon">
<MenuButton className="header__navigationItem--icon"> <Icon size={18} icon={ICONS.PUBLISH} aria-hidden />
<Icon size={18} icon={ICONS.PUBLISH} aria-hidden /> </MenuButton>
</MenuButton> </Tooltip>
</Tooltip>
<MenuList className="menu__list--header"> <MenuList className="menu__list--header">
<HeaderMenuLink page={PAGES.UPLOAD} icon={ICONS.PUBLISH} name={__('Upload')} /> <HeaderMenuLink {...uploadProps} page={PAGES.UPLOAD} icon={ICONS.PUBLISH} name={__('Upload')} />
<HeaderMenuLink page={PAGES.CHANNEL_NEW} icon={ICONS.CHANNEL} name={__('New Channel')} /> <HeaderMenuLink {...uploadProps} page={PAGES.CHANNEL_NEW} icon={ICONS.CHANNEL} name={__('New Channel')} />
<HeaderMenuLink page={PAGES.YOUTUBE_SYNC} icon={ICONS.YOUTUBE} name={__('Sync YouTube Channel')} /> <HeaderMenuLink
{livestreamEnabled && <HeaderMenuLink page={PAGES.LIVESTREAM} icon={ICONS.VIDEO} name={__('Go Live')} />} {...uploadProps}
</MenuList> page={PAGES.YOUTUBE_SYNC}
</Menu> icon={ICONS.YOUTUBE}
)} name={__('Sync YouTube Channel')}
/>
{livestreamEnabled && (
<HeaderMenuLink {...uploadProps} page={PAGES.LIVESTREAM} icon={ICONS.VIDEO} name={__('Go Live')} />
)}
</MenuList>
</Menu>
{notificationsEnabled && <NotificationHeaderButton />} {notificationsEnabled && <NotificationHeaderButton />}