"use client";

import { useEffect, useState, useRef } from "react";
import { useSession } from "next-auth/react";
import { redirect } from "next/navigation";
import Navigation from "@/components/carnet/navigation";
import { NotesView } from "@/components/carnet/notes-view";
import { Editor } from "@/components/carnet/editor";
import { PanelResizer } from "@/components/carnet/panel-resizer";
import { useMediaQuery } from "@/hooks/use-media-query";
import { ContactsView } from '@/components/carnet/contacts-view';
import { X, Menu } from "lucide-react";
import { ContactDetails } from '@/components/carnet/contact-details';
import { parse as parseVCard, format as formatVCard } from 'vcard-parser';

// Layout modes
export enum PaneLayout {
  TagSelection = "tag-selection",
  ItemSelection = "item-selection",
  TableView = "table-view",
  Editing = "editing"
}

interface Note {
  id: string;
  title: string;
  content: string;
  lastModified: string;
  type: string;
  mime: string;
  etag: string;
}

interface Contact {
  id: string;
  fullName?: string;
  email?: string;
  phone?: string;
  organization?: string;
  address?: string;
  notes?: string;
  group?: string;
}

export default function CarnetPage() {
  const { data: session, status } = useSession();
  const [isLoading, setIsLoading] = useState(true);
  const [layoutMode, setLayoutMode] = useState<string>("item-selection");
  const [selectedNote, setSelectedNote] = useState<Note | null>(null);
  const [isMobile, setIsMobile] = useState(false);
  const [showNav, setShowNav] = useState(true);
  const [showNotes, setShowNotes] = useState(true);
  const [nextcloudFolders, setNextcloudFolders] = useState<string[]>([]);
  const [selectedFolder, setSelectedFolder] = useState<string>('Notes');
  const [notes, setNotes] = useState<Note[]>([]);
  const [isLoadingNotes, setIsLoadingNotes] = useState(true);
  const [contacts, setContacts] = useState<Contact[]>([]);
  const [selectedContact, setSelectedContact] = useState<Contact | null>(null);
  const [isLoadingContacts, setIsLoadingContacts] = useState(true);
  
  // Panel widths state
  const [navWidth, setNavWidth] = useState(220);
  const [notesWidth, setNotesWidth] = useState(400);
  const [isDraggingNav, setIsDraggingNav] = useState(false);
  const [isDraggingNotes, setIsDraggingNotes] = useState(false);

  // Check screen size
  const isSmallScreen = useMediaQuery("(max-width: 768px)");
  const isMediumScreen = useMediaQuery("(max-width: 1024px)");

  // Cache for Nextcloud folders
  const foldersCache = useRef<{ folders: string[]; timestamp: number } | null>(null);

  useEffect(() => {
    const fetchNextcloudFolders = async () => {
      // First check localStorage cache
      const cachedData = localStorage.getItem('nextcloud_folders');
      if (cachedData) {
        const { folders, timestamp } = JSON.parse(cachedData);
        const cacheAge = Date.now() - timestamp;
        if (cacheAge < 5 * 60 * 1000) { // 5 minutes cache
          setNextcloudFolders(folders);
          return;
        }
      }

      try {
        const response = await fetch('/api/nextcloud/status');
        if (!response.ok) {
          throw new Error('Failed to fetch Nextcloud folders');
        }
        const data = await response.json();
        const folders = data.folders || [];
        
        // Update both localStorage and memory cache
        localStorage.setItem('nextcloud_folders', JSON.stringify({
          folders,
          timestamp: Date.now()
        }));
        
        foldersCache.current = {
          folders,
          timestamp: Date.now()
        };
        
        setNextcloudFolders(folders);
      } catch (err) {
        console.error('Error fetching Nextcloud folders:', err);
        setNextcloudFolders([]);
      }
    };

    if (status === "authenticated") {
      fetchNextcloudFolders();
    }
  }, [status]);

  useEffect(() => {
    if (status === "unauthenticated") {
      redirect("/signin");
    }
    if (status !== "loading") {
      setIsLoading(false);
    }
  }, [status]);

  useEffect(() => {
    if (isSmallScreen) {
      setIsMobile(true);
      setShowNav(false);
      setShowNotes(false);
    } else if (isMediumScreen) {
      setIsMobile(false);
      setShowNav(true);
      setShowNotes(false);
    } else {
      setIsMobile(false);
      setShowNav(true);
      setShowNotes(true);
    }
  }, [isSmallScreen, isMediumScreen]);

  useEffect(() => {
    if (selectedFolder === 'Contacts') {
      // When "Contacts" is selected, show all contacts
      fetchContacts('Contacts');
    } else if (selectedFolder.endsWith('.vcf')) {
      // When a specific VCF file is selected, show its contacts
      fetchContacts(selectedFolder);
    } else {
      // For other folders (Notes, etc.), fetch notes
      const fetchNotes = async () => {
        try {
          setIsLoadingNotes(true);
          const response = await fetch(`/api/nextcloud/files?folder=${selectedFolder}`);
          if (!response.ok) {
            throw new Error('Failed to fetch notes');
          }
          const data = await response.json();
          setNotes(data);
        } catch (error) {
          console.error('Error fetching notes:', error);
          setNotes([]);
        } finally {
          setIsLoadingNotes(false);
        }
      };
      fetchNotes();
    }
  }, [selectedFolder, session?.user?.id]);

  const parseVCardContent = (content: string): Contact[] => {
    try {
      // Split the content into individual vCards
      const vcards = content.split('BEGIN:VCARD').filter(section => section.trim());
      
      return vcards.map(section => {
        const vcard = parseVCard('BEGIN:VCARD' + section);
        
        // Extract contact properties with proper type handling
        const uid = vcard.uid?.[0]?.value;
        const fullName = vcard.fn?.[0]?.value;
        const email = vcard.email?.[0]?.value;
        const phone = vcard.tel?.[0]?.value;
        const organization = vcard.org?.[0]?.value;
        const address = vcard.adr?.[0]?.value;
        const notes = vcard.note?.[0]?.value;
        const group = vcard.categories?.[0]?.value;
        
        // Create a clean contact object
        const contact: Contact = {
          id: uid || Math.random().toString(36).substr(2, 9),
          fullName: fullName || 'Unknown Contact',
          email: email || '',
          phone: phone || '',
          organization: organization || '',
          address: address || '',
          notes: notes || '',
          group: group || ''
        };
        
        return contact;
      });
    } catch (error) {
      console.error('Error parsing VCF content:', error);
      return [];
    }
  };

  const fetchContacts = async (folder: string) => {
    try {
      setIsLoadingContacts(true);
      
      // First, check if we're looking at a specific VCF file
      if (folder.endsWith('.vcf')) {
        const response = await fetch(`/api/nextcloud/files/content?path=${encodeURIComponent(`/files/cube-${session?.user?.id}/Private/Contacts/${folder}`)}`);
        if (response.ok) {
          const { content } = await response.json();
          const contacts = parseVCardContent(content);
          setContacts(contacts.map(contact => ({
            ...contact,
            group: folder.replace('.vcf', '')
          })));
        }
      } else {
        // If not a VCF file, list all VCF files in the folder
        const response = await fetch(`/api/nextcloud/files?folder=${folder}`);
        if (response.ok) {
          const files = await response.json();
          const vcfFiles = files.filter((file: any) => file.basename.endsWith('.vcf'));
          
          // Parse VCF files and extract contact information
          const parsedContacts = await Promise.all(
            vcfFiles.map(async (file: any) => {
              try {
                const contentResponse = await fetch(`/api/nextcloud/files/content?path=${encodeURIComponent(file.filename)}`);
                if (contentResponse.ok) {
                  const { content } = await contentResponse.json();
                  const contacts = parseVCardContent(content);
                  return contacts.map(contact => ({
                    ...contact,
                    group: file.basename.replace('.vcf', '')
                  }));
                }
                return [];
              } catch (error) {
                console.error('Error fetching VCF content:', error);
                return [];
              }
            })
          );
          
          // Flatten the array of contact arrays
          setContacts(parsedContacts.flat().filter(Boolean));
        }
      }
    } catch (error) {
      console.error('Error fetching contacts:', error);
      setContacts([]);
    } finally {
      setIsLoadingContacts(false);
    }
  };

  // Handle panel resizing
  const handleNavResize = (e: MouseEvent) => {
    if (!isDraggingNav) return;
    const newWidth = e.clientX;
    if (newWidth >= 48 && newWidth <= 400) {
      setNavWidth(newWidth);
    }
  };

  const handleNotesResize = (e: MouseEvent) => {
    if (!isDraggingNotes) return;
    const newWidth = e.clientX - navWidth - 2; // 2px for the resizer
    if (newWidth >= 200) {
      setNotesWidth(newWidth);
    }
  };

  const handleNoteSelect = (note: Note) => {
    setSelectedNote(note);
    if (isMobile) {
      setShowNotes(false);
    }
  };

  const handleNoteSave = async (note: Note) => {
    try {
      const endpoint = note.id ? '/api/nextcloud/files' : '/api/nextcloud/files';
      const method = note.id ? 'PUT' : 'POST';
      
      const response = await fetch(endpoint, {
        method,
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({
          id: note.id,
          title: note.title,
          content: note.content,
          folder: selectedFolder
        }),
      });

      if (!response.ok) {
        throw new Error('Failed to save note');
      }

      // After successful save, refresh the notes list
      const notesResponse = await fetch(`/api/nextcloud/files?folder=${selectedFolder}`);
      if (notesResponse.ok) {
        const updatedNotes = await notesResponse.json();
        setNotes(updatedNotes);
      }
    } catch (error) {
      console.error('Error saving note:', error);
    }
  };

  const handleFolderSelect = (folder: string) => {
    console.log('Selected folder:', folder);
    setSelectedFolder(folder);
    setLayoutMode("item-selection");
    // Reset selected contact when changing folders
    setSelectedContact(null);
  };

  const handleContactSelect = (contact: Contact) => {
    setSelectedContact(contact);
    if (isMobile) {
      setShowNotes(false);
    }
  };

  const handleNewNote = () => {
    setSelectedNote({
      id: '',
      title: '',
      content: '',
      lastModified: new Date().toISOString(),
      type: 'file',
      mime: 'text/markdown',
      etag: ''
    });
    if (isMobile) {
      setShowNotes(false);
    }
  };

  const handleDeleteNote = async (note: Note) => {
    try {
      const response = await fetch(`/api/nextcloud/files`, {
        method: 'DELETE',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({
          id: note.id,
          folder: selectedFolder
        }),
      });

      if (!response.ok) {
        throw new Error('Failed to delete note');
      }

      // Refresh the notes list
      const notesResponse = await fetch(`/api/nextcloud/files?folder=${selectedFolder}`);
      if (notesResponse.ok) {
        const updatedNotes = await notesResponse.json();
        setNotes(updatedNotes);
      }

      // If the deleted note was selected, clear the selection
      if (selectedNote?.id === note.id) {
        setSelectedNote(null);
      }
    } catch (error) {
      console.error('Error deleting note:', error);
    }
  };

  const handleContactSave = async (contact: Contact) => {
    if (!session?.user?.id) return;

    try {
      setIsLoading(true);
      
      // Always use Allemanique.vcf for new contacts
      const basePath = `/files/cube-${session.user.id}/Private/Contacts`;
      const vcfFile = 'Allemanique.vcf';
      const path = `${basePath}/${vcfFile}`;

      let vcfContent = '';
      let existingContacts: string[] = [];

      try {
        // Try to get existing contacts from the VCF file
        const response = await fetch(`/api/nextcloud/files/content?path=${encodeURIComponent(path)}`);
        if (response.ok) {
          const { content } = await response.json();
          // Split the content into individual vCards
          existingContacts = content.split('BEGIN:VCARD')
            .filter(section => section.trim())
            .map(section => 'BEGIN:VCARD' + section.trim());
        }
      } catch (error) {
        // If the file doesn't exist, we'll create it with just the new contact
        console.log('No existing VCF file found, will create a new one');
      }
      
      // Update or add the contact
      let updatedVcards: string[] = [];
      let contactUpdated = false;
      
      for (const vcard of existingContacts) {
        const parsed = parseVCard(vcard);
        if (parsed.uid?.[0]?.value === contact.id) {
          // Replace the existing contact
          const newVcard = [
            'BEGIN:VCARD',
            'VERSION:3.0',
            `UID:${contact.id}`,
            `FN:${contact.fullName || ''}`,
            ...(contact.email ? [`EMAIL;TYPE=INTERNET:${contact.email}`] : []),
            ...(contact.phone ? [`TEL;TYPE=CELL:${contact.phone}`] : []),
            ...(contact.organization ? [`ORG:${contact.organization}`] : []),
            ...(contact.address ? [`ADR:${contact.address}`] : []),
            ...(contact.notes ? [`NOTE:${contact.notes}`] : []),
            'END:VCARD'
          ].join('\n');
          updatedVcards.push(newVcard);
          contactUpdated = true;
        } else {
          // Keep the existing contact
          updatedVcards.push(vcard);
        }
      }
      
      // If contact wasn't found, add it as new
      if (!contactUpdated) {
        const newVcard = [
          'BEGIN:VCARD',
          'VERSION:3.0',
          `UID:${contact.id}`,
          `FN:${contact.fullName || ''}`,
          ...(contact.email ? [`EMAIL;TYPE=INTERNET:${contact.email}`] : []),
          ...(contact.phone ? [`TEL;TYPE=CELL:${contact.phone}`] : []),
          ...(contact.organization ? [`ORG:${contact.organization}`] : []),
          ...(contact.address ? [`ADR:${contact.address}`] : []),
          ...(contact.notes ? [`NOTE:${contact.notes}`] : []),
          'END:VCARD'
        ].join('\n');
        updatedVcards.push(newVcard);
      }
      
      // Join all vCards back together with proper spacing
      vcfContent = updatedVcards.join('\n\n');
      
      // Save the updated VCF file
      const saveResponse = await fetch('/api/nextcloud/files', {
        method: 'PUT',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({
          id: path,
          title: vcfFile,
          content: vcfContent,
          folder: 'Contacts',
          mime: 'text/vcard'
        }),
      });

      if (!saveResponse.ok) {
        throw new Error('Failed to save contact');
      }

      // Refresh the contacts list
      await fetchContacts(selectedFolder);
      
      // Update the selected contact if it was edited
      if (contactUpdated) {
        setSelectedContact(contact);
      }
    } catch (error) {
      console.error('Error saving contact:', error);
    } finally {
      setIsLoading(false);
    }
  };

  const handleContactDelete = async (contact: Contact) => {
    if (!confirm('Êtes-vous sûr de vouloir supprimer ce contact ?')) {
      return;
    }

    try {
      setIsLoading(true);
      
      // Determine the correct VCF file path
      const basePath = `/files/cube-${session?.user?.id}/Private/Contacts`;
      const vcfFile = contact.group ? `${contact.group}.vcf` : 'contacts.vcf';
      const path = `${basePath}/${vcfFile}`;

      // Get existing contacts from the VCF file
      const response = await fetch(`/api/nextcloud/files/content?path=${encodeURIComponent(path)}`);
      if (!response.ok) {
        throw new Error('Failed to fetch contacts');
      }
      
      const { content } = await response.json();
      
      // Split the content into individual vCards and filter out the one to delete
      const vcards = content.split('BEGIN:VCARD').filter(section => section.trim());
      const updatedVcards = vcards.filter(section => {
        const vcard = parseVCard('BEGIN:VCARD' + section);
        return vcard.uid?.[0]?.value !== contact.id;
      });
      
      // Join the remaining vCards back together
      const vcfContent = updatedVcards.map(section => 'BEGIN:VCARD' + section).join('\n');
      
      // Save the updated VCF file
      const saveResponse = await fetch('/api/nextcloud/files', {
        method: 'PUT',
        headers: {
          'Content-Type': 'application/json',
        },
        body: JSON.stringify({
          id: path,
          title: vcfFile,
          content: vcfContent,
          folder: 'Contacts',
          mime: 'text/vcard'
        }),
      });

      if (!saveResponse.ok) {
        throw new Error('Failed to delete contact');
      }

      // Clear selected contact and refresh list
      setSelectedContact(null);
      await fetchContacts(selectedFolder);
    } catch (error) {
      console.error('Error deleting contact:', error);
    } finally {
      setIsLoading(false);
    }
  };

  const generateVCardContent = (contact: Contact): string => {
    const vcard = {
      version: '3.0',
      uid: contact.id,
      fn: contact.fullName,
      email: contact.email ? [{ value: contact.email, type: 'INTERNET' }] : undefined,
      tel: contact.phone ? [{ value: contact.phone, type: 'CELL' }] : undefined,
      org: contact.organization ? [{ value: contact.organization }] : undefined,
      adr: contact.address ? [{ value: contact.address }] : undefined,
      note: contact.notes ? [{ value: contact.notes }] : undefined,
      categories: contact.group ? [{ value: contact.group }] : undefined
    };

    return formatVCard(vcard);
  };

  if (isLoading) {
    return (
      <div className="flex h-screen items-center justify-center">
        <div className="h-32 w-32 animate-spin rounded-full border-t-2 border-b-2 border-gray-900"></div>
      </div>
    );
  }

  return (
    <main className="w-full h-screen bg-black">
      <div className="w-full h-full px-4 pt-12 pb-4">
        <div className="flex h-full bg-carnet-bg">
          {/* Navigation Panel */}
          {showNav && (
            <>
              <div className="flex-none" style={{ width: navWidth }}>
                <Navigation 
                  nextcloudFolders={nextcloudFolders} 
                  onFolderSelect={handleFolderSelect}
                />
              </div>
              <PanelResizer
                isDragging={isDraggingNav}
                onDragStart={() => setIsDraggingNav(true)}
                onDragEnd={() => setIsDraggingNav(false)}
                onDrag={handleNavResize}
              />
            </>
          )}

          {/* Notes/Contacts Panel */}
          {showNotes && (
            <>
              <div className="flex-1 overflow-hidden">
                {selectedFolder === 'Contacts' ? (
                  <ContactsView
                    contacts={contacts}
                    onContactSelect={handleContactSelect}
                    selectedContact={selectedContact}
                    loading={isLoadingNotes}
                  />
                ) : (
                  <NotesView 
                    notes={notes}
                    loading={isLoadingNotes}
                    onNoteSelect={handleNoteSelect} 
                    currentFolder={selectedFolder}
                    onNewNote={handleNewNote}
                    onDeleteNote={handleDeleteNote}
                  />
                )}
              </div>

              {/* Notes Resizer */}
              <PanelResizer
                isDragging={isDraggingNotes}
                onDragStart={() => setIsDraggingNotes(true)}
                onDragEnd={() => setIsDraggingNotes(false)}
                onDrag={handleNotesResize}
              />
            </>
          )}

          {/* Editor Panel */}
          <div className="flex-1 overflow-hidden">
            {selectedFolder === 'Contacts' || selectedFolder.endsWith('.vcf') ? (
              <ContactDetails 
                contact={selectedContact} 
                onSave={handleContactSave}
                onDelete={handleContactDelete}
              />
            ) : (
              <Editor 
                note={selectedNote} 
                onSave={handleNoteSave}
                currentFolder={selectedFolder}
                onRefresh={() => {
                  // Refresh the notes list
                  fetch(`/api/nextcloud/files?folder=${selectedFolder}`)
                    .then(response => response.json())
                    .then(updatedNotes => {
                      if (selectedFolder === 'Contacts') {
                        setContacts(updatedNotes);
                      } else {
                        setNotes(updatedNotes);
                      }
                    })
                    .catch(error => console.error('Error refreshing data:', error));
                }}
              />
            )}
          </div>

          {/* Mobile Navigation Toggle */}
          {isMobile && (
            <button
              onClick={() => setShowNav(!showNav)}
              className="fixed bottom-4 right-4 bg-primary text-white p-3 rounded-full shadow-lg"
            >
              {showNav ? <X className="h-6 w-6" /> : <Menu className="h-6 w-6" />}
            </button>
          )}
        </div>
      </div>
    </main>
  );
}