feature: clone topic in chat frontend

Author: cdxker

frontends/chat/src/components/Navbar/Sidebar.tsx

@@ -5,6 +5,7 @@ import {
   BiRegularPlus,
   BiRegularTrash,
   BiRegularX,
+  BiRegularDuplicate,
 } from "solid-icons/bi";
 import {
   Accessor,
@@ -81,6 +82,34 @@ export const Sidebar = (props: SidebarProps) => {
     await props.refetchTopics();
   };
 
+  const cloneTopic = async () => {
+    const dataset = userContext.currentDataset?.();
+    if (!dataset) return;
+
+    const res = await fetch(`${apiHost}/topic/clone`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        "TR-Dataset": dataset.dataset.id,
+      },
+      body: JSON.stringify({
+        topic_id: props.currentTopic()?.id,
+        owner_id: userContext.user?.()?.id,
+      }),
+      credentials: "include",
+    });
+
+    if (res.ok) {
+      await props.refetchTopics();
+    } else {
+      createToast({
+        type: "error",
+        message: "Error deleting topic",
+      });
+      return;
+    }
+  };
+
   const deleteSelected = async () => {
     const dataset = userContext.currentDataset?.();
     if (!dataset) return;
@@ -218,13 +247,24 @@ export const Sidebar = (props: SidebarProps) => {
                     <div class="flex-1" />
                     {props.currentTopic()?.id === topic.id && (
                       <div class="flex flex-row items-center space-x-2">
+                        <button
+                          onClick={(e) => {
+                            e.preventDefault();
+                            void cloneTopic();
+                          }}
+                          class="text-lg hover:text-blue-500"
+                          title="Clone chat"
+                        >
+                          <BiRegularDuplicate />
+                        </button>
                         <button
                           onClick={(e) => {
                             e.preventDefault();
                             setEditingTopic(topic.name);
                             setEditingIndex(index());
                           }}
                           class="text-lg hover:text-blue-500"
+                          title="Edit topic name"
                         >
                           <BiRegularEdit />
                         </button>
@@ -234,6 +274,7 @@ export const Sidebar = (props: SidebarProps) => {
                             void deleteSelected();
                           }}
                           class="text-lg hover:text-red-500"
+                          title="Delete chat"
                         >
                           <BiRegularTrash />
                         </button>