'use client';
import { useState, useEffect, useCallback, useMemo } from 'react';
/**
 * Parse URL hash into route state
 * 
 * URL Schema:
 * - #tab                              → Tab only, show default content (docs view)
 * - #tab/page/{slug}                  → Doc page (docs view)
 * - #tab/endpoint/{id}                → API endpoint (docs view)
 * - #tab/endpoint/{id}/playground     → API endpoint (playground view)
 * - #tab/endpoint/{id}/notes          → API endpoint (notes view)
 * - #tab/page/{slug}/notes            → Doc page (notes view)
 */ function parseHash(hash) {
    // Remove leading # if present
    const cleanHash = hash.startsWith('#') ? hash.slice(1) : hash;
    // Default state
    const defaultState = {
        tab: null,
        contentType: null,
        contentId: null,
        view: 'docs',
        hash: cleanHash
    };
    if (!cleanHash) {
        return defaultState;
    }
    // Split hash into parts: tab/type/id[/view]
    const parts = cleanHash.split('/');
    const tab = parts[0] || null;
    const type = parts[1] || null;
    // Check if last part is a view mode
    const lastPart = parts[parts.length - 1];
    const isViewSuffix = lastPart === 'playground' || lastPart === 'notes';
    const view = isViewSuffix ? lastPart : 'docs';
    // Get ID (everything between type and view, or type and end)
    const idParts = isViewSuffix ? parts.slice(2, -1) : parts.slice(2);
    const id = idParts.join('/') || null;
    // Parse content type
    let contentType = null;
    if (type === 'endpoint') {
        contentType = 'endpoint';
    } else if (type === 'page') {
        contentType = 'page';
    } else if (type === 'section') {
        contentType = 'section';
    }
    return {
        tab,
        contentType,
        contentId: id,
        view,
        hash: cleanHash
    };
}
/**
 * Get the current hash from window.location
 */ function getCurrentHash() {
    if (typeof window === 'undefined') return '';
    return window.location.hash;
}
/**
 * Hook that provides URL-based route state
 * 
 * This hook is the single source of truth for page/content selection.
 * It automatically updates when the URL hash changes (via navigation or browser back/forward).
 * 
 * @example
 * const { tab, contentType, contentId } = useRouteState()
 * 
 * // Render based on content type
 * if (contentType === 'page') {
 *   return <DocPage slug={contentId} />
 * }
 */ export function useRouteState() {
    const [hash, setHash] = useState(()=>getCurrentHash());
    // Parse hash into route state
    const state = useMemo(()=>parseHash(hash), [
        hash
    ]);
    // Listen for hash changes
    useEffect(()=>{
        const handleHashChange = ()=>{
            setHash(getCurrentHash());
        };
        // Listen for both hashchange and popstate (browser back/forward)
        window.addEventListener('hashchange', handleHashChange);
        window.addEventListener('popstate', handleHashChange);
        // Set initial hash (in case it was set before this effect ran)
        handleHashChange();
        return ()=>{
            window.removeEventListener('hashchange', handleHashChange);
            window.removeEventListener('popstate', handleHashChange);
        };
    }, []);
    return state;
}
/**
 * Hook that provides navigation functions for updating the URL
 * 
 * @param defaultTab - Default tab to use when navigating
 * @returns Navigation functions
 */ export function useRouteNavigation(defaultTab) {
    const navigateToPage = useCallback((slug, tab, view)=>{
        const targetTab = tab || defaultTab || '';
        const viewSuffix = view && view !== 'docs' ? `/${view}` : '';
        window.location.hash = targetTab ? `${targetTab}/page/${slug}${viewSuffix}` : `page/${slug}${viewSuffix}`;
    }, [
        defaultTab
    ]);
    const navigateToEndpoint = useCallback((id, tab, view)=>{
        const targetTab = tab || defaultTab || '';
        const viewSuffix = view && view !== 'docs' ? `/${view}` : '';
        window.location.hash = targetTab ? `${targetTab}/endpoint/${id}${viewSuffix}` : `endpoint/${id}${viewSuffix}`;
    }, [
        defaultTab
    ]);
    const navigateToSection = useCallback((sectionId, tab)=>{
        const targetTab = tab || defaultTab || '';
        window.location.hash = targetTab ? `${targetTab}/section/${sectionId}` : `section/${sectionId}`;
    }, [
        defaultTab
    ]);
    const navigateToTab = useCallback((tab)=>{
        window.location.hash = tab;
    }, []);
    const clearSelection = useCallback((tab)=>{
        const targetTab = tab || defaultTab;
        if (targetTab) {
            window.location.hash = targetTab;
        } else {
            // Remove hash entirely
            window.history.pushState(null, '', window.location.pathname + window.location.search);
        }
    }, [
        defaultTab
    ]);
    return {
        navigateToPage,
        navigateToEndpoint,
        navigateToSection,
        navigateToTab,
        clearSelection
    };
}
/**
 * Utility to build hash URLs (for href attributes)
 */ export const buildHashUrl = {
    page: (tab, slug, view)=>{
        const viewSuffix = view && view !== 'docs' ? `/${view}` : '';
        return `#${tab}/page/${slug}${viewSuffix}`;
    },
    endpoint: (tab, id, view)=>{
        const viewSuffix = view && view !== 'docs' ? `/${view}` : '';
        return `#${tab}/endpoint/${id}${viewSuffix}`;
    },
    section: (tab, sectionId)=>`#${tab}/section/${sectionId}`,
    tab: (tab)=>`#${tab}`
};
export { parseHash };
