'use client';

import { createContext, useContext, useState } from 'react';
import type { ReactNode } from 'react';

interface PageHeader {
  title: string;
  subtitle?: string;
  crumbs?: string[];
  actions?: ReactNode;
}

interface PageHeaderContextValue {
  header: PageHeader;
  setHeader: (h: PageHeader) => void;
}

const PageHeaderContext = createContext<PageHeaderContextValue | null>(null);

export function PageHeaderProvider({ children }: { children: ReactNode }) {
  const [header, setHeader] = useState<PageHeader>({ title: 'MeshiTrack' });
  return (
    <PageHeaderContext.Provider value={{ header, setHeader }}>
      {children}
    </PageHeaderContext.Provider>
  );
}

export function usePageHeader(): PageHeaderContextValue {
  const ctx = useContext(PageHeaderContext);
  // Return a no-op when rendered outside the provider (e.g. in unit tests).
  if (!ctx) {
    return {
      header: { title: '' },

      setHeader: () => {},
    };
  }
  return ctx;
}
