Skip to content

feat: adds fuzzy search in the automation list page #71

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
MatteoGabriele merged 3 commits into from
Apr 22, 2026
Merged

feat: adds fuzzy search in the automation list page #71

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
216e2f0
feat: adds fuzzy search in the automation list page
MatteoGabriele Apr 22, 2026
f01789d
refactor: put lazy back
MatteoGabriele Apr 22, 2026
f8b1a53
fix: trim all queries
MatteoGabriele Apr 22, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions app/components/Verified/AutomationList.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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>

Expand All @@ -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"
>
Expand Down
2 changes: 1 addition & 1 deletion app/layouts/default.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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'" />
Expand Down
17 changes: 17 additions & 0 deletions app/layouts/minimal.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -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>
Comment on lines +5 to +11
Copy link
Copy Markdown

@coderabbitai coderabbitai Bot Apr 22, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

🧩 Analysis chain

🏁 Script executed:

# Check if the file exists and review its content
cat -n app/layouts/minimal.vue

Repository: MatteoGabriele/agentscan

Length of output: 575

🏁 Script executed:

# Check the framework and dependencies
head -30 package.json

Repository: MatteoGabriele/agentscan

Length of output: 846

🏁 Script executed:

# Look for nuxt.config or other framework configuration
ls -la | grep -E "(nuxt|vue|tsconfig)" | head -20

Repository: MatteoGabriele/agentscan

Length of output: 200

🏁 Script executed:

# Search for router.back() usage patterns
rg "router\.back\(\)" --type vue --type ts --type js

Repository: MatteoGabriele/agentscan

Length of output: 95

🏁 Script executed:

# Search for navigateTo usage (Nuxt pattern)
rg "navigateTo" --type vue --type ts --type js

Repository: MatteoGabriele/agentscan

Length of output: 95

🏁 Script executed:

# Search for useRouter usage
rg "useRouter" --type vue --type ts --type js

Repository: MatteoGabriele/agentscan

Length of output: 95

🏁 Script executed:

# Search for history.state checks
rg "history\.state" --type vue --type ts --type js

Repository: MatteoGabriele/agentscan

Length of output: 95

🏁 Script executed:

# Search for any router or navigation related middleware/composables
fd -e ts -e js -e vue | xargs grep -l "navigation\|router" | head -20

Repository: MatteoGabriele/agentscan

Length of output: 137

🏁 Script executed:

# Search for router.back() usage
rg "router\.back\(\)" -g "*.vue" -g "*.ts" -g "*.js"

Repository: MatteoGabriele/agentscan

Length of output: 121

🏁 Script executed:

# Search for navigateTo usage (Nuxt pattern)
rg "navigateTo" -g "*.vue" -g "*.ts" -g "*.js"

Repository: MatteoGabriele/agentscan

Length of output: 50

🏁 Script executed:

# Search for useRouter usage
rg "useRouter" -g "*.vue" -g "*.ts" -g "*.js"

Repository: MatteoGabriele/agentscan

Length of output: 169

🏁 Script executed:

# Search for history.state or back entry checks
rg "history\.state|history\.back" -g "*.vue" -g "*.ts" -g "*.js"

Repository: MatteoGabriele/agentscan

Length of output: 50

🏁 Script executed:

# Check app structure
tree -L 3 app/ 2>/dev/null || find app -maxdepth 3 -type f | head -40

Repository: MatteoGabriele/agentscan

Length of output: 728

🏁 Script executed:

# Search for layout references
rg "definePageMeta.*minimal|layout.*minimal" -g "*.vue"

Repository: MatteoGabriele/agentscan

Length of output: 164

🏁 Script executed:

# Check the pages that likely use minimal layout
cat -n app/pages/automations.vue

Repository: MatteoGabriele/agentscan

Length of output: 5109

🏁 Script executed:

# Check privacy-policy page
cat -n app/pages/privacy-policy.vue

Repository: MatteoGabriele/agentscan

Length of output: 4444

🏁 Script executed:

# Check default layout to compare
cat -n app/layouts/default.vue

Repository: MatteoGabriele/agentscan

Length of output: 1948

🏁 Script executed:

# Check for any middleware or app-level navigation patterns
find app -name "*.ts" -o -name "*.js" | xargs grep -l "router\|navigate" 2>/dev/null | head -20

Repository: MatteoGabriele/agentscan

Length of output: 50

🏁 Script executed:

# Check if there are any plugins related to router
ls -la app/plugins 2>/dev/null || echo "No plugins directory found"

Repository: MatteoGabriele/agentscan

Length of output: 94

🏁 Script executed:

# Check nuxt.config to see router setup
cat -n nuxt.config.ts

Repository: MatteoGabriele/agentscan

Length of output: 2103

🏁 Script executed:

# Verify if composables use useRouter in specific ways
cat -n app/pages/index.vue | head -50

Repository: MatteoGabriele/agentscan

Length of output: 477

🏁 Script executed:

# Search for any window.history usage
rg "window\.history|history\.length|history\.back" -g "*.vue" -g "*.ts" -g "*.js"

Repository: MatteoGabriele/agentscan

Length of output: 50

🏁 Script executed:

# Check if router.push is used as fallback pattern elsewhere
rg "router\.push" -g "*.vue" -g "*.ts" -g "*.js" -A 2

Repository: MatteoGabriele/agentscan

Length of output: 341

🏁 Script executed:

# Check index.vue to understand the home page route
cat -n app/pages/index.vue

Repository: MatteoGabriele/agentscan

Length of output: 477

Use a more reliable check for back navigation fallback.

Direct visits to /automations or /privacy-policy have no back history. When router.back() is called on a direct visit, it either does nothing or navigates to an external site (if the user came from external search). Add a fallback to navigate to home when there is no back entry available.

For the history check, use window.history.length > 1 instead of window.history.state?.back, which is more reliable and standard across browsers.

Proposed fix 
-<script setup lang="ts"></script>
+<script setup lang="ts">
+const router = useRouter();
+
+const goBack = () => {
+  if (window.history.length > 1) {
+    router.back();
+    return;
+  }
+
+  navigateTo("/");
+};
+</script>
 
 <template>
   <div class="mx-auto max-w-2xl p-6 pb-12 w-full">
     <button
-      `@click`="$router.back()"
+      type="button"
+      `@click`="goBack"
       class="text-gh-muted hover:text-gh-text transition-colors flex items-center gap-2"
     >
🤖 Prompt for AI Agents 
Verify each finding against the current code and only fix it if needed.

In `@app/layouts/minimal.vue` around lines 5 - 11, Replace the direct call to
$router.back() in the back button with a small handler (e.g., handleGoBack or
goBack) that checks window.history.length > 1 and calls $router.back() only when
true, otherwise falls back to a safe navigation like $router.push('/') or
$router.push({ name: 'home' }); update the button to call that handler instead
of $router.back() so direct visits or external referrers don't navigate
unpredictably.


<div class="mt-8">
<slot />
</div>
</div>
</template>
174 changes: 108 additions & 66 deletions app/pages/automations.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,38 @@
<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 queryTrimmed = query.toLowerCase();
let textIndex = 0;

for (let i = 0; i < queryTrimmed.length; i++) {
textIndex = text.toLowerCase().indexOf(queryTrimmed[i] ?? "", textIndex);
if (textIndex === -1) return false;
textIndex++;
}

return true;
};

const filteredItems = computed(() => {
const query = search.value.trim();

if (!query) {
return items.value;
}

return items.value.filter((item) => fuzzySearch(query, item.username));
});

definePageMeta({
layout: "minimal",
});

useHead({
title: "Verified automations | AgentScan",
meta: [
Expand All @@ -19,9 +47,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
Expand All @@ -31,72 +63,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>
Loading