setup message population on search

api/lib/db/mongoMeili.js

@@ -9,7 +9,8 @@ const validateOptions = function (options) {
 };
 
 const createMeiliMongooseModel = function ({ index, indexName, client, attributesToIndex }) {
-  console.log('attributesToIndex', attributesToIndex);
+  // console.log('attributesToIndex', attributesToIndex);
+  const primaryKey = attributesToIndex[0];
   // MeiliMongooseModel is of type Mongoose.Model
   class MeiliMongooseModel {
     // Clear Meili index
@@ -24,7 +25,7 @@ const createMeiliMongooseModel = function ({ index, indexName, client, attribute
 
     static async resetIndex() {
       await this.clearMeiliIndex();
-      await client.createIndex(indexName, { primaryKey: attributesToIndex[0] });
+      await client.createIndex(indexName, { primaryKey });
     }
     // Clear Meili index
     // Push a mongoDB collection to Meili index
@@ -52,24 +53,24 @@ const createMeiliMongooseModel = function ({ index, indexName, client, attribute
       // Populate hits with content from mongodb
       if (populate) {
         // Find objects into mongodb matching `objectID` from Meili search
+        const query = {};
+        query[primaryKey] = { $in: _.map(data.hits, primaryKey) };
         const hitsFromMongoose = await this.find(
-          {
-            _id: { $in: _.map(data.hits, '_id') }
-          },
+          query,
           _.reduce(
             this.schema.obj,
             function (results, value, key) {
               return { ...results, [key]: 1 };
             },
             { _id: 1 }
-          )
+          ),
         );
 
         // Add additional data from mongodb into Meili search hits
         const populatedHits = data.hits.map(function (hit) {
-          const originalHit = _.find(hitsFromMongoose, {
-            _id: hit._id
-          });
+          const query = {};
+          query[primaryKey] = hit[primaryKey];
+          const originalHit = _.find(hitsFromMongoose, query);
 
           return {
             ...(originalHit ? originalHit.toJSON() : {}),

api/server/routes/search.js

@@ -46,4 +46,13 @@ router.get('/clear', async function (req, res) {
   res.send('cleared');
 });
 
+router.get('/test', async function (req, res) {
+  const { q } = req.query;
+  const messages = (await Message.meiliSearch(q, { attributesToHighlight: ['text'] }, true)).hits.map(message => {
+    const { _formatted, ...rest } = message;
+    return { ...rest, searchResult: true, text: _formatted.text };
+  });
+  res.send(messages);
+});
+
 module.exports = router;

client/src/components/Messages/Message.jsx

@@ -22,7 +22,7 @@ export default function Message({
     (state) => state.submit
   );
   const [abortScroll, setAbort] = useState(false);
-  const { sender, text, isCreatedByUser, error, submitting } = message;
+  const { sender, text, searchResult, isCreatedByUser, error, submitting } = message;
   const textEditor = useRef(null);
   const convo = useSelector((state) => state.convo);
   const last = !message?.children?.length;
@@ -159,7 +159,7 @@ export default function Message({
                 <div className="flex min-h-[20px] flex-grow flex-col items-start gap-4 whitespace-pre-wrap">
                   {/* <div className={`${blinker ? 'result-streaming' : ''} markdown prose dark:prose-invert light w-full break-words`}> */}
                   <div className="markdown prose dark:prose-invert light w-full break-words">
-                    {!isCreatedByUser ? (
+                    {(!isCreatedByUser || searchResult) ? (
                       <TextWrapper
                         text={text}
                         generateCursor={generateCursor}

client/src/store/messageSlice.js

@@ -12,7 +12,9 @@ const currentSlice = createSlice({
   reducers: {
     setMessages: (state, action) => {
       state.messages = action.payload;
-      state.messageTree = buildTree(action.payload);
+      const groupAll = action.payload[0]?.searchResult;
+      if (groupAll) console.log('grouping all messages');
+      state.messageTree = buildTree(action.payload, groupAll);
     },
     setEmptyMessage: (state) => {
       state.messages = [

client/src/utils/buildTree.js

@@ -1,17 +1,29 @@
-export default function buildTree(messages) {
+export default function buildTree(messages, groupAll = false) {
   let messageMap = {};
   let rootMessages = [];
 
+  if (!groupAll) {
     // Traverse the messages array and store each element in messageMap.
-  messages.forEach(message => {
-    messageMap[message.messageId] = {...message, children: []};
+    messages.forEach((message) => {
+      messageMap[message.messageId] = { ...message, children: [] };
 
       const parentMessage = messageMap[message.parentMessageId];
-    if (parentMessage)
-      parentMessage.children.push(messageMap[message.messageId]);
-    else 
-      rootMessages.push(messageMap[message.messageId]);
+      if (parentMessage) parentMessage.children.push(messageMap[message.messageId]);
+      else rootMessages.push(messageMap[message.messageId]);
     });
 
     return rootMessages;
+  }
+
+  // Group all messages into one tree
+  let parentId = messages[0].messageId;
+  messages.forEach((message, i) => {
+    if (i === 0) {
+      messageMap[parentId] = { ...message, children: [] };
+      return;
+    }
+    messageMap[parentId].children.push({ ...message, children: [] });
+  });
+
+  return [messageMap[parentId]];
 }