From d52fe0f0641b03bccbbc7034f3ab4618674cab0b Mon Sep 17 00:00:00 2001 From: alma Date: Sun, 20 Apr 2025 15:35:00 +0200 Subject: [PATCH] carnet uix layout --- app/carnet/page.tsx | 158 ++++++++++--------------------- components/carnet/header.tsx | 11 +++ components/carnet/navigation.tsx | 33 ++----- 3 files changed, 68 insertions(+), 134 deletions(-) create mode 100644 components/carnet/header.tsx diff --git a/app/carnet/page.tsx b/app/carnet/page.tsx index c4994681..e7a3f647 100644 --- a/app/carnet/page.tsx +++ b/app/carnet/page.tsx @@ -33,12 +33,11 @@ interface NextcloudStatus { export default function CarnetPage() { const { data: session, status } = useSession(); + const [layout, setLayout] = useState(PaneLayout.ItemSelection); + const [nextcloudFolders, setNextcloudFolders] = useState([]); + const [selectedFolder, setSelectedFolder] = useState(null); const [isLoading, setIsLoading] = useState(true); - const [nextcloudStatus, setNextcloudStatus] = useState({ - isConnected: false, - folders: [] - }); - const [layoutMode, setLayoutMode] = useState(PaneLayout.ItemSelection); + const [error, setError] = useState(null); const [selectedNote, setSelectedNote] = useState(null); const [isMobile, setIsMobile] = useState(false); const [showNav, setShowNav] = useState(true); @@ -54,36 +53,26 @@ export default function CarnetPage() { const isSmallScreen = useMediaQuery("(max-width: 768px)"); const isMediumScreen = useMediaQuery("(max-width: 1024px)"); - // Check Nextcloud connection and get folders useEffect(() => { - async function checkNextcloudConnection() { + const fetchNextcloudFolders = async () => { try { const response = await fetch('/api/nextcloud/status'); - const data = await response.json(); - if (!response.ok) { - throw new Error(data.error || 'Failed to connect to Nextcloud'); + throw new Error('Failed to fetch Nextcloud folders'); } - - setNextcloudStatus({ - isConnected: true, - folders: data.folders || [] - }); - } catch (error) { - console.error('Nextcloud connection error:', error); - setNextcloudStatus({ - isConnected: false, - folders: [], - error: error instanceof Error ? error.message : 'Failed to connect to Nextcloud' - }); - toast.error("Impossible de se connecter à Nextcloud. Veuillez vérifier votre connexion."); + const data = await response.json(); + setNextcloudFolders(data.folders || []); + setError(null); + } catch (err) { + setError(err instanceof Error ? err.message : 'An error occurred'); + setNextcloudFolders([]); + } finally { + setIsLoading(false); } - } + }; - if (session?.user) { - checkNextcloudConnection(); - } - }, [session]); + fetchNextcloudFolders(); + }, []); useEffect(() => { if (status === "unauthenticated") { @@ -139,99 +128,50 @@ export default function CarnetPage() { console.log('Saving note:', note); }; + const handleFolderSelect = (folder: string) => { + setSelectedFolder(folder); + setLayout(PaneLayout.ItemSelection); + }; + if (isLoading) { return ( -
-
+
+
); } - if (!nextcloudStatus.isConnected) { + if (error) { return ( -
-
-

- Connexion à Nextcloud impossible -

-

- {nextcloudStatus.error || "Veuillez vérifier votre connexion et réessayer."} -

- -
+
+
{error}
); } return ( -
- {/* Navigation Panel */} - {showNav && ( - <> -
- -
- - {/* Navigation Resizer */} - setIsDraggingNav(true)} - onDragEnd={() => setIsDraggingNav(false)} - onDrag={handleNavResize} - /> - - )} - - {/* Notes Panel */} - {showNotes && ( - <> -
- -
- - {/* Notes Resizer */} - setIsDraggingNotes(true)} - onDragEnd={() => setIsDraggingNotes(false)} - onDrag={handleNotesResize} - /> - - )} - - {/* Editor Panel */} -
- -
- - {/* Mobile Navigation Toggle */} - {isMobile && ( -
- - +
+ +
+
+
+ {selectedFolder ? ( +
+

{selectedFolder}

+ {/* Add your folder content here */} +
+ ) : ( +
+

Select a folder to view its contents

+
+ )}
- )} -
+
+
); } \ No newline at end of file diff --git a/components/carnet/header.tsx b/components/carnet/header.tsx new file mode 100644 index 00000000..a965967e --- /dev/null +++ b/components/carnet/header.tsx @@ -0,0 +1,11 @@ +interface HeaderProps { + title: string; +} + +export default function Header({ title }: HeaderProps) { + return ( +
+

{title}

+
+ ); +} \ No newline at end of file diff --git a/components/carnet/navigation.tsx b/components/carnet/navigation.tsx index 43a322a0..8e7c99d3 100644 --- a/components/carnet/navigation.tsx +++ b/components/carnet/navigation.tsx @@ -5,11 +5,13 @@ import { Search, BookOpen, Tag, Trash2, Star, Archive, X, Folder } from 'lucide- import { PaneLayout } from '@/app/carnet/page'; interface NavigationProps { - onLayoutChange?: (layout: PaneLayout) => void; - nextcloudFolders?: string[]; + layout: PaneLayout; + onLayoutChange: (layout: PaneLayout) => void; + nextcloudFolders: string[]; + onFolderSelect: (folder: string) => void; } -export const Navigation: React.FC = ({ onLayoutChange, nextcloudFolders = [] }) => { +export default function Navigation({ layout, onLayoutChange, nextcloudFolders, onFolderSelect }: NavigationProps) { const [searchQuery, setSearchQuery] = useState(''); return ( @@ -75,29 +77,10 @@ export const Navigation: React.FC = ({ onLayoutChange, nextclou - {/* Favorites Section */} -
-

Vues

-
-
- Journal - 2 -
-
- Santé - 1 -
-
- Daily Notes - 7 -
-
-
- - {/* Nextcloud Folders */} + {/* Nextcloud Folders Section */} {nextcloudFolders.length > 0 && (
-

Dossiers Nextcloud

+

Vues

{nextcloudFolders.map((folder) => (
= ({ onLayoutChange, nextclou
); -}; \ No newline at end of file +} \ No newline at end of file