From 099784699a3084fcfd3f4a5a7accb548953283e0 Mon Sep 17 00:00:00 2001 From: Daniel Date: Mon, 12 Jun 2023 01:58:37 +0330 Subject: [PATCH] minor changes and improvements --- components/CollectionCard.tsx | 19 ++- components/Dashboard/CollectionItem.tsx | 55 ------- components/Dashboard/LinkItem.tsx | 195 ------------------------ components/Sidebar.tsx | 4 +- lib/api/archive.ts | 7 +- lib/api/controllers/tags/getTags.ts | 12 +- pages/dashboard.tsx | 17 +-- pages/links.tsx | 4 +- 8 files changed, 36 insertions(+), 277 deletions(-) delete mode 100644 components/Dashboard/CollectionItem.tsx delete mode 100644 components/Dashboard/LinkItem.tsx diff --git a/components/CollectionCard.tsx b/components/CollectionCard.tsx index fed3b1f..622e066 100644 --- a/components/CollectionCard.tsx +++ b/components/CollectionCard.tsx @@ -1,5 +1,5 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { faEllipsis } from "@fortawesome/free-solid-svg-icons"; +import { faEllipsis, faLink } from "@fortawesome/free-solid-svg-icons"; import Link from "next/link"; import { CollectionIncludingMembers } from "@/types/global"; import useLinkStore from "@/store/links"; @@ -8,6 +8,7 @@ import { useState } from "react"; import Modal from "@/components/Modal"; import CollectionModal from "@/components/Modal/Collection"; import ProfilePhoto from "./ProfilePhoto"; +import { faCalendarDays } from "@fortawesome/free-regular-svg-icons"; export default function CollectionCard({ collection, @@ -80,11 +81,17 @@ export default function CollectionCard({ ) : null}
-

- {links.filter((e) => e.collectionId === collection.id).length}{" "} - Links -

-

{formattedDate}

+
+ + {links.filter((e) => e.collectionId === collection.id).length} +
+
+ +

{formattedDate}

+
diff --git a/components/Dashboard/CollectionItem.tsx b/components/Dashboard/CollectionItem.tsx deleted file mode 100644 index 4e64e88..0000000 --- a/components/Dashboard/CollectionItem.tsx +++ /dev/null @@ -1,55 +0,0 @@ -import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { faChevronRight } from "@fortawesome/free-solid-svg-icons"; -import Link from "next/link"; -import { CollectionIncludingMembers } from "@/types/global"; -import useLinkStore from "@/store/links"; - -export default function CollectionItem({ - collection, -}: { - collection: CollectionIncludingMembers; -}) { - const { links } = useLinkStore(); - - return ( - -
-
-
-
-

{collection.name}

-

{collection.description}

-
- - -
-
-
-

Members:

- {collection.members.map((e, i) => { - return ( -

- {e.user.name} -

- ); - })} -
-
-

- {links.filter((e) => e.collectionId === collection.id).length} Links -

-
-
- - ); -} diff --git a/components/Dashboard/LinkItem.tsx b/components/Dashboard/LinkItem.tsx deleted file mode 100644 index 152178c..0000000 --- a/components/Dashboard/LinkItem.tsx +++ /dev/null @@ -1,195 +0,0 @@ -import { LinkIncludingCollectionAndTags } from "@/types/global"; -import { - faFolder, - faArrowUpRightFromSquare, - faEllipsis, -} from "@fortawesome/free-solid-svg-icons"; -import { faFileImage, faFilePdf } from "@fortawesome/free-regular-svg-icons"; -import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { useState } from "react"; -import Image from "next/image"; -import useLinkStore from "@/store/links"; -import LinkModal from "../Modal/LinkModal"; -import Link from "next/link"; -import Dropdown from "../Dropdown"; -import Modal from "../Modal"; - -type Props = { - link: LinkIncludingCollectionAndTags; - count: number; -}; - -export default function LinkItem({ link, count }: Props) { - const [expandDropdown, setExpandDropdown] = useState(false); - const [editModal, setEditModal] = useState(false); - - const { removeLink } = useLinkStore(); - - const url = new URL(link.url); - const formattedDate = new Date(link.createdAt as string).toLocaleString( - "en-US", - { - year: "numeric", - month: "short", - day: "numeric", - } - ); - - const toggleEditModal = () => { - setEditModal(!editModal); - }; - - return ( -
- {editModal ? ( - - - - ) : null} - - { - const target = e.target as HTMLElement; - target.style.opacity = "0"; - }} - /> - { - const target = e.target as HTMLElement; - target.style.opacity = "0"; - }} - /> -
-
-
-

{count + 1}.

-

{link.name}

-
-

{link.title}

-
- -
- -

{link.collection.name}

-
- - -
- {link.tags.map((e, i) => ( - -

- # {e.name} -

- - ))} -
-
-
-

{formattedDate}

- -
-

{url.host}

- -
- -
-
- -
-
setExpandDropdown(!expandDropdown)} - id="expand-dropdown" - className="text-gray-500 inline-flex rounded-md cursor-pointer hover:bg-white hover:outline outline-sky-100 outline-1 duration-100 p-1" - > - -
-
- -
- - {expandDropdown ? ( - { - setEditModal(true); - setExpandDropdown(false); - }, - }, - { - name: "Delete", - onClick: () => { - removeLink(link); - setExpandDropdown(false); - }, - }, - ]} - onClickOutside={(e: Event) => { - const target = e.target as HTMLInputElement; - if (target.id !== "expand-dropdown") setExpandDropdown(false); - }} - className="absolute top-8 right-0 w-36" - /> - ) : null} -
-
-
- ); -} diff --git a/components/Sidebar.tsx b/components/Sidebar.tsx index c9074e6..95c24d6 100644 --- a/components/Sidebar.tsx +++ b/components/Sidebar.tsx @@ -4,9 +4,9 @@ import { faFolder, faBox, faHashtag, - faBookmark, faChartSimple, faChevronDown, + faLink, } from "@fortawesome/free-solid-svg-icons"; import useTagStore from "@/store/tags"; import Link from "next/link"; @@ -97,7 +97,7 @@ export default function Sidebar({ className }: { className?: string }) { } outline-sky-100 outline-1 duration-100 py-1 px-2 rounded-md cursor-pointer flex items-center gap-2`} >

All Links

diff --git a/lib/api/archive.ts b/lib/api/archive.ts index ce79889..6aaa5bd 100644 --- a/lib/api/archive.ts +++ b/lib/api/archive.ts @@ -32,7 +32,12 @@ export default async function archive( if (linkExists) { await Promise.all([ - page.pdf({ path: archivePath + ".pdf", format: "a4" }), + page.pdf({ + path: archivePath + ".pdf", + format: "a4", + printBackground: true, + margin: { top: "15px", bottom: "15px" }, + }), page.screenshot({ fullPage: true, path: archivePath + ".png" }), ]); } diff --git a/lib/api/controllers/tags/getTags.ts b/lib/api/controllers/tags/getTags.ts index 68de85a..e1b007f 100644 --- a/lib/api/controllers/tags/getTags.ts +++ b/lib/api/controllers/tags/getTags.ts @@ -1,7 +1,7 @@ import { prisma } from "@/lib/api/db"; export default async function getTags(userId: number) { - // remove empty tags + // Remove empty tags await prisma.tag.deleteMany({ where: { ownerId: userId, @@ -30,11 +30,11 @@ export default async function getTags(userId: number) { }, ], }, - orderBy: { - links: { - _count: "desc", - }, - }, + // orderBy: { + // links: { + // _count: "desc", + // }, + // }, }); return { response: tags, status: 200 }; diff --git a/pages/dashboard.tsx b/pages/dashboard.tsx index f8f150e..7146d29 100644 --- a/pages/dashboard.tsx +++ b/pages/dashboard.tsx @@ -4,9 +4,9 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import MainLayout from "@/layouts/MainLayout"; import useLinkStore from "@/store/links"; import useTagStore from "@/store/tags"; -import LinkItem from "@/components/Dashboard/LinkItem"; +import LinkCard from "@/components/LinkCard"; import Link from "next/link"; -import CollectionItem from "@/components/Dashboard/CollectionItem"; +import CollectionCard from "@/components/CollectionCard"; import { useEffect, useState } from "react"; export default function Dashboard() { @@ -68,7 +68,7 @@ export default function Dashboard() {
-
+

Recently added Links

@@ -89,11 +89,11 @@ export default function Dashboard() { ) .slice(0, 5) .map((e, i) => ( - + ))}
-
+

Top Collections

@@ -107,14 +107,11 @@ export default function Dashboard() {
{sortedCollections.map((e, i) => ( - + ))}
-
-
-

Top Tags

-
+
{tags.slice(0, 19).map((e, i) => (