Disroot/Mangane
5
0
Fork 0
Code Issues Pull requests Packages Projects Releases 2 Wiki Activity

Add timeline links to navigation

Browse source
This commit is contained in:
Alex Gleason 2022-04-12 20:10:47 -05:00
parent 9c79ae386a
commit b727ef3d21
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
3 changed files with 54 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
app/soapbox/components/sidebar-navigation.tsx
View file

@ -27,7 +27,7 @@ const SidebarNavigation = () => {
<SidebarNavigationLink
to='/'
icon={require('icons/feed.svg')}
text={<FormattedMessage id='tabs_bar.home' defaultMessage='Feed' />}
text={<FormattedMessage id='tabs_bar.home' defaultMessage='Home' />}
/>
{account && (
@ -42,7 +42,7 @@ const SidebarNavigation = () => {
to='/notifications'
icon={require('icons/alert.svg')}
count={notificationCount}
text={<FormattedMessage id='tabs_bar.notifications' defaultMessage='Alerts' />}
text={<FormattedMessage id='tabs_bar.notifications' defaultMessage='Notifications' />}
/>
<SidebarNavigationLink
@ -95,27 +95,25 @@ const SidebarNavigation = () => {
/>
)}
{/* {features.federating ? (
<NavLink to='/timeline/local' className='btn grouped'>
<Icon
src={require('@tabler/icons/icons/users.svg')}
className={classNames('primary-navigation__icon', { 'svg-icon--active': location.pathname === '/timeline/local' })}
/>
{instance.title}
</NavLink>
) : (
<NavLink to='/timeline/local' className='btn grouped'>
<Icon src={require('@tabler/icons/icons/world.svg')} className='primary-navigation__icon' />
<FormattedMessage id='tabs_bar.all' defaultMessage='All' />
</NavLink>
{(features.localTimeline || features.publicTimeline) && (
<hr className='dark:border-slate-700' />
)}
{features.federating && (
<NavLink to='/timeline/fediverse' className='btn grouped'>
<Icon src={require('icons/fediverse.svg')} className='column-header__icon' />
<FormattedMessage id='tabs_bar.fediverse' defaultMessage='Fediverse' />
</NavLink>
)} */}
{features.localTimeline && (
<SidebarNavigationLink
to='/timeline/local'
icon={features.federating ? require('@tabler/icons/icons/users.svg') : require('@tabler/icons/icons/world.svg')}
text={features.federating ? instance.title : <FormattedMessage id='tabs_bar.all' defaultMessage='All' />}
/>
)}
{(features.publicTimeline && features.federating) && (
<SidebarNavigationLink
to='/timeline/fediverse'
icon={require('icons/fediverse.svg')}
text={<FormattedMessage id='tabs_bar.fediverse' defaultMessage='Fediverse' />}
/>
)}
</div>
{account && (

30
app/soapbox/components/sidebar_menu.tsx
View file

@ -1,6 +1,6 @@
import classNames from 'classnames';
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
import { useDispatch } from 'react-redux';
import { Link, NavLink } from 'react-router-dom';
@ -37,7 +37,7 @@ const messages = defineMessages({
interface ISidebarLink {
to: string,
icon: string,
text: string,
text: string | JSX.Element,
onClick: React.EventHandler<React.MouseEvent>,
}
@ -62,6 +62,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
const { logo } = useSoapboxConfig();
const features = useFeatures();
const getAccount = makeGetAccount();
const instance = useAppSelector((state) => state.instance);
const me = useAppSelector((state) => state.me);
const account = useAppSelector((state) => me ? getAccount(state, me) : null);
const otherAccounts: ImmutableList<AccountEntity> = useAppSelector((state) => getOtherAccounts(state));
@ -130,7 +131,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
<HStack alignItems='center' justifyContent='between'>
<Link to='/' onClick={onClose}>
{logo ? (
<img alt='Logo' src={logo} className='h-5 w-auto min-w-[140px] cursor-pointer' />
<img alt='Logo' src={logo} className='h-5 w-auto cursor-pointer' />
): (
<Icon
alt='Logo'
@ -154,6 +155,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
<Account account={account} showProfileHoverCard={false} />
</Link>
{/* TODO: make this available to everyone */}
{account.staff && (
<Stack>
<button type='button' onClick={handleSwitcherClick} className='py-1'>
@ -190,6 +192,28 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
onClick={onClose}
/>
{(features.localTimeline || features.publicTimeline) && (
<hr className='dark:border-slate-700' />
)}
{features.localTimeline && (
<SidebarLink
to='/timeline/local'
icon={features.federating ? require('@tabler/icons/icons/users.svg') : require('@tabler/icons/icons/world.svg')}
text={features.federating ? instance.title : <FormattedMessage id='tabs_bar.all' defaultMessage='All' />}
onClick={onClose}
/>
)}
{(features.publicTimeline && features.federating) && (
<SidebarLink
to='/timeline/fediverse'
icon={require('icons/fediverse.svg')}
text={<FormattedMessage id='tabs_bar.fediverse' defaultMessage='Fediverse' />}
onClick={onClose}
/>
)}
<hr />
<SidebarLink

8
app/soapbox/utils/features.ts
View file

@ -68,6 +68,14 @@ const getInstanceFeatures = (instance: Instance) => {
// Even though Pleroma supports these endpoints, it has disadvantages
// v.software === PLEROMA && gte(v.version, '2.1.0'),
]),
localTimeline: any([
v.software === MASTODON,
v.software === PLEROMA,
]),
publicTimeline: any([
v.software === MASTODON,
v.software === PLEROMA,
]),
directTimeline: any([
v.software === MASTODON && lt(v.compatVersion, '3.0.0'),
v.software === PLEROMA && gte(v.version, '0.9.9'),