refactor: rename link_list with a proper name

inertia/components/dashboard/collection/collection_container.tsx

@@ -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 LinkList from '~/components/dashboard/link/link_list';
-import { NoCollection, NoLink } from '~/components/dashboard/link_list/no_item';
+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 ? (
+      <LinkList links={activeCollection.links} />
-        <LinkListStyle>
-          {activeCollection?.links.map((link) => (
-            <LinkItem link={link} key={link.id} showUserControls />
-          ))}
-        </LinkListStyle>
-      ) : (
-        <NoLink />
-      )}
       <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',
-});

inertia/components/dashboard/link/link_item.tsx

@@ -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',

inertia/components/dashboard/link/link_list.tsx

@@ -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>
+  );
+}

inertia/pages/dashboard.tsx

@@ -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>