imporvement: better link check

components/search/search.tsx

@@ -5,6 +5,8 @@ import { settingsState } from "../state/settings";
 import { useTranslations } from "next-intl";
 import { useState } from "react";
 import { normalizeURL } from "@/lib/normalizeURL";
+import validLink from "@/lib/url/valid_link";
+
 export default function Search(props: { onFocus: () => void }) {
     const settings: settings = useRecoilValue(settingsState);
     const t = useTranslations("Search");
@@ -14,20 +16,14 @@ export default function Search(props: { onFocus: () => void }) {
 
     function handleKeydown(e: any) {
         let URL = "";
-        let url_re =
+        if (validLink(query)) {
-            /^https?:\/\/([\w-]+\.)+[\w-]+(\/[\w-./?%&=]*)?:?[0-9]{0,5}\/?[-a-zA-Z0-9_.~!*'();:@&=+$,/?#\[\]%]*$/;
-        let domain_re =
-            /^[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(\.[a-zA-Z][-a-zA-Z]{0,62})+\.?:?[0-9]{0,5}\/?[-a-zA-Z0-9_.~!*'();:@&=+$,/?#\[\]%]*$/;
-        let ip_re =
-            /^((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})(\.((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})){3}:?[0-9]{0,5}\/?[-a-zA-Z0-9_.~!*'();:@&=+$,/?#\[\]%]*$/;
-        if (url_re.test(query) || domain_re.test(query) || ip_re.test(query)) {
             URL = normalizeURL(query);
         } else {
             URL = settings.searchEngines[settings.currentSearchEngine];
             URL = URL.replace("%s", query);
         }
         if (e.key == "Enter") {
-            location.href=URL;
+            location.href = URL;
         }
     }
 

lib/url/valid_link.ts

@@ -0,0 +1,33 @@
+import punycode from "punycode/";
+import { tldList } from "./tld_list";
+
+export default function validLink(link: string) {
+    let finalURL = '';
+    try {
+        const url = new URL(link);
+        finalURL = url.origin;
+    } catch (error) {
+        // if the URL is invalid, try to add the protocol
+        try {
+            const urlWithHTTP = new URL("http://" + link);
+            finalURL = urlWithHTTP.origin;
+        } catch (error) {
+            return false;
+        }
+    }
+    if (validTLD(finalURL)) {
+        return true;
+    } else {
+        return false;
+    }
+}
+
+function validTLD(domain: string): boolean {
+    const tld = punycode.toUnicode(domain.split(".").reverse()[0]);
+    console.log(tld);
+    if (tldList.includes(tld)) {
+        return true;
+    } else {
+        return false;
+    }
+}

package.json

@@ -6,13 +6,15 @@
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint"
+    "lint": "next lint",
+    "test": "jest"
   },
   "dependencies": {
     "clsx": "^2.1.0",
     "framer-motion": "^11.0.24",
     "next": "14.1.1",
     "next-intl": "^3.10.0",
+    "punycode": "^2.3.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "recoil": "^0.7.7",
@@ -21,13 +23,18 @@
     "validate-color": "^2.2.4"
   },
   "devDependencies": {
+    "@jest/globals": "^29.7.0",
+    "@types/jest": "^29.5.12",
     "@types/node": "^20",
+    "@types/punycode": "^2.1.4",
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "@types/valid-url": "^1.0.7",
     "autoprefixer": "^10.0.1",
+    "jest": "^29.7.0",
     "postcss": "^8",
     "tailwindcss": "^3.3.0",
+    "ts-jest": "^29.1.2",
     "typescript": "^5"
   }
 }