Add tag-based article filtering and new tag page

Expanded article search to include filtering by tags. Introduced a new page for viewing articles under specific tags. Updated article grid to link to the new tag-specific pages.

Author: mikepsinn

app/researcher/articles/tags/[tagSlug]/page.tsx

@@ -0,0 +1,20 @@
+'use client'
+
+import { useParams } from 'next/navigation'
+import ArticleSearchAndGrid from "@/components/article/ArticleSearchAndGrid";
+
+type Params = {
+    tagSlug: string
+}
+
+export default function TagArticles() {
+    const params = useParams<Params>()
+    const tagSlug = params?.tagSlug ?? ''
+
+    return (
+        <div className="container mx-auto p-4">
+            <h1 className="text-3xl font-bold mb-6">Articles in {tagSlug}</h1>
+            <ArticleSearchAndGrid tagSlug={tagSlug} />
+        </div>
+    )
+}

app/researcher/researcherActions.ts

@@ -15,7 +15,7 @@ const openai = new OpenAI({
 })
 const prisma = new PrismaClient()
 
-export async function searchArticles(query: string, categorySlug?: string) {
+export async function searchArticles(query: string, categorySlug?: string, tagSlug?: string) {
   try {
     const whereClause: any = {
       OR: [
@@ -28,6 +28,13 @@ export async function searchArticles(query: string, categorySlug?: string) {
       whereClause.category = { slug: categorySlug };
     }
 
+    if (tagSlug) {
+      const tag = await prisma.articleTag.findUnique({ where: { slug: tagSlug } });
+      if (tag) {
+        whereClause.tags = { some: { id: tag.id } };
+      }
+    }
+
     return await prisma.article.findMany({
       where: whereClause,
       select: {

components/ArticleGrid.tsx

@@ -43,7 +43,7 @@ export default function ArticleGrid({ articles }: ArticleGridProps) {
                     <CardFooter className="mt-auto pt-4 border-t">
                         <div className="flex flex-wrap gap-2">
                             {article.tags.map((tag) => (
-                                <Link key={tag.name} href={`/research/tags/${tag.name}`}>
+                                <Link key={tag.name} href={`/researcher/articles/tags/${tag.slug}`}>
                                     <Badge variant="outline" className="text-xs">{tag.name}</Badge>
                                 </Link>
                             ))}

components/article/ArticleSearchAndGrid.tsx

@@ -7,9 +7,10 @@ import { searchArticles } from '@/app/researcher/researcherActions'
 
 type ArticleSearchAndGridProps = {
   categorySlug?: string
+  tagSlug?: string
 }
 
-export default function ArticleSearchAndGrid({ categorySlug = '' }: ArticleSearchAndGridProps) {
+export default function ArticleSearchAndGrid({ categorySlug = '', tagSlug = '' }: ArticleSearchAndGridProps) {
   const [articles, setArticles] = useState<ArticleWithRelations[]>([])
   const [isLoading, setIsLoading] = useState(true)
   const [searchQuery, setSearchQuery] = useState('')
@@ -18,7 +19,7 @@ export default function ArticleSearchAndGrid({ categorySlug = '' }: ArticleSearc
     const fetchArticles = async () => {
         setIsLoading(true)
         try {
-            const results = await searchArticles(searchQuery, categorySlug)
+            const results = await searchArticles(searchQuery, categorySlug, tagSlug)
             setArticles(results as ArticleWithRelations[])
         } catch (error) {
             console.error('Error fetching articles:', error)
@@ -27,7 +28,7 @@ export default function ArticleSearchAndGrid({ categorySlug = '' }: ArticleSearc
         }
     }
     fetchArticles()
-}, [categorySlug, searchQuery])
+}, [categorySlug, tagSlug, searchQuery])
 
   const handleSearch = (query: string) => {
     setSearchQuery(query)

tests/researcher.test.ts

@@ -7,7 +7,7 @@ import { findOrCreateArticleByPromptedTopic } from '@/lib/agents/researcher/rese
 
 const prisma = new PrismaClient();
 
-describe("Database-seeder tests", () => {
+describe("Research Agent tests", () => {
   jest.setTimeout(6000000)
 
     it("Generates article by URL", async () => {