refined infinite article grid and added article filtering

src/server/api/routers/article.ts

@@ -7,13 +7,29 @@ import {
 } from "@/server/api/trpc";
 import { Article, articles } from "@/server/db/schema";
 import {
+  articleFilterSchema,
   articleSchema,
   createArticleSchema,
 } from "@/lib/validation/zod/article";
-import { and, count, eq, gt, like, sql } from "drizzle-orm";
+import { and, asc, count, desc, eq, gt, ilike, like, sql } from "drizzle-orm";
 import { hasPermission, Role } from "@/lib/validation/permissions";
 import { generateSlug } from "@/lib/utils";
 
+const getArticleSorting = (sort: string) => {
+  switch (sort) {
+    case "newest":
+      return desc(articles.createdAt);
+    case "oldest":
+      return asc(articles.createdAt);
+    case "abc":
+      return asc(articles.title);
+    case "cba":
+      return desc(articles.title);
+    default:
+      return desc(articles.createdAt); // Default to newest
+  }
+};
+
 export const articleRouter = createTRPCRouter({
   // queries
   search: publicProcedure
@@ -32,25 +48,35 @@ export const articleRouter = createTRPCRouter({
         with: { category: true },
       });
     }),
-  getByPage: publicProcedure
+  getByCursor: publicProcedure
     .input(
       z.object({
-        categoryId: z.string().optional(),
         limit: z.number().optional(),
         cursor: z.string().optional(),
+        filter: articleFilterSchema.optional(),
       }),
     )
     .query(async ({ ctx, input }) => {
-      const { categoryId, cursor } = input!;
+      const { cursor } = input!;
       const limit = input?.limit ?? 50;
       const cursorArg = cursor ? gt(articles.slug, cursor) : undefined;
-      const categoryArg = categoryId
-        ? eq(articles.categoryId, categoryId)
+
+      const queryFilterArg = input?.filter?.query?.length
+        ? ilike(articles.title, "%" + input.filter.query + "%")
         : undefined;
+      const categoryArg = input?.filter?.category
+        ? eq(articles.categoryId, input.filter.category)
+        : undefined;
+      const orderBy = getArticleSorting(input?.filter?.sort ?? "newest");
       const items = await ctx.db.query.articles.findMany({
-        where: and(cursorArg, categoryArg),
+        where: and(
+          cursorArg,
+          categoryArg,
+          queryFilterArg,
+          eq(articles.published, true),
+        ),
         limit: limit + 1,
-        orderBy: articles.slug,
+        orderBy,
         columns: {
           title: true,
           slug: true,