bring selectNavLinks back into lbry-redux

This commit is contained in:
Sean Yesmunt 2018-09-04 13:23:18 -04:00
parent 4108e7fdcf
commit 4064b8c064
3 changed files with 166 additions and 4 deletions

View file

@ -4,11 +4,10 @@ import {
selectPageTitle, selectPageTitle,
selectIsBackDisabled, selectIsBackDisabled,
selectIsForwardDisabled, selectIsForwardDisabled,
selectNavLinks,
} from 'lbry-redux'; } from 'lbry-redux';
import { doNavigate, doHistoryBack, doHistoryForward } from 'redux/actions/navigation'; import { doNavigate, doHistoryBack, doHistoryForward } from 'redux/actions/navigation';
import { doDownloadUpgrade } from 'redux/actions/app'; import { doDownloadUpgrade } from 'redux/actions/app';
import { selectIsUpgradeAvailable } from 'redux/selectors/app'; import { selectIsUpgradeAvailable, selectNavLinks } from 'redux/selectors/app';
import { formatCredits } from 'util/formatCredits'; import { formatCredits } from 'util/formatCredits';
import Page from './view'; import Page from './view';
@ -28,4 +27,7 @@ const perform = dispatch => ({
downloadUpgrade: () => dispatch(doDownloadUpgrade()), downloadUpgrade: () => dispatch(doDownloadUpgrade()),
}); });
export default connect(select, perform)(Page); export default connect(
select,
perform
)(Page);

View file

@ -1,5 +1,5 @@
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { selectNavLinks } from 'lbry-redux'; import { selectNavLinks } from 'redux/selectors/app';
import { selectNotifications } from 'redux/selectors/subscriptions'; import { selectNotifications } from 'redux/selectors/subscriptions';
import SideBar from './view'; import SideBar from './view';

View file

@ -1,4 +1,5 @@
import { createSelector } from 'reselect'; import { createSelector } from 'reselect';
import { selectCurrentPage, selectHistoryStack } from 'lbry-redux';
export const selectState = state => state.app || {}; export const selectState = state => state.app || {};
@ -86,3 +87,162 @@ export const selectCurrentLanguage = createSelector(
export const selectVolume = createSelector(selectState, state => state.volume); export const selectVolume = createSelector(selectState, state => state.volume);
export const selectUpgradeTimer = createSelector(selectState, state => state.checkUpgradeTimer); export const selectUpgradeTimer = createSelector(selectState, state => state.checkUpgradeTimer);
export const selectNavLinks = createSelector(
selectCurrentPage,
selectHistoryStack,
(currentPage, historyStack) => {
const isWalletPage = page =>
page === 'wallet' ||
page === 'send' ||
page === 'getcredits' ||
page === 'rewards' ||
page === 'history' ||
page === 'invite' ||
page === 'backup';
const isMyLbryPage = page =>
page === 'downloaded' || page === 'published' || page === 'user_history';
const previousStack = historyStack.slice().reverse();
const getPreviousSubLinkPath = checkIfValidPage => {
for (let i = 0; i < previousStack.length; i += 1) {
const currentStackItem = previousStack[i];
// Trim off the "/" from the path
const pageInStack = currentStackItem.path.slice(1);
if (checkIfValidPage(pageInStack)) {
return currentStackItem.path;
}
}
return undefined;
};
// Gets the last active sublink in a section
const getActiveSublink = category => {
if (category === 'wallet') {
const previousPath = getPreviousSubLinkPath(isWalletPage);
return previousPath || '/wallet';
} else if (category === 'myLbry') {
const previousPath = getPreviousSubLinkPath(isMyLbryPage);
return previousPath || '/downloaded';
}
return undefined;
};
const isCurrentlyWalletPage = isWalletPage(currentPage);
const isCurrentlyMyLbryPage = isMyLbryPage(currentPage);
const walletSubLinks = [
{
label: 'Overview',
path: '/wallet',
active: currentPage === 'wallet',
},
{
label: 'Send & Receive',
path: '/send',
active: currentPage === 'send',
},
{
label: 'Transactions',
path: '/history',
active: currentPage === 'history',
},
{
label: 'Get Credits',
path: '/getcredits',
active: currentPage === 'getcredits',
},
{
label: 'Rewards',
path: '/rewards',
active: currentPage === 'rewards',
},
{
label: 'Invites',
path: '/invite',
active: currentPage === 'invite',
},
{
label: 'Backup',
path: '/backup',
active: currentPage === 'backup',
},
];
const myLbrySubLinks = [
{
label: 'Downloads',
path: '/downloaded',
active: currentPage === 'downloaded',
},
{
label: 'Publishes',
path: '/published',
active: currentPage === 'published',
},
{
label: 'History',
path: '/user_history',
active: currentPage === 'user_history',
},
];
const navLinks = {
primary: [
{
label: 'Explore',
path: '/discover',
active: currentPage === 'discover',
icon: 'Compass',
},
{
label: 'Subscriptions',
path: '/subscriptions',
active: currentPage === 'subscriptions',
icon: 'AtSign',
},
],
secondary: [
{
label: 'Wallet',
icon: 'CreditCard',
subLinks: walletSubLinks,
path: isCurrentlyWalletPage ? '/wallet' : getActiveSublink('wallet'),
active: isWalletPage(currentPage),
},
{
label: 'My LBRY',
icon: 'Folder',
subLinks: myLbrySubLinks,
path: isCurrentlyMyLbryPage ? '/downloaded' : getActiveSublink('myLbry'),
active: isMyLbryPage(currentPage),
},
{
label: 'Publish',
icon: 'UploadCloud',
path: '/publish',
active: currentPage === 'publish',
},
{
label: 'Settings',
icon: 'Settings',
path: '/settings',
active: currentPage === 'settings',
},
{
label: 'Help',
path: '/help',
icon: 'HelpCircle',
active: currentPage === 'help',
},
],
};
return navLinks;
}
);