gmakstutis/openrag
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixed navigation style to not placeholder for new conversation, not show loading state, and to show correct files

Browse source
This commit is contained in:
Lucas Oliveira 2025-11-18 17:28:38 -03:00
parent 68db630a27
commit 8a7cef695e
1 changed files with 17 additions and 75 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

92
frontend/components/navigation.tsx
View file

@ -431,35 +431,22 @@ export function Navigation({
<div className="flex-1 min-h-0 overflow-y-auto scrollbar-hide">
<div className="space-y-1 flex flex-col">
{loadingNewConversation || isConversationsLoading ? (
<div className="text-[13px] text-muted-foreground p-2">
Loading...
</div>
{/* Show skeleton loaders when loading and no conversations exist */}
{isConversationsLoading && conversations.length === 0 ? (
[0,1].map((skeletonIndex) => (
<div
key={`conversation-skeleton-${skeletonIndex}`}
className={cn("w-full px-3 h-11 rounded-lg animate-pulse", skeletonIndex === 0 ? "bg-accent/50" : "")}
>
<div className="h-3 bg-muted-foreground/20 rounded w-3/4 mt-3.5" />
</div>
))
) : (
<>
{/* Show placeholder conversation if it exists */}
{placeholderConversation && (
<button
type="button"
className="w-full px-3 rounded-lg bg-accent border border-dashed border-accent cursor-pointer group text-left h-[44px]"
onClick={() => {
// Don't load placeholder as a real conversation, just focus the input
if (typeof window !== "undefined") {
window.dispatchEvent(new CustomEvent("focusInput"));
}
}}
>
<div className="text-[13px] font-medium text-foreground truncate">
{placeholderConversation.title}
</div>
<div className="text-xs text-muted-foreground">
Start typing to begin...
</div>
</button>
)}
{/* Show regular conversations */}
{conversations.length === 0 && !placeholderConversation ? (
{conversations.length === 0 && !isConversationsLoading ? (
<div className="text-[13px] text-muted-foreground py-2 pl-3">
No conversations yet
</div>
@ -469,7 +456,7 @@ export function Navigation({
key={conversation.response_id}
type="button"
className={`w-full px-3 h-11 rounded-lg group relative text-left ${
loading
loading || isConversationsLoading
? "opacity-50 cursor-not-allowed"
: "hover:bg-accent cursor-pointer"
} ${
@ -478,11 +465,11 @@ export function Navigation({
: ""
}`}
onClick={() => {
if (loading) return;
if (loading || isConversationsLoading) return;
loadConversation(conversation);
refreshConversations();
}}
disabled={loading}
disabled={loading || isConversationsLoading}
>
<div className="flex items-center justify-between">
<div className="flex-1 min-w-0">
@ -493,7 +480,7 @@ export function Navigation({
<DropdownMenu>
<DropdownMenuTrigger
disabled={
loading || deleteSessionMutation.isPending
loading || isConversationsLoading || deleteSessionMutation.isPending
}
asChild
>
@ -543,51 +530,6 @@ export function Navigation({
</>
)}
</div>
{/* Conversation Knowledge Section - appears right after last conversation
<div className="flex-shrink-0 mt-4">
<div className="flex items-center justify-between mb-3 mx-3">
<h3 className="text-xs font-medium text-muted-foreground">
Conversation knowledge
</h3>
<button
type="button"
onClick={handleFilePickerClick}
className="p-1 hover:bg-accent rounded"
disabled={loading}
>
<Plus className="h-4 w-4 text-muted-foreground" />
</button>
</div>
<input
ref={fileInputRef}
type="file"
onChange={handleFilePickerChange}
className="hidden"
accept=".pdf,.doc,.docx,.txt,.md,.rtf,.odt"
/>
<div className="overflow-y-auto scrollbar-hide space-y-1">
{conversationDocs.length === 0 ? (
<div className="text-[13px] text-muted-foreground py-2 px-3">
No documents yet
</div>
) : (
conversationDocs.map(doc => (
<div
key={`${doc.filename}-${doc.uploadTime.getTime()}`}
className="w-full px-3 h-11 rounded-lg hover:bg-accent cursor-pointer group flex items-center"
>
<FileText className="h-4 w-4 mr-2 text-muted-foreground flex-shrink-0" />
<div className="flex-1 min-w-0">
<div className="text-sm text-foreground truncate">
{doc.filename}
</div>
</div>
</div>
))
)}
</div>
</div> */}
<div className="flex-shrink-0 mt-4">
<div className="flex items-center justify-between mb-3 mx-3">
<h3 className="text-xs font-medium text-muted-foreground">
@ -595,7 +537,7 @@ export function Navigation({
</h3>
</div>
<div className="overflow-y-auto scrollbar-hide space-y-1">
{newConversationFiles?.length === 0 ? (
{(newConversationFiles?.length ?? 0) === 0 ? (
<div className="text-[13px] text-muted-foreground py-2 px-3">
No documents yet
</div>