From 216e2f09b62461c69f283da0eb89afb2ae789d89 Mon Sep 17 00:00:00 2001
From: MatteoGabriele <m.gabriele.dev@gmail.com>
Date: Wed, 22 Apr 2026 11:47:44 +0200
Subject: [PATCH 1/3] feat: adds fuzzy search in the automation list page

---
 app/components/Verified/AutomationList.vue |   5 +-
 app/composables/useVerifiedAutomations.ts  |   2 +-
 app/layouts/default.vue                    |   2 +-
 app/layouts/minimal.vue                    |  17 ++
 app/pages/automations.vue                  | 170 ++++++++++++--------
 app/pages/privacy-policy.vue               | 173 +++++++++++----------
 6 files changed, 214 insertions(+), 155 deletions(-)
 create mode 100644 app/layouts/minimal.vue

diff --git a/app/components/Verified/AutomationList.vue b/app/components/Verified/AutomationList.vue
index 830d757..fd4080b 100644
--- a/app/components/Verified/AutomationList.vue
+++ b/app/components/Verified/AutomationList.vue
@@ -1,9 +1,10 @@
 <script setup lang="ts">
 const { data, pending } = useVerifiedAutomations();
 
+const MAX_VISIBLE = 10;
 const recentAutomations = computed<VerifiedAutomation[]>(() => {
   const items = data.value ?? [];
-  return items.toReversed().slice(0, 3);
+  return items.toReversed().slice(0, MAX_VISIBLE);
 });
 </script>
 
@@ -18,7 +19,7 @@ const recentAutomations = computed<VerifiedAutomation[]>(() => {
     <div class="flex flex-wrap items-center justify-center gap-2">
       <template v-if="pending">
         <div
-          v-for="i in 3"
+          v-for="i in MAX_VISIBLE"
           :key="`skeleton-${i}`"
           class="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full border border-gh-border/40"
         >
diff --git a/app/composables/useVerifiedAutomations.ts b/app/composables/useVerifiedAutomations.ts
index 0b3f068..b25b20f 100644
--- a/app/composables/useVerifiedAutomations.ts
+++ b/app/composables/useVerifiedAutomations.ts
@@ -1,7 +1,7 @@
 import type { VerifiedAutomation } from "~~/shared/types/automation";
 
 export function useVerifiedAutomations() {
-  return useLazyAsyncData("verified-list", async () => {
+  return useAsyncData("verified-list", async () => {
     return $fetch<VerifiedAutomation[]>("/api/verified-automations");
   });
 }
diff --git a/app/layouts/default.vue b/app/layouts/default.vue
index 20e3aa1..a355aa3 100644
--- a/app/layouts/default.vue
+++ b/app/layouts/default.vue
@@ -47,7 +47,7 @@ const isHomePage = computed<boolean>(() => route.name === "index");
 
   <div class="flex flex-col">
     <main
-      class="max-w-screen-sm mx-auto px-4 py-20 @container w-full min-h-screen flex flex-col"
+      class="max-w-screen-md mx-auto px-4 py-20 @container w-full min-h-screen flex flex-col"
       :class="{ 'justify-center': isHomePage }"
     >
       <MainLogo :heading-level="isHomePage ? 'h1' : 'h2'" />
diff --git a/app/layouts/minimal.vue b/app/layouts/minimal.vue
new file mode 100644
index 0000000..42647f8
--- /dev/null
+++ b/app/layouts/minimal.vue
@@ -0,0 +1,17 @@
+<script setup lang="ts"></script>
+
+<template>
+  <div class="mx-auto max-w-2xl p-6 pb-12 w-full">
+    <button
+      @click="$router.back()"
+      class="text-gh-muted hover:text-gh-text transition-colors flex items-center gap-2"
+    >
+      <span class="text-lg i-carbon:arrow-left"></span>
+      Go back
+    </button>
+
+    <div class="mt-8">
+      <slot />
+    </div>
+  </div>
+</template>
diff --git a/app/pages/automations.vue b/app/pages/automations.vue
index 751833f..5d626bc 100644
--- a/app/pages/automations.vue
+++ b/app/pages/automations.vue
@@ -1,10 +1,34 @@
 <script setup lang="ts">
 const { data, status, error } = useVerifiedAutomations();
+const search = ref("");
 
 const items = computed(() => {
   return data.value?.toReversed() ?? [];
 });
 
+const fuzzySearch = (query: string, text: string): boolean => {
+  const q = query.toLowerCase();
+  let textIndex = 0;
+
+  for (let i = 0; i < q.length; i++) {
+    textIndex = text.toLowerCase().indexOf(q[i] ?? "", textIndex);
+    if (textIndex === -1) return false;
+    textIndex++;
+  }
+
+  return true;
+};
+
+const filteredItems = computed(() => {
+  if (!search.value.trim()) return items.value;
+
+  return items.value.filter((item) => fuzzySearch(search.value, item.username));
+});
+
+definePageMeta({
+  layout: "minimal",
+});
+
 useHead({
   title: "Verified automations | AgentScan",
   meta: [
@@ -19,9 +43,13 @@ useHead({
 </script>
 
 <template>
-  <div class="mx-auto max-w-2xl px-6 py-16 w-full">
-    <h1 class="text-2xl font-semibold">Community verified automation list</h1>
-    <p v-if="items?.[0]" class="mt-2 text-sm text-gray-500">
+  <header class="text-center md:text-left">
+    <h1 class="text-2xl font-semibold">Community verified automations</h1>
+    <p class="text-gh-muted mt-1">
+      This is a list of accounts verified by the community as using heavy
+      automation, spamming through automation, or operating as bots.
+    </p>
+    <p v-if="items?.[0]" class="mt-6 text-sm text-gray-500">
       Last updated:
 
       <span
@@ -31,72 +59,82 @@ useHead({
       <NuxtTime v-else :datetime="items[0].createdAt" />
     </p>
 
-    <div v-if="status === 'pending'" class="mt-12">
-      <ul class="flex flex-col gap-4 w-full">
-        <li
-          v-for="item in 3"
-          :key="item"
-          class="not-last:border-b border-gh-border-light pb-6 mb-2"
-        >
-          <article>
-            <div class="w-full animate-pulse">
-              <div class="mb-4">
-                <div class="h-6 bg-gh-border rounded w-1/3" />
-              </div>
-              <div class="space-y-4">
-                <div class="h-3 bg-gh-border rounded w-5/6" />
-                <div class="h-3 bg-gh-border rounded w-4/6" />
-              </div>
+    <input
+      v-model="search"
+      type="text"
+      placeholder="Search by username..."
+      class="mt-12 w-full px-3 py-2 bg-gh-bg border border-gh-border rounded text-sm text-gh-text placeholder:text-gh-muted focus:outline-none focus:border-gh-border/80"
+    />
+  </header>
+
+  <div v-if="status === 'pending'" class="mt-12">
+    <ul class="flex flex-col gap-4 w-full">
+      <li
+        v-for="item in 3"
+        :key="item"
+        class="not-last:border-b border-gh-border-light pb-6 mb-2"
+      >
+        <article>
+          <div class="w-full animate-pulse">
+            <div class="mb-4">
+              <div class="h-6 bg-gh-border rounded w-1/3" />
+            </div>
+            <div class="space-y-4">
+              <div class="h-3 bg-gh-border rounded w-5/6" />
+              <div class="h-3 bg-gh-border rounded w-4/6" />
             </div>
-            <footer
-              class="flex items-baseline justify-between mt-4 animate-pulse"
+          </div>
+          <footer
+            class="flex items-baseline justify-between mt-4 animate-pulse"
+          >
+            <div class="h-3 bg-gh-border rounded w-20" />
+            <div class="h-3 bg-gh-border rounded w-20" />
+          </footer>
+        </article>
+      </li>
+    </ul>
+  </div>
+  <div v-else-if="error">
+    {{ error.message }}
+  </div>
+  <div v-else-if="data" class="mt-12">
+    <ul class="flex flex-col gap-4">
+      <li v-if="filteredItems.length === 0">
+        No account has been found under "{{ search }}"
+      </li>
+      <li
+        v-for="item in filteredItems"
+        :key="item.username"
+        class="not-last:border-b border-gh-border-light pb-6 mb-2"
+      >
+        <article>
+          <h2>
+            <NuxtLink
+              :to="`/user/${item.username}`"
+              class="text-xl font-mono underline hover:text-gh-muted"
             >
-              <div class="h-3 bg-gh-border rounded w-20" />
-              <div class="h-3 bg-gh-border rounded w-20" />
-            </footer>
-          </article>
-        </li>
-      </ul>
-    </div>
-    <div v-else-if="error">
-      {{ error.message }}
-    </div>
-    <div v-else-if="data" class="mt-12">
-      <ul class="flex flex-col gap-4">
-        <li
-          v-for="item in items"
-          :key="item.username"
-          class="not-last:border-b border-gh-border-light pb-6 mb-2"
-        >
-          <article>
-            <h2>
-              <NuxtLink
-                :to="`/user/${item.username}`"
-                class="text-xl font-mono underline hover:text-gh-muted"
-              >
-                {{ item.username }}
-              </NuxtLink>
-            </h2>
+              {{ item.username }}
+            </NuxtLink>
+          </h2>
 
-            <p class="my-2 text-sm">{{ item.reason }}</p>
+          <p class="my-2 text-sm">{{ item.reason }}</p>
 
-            <footer class="flex items-baseline justify-between mt-4">
-              <p class="text-gh-muted text-xs">
-                Flagged
-                <NuxtTime :title="item.createdAt" :datetime="item.createdAt" />
-              </p>
-              <NuxtLink
-                :to="item.issueUrl"
-                target="_blank"
-                external
-                class="underline inline text-xs hover:text-gh-muted"
-              >
-                View issue
-              </NuxtLink>
-            </footer>
-          </article>
-        </li>
-      </ul>
-    </div>
+          <footer class="flex items-baseline justify-between mt-4">
+            <p class="text-gh-muted text-xs">
+              Flagged
+              <NuxtTime :title="item.createdAt" :datetime="item.createdAt" />
+            </p>
+            <NuxtLink
+              :to="item.issueUrl"
+              target="_blank"
+              external
+              class="underline inline text-xs hover:text-gh-muted"
+            >
+              View issue
+            </NuxtLink>
+          </footer>
+        </article>
+      </li>
+    </ul>
   </div>
 </template>
diff --git a/app/pages/privacy-policy.vue b/app/pages/privacy-policy.vue
index cf355ef..d561858 100644
--- a/app/pages/privacy-policy.vue
+++ b/app/pages/privacy-policy.vue
@@ -1,96 +1,99 @@
+<script setup lang="ts">
+definePageMeta({
+  layout: "minimal",
+});
+</script>
+
 <template>
-  <div class="mx-auto max-w-2xl px-6 py-16">
-    <h1 class="text-2xl font-semibold">Privacy Policy</h1>
-    <p class="mt-2 text-sm text-gray-500">Last updated: March 2026</p>
+  <h1 class="text-2xl font-semibold">Privacy Policy</h1>
+  <p class="mt-2 text-sm text-gray-500">Last updated: March 2026</p>
 
-    <p class="mt-6 text-sm leading-relaxed">
-      Welcome to AgentScan. We are committed to protecting your privacy. This
-      policy explains what data we collect, how we use it, and your rights
-      regarding your information.
-    </p>
+  <p class="mt-6 text-sm leading-relaxed">
+    Welcome to AgentScan. We are committed to protecting your privacy. This
+    policy explains what data we collect, how we use it, and your rights
+    regarding your information.
+  </p>
 
-    <section class="mt-10">
-      <h2 class="text-base font-semibold">What we collect</h2>
-      <p class="mt-2 text-sm leading-relaxed">
-        Nothing. AgentScan does not collect, store, or process any personal
-        data. There are no accounts, no cookies, no tracking, and no analytics.
-      </p>
-    </section>
+  <section class="mt-10">
+    <h2 class="text-base font-semibold">What we collect</h2>
+    <p class="mt-2 text-sm leading-relaxed">
+      Nothing. AgentScan does not collect, store, or process any personal data.
+      There are no accounts, no cookies, no tracking, and no analytics.
+    </p>
+  </section>
 
-    <section class="mt-8">
-      <h2 class="text-base font-semibold">GitHub data</h2>
-      <p class="mt-2 text-sm leading-relaxed">
-        AgentScan only accesses public GitHub data — the same information anyone
-        can see by visiting a GitHub profile. When you search for a username, we
-        fetch their public events and profile from the GitHub API and analyze
-        them in real time. Nothing is stored after the request is complete.
-      </p>
-    </section>
+  <section class="mt-8">
+    <h2 class="text-base font-semibold">GitHub data</h2>
+    <p class="mt-2 text-sm leading-relaxed">
+      AgentScan only accesses public GitHub data — the same information anyone
+      can see by visiting a GitHub profile. When you search for a username, we
+      fetch their public events and profile from the GitHub API and analyze them
+      in real time. Nothing is stored after the request is complete.
+    </p>
+  </section>
 
-    <section class="mt-8">
-      <h2 class="text-base font-semibold">Cookies</h2>
-      <p class="mt-2 text-sm leading-relaxed">
-        AgentScan does not use cookies of any kind — no session cookies, no
-        tracking cookies, no analytics cookies.
-      </p>
-    </section>
+  <section class="mt-8">
+    <h2 class="text-base font-semibold">Cookies</h2>
+    <p class="mt-2 text-sm leading-relaxed">
+      AgentScan does not use cookies of any kind — no session cookies, no
+      tracking cookies, no analytics cookies.
+    </p>
+  </section>
 
-    <section class="mt-8">
-      <h2 class="text-base font-semibold">Third parties</h2>
-      <p class="mt-2 text-sm leading-relaxed">
-        AgentScan uses the following third-party services:
-      </p>
-      <ul class="mt-2 space-y-1 text-sm leading-relaxed list-disc list-inside">
-        <li>
-          <strong>GitHub API</strong> — to fetch public profile and activity
-          data
-        </li>
-        <li>
-          <strong>Netlify</strong> — for hosting and serving the application
-        </li>
-      </ul>
-      <p class="mt-3 text-sm leading-relaxed">
-        We do not share any data with advertisers or other third parties.
-      </p>
-    </section>
+  <section class="mt-8">
+    <h2 class="text-base font-semibold">Third parties</h2>
+    <p class="mt-2 text-sm leading-relaxed">
+      AgentScan uses the following third-party services:
+    </p>
+    <ul class="mt-2 space-y-1 text-sm leading-relaxed list-disc list-inside">
+      <li>
+        <strong>GitHub API</strong> — to fetch public profile and activity data
+      </li>
+      <li>
+        <strong>Netlify</strong> — for hosting and serving the application
+      </li>
+    </ul>
+    <p class="mt-3 text-sm leading-relaxed">
+      We do not share any data with advertisers or other third parties.
+    </p>
+  </section>
 
-    <section class="mt-8">
-      <h2 class="text-base font-semibold">Verified accounts list</h2>
-      <p class="mt-2 text-sm leading-relaxed">
-        AgentScan maintains a curated list of manually verified automated
-        accounts. This list is public, stored directly in the open source
-        repository, and only contains GitHub usernames along with a reason and a
-        link to the original report. If you believe your account has been
-        incorrectly listed, you can dispute it by opening the linked issue on
-        GitHub.
-      </p>
-    </section>
+  <section class="mt-8">
+    <h2 class="text-base font-semibold">Verified accounts list</h2>
+    <p class="mt-2 text-sm leading-relaxed">
+      AgentScan maintains a curated list of manually verified automated
+      accounts. This list is public, stored directly in the open source
+      repository, and only contains GitHub usernames along with a reason and a
+      link to the original report. If you believe your account has been
+      incorrectly listed, you can dispute it by opening the linked issue on
+      GitHub.
+    </p>
+  </section>
 
-    <section class="mt-8">
-      <h2 class="text-base font-semibold">Your rights</h2>
-      <p class="mt-2 text-sm leading-relaxed">
-        Since we do not collect any personal data, there is nothing to access,
-        export, or delete. If your GitHub account appears in our verified list
-        and you believe it was added in error, you can dispute it via the linked
-        GitHub issue.
-      </p>
-    </section>
+  <section class="mt-8">
+    <h2 class="text-base font-semibold">Your rights</h2>
+    <p class="mt-2 text-sm leading-relaxed">
+      Since we do not collect any personal data, there is nothing to access,
+      export, or delete. If your GitHub account appears in our verified list and
+      you believe it was added in error, you can dispute it via the linked
+      GitHub issue.
+    </p>
+  </section>
 
-    <section class="mt-8">
-      <h2 class="text-base font-semibold">Open source</h2>
-      <p class="mt-2 text-sm leading-relaxed">
-        AgentScan is open source. You can read the full code to verify exactly
-        what the app does. If you have a concern, open an issue on the GitHub
-        repository.
-      </p>
-    </section>
+  <section class="mt-8">
+    <h2 class="text-base font-semibold">Open source</h2>
+    <p class="mt-2 text-sm leading-relaxed">
+      AgentScan is open source. You can read the full code to verify exactly
+      what the app does. If you have a concern, open an issue on the GitHub
+      repository.
+    </p>
+  </section>
 
-    <section class="mt-8">
-      <h2 class="text-base font-semibold">Changes to this policy</h2>
-      <p class="mt-2 text-sm leading-relaxed">
-        We may update this privacy policy from time to time. Any changes will be
-        published on this page with an updated revision date.
-      </p>
-    </section>
-  </div>
+  <section class="mt-8">
+    <h2 class="text-base font-semibold">Changes to this policy</h2>
+    <p class="mt-2 text-sm leading-relaxed">
+      We may update this privacy policy from time to time. Any changes will be
+      published on this page with an updated revision date.
+    </p>
+  </section>
 </template>

From f01789d5d8025d048a259b558fc7e13eab9f94d7 Mon Sep 17 00:00:00 2001
From: MatteoGabriele <m.gabriele.dev@gmail.com>
Date: Wed, 22 Apr 2026 14:55:15 +0200
Subject: [PATCH 2/3] refactor: put lazy back

---
 app/composables/useVerifiedAutomations.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/composables/useVerifiedAutomations.ts b/app/composables/useVerifiedAutomations.ts
index b25b20f..0b3f068 100644
--- a/app/composables/useVerifiedAutomations.ts
+++ b/app/composables/useVerifiedAutomations.ts
@@ -1,7 +1,7 @@
 import type { VerifiedAutomation } from "~~/shared/types/automation";
 
 export function useVerifiedAutomations() {
-  return useAsyncData("verified-list", async () => {
+  return useLazyAsyncData("verified-list", async () => {
     return $fetch<VerifiedAutomation[]>("/api/verified-automations");
   });
 }

From f8b1a53364821abd52f0df5ddb0ea1d3e0f38cd9 Mon Sep 17 00:00:00 2001
From: MatteoGabriele <m.gabriele.dev@gmail.com>
Date: Wed, 22 Apr 2026 14:58:32 +0200
Subject: [PATCH 3/3] fix: trim all queries

---
 app/pages/automations.vue | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/app/pages/automations.vue b/app/pages/automations.vue
index 5d626bc..28b43a3 100644
--- a/app/pages/automations.vue
+++ b/app/pages/automations.vue
@@ -7,11 +7,11 @@ const items = computed(() => {
 });
 
 const fuzzySearch = (query: string, text: string): boolean => {
-  const q = query.toLowerCase();
+  const queryTrimmed = query.toLowerCase();
   let textIndex = 0;
 
-  for (let i = 0; i < q.length; i++) {
-    textIndex = text.toLowerCase().indexOf(q[i] ?? "", textIndex);
+  for (let i = 0; i < queryTrimmed.length; i++) {
+    textIndex = text.toLowerCase().indexOf(queryTrimmed[i] ?? "", textIndex);
     if (textIndex === -1) return false;
     textIndex++;
   }
@@ -20,9 +20,13 @@ const fuzzySearch = (query: string, text: string): boolean => {
 };
 
 const filteredItems = computed(() => {
-  if (!search.value.trim()) return items.value;
+  const query = search.value.trim();
 
-  return items.value.filter((item) => fuzzySearch(search.value, item.username));
+  if (!query) {
+    return items.value;
+  }
+
+  return items.value.filter((item) => fuzzySearch(query, item.username));
 });
 
 definePageMeta({