refactor: rename link_list with a proper name

This commit is contained in:
Sonny
2024-05-14 13:19:49 +02:00
committed by Sonny
parent c916b5870b
commit 5a8bda0322
6 changed files with 40 additions and 30 deletions

View File

@@ -4,8 +4,8 @@ import { RxHamburgerMenu } from 'react-icons/rx';
import CollectionControls from '~/components/dashboard/collection/collection_controls';
import CollectionDescription from '~/components/dashboard/collection/collection_description';
import CollectionHeader from '~/components/dashboard/collection/collection_header';
import LinkItem from '~/components/dashboard/link_list/link_item';
import { NoCollection, NoLink } from '~/components/dashboard/link_list/no_item';
import LinkList from '~/components/dashboard/link/link_list';
import { NoCollection } from '~/components/dashboard/link/no_item';
import Footer from '~/components/footer/footer';
import useActiveCollection from '~/hooks/use_active_collection';
@@ -32,15 +32,15 @@ const CollectionHeaderWrapper = styled.h2(({ theme }) => ({
},
}));
interface LinksProps {
interface CollectionContainerProps {
isMobile: boolean;
openSideMenu: () => void;
}
export default function Links({
export default function CollectionContainer({
isMobile,
openSideMenu,
}: Readonly<LinksProps>) {
}: Readonly<CollectionContainerProps>) {
const { activeCollection } = useActiveCollection();
if (activeCollection === null) {
@@ -66,29 +66,8 @@ export default function Links({
<CollectionControls />
</CollectionHeaderWrapper>
<CollectionDescription />
{activeCollection?.links.length !== 0 ? (
<LinkListStyle>
{activeCollection?.links.map((link) => (
<LinkItem link={link} key={link.id} showUserControls />
))}
</LinkListStyle>
) : (
<NoLink />
)}
<LinkList links={activeCollection.links} />
<Footer />
</LinksWrapper>
);
}
const LinkListStyle = styled.ul({
height: '100%',
width: '100%',
minWidth: 0,
display: 'flex',
flex: 1,
gap: '0.5em',
padding: '3px',
flexDirection: 'column',
overflowX: 'hidden',
overflowY: 'scroll',
});

View File

@@ -3,7 +3,7 @@ import styled from '@emotion/styled';
import { AiFillStar } from 'react-icons/ai';
import ExternalLink from '~/components/common/external_link';
import LinkFavicon from '~/components/dashboard/link/link_favicon';
import LinkControls from '~/components/dashboard/link_list/link_controls';
import LinkControls from '~/components/dashboard/link/link_controls';
const LinkWrapper = styled.li(({ theme }) => ({
userSelect: 'none',

View File

@@ -0,0 +1,31 @@
import type Link from '#models/link';
import styled from '@emotion/styled';
import LinkItem from '~/components/dashboard/link/link_item';
import { NoLink } from '~/components/dashboard/link/no_item';
const LinkListStyle = styled.ul({
height: '100%',
width: '100%',
minWidth: 0,
display: 'flex',
flex: 1,
gap: '0.5em',
padding: '3px',
flexDirection: 'column',
overflowX: 'hidden',
overflowY: 'scroll',
});
export default function LinkList({ links }: { links: Link[] }) {
if (links.length === 0) {
return <NoLink />;
}
return (
<LinkListStyle>
{links.map((link) => (
<LinkItem link={link} key={link.id} showUserControls />
))}
</LinkListStyle>
);
}

View File

@@ -7,7 +7,7 @@ import { router } from '@inertiajs/react';
import { ReactNode, useEffect, useMemo, useState } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';
import { useSwipeable } from 'react-swipeable';
import Links from '~/components/dashboard/link_list/link_list';
import CollectionContainer from '~/components/dashboard/collection/collection_container';
import SideNavigation from '~/components/dashboard/side_nav/side_navigation';
import SwiperHandler from '~/components/dashboard/swiper_handler';
import DashboardLayout from '~/components/layouts/dashboard_layout';
@@ -54,7 +54,7 @@ export default function DashboardPage(props: Readonly<DashboardPageProps>) {
<SideNavigation />
</SideBar>
)}
<Links isMobile={isMobile} openSideMenu={open} />
<CollectionContainer isMobile={isMobile} openSideMenu={open} />
</SwiperHandler>
</DashboardProviders>
</DashboardLayout>