53 lines
1.3 KiB
TypeScript
53 lines
1.3 KiB
TypeScript
import { Stack, Text } from '@mantine/core';
|
|
import { useCommonHooks } from 'hooks';
|
|
import { textClasses } from 'styles';
|
|
import LinkGroups from './LinkGroups';
|
|
|
|
function Links({ contentType }: any) {
|
|
const { isMobile, linksIsFetched, groupsIsFetched, groupData, bookmarkData } =
|
|
useCommonHooks();
|
|
return (
|
|
<>
|
|
{groupsIsFetched &&
|
|
linksIsFetched &&
|
|
groupData?.length > 0 &&
|
|
contentType.length > 0 && (
|
|
<Stack id='links' style={{ gap: 0 }}>
|
|
<Text className={textClasses.sectionTitle} classNames={textClasses}>
|
|
Bookmarks
|
|
</Text>
|
|
<Stack
|
|
style={{
|
|
display: 'grid',
|
|
flexWrap: 'nowrap',
|
|
gridColumnGap: '20px',
|
|
gridRowGap: '0px',
|
|
gridTemplateColumns: isMobile ? '1fr 1fr' : '1fr 1fr 1fr 1fr 1fr',
|
|
gridTemplateRows: 'auto',
|
|
}}
|
|
>
|
|
{groupData.map((category: any) => {
|
|
if (
|
|
contentType.includes(category.filterName) ||
|
|
contentType.includes('All')
|
|
) {
|
|
return (
|
|
<LinkGroups
|
|
key={category}
|
|
category={category.categoryName}
|
|
links={bookmarkData.filter(
|
|
(bookmark: any) => bookmark.category === category.categoryName,
|
|
)}
|
|
/>
|
|
);
|
|
}
|
|
})}
|
|
</Stack>
|
|
</Stack>
|
|
)}
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default Links;
|