8daf50ac3f
- Fix LanguageProvider: add RTL support (ar/fa), translation caching, prevent blank flash during load, browser language detection - Fix detect-user-language: extend whitelist from 5 to all 15 languages - Remove hardcoded initialLanguage="fr" from auth layout - Complete fr.json translation (all sections translated from English) - Add missing admin.ai keys to all 13 non-English locales - Translate ai.autoLabels, ai.batchOrganization, memoryEcho sections for all locales - Remove duplicate top-level autoLabels/batchOrganization from en.json - Fix notebook creation: replace window.location.reload() with createNotebookOptimistic + router.refresh() - Fix notebook name truncation in sidebar with min-w-0 - Remove redundant router.refresh() after note creation in page.tsx Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
78 lines
2.2 KiB
TypeScript
78 lines
2.2 KiB
TypeScript
'use client'
|
|
|
|
import { memo, useState, useEffect } from 'react'
|
|
import { Sparkles } from 'lucide-react'
|
|
import { cn } from '@/lib/utils'
|
|
import { useLanguage } from '@/lib/i18n/LanguageProvider'
|
|
import { getConnectionsCount } from '@/lib/connections-cache'
|
|
|
|
interface ConnectionsBadgeProps {
|
|
noteId: string
|
|
onClick?: () => void
|
|
className?: string
|
|
}
|
|
|
|
export const ConnectionsBadge = memo(function ConnectionsBadge({ noteId, onClick, className }: ConnectionsBadgeProps) {
|
|
const { t } = useLanguage()
|
|
const [connectionCount, setConnectionCount] = useState<number>(0)
|
|
const [isLoading, setIsLoading] = useState(false)
|
|
const [isHovered, setIsHovered] = useState(false)
|
|
const [fetchAttempted, setFetchAttempted] = useState(false)
|
|
|
|
useEffect(() => {
|
|
if (fetchAttempted) return
|
|
setFetchAttempted(true)
|
|
|
|
let isMounted = true
|
|
|
|
const fetchConnections = async () => {
|
|
setIsLoading(true)
|
|
try {
|
|
const count = await getConnectionsCount(noteId)
|
|
if (isMounted) {
|
|
setConnectionCount(count)
|
|
}
|
|
} catch (error) {
|
|
console.error('[ConnectionsBadge] Failed to fetch connections:', error)
|
|
if (isMounted) {
|
|
setConnectionCount(0)
|
|
}
|
|
} finally {
|
|
if (isMounted) {
|
|
setIsLoading(false)
|
|
}
|
|
}
|
|
}
|
|
|
|
fetchConnections()
|
|
|
|
return () => {
|
|
isMounted = false
|
|
}
|
|
}, [noteId]) // eslint-disable-line react-hooks/exhaustive-deps
|
|
|
|
// Don't render if no connections or still loading
|
|
if (connectionCount === 0 || isLoading) {
|
|
return null
|
|
}
|
|
|
|
const plural = connectionCount > 1 ? 's' : ''
|
|
const badgeText = t('memoryEcho.connectionsBadge', { count: connectionCount, plural })
|
|
|
|
return (
|
|
<div className={cn(
|
|
'inline-flex items-center gap-1 px-2 py-0.5 rounded-full text-xs font-medium bg-purple-100 dark:bg-purple-900/30 text-purple-700 dark:text-purple-400 border border-purple-200 dark:border-purple-800 transition-all duration-150 ease-out',
|
|
isHovered && 'scale-105',
|
|
className
|
|
)}
|
|
onClick={onClick}
|
|
onMouseEnter={() => setIsHovered(true)}
|
|
onMouseLeave={() => setIsHovered(false)}
|
|
title={badgeText}
|
|
>
|
|
<Sparkles className="h-2.5 w-2.5 inline-block mr-1" />
|
|
{badgeText}
|
|
</div>
|
|
)
|
|
})
|