From 2855e70cb0c8fcea478e052c91086b0b72b0b4e8 Mon Sep 17 00:00:00 2001
From: serafettin <mail@serafettin.net>
Date: Thu, 20 Jun 2024 21:40:08 -0400
Subject: [PATCH] Iterate

---
 api/src/controllers/conversation.js           |  2 +-
 .../sections/History/HistoryItem.tsx          | 89 ++++++++++---------
 .../site/indexes/AskIndexes/index.tsx         |  9 +-
 web-app/src/services/api-service-new.ts       |  2 +-
 4 files changed, 56 insertions(+), 46 deletions(-)

diff --git a/api/src/controllers/conversation.js b/api/src/controllers/conversation.js
index fbcbe422..3cf4ebd9 100644
--- a/api/src/controllers/conversation.js
+++ b/api/src/controllers/conversation.js
@@ -152,7 +152,7 @@ export const refreshSummary = async (req, res, next) => {
         },
         prompt: `Given the following conversation titles, generate one and unique title.
         The title should be clear, descriptive, and relevant to the topic at hand.
-        Write title from the chat_history in maximum 10 words.
+        Write title from the chat_history in maximum 10 words. Dont add "title" prefixes.
         Chat_history: {chat_history}
         `,
       },
diff --git a/web-app/src/components/sections/History/HistoryItem.tsx b/web-app/src/components/sections/History/HistoryItem.tsx
index c724f6c1..ff5cb735 100644
--- a/web-app/src/components/sections/History/HistoryItem.tsx
+++ b/web-app/src/components/sections/History/HistoryItem.tsx
@@ -2,6 +2,11 @@ import { useApp } from "@/context/AppContext";
 import Button from "components/base/Button";
 import moment from "moment";
 import { useRouter } from "next/navigation";
+import Row from "@/components/layout/base/Grid/Row";
+import Col from "@/components/layout/base/Grid/Col";
+import Flex from "@/components/layout/base/Grid/Flex";
+import Text from "@/components/base/Text";
+import FlexRow from "@/components/layout/base/Grid/FlexRow";
 import HistoryItemOpsPopup from "./HistoryItemOpsPopup";
 
 type HistoryItemProps = {
@@ -24,25 +29,48 @@ const HistoryItem = ({ item }: { item: HistoryItemProps }) => {
       onClick={() => {
         router.push(`/conversation/${item.id}`);
       }}
+      style={{
+        cursor: "pointer",
+      }}
+      className="card-item p-6"
     >
-      <div
-        style={{
-          borderRadius: "4px",
-          padding: "12px",
-          border: "1px solid var(--gray-2)",
-          height: "fit-content",
-          display: "flex",
-          flexDirection: "column",
-          gap: "4px",
-          cursor: "pointer",
-        }}
-      >
-        <div
-          style={{
-            alignSelf: "flex-end",
-            position: "absolute",
-          }}
-        >
+      <FlexRow justify={"between"} fullWidth>
+        <Col xs={10}>
+          <Flex
+            className={"idxflex-nowrap"}
+            alignitems={"top"}
+            flexdirection={"column"}
+          >
+            <Row>
+              <Text
+                style={{
+                  fontSize: "14px",
+                  fontWeight: "bold",
+                  margin: 0,
+                }}
+              >
+                {item.summary}
+              </Text>
+            </Row>
+            <Row className={"mt-3"}>
+              <Flex alignitems={"left"}>
+                <Col>
+                  <Text
+                    style={{
+                      fontSize: "12px",
+                      margin: 0,
+                    }}
+                  >
+                    {item?.createdAt
+                      ? `Updated ${moment(new Date(item.createdAt)).fromNow()}`
+                      : ""}
+                  </Text>
+                </Col>
+              </Flex>
+            </Row>
+          </Flex>
+        </Col>
+        <Col pullRight>
           <Button
             onClick={(e: any) => {
               e.stopPropagation();
@@ -57,29 +85,8 @@ const HistoryItem = ({ item }: { item: HistoryItemProps }) => {
               }}
             />
           </Button>
-        </div>
-        <h2
-          style={{
-            fontSize: "14px",
-            fontWeight: "bold",
-            margin: 0,
-          }}
-        >
-          {item.summary}
-        </h2>
-
-        <p
-          style={{
-            fontSize: "12px",
-            margin: 0,
-          }}
-        >
-          {/* Last message 10 days ago */}
-          {item?.createdAt
-            ? `Updated ${moment(new Date(item.createdAt)).fromNow()}`
-            : ""}
-        </p>
-      </div>
+        </Col>
+      </FlexRow>
     </div>
   );
 };
diff --git a/web-app/src/components/site/indexes/AskIndexes/index.tsx b/web-app/src/components/site/indexes/AskIndexes/index.tsx
index a4e0a18c..a3ac2a85 100644
--- a/web-app/src/components/site/indexes/AskIndexes/index.tsx
+++ b/web-app/src/components/site/indexes/AskIndexes/index.tsx
@@ -292,10 +292,13 @@ const AskIndexes: FC<AskIndexesProps> = ({ sources }) => {
     console.log("Received message from server", payload);
 
     if (payload.channel === "end") {
-      if (viewedConversation && viewedConversation.summary === `New Chat`) {
+      if (viewedConversation && viewedConversation.summary === `New chat`) {
         api!.getConversationWithSummary(viewedConversation.id).then((c) => {
-          viewedConversation.summary = c.summary;
-          setViewedConversation(viewedConversation);
+          setConversations(
+            conversations.map((i: any) =>
+              i.id === c.id ? { ...c, summary: c.summary } : i,
+            ),
+          );
         });
       }
 
diff --git a/web-app/src/services/api-service-new.ts b/web-app/src/services/api-service-new.ts
index a444e53b..ee7e5bde 100644
--- a/web-app/src/services/api-service-new.ts
+++ b/web-app/src/services/api-service-new.ts
@@ -31,7 +31,7 @@ const API_ENDPOINTS = {
   LIST_CONVERSATIONS: "/conversations",
   CREATE_CONVERSATION: "/conversations",
   GET_CONVERSATION: "/conversations/:conversationId",
-  GET_CONVERSATION_WITH_SUMMARY: "/conversations/:conversationId",
+  GET_CONVERSATION_WITH_SUMMARY: "/conversations/:conversationId/summary",
   DELETE_CONVERSATION: "/conversations/:conversationId",
   SEND_MESSAGE: "/conversations/:conversationId/messages",
   UPDATE_MESSAGE: "/conversations/:conversationId/messages/:messageId",