From 3b26a6b60041be1b55ad08413b3f7de6dd541795 Mon Sep 17 00:00:00 2001
From: cristhianzl <cristhian.lousa@gmail.com>
Date: Thu, 4 Sep 2025 15:56:22 -0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A5=20(navigation.tsx):=20remove=20unu?=
 =?UTF-8?q?sed=20code=20and=20streamline=20navigation=20component=20for=20?=
 =?UTF-8?q?better=20performance=20and=20readability?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/components/navigation.tsx | 230 -------------------------
 1 file changed, 230 deletions(-)
 delete mode 100644 frontend/src/components/navigation.tsx

diff --git a/frontend/src/components/navigation.tsx b/frontend/src/components/navigation.tsx
deleted file mode 100644
index 30ac9a4b..00000000
--- a/frontend/src/components/navigation.tsx
+++ /dev/null
@@ -1,230 +0,0 @@
-"use client"
-
-import { useState, useEffect, useRef } from "react"
-import { useRouter, usePathname } from "next/navigation"
-import { Button } from "@/components/ui/button"
-import { Plus, MessageSquare, Database, Settings, GitBranch } from "lucide-react"
-import { useChat } from "@/contexts/chat-context"
-import { useAuth } from "@/contexts/auth-context"
-
-interface Conversation {
-  id: string
-  title: string
-  endpoint: string
-  last_activity: string
-  created_at: string
-  response_id: string
-  messages?: Array<{
-    role: string
-    content: string
-    timestamp?: string
-    response_id?: string
-  }>
-}
-
-export function Navigation() {
-  const router = useRouter()
-  const pathname = usePathname()
-  const { user } = useAuth()
-  const {
-    refreshTrigger,
-    refreshTriggerSilent,
-    loadConversation,
-    startNewConversation,
-    currentConversationId,
-    placeholderConversation,
-  } = useChat()
-  
-  const [conversations, setConversations] = useState<Conversation[]>([])
-  const [loading, setLoading] = useState(false)
-
-  // Load conversations from backend
-  const loadConversations = async () => {
-    if (!user) return
-    
-    try {
-      setLoading(true)
-      const response = await fetch("/api/conversations")
-      if (response.ok) {
-        const data = await response.json()
-        setConversations(data.conversations || [])
-      }
-    } catch (error) {
-      console.error("Failed to load conversations:", error)
-    } finally {
-      setLoading(false)
-    }
-  }
-
-  // Load conversations on mount and when refreshTrigger changes (with loading state)
-  useEffect(() => {
-    loadConversations()
-  }, [refreshTrigger, user])
-
-  // Silent refresh - update data without loading state
-  useEffect(() => {
-    const loadSilent = async () => {
-      if (!user) return
-      
-      try {
-        // Don't show loading state for silent refresh
-        const response = await fetch("/api/conversations")
-        if (response.ok) {
-          const data = await response.json()
-          setConversations(data.conversations || [])
-        }
-      } catch (error) {
-        console.error("Silent conversation refresh failed:", error)
-      }
-    }
-
-    // Only do silent refresh if we have a silent trigger change (not initial load)
-    if (refreshTriggerSilent > 0) {
-      loadSilent()
-    }
-  }, [refreshTriggerSilent, user])
-
-  const handleNewConversation = () => {
-    startNewConversation()
-    // Dispatch custom event to notify chat page
-    window.dispatchEvent(new CustomEvent('newConversation'))
-    router.push('/chat')
-  }
-
-  const handleConversationClick = async (conversation: Conversation) => {
-    try {
-      // Load full conversation data from backend
-      const response = await fetch(`/api/conversations/${conversation.response_id}`)
-      if (response.ok) {
-        const fullConversation = await response.json()
-        loadConversation(fullConversation)
-        router.push('/chat')
-      }
-    } catch (error) {
-      console.error("Failed to load conversation:", error)
-    }
-  }
-
-  const formatRelativeTime = (timestamp: string) => {
-    const date = new Date(timestamp)
-    const now = new Date()
-    const diffMs = now.getTime() - date.getTime()
-    const diffHours = Math.floor(diffMs / (1000 * 60 * 60))
-    const diffDays = Math.floor(diffHours / 24)
-
-    if (diffDays > 0) {
-      return `${diffDays}d ago`
-    } else if (diffHours > 0) {
-      return `${diffHours}h ago`
-    } else {
-      return 'Just now'
-    }
-  }
-
-  return (
-    <nav className="flex flex-col h-full w-72 bg-muted/30 border-r border-border">
-      {/* Header */}
-      <div className="p-4 border-b border-border">
-        <Button 
-          onClick={handleNewConversation}
-          className="w-full justify-start gap-2"
-          variant="default"
-        >
-          <Plus className="h-4 w-4" />
-          New Conversation
-        </Button>
-      </div>
-
-      {/* Navigation Links */}
-      <div className="p-4 border-b border-border">
-        <div className="space-y-2">
-          <Button
-            variant={pathname === '/chat' ? 'secondary' : 'ghost'}
-            className="w-full justify-start gap-2"
-            onClick={() => router.push('/chat')}
-          >
-            <MessageSquare className="h-4 w-4" />
-            Chat
-          </Button>
-          <Button
-            variant={pathname === '/knowledge' ? 'secondary' : 'ghost'}
-            className="w-full justify-start gap-2"
-            onClick={() => router.push('/knowledge')}
-          >
-            <Database className="h-4 w-4" />
-            Knowledge
-          </Button>
-          <Button
-            variant={pathname === '/settings' ? 'secondary' : 'ghost'}
-            className="w-full justify-start gap-2"
-            onClick={() => router.push('/settings')}
-          >
-            <Settings className="h-4 w-4" />
-            Settings
-          </Button>
-        </div>
-      </div>
-
-      {/* Conversations List */}
-      <div className="flex-1 overflow-hidden">
-        <div className="px-4 py-2">
-          <h3 className="text-sm font-medium text-muted-foreground mb-2">Conversations</h3>
-        </div>
-        
-        <div className="flex-1 overflow-y-auto px-2">
-          {loading ? (
-            <div className="p-4 text-sm text-muted-foreground">
-              Loading conversations...
-            </div>
-          ) : (
-            <div className="space-y-1">
-              {/* Show placeholder conversation if exists */}
-              {placeholderConversation && (
-                <div className="p-2 rounded-md bg-primary/10 border border-primary/20">
-                  <div className="flex items-center gap-2 text-sm">
-                    <MessageSquare className="h-3 w-3 text-primary" />
-                    <span className="text-primary font-medium">New conversation</span>
-                  </div>
-                  <div className="text-xs text-muted-foreground mt-1">
-                    Active
-                  </div>
-                </div>
-              )}
-              
-              {conversations.map((conversation) => (
-                <button
-                  key={conversation.id}
-                  onClick={() => handleConversationClick(conversation)}
-                  className={`w-full text-left p-2 rounded-md transition-colors hover:bg-muted/50 ${
-                    currentConversationId === conversation.response_id 
-                      ? 'bg-muted border border-border' 
-                      : ''
-                  }`}
-                >
-                  <div className="flex items-center gap-2 mb-1">
-                    <MessageSquare className="h-3 w-3 text-muted-foreground" />
-                    <span className="text-sm font-medium truncate">
-                      {conversation.title || 'Untitled'}
-                    </span>
-                    {conversation.endpoint === 'chat' && (
-                      <GitBranch className="h-3 w-3 text-blue-400 ml-auto" />
-                    )}
-                  </div>
-                  <div className="text-xs text-muted-foreground">
-                    {formatRelativeTime(conversation.last_activity)}
-                  </div>
-                </button>
-              ))}
-              
-              {conversations.length === 0 && !placeholderConversation && (
-                <div className="p-4 text-sm text-muted-foreground text-center">
-                  No conversations yet
-                </div>
-              )}
-            </div>
-          )}
-        </div>
-      </div>
-    </nav>
-  )
-}
\ No newline at end of file