QOL

Signed-off-by: Hadi <112569860+anotherhadi@users.noreply.github.com>

front/src/lib/components/index/search/datawells.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
   import type { Dataleak } from "$src/lib/types";
-  import { Replace, Search } from "@lucide/svelte";
+  import { Database, Replace, Search } from "@lucide/svelte";
 
   let {
     dataleaks,
@@ -42,6 +42,16 @@
     }
   });
 
+  function getDomain(dataleakName: string) {
+    const firstPart = dataleakName.split(" ")[0].toLowerCase();
+    const domainRegex =
+      /^(?:[a-z0-9](?:[a-z0-9-]{0,61}[a-z0-9])?\.)+[a-z]{2,}$/;
+    if (domainRegex.test(firstPart)) {
+      return firstPart;
+    }
+    return null;
+  }
+
   function previousPage() {
     if (page > 1) {
       page--;
@@ -66,6 +76,7 @@
       <!-- head -->
       <thead>
         <tr>
+          <th></th>
           <th>Name</th>
           <th>Number of rows</th>
           {#if showColumns}
@@ -77,6 +88,25 @@
         {#if paginatedDataleaks.length > 0}
           {#each paginatedDataleaks as item}
             <tr class="hover:bg-base-300">
+              <th>
+                <div>
+                  {#if getDomain(item.Name)}
+                    <img
+                      src="https://icons.duckduckgo.com/ip3/{getDomain(
+                        item.Name,
+                      )}.ico"
+                      class="size-8 rounded-xl bg-neutral"
+                      alt="Favicon de {getDomain(item.Name)}"
+                    />
+                  {:else}
+                    <div
+                      class="size-8 rounded-xl bg-neutral items-center justify-center flex"
+                    >
+                      <Database class="text-neutral-content" />
+                    </div>
+                  {/if}
+                </div>
+              </th>
               <th>
                 {item.Name}
               </th>
@@ -90,7 +120,7 @@
           {/each}
         {:else}
           <tr class="hover:bg-base-300">
-            <td colspan={3} class="text-center leading-9"
+            <td colspan={100} class="text-center leading-9"
               ><span class="text-3xl">(·.·)</span><br />No data wells found</td
             >
           </tr>

front/src/lib/components/index/search/id/row.svelte

@@ -63,19 +63,19 @@
       <div
         class="size-10 rounded-box bg-neutral items-center justify-center flex"
       >
-        <Key />
+        <Key class="text-neutral-content" />
       </div>
     {:else if row["email"] !== null}
       <div
         class="size-10 rounded-box bg-neutral items-center justify-center flex"
       >
-        <Mail />
+        <Mail class="text-neutral-content" />
       </div>
     {:else}
       <div
         class="size-10 rounded-box bg-neutral items-center justify-center flex"
       >
-        <Database />
+        <Database class="text-neutral-content" />
       </div>
     {/if}
   </div>

front/src/lib/components/index/search/searchbar.svelte

@@ -43,7 +43,14 @@
     axios
       .post(
         `${$serverUrl}/search`,
-        { Text: query, Column: activeFilter, ExactMatch: exactMatch, Datawells: datawells, GithubRecon: githubRecon, GravatarRecon: gravatarRecon },
+        {
+          Text: query,
+          Column: activeFilter,
+          ExactMatch: exactMatch,
+          Datawells: datawells,
+          GithubRecon: githubRecon,
+          GravatarRecon: gravatarRecon,
+        },
         {
           headers: {
             "Content-Type": "application/json",
@@ -84,10 +91,13 @@
       {/each}
     </div>
 
-    <details class="dropdown dropdown-end">
+    <div class="dropdown dropdown-end">
-      <summary class="btn btn-square m-1"><Settings size={16} /></summary>
+      <div tabindex="0" role="button" class="btn m-1 btn-square btn-soft">
+        <Settings size={16} />
+      </div>
       <ul
-        class="menu dropdown-content bg-base-200 rounded-box z-1 w-52 p-2 shadow-sm"
+        tabindex="-1"
+        class="dropdown-content menu bg-base-100 rounded-box z-1 w-52 p-2 shadow-sm"
       >
         <li>
           <label class="label">
@@ -97,18 +107,26 @@
         </li>
         <li>
           <label class="label">
-            <input type="checkbox" bind:checked={githubRecon} class="checkbox" />
+            <input
+              type="checkbox"
+              bind:checked={githubRecon}
+              class="checkbox"
+            />
             Github Recon
           </label>
         </li>
         <li>
           <label class="label">
-            <input type="checkbox" bind:checked={gravatarRecon} class="checkbox" />
+            <input
+              type="checkbox"
+              bind:checked={gravatarRecon}
+              class="checkbox"
+            />
             Gravatar Recon
           </label>
         </li>
       </ul>
-    </details>
+    </div>
   </div>
 
   <form