From 1feb551093c5ceaf35dd6c8d0f4084cbe0974e8c Mon Sep 17 00:00:00 2001
From: Sonny <sonnyasdev@gmail.com>
Date: Tue, 21 Nov 2023 17:48:57 +0100
Subject: [PATCH] fix: api favicon call

---
 src/components/Links/LinkFavicon.tsx |  9 +++----
 src/pages/api/favicon.ts             | 37 ++++++++++++++++++++--------
 src/utils/link.ts                    |  3 ---
 3 files changed, 31 insertions(+), 18 deletions(-)
 delete mode 100644 src/utils/link.ts

diff --git a/src/components/Links/LinkFavicon.tsx b/src/components/Links/LinkFavicon.tsx
index f1f8fa6..123b594 100644
--- a/src/components/Links/LinkFavicon.tsx
+++ b/src/components/Links/LinkFavicon.tsx
@@ -3,8 +3,6 @@ import { useState } from "react";
 import { TbLoader3 } from "react-icons/tb";
 import { TfiWorld } from "react-icons/tfi";
 
-import { faviconLinkBuilder } from "utils/link";
-
 import styles from "./links.module.scss";
 
 interface LinkFaviconProps {
@@ -23,11 +21,12 @@ export default function LinkFavicon({
   const [isFailed, setFailed] = useState<boolean>(false);
   const [isLoading, setLoading] = useState<boolean>(true);
 
+  const baseUrlApi =
+    process.env.NEXT_PUBLIC_API_URL || window.location.origin + "/api";
+
   const setFallbackFavicon = () => setFailed(true);
   const handleStopLoading = () => setLoading(false);
 
-  const { origin } = new URL(url);
-
   return (
     <div
       className={styles["favicon"]}
@@ -35,7 +34,7 @@ export default function LinkFavicon({
     >
       {!isFailed ? (
         <Image
-          src={faviconLinkBuilder(origin)}
+          src={`${baseUrlApi}/favicon?urlParam=${url}`}
           onError={() => {
             setFallbackFavicon();
             handleStopLoading();
diff --git a/src/pages/api/favicon.ts b/src/pages/api/favicon.ts
index 072cea4..ee4d568 100644
--- a/src/pages/api/favicon.ts
+++ b/src/pages/api/favicon.ts
@@ -1,16 +1,20 @@
 import { NextApiRequest, NextApiResponse } from "next";
 import { createReadStream } from "node:fs";
 import { resolve } from "node:path";
-import { downloadImageFromUrl, getFavicon, makeRequestWithUserAgent } from "lib/request";
+import {
+  downloadImageFromUrl,
+  getFavicon,
+  makeRequestWithUserAgent,
+} from "lib/request";
 import { Favicon } from "types/types";
 import { buildFaviconUrl, findFaviconPath } from "lib/url";
 import { convertBase64ToBuffer, isBase64Image, isImage } from "lib/image";
 
 export default async function handler(
   req: NextApiRequest,
-  res: NextApiResponse
+  res: NextApiResponse,
 ) {
-  const urlParam = (req.query?.url as string) || "";
+  const urlParam = (req.query?.urlParam as string) || "";
   if (!urlParam) {
     throw new Error("URL is missing");
   }
@@ -19,7 +23,11 @@ export default async function handler(
   try {
     return sendImage(res, await getFavicon(faviconRequestUrl));
   } catch (error) {
-    console.error("[Favicon]", `[first: ${faviconRequestUrl}]`, "Unable to retrieve favicon from favicon.ico url");
+    console.error(
+      "[Favicon]",
+      `[first: ${faviconRequestUrl}]`,
+      "Unable to retrieve favicon from favicon.ico url",
+    );
   }
 
   const requestDocument = await makeRequestWithUserAgent(urlParam);
@@ -27,8 +35,11 @@ export default async function handler(
 
   const faviconPath = findFaviconPath(documentAsText);
   if (!faviconPath) {
-    console.error("[Favicon]", `[first: ${faviconRequestUrl}]`, "No link/href attribute found");
-    console.log(documentAsText);
+    console.error(
+      "[Favicon]",
+      `[first: ${faviconRequestUrl}]`,
+      "No link/href attribute found",
+    );
     return sendDefaultImage(res);
   }
 
@@ -39,17 +50,23 @@ export default async function handler(
     }
 
     if (isBase64Image(faviconPath)) {
-      console.log("[Favicon]", `[second: ${faviconRequestUrl}]`, "info: base64, convert it to buffer");
+      console.log(
+        "[Favicon]",
+        `[second: ${faviconRequestUrl}]`,
+        "info: base64, convert it to buffer",
+      );
       const buffer = convertBase64ToBuffer(faviconPath);
       return sendImage(res, {
         buffer,
         type: "image/x-icon",
         size: buffer.length,
-        url: faviconPath
+        url: faviconPath,
       });
     }
 
-    const finalUrl = buildFaviconUrl(requestDocument.url, faviconPath);
+    const finalUrl = faviconPath.startsWith("http")
+      ? faviconPath
+      : buildFaviconUrl(requestDocument.url, faviconPath);
     const favicon = await downloadImageFromUrl(finalUrl);
     if (!isImage(favicon.type)) {
       throw new Error("Favicon path does not return an image");
@@ -72,7 +89,7 @@ function sendImage(res: NextApiResponse, { buffer, type, size }: Favicon) {
 
 function sendDefaultImage(res: NextApiResponse) {
   const readStream = createReadStream(
-    resolve(process.cwd(), "./public/empty-image.png")
+    resolve(process.cwd(), "./public/empty-image.png"),
   );
   res.writeHead(206);
   readStream.pipe(res);
diff --git a/src/utils/link.ts b/src/utils/link.ts
deleted file mode 100644
index f41fff8..0000000
--- a/src/utils/link.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export function faviconLinkBuilder(origin: string) {
-  return `${process.env.NEXT_PUBLIC_API_URL}/favicon?url=${origin}`;
-}