feat: add index and enable ordering

src/app/boards/boards.tsx

@@ -11,7 +11,7 @@ export function Boards() {
     <div>
       {data?.map((board) => {
         return (
-          <Link key={board.id} href={`boards/${board.id}`}>
+          <Link key={board.publicId} href={`boards/${board.publicId}`}>
             <div className="align-center mr-5 flex w-72 justify-center rounded-md border border-dashed border-dark-600 bg-dark-100 p-14 hover:bg-dark-200">
               <p className="text-md px-4 font-medium text-dark-1000">
                 {board.name}

src/server/api/routers/board.ts

@@ -1,7 +1,7 @@
 import { z } from "zod";
-import { eq } from "drizzle-orm";
+import { eq, asc } from "drizzle-orm";
 
-import { boards } from "~/server/db/schema";
+import { boards, cards, lists } from "~/server/db/schema";
 import { generateUID } from "~/utils/generateUID";
 
 import {
@@ -10,24 +10,47 @@ import {
 } from "~/server/api/trpc";
 
 export const boardRouter = createTRPCRouter({
-  all: publicProcedure.query(async ({ ctx }) => {
+  all: publicProcedure.query(({ ctx }) => {
     const userId = ctx.session?.user.id;
 
     if (!userId) return;
 
-    const boards = await ctx.db.query.boards.findMany();
-
-    return boards.map((board) => ({ ...board, id: board.publicId }))
+    return ctx.db.query.boards.findMany({
+      columns: {
+        publicId: true,
+        name: true,
+      },
+    });
   }),
   byId: publicProcedure
     .input(z.object({ id: z.string().min(12) }))
     .query(({ ctx, input }) => 
       ctx.db.query.boards.findFirst({
         where: eq(boards.publicId, input.id),
+        columns: {
+          publicId: true,
+          name: true,
+        },
         with: {
           lists: {
+            orderBy: [asc(lists.index)],
+            columns: {
+              publicId: true,
+              name: true,
+              boardId: true,
+              index: true,
+            },
             with: {
-              cards: true,
+              cards: {
+                orderBy: [asc(cards.index)],
+                columns: {
+                  publicId: true,
+                  title: true,
+                  description: true,
+                  listId: true,
+                  index: true,
+                }
+              }
             },
           },
         },

src/server/db/schema.ts

@@ -7,6 +7,7 @@ import {
   primaryKey,
   text,
   timestamp,
+  unique,
   varchar,
 } from "drizzle-orm/mysql-core";
 import { type AdapterAccount } from "next-auth/adapters";
@@ -17,7 +18,7 @@ import { type AdapterAccount } from "next-auth/adapters";
  *
  * @see https://orm.drizzle.team/docs/goodies#multi-project-schema
  */
-export const mySqlTable = mysqlTableCreator((name) => `kan.${name}`);
+export const mySqlTable = mysqlTableCreator((name) => `${name}`);
 
 export const boards = mySqlTable(
   "board",
@@ -53,7 +54,10 @@ export const lists = mySqlTable(
       .notNull(),
     updatedAt: timestamp("updatedAt").onUpdateNow(),
     boardId: varchar("boardId", { length: 256 }).notNull(),
-  }
+    index: int("index").notNull()
+  }, (t) => ({
+    unq: unique().on(t.boardId, t.index),
+  })
 );
 
 export const listsRelations = relations(lists, ({ one, many }) => ({
@@ -81,7 +85,10 @@ export const cards = mySqlTable(
       .notNull(),
     updatedAt: timestamp("updatedAt").onUpdateNow(),
     listId: varchar("listId", { length: 256 }).notNull(),
-  }
+    index: int("index").notNull()
+  }, (t) => ({
+    unq: unique().on(t.listId, t.index),
+  })
 );
 
 export const cardsRelations = relations(cards, ({ one }) => ({