page adn app header mods

frontend/src/context/PageContext.tsx

@@ -0,0 +1,48 @@
+/**
+ * Page Context - Shares current page info with header
+ * Allows pages to set title, breadcrumb, badge for display in AppHeader
+ */
+import React, { createContext, useContext, useState, ReactNode } from 'react';
+
+interface PageInfo {
+  title: string;
+  breadcrumb?: string;
+  badge?: {
+    icon: ReactNode;
+    color: 'blue' | 'green' | 'purple' | 'orange' | 'red' | 'indigo';
+  };
+}
+
+interface PageContextType {
+  pageInfo: PageInfo | null;
+  setPageInfo: (info: PageInfo | null) => void;
+}
+
+const PageContext = createContext<PageContextType | undefined>(undefined);
+
+export function PageProvider({ children }: { children: ReactNode }) {
+  const [pageInfo, setPageInfo] = useState<PageInfo | null>(null);
+
+  return (
+    <PageContext.Provider value={{ pageInfo, setPageInfo }}>
+      {children}
+    </PageContext.Provider>
+  );
+}
+
+export function usePageContext() {
+  const context = useContext(PageContext);
+  if (context === undefined) {
+    throw new Error('usePageContext must be used within a PageProvider');
+  }
+  return context;
+}
+
+export function usePage(info: PageInfo) {
+  const { setPageInfo } = usePageContext();
+  
+  React.useEffect(() => {
+    setPageInfo(info);
+    return () => setPageInfo(null);
+  }, [info.title, info.breadcrumb]);
+}