bigbuffet/bigbuffet-rw
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'sidebar-links' into 'develop'

Browse source 
Fix external links in sidebar/sidenav

See merge request soapbox-pub/soapbox-fe!1361
This commit is contained in:
marcin mikołajczak 2022-05-23 19:41:00 +00:00
commit 9030b93c5b
2 changed files with 20 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -6,7 +6,6 @@ import { getSettings } from 'soapbox/actions/settings';
import DropdownMenu from 'soapbox/containers/dropdown_menu_container';
import ComposeButton from 'soapbox/features/ui/components/compose-button';
import { useAppSelector, useOwnAccount } from 'soapbox/hooks';
import { getBaseURL } from 'soapbox/utils/accounts';
import { getFeatures } from 'soapbox/utils/features';
import SidebarNavigationLink from './sidebar-navigation-link';
@ -23,7 +22,6 @@ const SidebarNavigation = () => {
const followRequestsCount = useAppSelector((state) => state.user_lists.getIn(['follow_requests', 'items'], ImmutableOrderedSet()).count());
const dashboardCount = useAppSelector((state) => state.admin.openReports.count() + state.admin.awaitingApproval.count());
const baseURL = account ? getBaseURL(account) : '';
const features = getFeatures(instance);
const makeMenu = (): Menu => {
@ -55,14 +53,6 @@ const SidebarNavigation = () => {
});
}
if (instance.invites_enabled) {
menu.push({
to: `${baseURL}/invites`,
icon: require('@tabler/icons/icons/mailbox.svg'),
text: <FormattedMessage id='navigation.invites' defaultMessage='Invites' />,
});
}
if (settings.get('isDeveloper')) {
menu.push({
to: '/developers',

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

@ -14,7 +14,6 @@ import { Stack } from 'soapbox/components/ui';
import ProfileStats from 'soapbox/features/ui/components/profile_stats';
import { useAppSelector, useFeatures } from 'soapbox/hooks';
import { makeGetAccount, makeGetOtherAccounts } from 'soapbox/selectors';
import { getBaseURL } from 'soapbox/utils/accounts';
import { HStack, Icon, IconButton, Text } from './ui';
@ -43,14 +42,15 @@ const messages = defineMessages({
});
interface ISidebarLink {
to: string,
href?: string,
to?: string,
icon: string,
text: string | JSX.Element,
onClick: React.EventHandler<React.MouseEvent>,
}
const SidebarLink: React.FC<ISidebarLink> = ({ to, icon, text, onClick }) => (
<NavLink className='group py-1 rounded-md' to={to} onClick={onClick}>
const SidebarLink: React.FC<ISidebarLink> = ({ href, to, icon, text, onClick }) => {
const body = (
<HStack space={2} alignItems='center'>
<div className='bg-primary-50 dark:bg-slate-700 relative rounded inline-flex p-2'>
<Icon src={icon} className='text-primary-600 h-5 w-5' />
@ -58,8 +58,22 @@ const SidebarLink: React.FC<ISidebarLink> = ({ to, icon, text, onClick }) => (
<Text tag='span' weight='medium' theme='muted' className='group-hover:text-gray-800 dark:group-hover:text-gray-200'>{text}</Text>
</HStack>
</NavLink>
);
);
if (to) {
return (
<NavLink className='group py-1 rounded-md' to={to} onClick={onClick}>
{body}
</NavLink>
);
}
return (
<a className='group py-1 rounded-md' href={href} target='_blank' onClick={onClick}>
{body}
</a>
);
};
const getOtherAccounts = makeGetOtherAccounts();
@ -76,8 +90,6 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
const sidebarOpen = useAppSelector((state) => state.sidebar.sidebarOpen);
const settings = useAppSelector((state) => getSettings(state));
const baseURL = account ? getBaseURL(account) : '';
const closeButtonRef = React.useRef(null);
const [switcher, setSwitcher] = React.useState(false);
@ -220,15 +232,6 @@ const SidebarMenu: React.FC = (): JSX.Element | null => {
/>
)}
{instance.invites_enabled && (
<SidebarLink
to={`${baseURL}/invites`}
icon={require('@tabler/icons/icons/mailbox.svg')}
text={intl.formatMessage(messages.invites)}
onClick={onClose}
/>
)}
{settings.get('isDeveloper') && (
<SidebarLink
to='/developers'