carnet panel

This commit is contained in:
alma 2025-04-20 18:07:52 +02:00
parent 4f85ca7ff1
commit b1988cef6d

View File

@ -1,11 +1,15 @@
"use client";
import React, { useState } from 'react';
import { Search, BookOpen, Tag, Trash2, Star, Archive, X, Folder, FileText, Calendar, Heart, Users, LucideIcon } from 'lucide-react';
import { Search, BookOpen, Tag, Trash2, Star, Archive, X, Folder, FileText, Calendar, Heart, Users, LucideIcon, Layout, Plus } from 'lucide-react';
import { PaneLayout } from '@/app/carnet/page';
interface NavigationProps {
layout: string;
onLayoutChange: (layout: string) => void;
nextcloudFolders: string[];
onFolderSelect: (folder: string) => void;
onNewNote: () => void;
}
type FolderType = 'Notes' | 'Diary' | 'Health' | 'Contacts';
@ -23,7 +27,7 @@ const FOLDER_CONFIG: Record<FolderType, FolderConfig> = {
'Contacts': { icon: Users, order: 4 }
};
export default function Navigation({ nextcloudFolders, onFolderSelect }: NavigationProps) {
export default function Navigation({ layout, onLayoutChange, nextcloudFolders, onFolderSelect, onNewNote }: NavigationProps) {
const [searchQuery, setSearchQuery] = useState('');
const getFolderIcon = (folder: string) => {
@ -72,6 +76,47 @@ export default function Navigation({ nextcloudFolders, onFolderSelect }: Navigat
</div>
</div>
{/* New Note Button */}
<div className="px-4 pb-4">
<button
onClick={onNewNote}
className="w-full flex items-center justify-center space-x-2 px-3 py-2 bg-primary text-white rounded-md hover:bg-primary-dark transition-colors"
>
<Plus className="h-4 w-4" />
<span>Nouvelle note</span>
</button>
</div>
{/* Layout Selection */}
<div className="p-4 border-b border-carnet-border">
<div className="flex items-center space-x-2">
<Layout className="h-4 w-4 text-carnet-text-muted" />
<span className="text-sm font-medium text-carnet-text-primary">Vues</span>
</div>
<div className="mt-2 space-y-1">
<button
onClick={() => onLayoutChange('item-selection')}
className={`w-full px-3 py-2 text-sm rounded-md ${
layout === 'item-selection'
? 'bg-primary text-white'
: 'text-carnet-text-primary hover:bg-carnet-hover'
}`}
>
Liste
</button>
<button
onClick={() => onLayoutChange('table-view')}
className={`w-full px-3 py-2 text-sm rounded-md ${
layout === 'table-view'
? 'bg-primary text-white'
: 'text-carnet-text-primary hover:bg-carnet-hover'
}`}
>
Tableau
</button>
</div>
</div>
{/* Folders */}
<div className="flex-1 overflow-y-auto p-4">
<div className="space-y-1">