feat(ai): implement intelligent auto-tagging system
- Added multi-provider AI infrastructure (OpenAI/Ollama) - Implemented real-time tag suggestions with debounced analysis - Created AI diagnostics and database maintenance tools in Settings - Added automated garbage collection for orphan labels - Refined UX with deterministic color hashing and interactive ghost tags
This commit is contained in:
@@ -18,7 +18,7 @@ import {
|
||||
DropdownMenuContent,
|
||||
DropdownMenuTrigger,
|
||||
} from '@/components/ui/dropdown-menu'
|
||||
import { X, Plus, Palette, Image as ImageIcon, Bell, FileText, Eye, Link as LinkIcon } from 'lucide-react'
|
||||
import { X, Plus, Palette, Image as ImageIcon, Bell, FileText, Eye, Link as LinkIcon, Sparkles } from 'lucide-react'
|
||||
import { updateNote } from '@/app/actions/notes'
|
||||
import { fetchLinkMetadata } from '@/app/actions/scrape'
|
||||
import { cn } from '@/lib/utils'
|
||||
@@ -28,6 +28,9 @@ import { LabelManager } from './label-manager'
|
||||
import { LabelBadge } from './label-badge'
|
||||
import { ReminderDialog } from './reminder-dialog'
|
||||
import { EditorImages } from './editor-images'
|
||||
import { useAutoTagging } from '@/hooks/use-auto-tagging'
|
||||
import { GhostTags } from './ghost-tags'
|
||||
import { useLabels } from '@/context/LabelContext'
|
||||
|
||||
interface NoteEditorProps {
|
||||
note: Note
|
||||
@@ -36,6 +39,7 @@ interface NoteEditorProps {
|
||||
|
||||
export function NoteEditor({ note, onClose }: NoteEditorProps) {
|
||||
const { addToast } = useToast()
|
||||
const { labels: globalLabels, addLabel, refreshLabels } = useLabels()
|
||||
const [title, setTitle] = useState(note.title || '')
|
||||
const [content, setContent] = useState(note.content)
|
||||
const [checkItems, setCheckItems] = useState<CheckItem[]>(note.checkItems || [])
|
||||
@@ -49,6 +53,12 @@ export function NoteEditor({ note, onClose }: NoteEditorProps) {
|
||||
const [showMarkdownPreview, setShowMarkdownPreview] = useState(false)
|
||||
const fileInputRef = useRef<HTMLInputElement>(null)
|
||||
|
||||
// Auto-tagging hook
|
||||
const { suggestions, isAnalyzing } = useAutoTagging({
|
||||
content: note.type === 'text' ? (content || '') : '',
|
||||
enabled: note.type === 'text' // Auto-tagging only for text notes
|
||||
})
|
||||
|
||||
// Reminder state
|
||||
const [showReminderDialog, setShowReminderDialog] = useState(false)
|
||||
const [currentReminder, setCurrentReminder] = useState<Date | null>(note.reminder)
|
||||
@@ -56,9 +66,43 @@ export function NoteEditor({ note, onClose }: NoteEditorProps) {
|
||||
// Link state
|
||||
const [showLinkDialog, setShowLinkDialog] = useState(false)
|
||||
const [linkUrl, setLinkUrl] = useState('')
|
||||
|
||||
// Tags rejetés par l'utilisateur pour cette session
|
||||
const [dismissedTags, setDismissedTags] = useState<string[]>([])
|
||||
|
||||
const colorClasses = NOTE_COLORS[color as NoteColor] || NOTE_COLORS.default
|
||||
|
||||
const handleSelectGhostTag = async (tag: string) => {
|
||||
// Vérification insensible à la casse
|
||||
const tagExists = labels.some(l => l.toLowerCase() === tag.toLowerCase())
|
||||
|
||||
if (!tagExists) {
|
||||
setLabels(prev => [...prev, tag])
|
||||
|
||||
// Créer le label globalement s'il n'existe pas
|
||||
const globalExists = globalLabels.some(l => l.name.toLowerCase() === tag.toLowerCase())
|
||||
if (!globalExists) {
|
||||
try {
|
||||
await addLabel(tag)
|
||||
} catch (err) {
|
||||
console.error('Erreur création label auto:', err)
|
||||
}
|
||||
}
|
||||
addToast(`Tag "${tag}" ajouté`, 'success')
|
||||
}
|
||||
}
|
||||
|
||||
const handleDismissGhostTag = (tag: string) => {
|
||||
setDismissedTags(prev => [...prev, tag])
|
||||
}
|
||||
|
||||
// Filtrer les suggestions pour ne pas afficher celles rejetées ou déjà ajoutées (insensible à la casse)
|
||||
const filteredSuggestions = suggestions.filter(s => {
|
||||
if (!s || !s.tag) return false
|
||||
return !labels.some(l => l.toLowerCase() === s.tag.toLowerCase()) &&
|
||||
!dismissedTags.includes(s.tag)
|
||||
})
|
||||
|
||||
const handleImageUpload = async (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
const files = e.target.files
|
||||
if (!files) return
|
||||
@@ -142,6 +186,10 @@ export function NoteEditor({ note, onClose }: NoteEditorProps) {
|
||||
reminder: currentReminder,
|
||||
isMarkdown,
|
||||
})
|
||||
|
||||
// Rafraîchir les labels globaux pour refléter les suppressions éventuelles (orphans)
|
||||
await refreshLabels()
|
||||
|
||||
onClose()
|
||||
} catch (error) {
|
||||
console.error('Failed to save note:', error)
|
||||
@@ -193,12 +241,19 @@ export function NoteEditor({ note, onClose }: NoteEditorProps) {
|
||||
|
||||
<div className="space-y-4">
|
||||
{/* Title */}
|
||||
<Input
|
||||
placeholder="Title"
|
||||
value={title}
|
||||
onChange={(e) => setTitle(e.target.value)}
|
||||
className="text-lg font-semibold border-0 focus-visible:ring-0 px-0 bg-transparent"
|
||||
/>
|
||||
<div className="relative">
|
||||
<Input
|
||||
placeholder="Title"
|
||||
value={title}
|
||||
onChange={(e) => setTitle(e.target.value)}
|
||||
className="text-lg font-semibold border-0 focus-visible:ring-0 px-0 bg-transparent pr-8"
|
||||
/>
|
||||
{filteredSuggestions.length > 0 && (
|
||||
<div className="absolute right-0 top-1/2 -translate-y-1/2" title="Suggestions IA disponibles">
|
||||
<Sparkles className="w-4 h-4 text-purple-500 animate-pulse" />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Images */}
|
||||
<EditorImages images={images} onRemove={handleRemoveImage} />
|
||||
@@ -284,6 +339,14 @@ export function NoteEditor({ note, onClose }: NoteEditorProps) {
|
||||
className="min-h-[200px] border-0 focus-visible:ring-0 px-0 bg-transparent resize-none"
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* AI Auto-tagging Suggestions */}
|
||||
<GhostTags
|
||||
suggestions={filteredSuggestions}
|
||||
isAnalyzing={isAnalyzing}
|
||||
onSelectTag={handleSelectGhostTag}
|
||||
onDismissTag={handleDismissGhostTag}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
<div className="space-y-2">
|
||||
@@ -421,84 +484,43 @@ export function NoteEditor({ note, onClose }: NoteEditorProps) {
|
||||
/>
|
||||
</DialogContent>
|
||||
|
||||
<ReminderDialog
|
||||
|
||||
open={showReminderDialog}
|
||||
|
||||
onOpenChange={setShowReminderDialog}
|
||||
|
||||
currentReminder={currentReminder}
|
||||
|
||||
onSave={handleReminderSave}
|
||||
|
||||
onRemove={handleRemoveReminder}
|
||||
<ReminderDialog
|
||||
open={showReminderDialog}
|
||||
onOpenChange={setShowReminderDialog}
|
||||
currentReminder={currentReminder}
|
||||
onSave={handleReminderSave}
|
||||
onRemove={handleRemoveReminder}
|
||||
/>
|
||||
|
||||
<Dialog open={showLinkDialog} onOpenChange={setShowLinkDialog}>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>Add Link</DialogTitle>
|
||||
</DialogHeader>
|
||||
<div className="space-y-4 py-4">
|
||||
<Input
|
||||
placeholder="https://example.com"
|
||||
value={linkUrl}
|
||||
onChange={(e) => setLinkUrl(e.target.value)}
|
||||
onKeyDown={(e) => {
|
||||
if (e.key === 'Enter') {
|
||||
e.preventDefault()
|
||||
handleAddLink()
|
||||
}
|
||||
}}
|
||||
autoFocus
|
||||
/>
|
||||
|
||||
|
||||
|
||||
<Dialog open={showLinkDialog} onOpenChange={setShowLinkDialog}>
|
||||
|
||||
<DialogContent>
|
||||
|
||||
<DialogHeader>
|
||||
|
||||
<DialogTitle>Add Link</DialogTitle>
|
||||
|
||||
</DialogHeader>
|
||||
|
||||
<div className="space-y-4 py-4">
|
||||
|
||||
<Input
|
||||
|
||||
placeholder="https://example.com"
|
||||
|
||||
value={linkUrl}
|
||||
|
||||
onChange={(e) => setLinkUrl(e.target.value)}
|
||||
|
||||
onKeyDown={(e) => {
|
||||
|
||||
if (e.key === 'Enter') {
|
||||
|
||||
e.preventDefault()
|
||||
|
||||
handleAddLink()
|
||||
|
||||
}
|
||||
|
||||
}}
|
||||
|
||||
autoFocus
|
||||
|
||||
/>
|
||||
|
||||
</div>
|
||||
|
||||
<DialogFooter>
|
||||
|
||||
<Button variant="ghost" onClick={() => setShowLinkDialog(false)}>
|
||||
|
||||
Cancel
|
||||
|
||||
</Button>
|
||||
|
||||
<Button onClick={handleAddLink}>
|
||||
|
||||
Add
|
||||
|
||||
</Button>
|
||||
|
||||
</DialogFooter>
|
||||
|
||||
</DialogContent>
|
||||
|
||||
</Dialog>
|
||||
|
||||
</Dialog>
|
||||
|
||||
)
|
||||
|
||||
}
|
||||
|
||||
|
||||
</div>
|
||||
<DialogFooter>
|
||||
<Button variant="ghost" onClick={() => setShowLinkDialog(false)}>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button onClick={handleAddLink}>
|
||||
Add
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</Dialog>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user