small fix

components/Modal/Link/LinkDetails.tsx

@@ -3,7 +3,7 @@ import {
   LinkIncludingShortenedCollectionAndTags,
 } from "@/types/global";
 import Image from "next/image";
-import ColorThief, { RGBColor } from "colorthief";
+// import ColorThief, { RGBColor } from "colorthief";
 import { useEffect, useState } from "react";
 import Link from "next/link";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -53,47 +53,47 @@ export default function LinkDetails({ link }: Props) {
     );
   }, [collections]);
 
-  const [colorPalette, setColorPalette] = useState<RGBColor[]>();
+  // const [colorPalette, setColorPalette] = useState<RGBColor[]>();
 
-  const colorThief = new ColorThief();
+  // const colorThief = new ColorThief();
 
   const url = isValidUrl(link.url) ? new URL(link.url) : undefined;
 
-  const rgbToHex = (r: number, g: number, b: number): string =>
+  // const rgbToHex = (r: number, g: number, b: number): string =>
-    "#" +
+  //   "#" +
-    [r, g, b]
+  //   [r, g, b]
-      .map((x) => {
+  //     .map((x) => {
-        const hex = x.toString(16);
+  //       const hex = x.toString(16);
-        return hex.length === 1 ? "0" + hex : hex;
+  //       return hex.length === 1 ? "0" + hex : hex;
-      })
+  //     })
-      .join("");
+  //     .join("");
 
-  useEffect(() => {
+  // useEffect(() => {
-    const banner = document.getElementById("link-banner");
+  //   const banner = document.getElementById("link-banner");
-    const bannerInner = document.getElementById("link-banner-inner");
+  //   const bannerInner = document.getElementById("link-banner-inner");
 
-    if (colorPalette && banner && bannerInner) {
+  //   if (colorPalette && banner && bannerInner) {
-      banner.style.background = `linear-gradient(to right, ${rgbToHex(
+  //     banner.style.background = `linear-gradient(to right, ${rgbToHex(
-        colorPalette[0][0],
+  //       colorPalette[0][0],
-        colorPalette[0][1],
+  //       colorPalette[0][1],
-        colorPalette[0][2]
+  //       colorPalette[0][2]
-      )}, ${rgbToHex(
+  //     )}, ${rgbToHex(
-        colorPalette[1][0],
+  //       colorPalette[1][0],
-        colorPalette[1][1],
+  //       colorPalette[1][1],
-        colorPalette[1][2]
+  //       colorPalette[1][2]
-      )})`;
+  //     )})`;
 
-      bannerInner.style.background = `linear-gradient(to right, ${rgbToHex(
+  //     bannerInner.style.background = `linear-gradient(to right, ${rgbToHex(
-        colorPalette[2][0],
+  //       colorPalette[2][0],
-        colorPalette[2][1],
+  //       colorPalette[2][1],
-        colorPalette[2][2]
+  //       colorPalette[2][2]
-      )}, ${rgbToHex(
+  //     )}, ${rgbToHex(
-        colorPalette[3][0],
+  //       colorPalette[3][0],
-        colorPalette[3][1],
+  //       colorPalette[3][1],
-        colorPalette[3][2]
+  //       colorPalette[3][2]
-      )})`;
+  //     )})`;
-    }
+  //   }
-  }, [colorPalette]);
+  // }, [colorPalette]);
 
   const handleDownload = (format: "png" | "pdf") => {
     const path = `/api/archives/${link.collection.id}/${link.id}.${format}`;
@@ -133,19 +133,19 @@ export default function LinkDetails({ link }: Props) {
             id={"favicon-" + link.id}
             className="select-none mt-2 rounded-full shadow border-[3px] border-white bg-white aspect-square"
             draggable="false"
-            onLoad={(e) => {
+            // onLoad={(e) => {
-              try {
+            //   try {
-                const color = colorThief.getPalette(
+            //     const color = colorThief.getPalette(
-                  e.target as HTMLImageElement,
+            //       e.target as HTMLImageElement,
-                  4,
+            //       4,
-                  20
+            //       20
-                );
+            //     );
 
-                setColorPalette(color);
+            //     setColorPalette(color);
-              } catch (err) {
+            //   } catch (err) {
-                console.log(err);
+            //     console.log(err);
-              }
+            //   }
-            }}
+            // }}
             onError={(e) => {
               setImageError(true);
             }}

components/SortDropdown.tsx

@@ -21,7 +21,7 @@ export default function SortDropdown({
         const target = e.target as HTMLInputElement;
         if (target.id !== "sort-dropdown") toggleSortDropdown();
       }}
-      className="absolute top-8 right-0 border border-sky-100 shadow-md bg-gray-50 rounded-md p-2 z-10 w-48"
+      className="absolute top-8 right-0 border border-sky-100 shadow-md bg-gray-50 rounded-md p-2 z-20 w-48"
     >
       <p className="mb-2 text-sky-900 text-center font-semibold">Sort by</p>
       <div className="flex flex-col gap-2">

e2e/example.spec.ts

@@ -1,18 +0,0 @@
-import { test, expect } from '@playwright/test';
-
-test('has title', async ({ page }) => {
-  await page.goto('https://playwright.dev/');
-
-  // Expect a title "to contain" a substring.
-  await expect(page).toHaveTitle(/Playwright/);
-});
-
-test('get started link', async ({ page }) => {
-  await page.goto('https://playwright.dev/');
-
-  // Click the get started link.
-  await page.getByRole('link', { name: 'Get started' }).click();
-
-  // Expects the URL to contain intro.
-  await expect(page).toHaveURL(/.*intro/);
-});

lib/api/archive.ts

@@ -1,8 +1,5 @@
 import { Page, chromium, devices } from "playwright";
 import { prisma } from "@/lib/api/db";
-// import puppeteer from "puppeteer-extra";
-// import AdblockerPlugin from "puppeteer-extra-plugin-adblocker";
-// import StealthPlugin from "puppeteer-extra-plugin-stealth";
 import createFile from "@/lib/api/storage/createFile";
 
 export default async function archive(
@@ -15,14 +12,8 @@ export default async function archive(
   const page = await context.newPage();
 
   try {
-    // puppeteer.use(AdblockerPlugin()).use(StealthPlugin());
-
-    // const page = await browser.newPage();
-
     await page.goto(url, { waitUntil: "domcontentloaded", timeout: 300000 });
 
-    // await page.setViewport({ width: 1080, height: 1024 });
-
     await autoScroll(page);
 
     const linkExists = await prisma.link.findUnique({

package.json

@@ -31,15 +31,10 @@
     "crypto-js": "^4.1.1",
     "eslint": "8.33.0",
     "eslint-config-next": "13.1.6",
-    "multer": "^1.4.5-lts.1",
     "next": "13.1.6",
     "next-auth": "^4.22.1",
     "nodemailer": "^6.9.3",
     "playwright": "^1.35.1",
-    "puppeteer": "^19.8.0",
-    "puppeteer-extra": "^3.3.6",
-    "puppeteer-extra-plugin-adblocker": "^2.13.6",
-    "puppeteer-extra-plugin-stealth": "^2.11.2",
     "react": "18.2.0",
     "react-colorful": "^5.6.1",
     "react-dom": "18.2.0",
@@ -52,7 +47,6 @@
   "devDependencies": {
     "@playwright/test": "^1.35.1",
     "@types/bcrypt": "^5.0.0",
-    "@types/multer": "^1.4.7",
     "autoprefixer": "^10.4.14",
     "postcss": "^8.4.24",
     "prisma": "^4.9.0",