pleroma/packages/pl-fe/src/components/navlinks.tsx
marcin mikołajczak 966b04fdf0 Call it pl-fe internally
Signed-off-by: marcin mikołajczak <git@mkljczk.pl>
2024-08-28 13:41:08 +02:00

43 lines
1.3 KiB
TypeScript

import React from 'react';
import { Link } from 'react-router-dom';
import { Text } from 'pl-fe/components/ui';
import { useSettings, usePlFeConfig } from 'pl-fe/hooks';
interface INavlinks {
type: string;
}
const Navlinks: React.FC<INavlinks> = ({ type }) => {
const { locale } = useSettings();
const { copyright, navlinks } = usePlFeConfig();
return (
<footer className='relative mx-auto mt-auto max-w-7xl py-8'>
<div className='flex flex-wrap justify-center'>
{navlinks.get(type)?.map((link, idx) => {
const url = link.url;
const isExternal = url.startsWith('http');
const Comp = (isExternal ? 'a' : Link) as 'a';
const compProps = isExternal ? { href: url, target: '_blank' } : { to: url };
return (
<div key={idx} className='px-5 py-2'>
<Comp {...compProps} className='text-primary-600 hover:underline dark:text-primary-400'>
<Text tag='span' theme='inherit' size='sm'>
{(link.getIn(['titleLocales', locale]) || link.get('title')) as string}
</Text>
</Comp>
</div>
);
})}
</div>
<div className='mt-6'>
<Text theme='muted' align='center' size='sm'>{copyright}</Text>
</div>
</footer>
);
};
export { Navlinks };