Refactor GTM Architect to v2: Python-driven architecture, 9-phase process, new DB and Docker setup

k-pop-thumbnail-genie/contexts/LoggingContext.tsx

@@ -0,0 +1,45 @@
+
+import React, { createContext, useState, useContext, useCallback } from 'react';
+
+export type LogType = 'info' | 'success' | 'error' | 'warn';
+
+export interface LogMessage {
+  type: LogType;
+  message: string;
+  timestamp: string;
+}
+
+interface LoggingContextType {
+  logs: LogMessage[];
+  log: (type: LogType, message: string) => void;
+  clearLogs: () => void;
+}
+
+const LoggingContext = createContext<LoggingContextType | undefined>(undefined);
+
+export const LoggingProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  const [logs, setLogs] = useState<LogMessage[]>([]);
+
+  const log = useCallback((type: LogType, message: string) => {
+    const timestamp = new Date().toLocaleTimeString();
+    setLogs(prevLogs => [...prevLogs, { type, message, timestamp }]);
+  }, []);
+  
+  const clearLogs = useCallback(() => {
+    setLogs([]);
+  }, []);
+
+  return (
+    <LoggingContext.Provider value={{ logs, log, clearLogs }}>
+      {children}
+    </LoggingContext.Provider>
+  );
+};
+
+export const useLogger = (): LoggingContextType => {
+  const context = useContext(LoggingContext);
+  if (context === undefined) {
+    throw new Error('useLogger must be used within a LoggingProvider');
+  }
+  return context;
+};