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

Update Navigation component styles for improved layout consistency and spacing adjustments.

Browse source
This commit is contained in:
Deon Sanchez 2025-10-02 12:38:09 -06:00
parent 93c2d2f1ad
commit 9fb771d048
1 changed files with 10 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
frontend/components/navigation.tsx
View file

@ -331,7 +331,7 @@ export function Navigation({
return ( return (
<div className="flex flex-col h-full bg-background"> <div className="flex flex-col h-full bg-background">
<div className="px-3 py-2 flex-shrink-0"> <div className="px-4 py-2 flex-shrink-0">
<div className="space-y-1"> <div className="space-y-1">
{routes.map(route => ( {routes.map(route => (
<div key={route.href}> <div key={route.href}>
@ -373,10 +373,10 @@ export function Navigation({
{/* Chat Page Specific Sections */} {/* Chat Page Specific Sections */}
{isOnChatPage && ( {isOnChatPage && (
<div className="flex-1 min-h-0 flex flex-col"> <div className="flex-1 min-h-0 flex flex-col px-4">
{/* Conversations Section */} {/* Conversations Section */}
<div className="px-3 flex-shrink-0"> <div className="flex-shrink-0">
<div className="flex items-center justify-between mb-3 ml-3 mr-2"> <div className="flex items-center justify-between mb-3 mx-3">
<h3 className="text-xs font-medium text-muted-foreground"> <h3 className="text-xs font-medium text-muted-foreground">
Conversations Conversations
</h3> </h3>
@ -392,7 +392,7 @@ export function Navigation({
</div> </div>
</div> </div>
<div className="px-3 flex-1 min-h-0 flex flex-col"> <div className="flex-1 min-h-0 flex flex-col">
{/* Conversations List - grows naturally, doesn't fill all space */} {/* Conversations List - grows naturally, doesn't fill all space */}
<div className="flex-shrink-0 overflow-y-auto scrollbar-hide space-y-1 max-h-full"> <div className="flex-shrink-0 overflow-y-auto scrollbar-hide space-y-1 max-h-full">
{loadingNewConversation || isConversationsLoading ? ( {loadingNewConversation || isConversationsLoading ? (
@ -424,7 +424,7 @@ export function Navigation({
{/* Show regular conversations */} {/* Show regular conversations */}
{conversations.length === 0 && !placeholderConversation ? ( {conversations.length === 0 && !placeholderConversation ? (
<div className="text-[13px] text-muted-foreground p-2 ml-1"> <div className="text-[13px] text-muted-foreground py-2 pl-3">
No conversations yet No conversations yet
</div> </div>
) : ( ) : (
@ -432,7 +432,7 @@ export function Navigation({
<button <button
key={conversation.response_id} key={conversation.response_id}
type="button" type="button"
className={`w-full px-3 pr-2 h-11 rounded-lg group relative text-left ${ className={`w-full px-3 h-11 rounded-lg group relative text-left ${
loading loading
? "opacity-50 cursor-not-allowed" ? "opacity-50 cursor-not-allowed"
: "hover:bg-accent cursor-pointer" : "hover:bg-accent cursor-pointer"
@ -510,7 +510,7 @@ export function Navigation({
{/* Conversation Knowledge Section - appears right after last conversation */} {/* Conversation Knowledge Section - appears right after last conversation */}
<div className="flex-shrink-0 mt-4"> <div className="flex-shrink-0 mt-4">
<div className="flex items-center justify-between mb-3 ml-3 mr-2"> <div className="flex items-center justify-between mb-3 mx-3">
<h3 className="text-xs font-medium text-muted-foreground"> <h3 className="text-xs font-medium text-muted-foreground">
Conversation knowledge Conversation knowledge
</h3> </h3>
@ -532,14 +532,14 @@ export function Navigation({
/> />
<div className="overflow-y-auto scrollbar-hide space-y-1"> <div className="overflow-y-auto scrollbar-hide space-y-1">
{conversationDocs.length === 0 ? ( {conversationDocs.length === 0 ? (
<div className="text-[13px] text-muted-foreground p-2 ml-1"> <div className="text-[13px] text-muted-foreground py-2 px-3">
No documents yet No documents yet
</div> </div>
) : ( ) : (
conversationDocs.map(doc => ( conversationDocs.map(doc => (
<div <div
key={`${doc.filename}-${doc.uploadTime.getTime()}`} key={`${doc.filename}-${doc.uploadTime.getTime()}`}
className="w-full px-3 pr-2 h-11 rounded-lg hover:bg-accent cursor-pointer group flex items-center" 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" /> <FileText className="h-4 w-4 mr-2 text-muted-foreground flex-shrink-0" />
<div className="flex-1 min-w-0"> <div className="flex-1 min-w-0">