LibreChat/client/src/utils/convos.ts

165 lines
4.6 KiB
TypeScript
Raw Normal View History

import {
parseISO,
isToday,
isWithinInterval,
subDays,
getMonth,
getYear,
startOfDay,
startOfYear,
format,
} from 'date-fns';
♾️ style: Infinite Scroll Nav and Sort Convos by Date/Usage (#1708) * Style: Infinite Scroll and Group convos by date * Style: Infinite Scroll and Group convos by date- Redesign NavBar * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Clean code * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Including OpenRouter and Mistral icon * refactor(Conversations): cleanup use of utility functions and typing * refactor(Nav/NewChat): use localStorage `lastConversationSetup` to determine the endpoint to use, as well as icons -> JSX components, remove use of `endpointSelected` * refactor: remove use of `isFirstToday` * refactor(Nav): remove use of `endpointSelected`, consolidate scrolling logic to its own hook `useNavScrolling`, remove use of recoil `conversation` * refactor: Add spinner to bottom of list, throttle fetching, move query hooks to client workspace * chore: sort by `updatedAt` field * refactor: optimize conversation infinite query, use optimistic updates, add conversation helpers for managing pagination, remove unnecessary operations * feat: gen_title route for generating the title for the conversation * style(Convo): change hover bg-color * refactor: memoize groupedConversations and return as array of tuples, correctly update convos pre/post message stream, only call genTitle if conversation is new, make `addConversation` dynamically either add/update depending if convo exists in pages already, reorganize type definitions * style: rename Header NewChat Button -> HeaderNewChat, add NewChatIcon, closely match main Nav New Chat button to ChatGPT * style(NewChat): add hover bg color * style: cleanup comments, match ChatGPT nav styling, redesign search bar, make part of new chat sticky header, move Nav under same parent as outlet/mobilenav, remove legacy code, search only if searchQuery is not empty * feat: add tests for conversation helpers and ensure no duplicate conversations are ever grouped * style: hover bg-color * feat: alt-click on convo item to open conversation in new tab * chore: send error message when `gen_title` fails --------- Co-authored-by: Walber Cardoso <walbercardoso@gmail.com>
2024-02-03 20:25:35 -05:00
import type {
TConversation,
ConversationData,
ConversationUpdater,
GroupedConversations,
} from 'librechat-data-provider';
const getGroupName = (date: Date) => {
const now = new Date();
if (isToday(date)) {
return 'Today';
}
if (isWithinInterval(date, { start: startOfDay(subDays(now, 1)), end: now })) {
return 'Yesterday';
}
♾️ style: Infinite Scroll Nav and Sort Convos by Date/Usage (#1708) * Style: Infinite Scroll and Group convos by date * Style: Infinite Scroll and Group convos by date- Redesign NavBar * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Clean code * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Including OpenRouter and Mistral icon * refactor(Conversations): cleanup use of utility functions and typing * refactor(Nav/NewChat): use localStorage `lastConversationSetup` to determine the endpoint to use, as well as icons -> JSX components, remove use of `endpointSelected` * refactor: remove use of `isFirstToday` * refactor(Nav): remove use of `endpointSelected`, consolidate scrolling logic to its own hook `useNavScrolling`, remove use of recoil `conversation` * refactor: Add spinner to bottom of list, throttle fetching, move query hooks to client workspace * chore: sort by `updatedAt` field * refactor: optimize conversation infinite query, use optimistic updates, add conversation helpers for managing pagination, remove unnecessary operations * feat: gen_title route for generating the title for the conversation * style(Convo): change hover bg-color * refactor: memoize groupedConversations and return as array of tuples, correctly update convos pre/post message stream, only call genTitle if conversation is new, make `addConversation` dynamically either add/update depending if convo exists in pages already, reorganize type definitions * style: rename Header NewChat Button -> HeaderNewChat, add NewChatIcon, closely match main Nav New Chat button to ChatGPT * style(NewChat): add hover bg color * style: cleanup comments, match ChatGPT nav styling, redesign search bar, make part of new chat sticky header, move Nav under same parent as outlet/mobilenav, remove legacy code, search only if searchQuery is not empty * feat: add tests for conversation helpers and ensure no duplicate conversations are ever grouped * style: hover bg-color * feat: alt-click on convo item to open conversation in new tab * chore: send error message when `gen_title` fails --------- Co-authored-by: Walber Cardoso <walbercardoso@gmail.com>
2024-02-03 20:25:35 -05:00
if (isWithinInterval(date, { start: subDays(now, 7), end: now })) {
return 'Previous 7 days';
♾️ style: Infinite Scroll Nav and Sort Convos by Date/Usage (#1708) * Style: Infinite Scroll and Group convos by date * Style: Infinite Scroll and Group convos by date- Redesign NavBar * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Clean code * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Including OpenRouter and Mistral icon * refactor(Conversations): cleanup use of utility functions and typing * refactor(Nav/NewChat): use localStorage `lastConversationSetup` to determine the endpoint to use, as well as icons -> JSX components, remove use of `endpointSelected` * refactor: remove use of `isFirstToday` * refactor(Nav): remove use of `endpointSelected`, consolidate scrolling logic to its own hook `useNavScrolling`, remove use of recoil `conversation` * refactor: Add spinner to bottom of list, throttle fetching, move query hooks to client workspace * chore: sort by `updatedAt` field * refactor: optimize conversation infinite query, use optimistic updates, add conversation helpers for managing pagination, remove unnecessary operations * feat: gen_title route for generating the title for the conversation * style(Convo): change hover bg-color * refactor: memoize groupedConversations and return as array of tuples, correctly update convos pre/post message stream, only call genTitle if conversation is new, make `addConversation` dynamically either add/update depending if convo exists in pages already, reorganize type definitions * style: rename Header NewChat Button -> HeaderNewChat, add NewChatIcon, closely match main Nav New Chat button to ChatGPT * style(NewChat): add hover bg color * style: cleanup comments, match ChatGPT nav styling, redesign search bar, make part of new chat sticky header, move Nav under same parent as outlet/mobilenav, remove legacy code, search only if searchQuery is not empty * feat: add tests for conversation helpers and ensure no duplicate conversations are ever grouped * style: hover bg-color * feat: alt-click on convo item to open conversation in new tab * chore: send error message when `gen_title` fails --------- Co-authored-by: Walber Cardoso <walbercardoso@gmail.com>
2024-02-03 20:25:35 -05:00
}
if (isWithinInterval(date, { start: subDays(now, 30), end: now })) {
return 'Previous 30 days';
}
if (isWithinInterval(date, { start: startOfYear(now), end: now })) {
return ' ' + format(date, 'MMMM');
♾️ style: Infinite Scroll Nav and Sort Convos by Date/Usage (#1708) * Style: Infinite Scroll and Group convos by date * Style: Infinite Scroll and Group convos by date- Redesign NavBar * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Clean code * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Style: Infinite Scroll and Group convos by date- Redesign NavBar - Redesign NewChat Component * Including OpenRouter and Mistral icon * refactor(Conversations): cleanup use of utility functions and typing * refactor(Nav/NewChat): use localStorage `lastConversationSetup` to determine the endpoint to use, as well as icons -> JSX components, remove use of `endpointSelected` * refactor: remove use of `isFirstToday` * refactor(Nav): remove use of `endpointSelected`, consolidate scrolling logic to its own hook `useNavScrolling`, remove use of recoil `conversation` * refactor: Add spinner to bottom of list, throttle fetching, move query hooks to client workspace * chore: sort by `updatedAt` field * refactor: optimize conversation infinite query, use optimistic updates, add conversation helpers for managing pagination, remove unnecessary operations * feat: gen_title route for generating the title for the conversation * style(Convo): change hover bg-color * refactor: memoize groupedConversations and return as array of tuples, correctly update convos pre/post message stream, only call genTitle if conversation is new, make `addConversation` dynamically either add/update depending if convo exists in pages already, reorganize type definitions * style: rename Header NewChat Button -> HeaderNewChat, add NewChatIcon, closely match main Nav New Chat button to ChatGPT * style(NewChat): add hover bg color * style: cleanup comments, match ChatGPT nav styling, redesign search bar, make part of new chat sticky header, move Nav under same parent as outlet/mobilenav, remove legacy code, search only if searchQuery is not empty * feat: add tests for conversation helpers and ensure no duplicate conversations are ever grouped * style: hover bg-color * feat: alt-click on convo item to open conversation in new tab * chore: send error message when `gen_title` fails --------- Co-authored-by: Walber Cardoso <walbercardoso@gmail.com>
2024-02-03 20:25:35 -05:00
}
return ' ' + getYear(date).toString();
};
export const groupConversationsByDate = (conversations: TConversation[]): GroupedConversations => {
if (!Array.isArray(conversations)) {
return [];
}
const seenConversationIds = new Set();
const groups = conversations.reduce((acc, conversation) => {
if (seenConversationIds.has(conversation.conversationId)) {
return acc;
}
seenConversationIds.add(conversation.conversationId);
const date = parseISO(conversation.updatedAt);
const groupName = getGroupName(date);
if (!acc[groupName]) {
acc[groupName] = [];
}
acc[groupName].push(conversation);
return acc;
}, {});
const sortedGroups = {};
const dateGroups = ['Today', 'Last 7 days', 'Last 30 days'];
dateGroups.forEach((group) => {
if (groups[group]) {
sortedGroups[group] = groups[group];
}
});
Object.keys(groups)
.filter((group) => !dateGroups.includes(group))
.sort()
.reverse()
.forEach((year) => {
sortedGroups[year] = groups[year];
});
return Object.entries(sortedGroups);
};
export const addConversation: ConversationUpdater = (data, newConversation) => {
const newData = JSON.parse(JSON.stringify(data)) as ConversationData;
const { pageIndex, convIndex } = findPageForConversation(newData, newConversation);
if (pageIndex !== -1 && convIndex !== -1) {
return updateConversation(data, newConversation);
}
newData.pages[0].conversations.unshift({
...newConversation,
updatedAt: new Date().toISOString(),
});
return newData;
};
export function findPageForConversation(
data: ConversationData,
conversation: TConversation | { conversationId: string },
) {
for (let pageIndex = 0; pageIndex < data.pages.length; pageIndex++) {
const page = data.pages[pageIndex];
const convIndex = page.conversations.findIndex(
(c) => c.conversationId === conversation.conversationId,
);
if (convIndex !== -1) {
return { pageIndex, convIndex };
}
}
return { pageIndex: -1, convIndex: -1 }; // Not found
}
export const updateConversation: ConversationUpdater = (data, updatedConversation) => {
const newData = JSON.parse(JSON.stringify(data));
const { pageIndex, convIndex } = findPageForConversation(newData, updatedConversation);
if (pageIndex !== -1 && convIndex !== -1) {
// Remove the conversation from its current position
newData.pages[pageIndex].conversations.splice(convIndex, 1);
// Add the updated conversation to the top of the first page
newData.pages[0].conversations.unshift({
...updatedConversation,
updatedAt: new Date().toISOString(),
});
}
return newData;
};
export const updateConvoFields: ConversationUpdater = (
data: ConversationData,
updatedConversation: Partial<TConversation> & Pick<TConversation, 'conversationId'>,
): ConversationData => {
const newData = JSON.parse(JSON.stringify(data));
const { pageIndex, convIndex } = findPageForConversation(
newData,
updatedConversation as { conversationId: string },
);
if (pageIndex !== -1 && convIndex !== -1) {
const deleted = newData.pages[pageIndex].conversations.splice(convIndex, 1);
const oldConversation = deleted[0] as TConversation;
newData.pages[0].conversations.unshift({
...oldConversation,
...updatedConversation,
updatedAt: new Date().toISOString(),
});
}
return newData;
};
export const deleteConversation = (
data: ConversationData,
conversationId: string,
): ConversationData => {
const newData = JSON.parse(JSON.stringify(data));
const { pageIndex, convIndex } = findPageForConversation(newData, { conversationId });
if (pageIndex !== -1 && convIndex !== -1) {
// Delete the conversation from its current page
newData.pages[pageIndex].conversations.splice(convIndex, 1);
}
return newData;
};