zack3d/big-agi
1
0
Fork 0
mirror of https://github.com/enricoros/big-AGI.git synced 2026-05-10 21:50:14 -07:00
Code Issues Packages Projects Releases Wiki Activity

Message when no chats in active folder/search. Fixes #394

Browse Source
This commit is contained in:
Enrico Ros
2024-02-16 09:28:33 -08:00
parent 0cb7be8381
commit 75a15a12a6
2 changed files with 32 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/apps/chat/components/ChatDrawer.tsx
+13 -7
View File
@@ -78,7 +78,7 @@ function ChatDrawer(props: {
// external state
const { closeDrawer, closeDrawerOnMobile } = useOptimaDrawers();
const { activeFolder, allFolders, enableFolders, toggleEnableFolders } = useFolders(props.activeFolderId);
const { filteredChatsCount, filteredChatIDs, filteredChatsAreEmpty, filterefChatsBarBasis, renderNavItems } = useChatNavRenderItems(
const { filteredChatsCount, filteredChatIDs, filteredChatsAreEmpty, filteredChatsBarBasis, filteredChatsIncludeActive, renderNavItems } = useChatNavRenderItems(
props.activeConversationId, props.chatPanesConversationIds, debouncedSearchQuery, activeFolder, allFolders, navGrouping,
);
const { contentScaling, showSymbols } = useUIPreferencesStore(state => ({
@@ -90,11 +90,13 @@ function ChatDrawer(props: {
// New/Activate/Delete Conversation
const isMultiPane = props.chatPanesConversationIds.length >= 2;
const disableNewButton = props.disableNewButton && filteredChatsIncludeActive;
const newButtonDontRecycle = isMultiPane || !filteredChatsIncludeActive;
const handleButtonNew = React.useCallback(() => {
onConversationNew(isMultiPane);
onConversationNew(newButtonDontRecycle);
closeDrawerOnMobile();
}, [closeDrawerOnMobile, isMultiPane, onConversationNew]);
}, [closeDrawerOnMobile, newButtonDontRecycle, onConversationNew]);
const handleConversationActivate = React.useCallback((conversationId: DConversationId, closeMenu: boolean) => {
onConversationActivate(conversationId);
@@ -208,8 +210,8 @@ function ChatDrawer(props: {
<ListItem sx={{ mx: '0.25rem', mb: 0.5 }}>
<ListItemButton
// variant='outlined'
variant={props.disableNewButton ? undefined : 'outlined'}
disabled={props.disableNewButton}
variant={disableNewButton ? undefined : 'outlined'}
disabled={disableNewButton}
onClick={handleButtonNew}
sx={{
// ...PageDrawerTallItemSx,
@@ -221,7 +223,7 @@ function ChatDrawer(props: {
// style
borderRadius: 'md',
boxShadow: (props.disableNewButton || props.isMobile) ? 'none' : 'sm',
boxShadow: (disableNewButton || props.isMobile) ? 'none' : 'sm',
backgroundColor: 'background.popup',
transition: 'box-shadow 0.2s',
}}
@@ -254,7 +256,7 @@ function ChatDrawer(props: {
key={'nav-chat-' + item.conversationId}
item={item}
showSymbols={showSymbols}
bottomBarBasis={showSymbols ? filterefChatsBarBasis : 0}
bottomBarBasis={showSymbols ? filteredChatsBarBasis : 0}
onConversationActivate={handleConversationActivate}
onConversationBranch={onConversationBranch}
onConversationDelete={handleConversationDeleteNoConfirmation}
@@ -265,6 +267,10 @@ function ChatDrawer(props: {
<Typography key={'nav-divider-' + idx} level='body-xs' sx={{ textAlign: 'center', my: 'calc(var(--ListItem-minHeight) / 4)' }}>
{item.title}
</Typography>
) : item.type === 'nav-item-info-message' ? (
<Typography key={'nav-info-' + idx} level='body-xs' sx={{ textAlign: 'center', my: 'calc(var(--ListItem-minHeight) / 2)' }}>
{item.message}
</Typography>
) : null,
)}
</Box>
src/apps/chat/components/useChatNavRenderItems.tsx
+19 -5
View File
@@ -13,12 +13,17 @@ const SEARCH_MIN_CHARS = 3;
export type ChatNavGrouping = false | 'date' | 'persona';
export interface ChatNavigationGroupData {
interface ChatNavigationGroupData {
type: 'nav-item-group',
title: string,
}
type ChatRenderItemData = ChatNavigationItemData | ChatNavigationGroupData;
interface ChatNavigationInfoMessage {
type: 'nav-item-info-message',
message: string,
}
type ChatRenderItemData = ChatNavigationItemData | ChatNavigationGroupData | ChatNavigationInfoMessage;
// Returns a string with the pane indices where the conversation is also open, or false if it's not
@@ -79,7 +84,8 @@ export function useChatNavRenderItems(
filteredChatIDs: DConversationId[],
filteredChatsCount: number,
filteredChatsAreEmpty: boolean,
filterefChatsBarBasis: number,
filteredChatsBarBasis: number,
filteredChatsIncludeActive: boolean,
} {
return useChatStore(({ conversations }) => {
@@ -125,6 +131,9 @@ export function useChatNavRenderItems(
};
}).filter(item => !isSearching || item.searchFrequency > 0);
// check if the active conversation has an item in the list
const filteredChatsIncludeActive = chatNavItems.some(_c => _c.conversationId === activeConversationId);
// [sort by frequency, don't group] if there's a search query
chatNavItems.sort((a, b) => b.searchFrequency - a.searchFrequency);
@@ -160,11 +169,15 @@ export function useChatNavRenderItems(
]);
}
// [empty message] if there are no items
if (!renderNavItems.length)
renderNavItems.push({ type: 'nav-item-info-message', message: isSearching ? 'No results found' : 'No conversations in folder' });
// other derived state
const filteredChatIDs = chatNavItems.map(_c => _c.conversationId);
const filteredChatsCount = chatNavItems.length;
const filteredChatsAreEmpty = !filteredChatsCount || (filteredChatsCount === 1 && chatNavItems[0].isEmpty);
const filterefChatsBarBasis = (filteredChatsCount >= AUTO_UNDERLINE_COUNT || isSearching)
const filteredChatsBarBasis = (filteredChatsCount >= AUTO_UNDERLINE_COUNT || isSearching)
? chatNavItems.reduce((longest, _c) => Math.max(longest, isSearching ? _c.searchFrequency : _c.messageCount), 1)
: 0;
@@ -173,7 +186,8 @@ export function useChatNavRenderItems(
filteredChatIDs,
filteredChatsCount,
filteredChatsAreEmpty,
filterefChatsBarBasis,
filteredChatsBarBasis,
filteredChatsIncludeActive,
};
},
(a, b) => {