feat: fetch and display user threads, handle state and url query state

packages/akeru-server/src/core/application/controllers/thread/threadController.ts

@@ -7,6 +7,7 @@ import {
   deleteThread,
   userOwnsOrParticipatesInThread,
   getThread,
+  getThreads,
 } from "@/core/application/services/threadService";
 import {
   THREAD_DELETED_SUCCESSFULLY,
@@ -83,7 +84,6 @@ threads.delete(
 threads.get(
   "/thread/:id",
   async ({ params, bearer, set }) => {
-    console.log("hey");
     const decodedToken = await parseToken(bearer!);
 
     if (decodedToken) {
@@ -110,6 +110,27 @@ threads.get(
   }
 );
 
+/**
+ * Return all threads associated to a specific user
+ */
+threads.get(
+  "/thread",
+  async ({ bearer, set }) => {
+    console.info("all threads baby");
+    const decodedToken = await parseToken(bearer!);
+
+    if (decodedToken) {
+      const { userId } = decodedToken;
+
+      const threads = await getThreads(userId);
+      return threads;
+    }
+  },
+  {
+    beforeHandle: AuthMiddleware(["view_own_threads", "*"]),
+  }
+);
+
 /**
  * This adds a message to the thread, it can be from the assistant or from the human user
  */

packages/akeru-server/src/core/application/services/threadService.ts

@@ -96,5 +96,28 @@ export async function getThread(threadId: string): Promise<Thread | null> {
     return null;
   }
 
-  return JSON.parse(threadData);
+  return JSON.parse(threadData) as Thread;
+}
+
+/**
+ * Retrieves threads from Redis.
+ * @param {string} userId - The ID of the user threads to retrieve.
+ * @returns {Promise<Thread[] | null>} A promise that resolves to the threads of a user or null if not found.
+ */
+
+export async function getThreads(userId: string): Promise<Thread[] | null> {
+  const threadIds = await getUserThreads(userId);
+
+  if (!threadIds.length) {
+    return null;
+  }
+
+  const threads = await Promise.all(
+    threadIds.map(async (threadId) => {
+      const thread = await getThread(threadId);
+      return thread as Thread;
+    })
+  );
+
+  return threads;
 }

packages/app-akeru/src/app/(dashboard)/threads/features/thread-list/test-data.ts

@@ -2,43 +2,35 @@ import { ThreadsListItemProps } from "./threads-list-item";
 
 export const THREADS_LIST_MOCK_DATA: ThreadsListItemProps[] = [
   {
-    title: "Understanding React Hooks",
-    description: "A deep dive into the use of hooks in React for state and lifecycle management.",
-    date: "2024-05-01"
+    id: "1",
+    name: "Understanding React Hooks",
   },
   {
-    title: "Announcing TypeScript 5.0",
-    description: "Explore the new features and improvements in the latest TypeScript release.",
-    date: "2024-04-15"
+    id: "2",
+    name: "Announcing TypeScript 5.0",
   },
   {
-    title: "Getting Started with Python",
-    description: "An introductory guide to programming in Python for beginners.",
-    date: "2024-03-20"
+    id: "3",
+    name: "Getting Started with Python",
   },
   {
-    title: "AI Breakthrough in Natural Language Processing",
-    description: "How the latest advancements in AI are revolutionizing language understanding.",
-    date: "2024-02-10"
+    id: "4",
+    name: "AI Breakthrough in Natural Language Processing",
   },
   {
-    title: "Join the Annual Developer Conference",
-    description: "Meet and network with other developers at this year's conference. Keynotes, workshops, and more!",
-    date: "2024-06-05"
+    id: "5",
+    name: "Join the Annual Developer Conference",
   },
   {
-    title: "Hiring Frontend Engineers",
-    description: "We are looking for talented frontend engineers to join our team. Apply now!",
-    date: "2024-05-20"
+    id: "6",
+    name: "Hiring Frontend Engineers",
   },
   {
-    title: "Top 10 Books for Software Engineers",
-    description: "A curated list of must-read books for anyone in the software development field.",
-    date: "2024-01-30"
+    id: "7",
+    name: "Top 10 Books for Software Engineers",
   },
   {
-    title: "Critical Security Patch Released",
-    description: "A new security patch has been released to address vulnerabilities in the system. Update immediately.",
-    date: "2024-04-05"
-  }
+    id: "8",
+    name: "Critical Security Patch Released",
+  },
 ];

packages/app-akeru/src/app/(dashboard)/threads/features/thread-list/threads-list-item.tsx

@@ -2,9 +2,11 @@ import { cn } from "@/lib/utils";
 import React from "react";
 
 export interface ThreadsListItemProps {
-  title: string;
-  description: string;
-  date: string;
+  id: string;
+  name: string;
+  createdBy?: string;
+  participants?: string[];
+  messageIds?: string[];
   isActive?: boolean;
 }
 
@@ -17,7 +19,7 @@ const ThreadsListItem = (props: ThreadsListItemProps) => {
       )}
     >
       <p className="overflow-hidden text-ellipsis whitespace-nowrap text-sm ">
-        {props.title}
+        {props.name}
       </p>
     </div>
   );

packages/app-akeru/src/app/(dashboard)/threads/features/thread-list/threads-list.tsx

@@ -3,7 +3,7 @@
 import React, { useState, useEffect } from "react";
 import { THREADS_LIST_MOCK_DATA } from "./test-data";
 import { ScrollArea } from "@/components/ui/scroll-area";
-import ThreadsListItem from "./threads-list-item";
+import ThreadsListItem, { ThreadsListItemProps } from "./threads-list-item";
 import { Input } from "@/components/ui/input";
 import { Search } from "lucide-react";
 import { Skeleton } from "@/components/ui/skeleton";
@@ -40,13 +40,13 @@ const ThreadsList = () => {
             ? Array.from({ length: THREADS_LIST_MOCK_DATA.length }).map(
                 (_, idx) => <Skeleton key={idx} className="h-8" />,
               )
-            : THREADS_LIST_MOCK_DATA.map((thread, key) => (
+            : threads.map((thread: ThreadsListItemProps) => (
                 <div
-                  key={thread.title + key}
-                  onClick={() => handleSetActiveId(thread.title.toLowerCase())}
+                  key={thread.id}
+                  onClick={() => handleSetActiveId(thread.name.toLowerCase())}
                 >
                   <ThreadsListItem
-                    isActive={isActive(thread.title.toLowerCase())}
+                    isActive={isActive(thread.name.toLowerCase())}
                     {...thread}
                   />
                 </div>