import m from 'mithril';
import { Layout } from './layout';
import { 
  RecentActivity, 
  BuildStatus, 
  PartitionsList, 
  PartitionStatus, 
  JobsList, 
  JobMetrics, 
  GraphAnalysis 
} from './pages';
import { decodePartitionRef } from './utils';

export const appName = "databuild";

// Wrapper components that include layout
const LayoutWrapper = (component: any) => ({
  view: (vnode: any) => m(Layout, m(component, vnode.attrs))
});

// Route definitions
const routes = {
  '/': LayoutWrapper(RecentActivity),
  '/builds/:id': LayoutWrapper(BuildStatus),
  '/partitions': LayoutWrapper(PartitionsList),
  '/partitions/:base64_ref': LayoutWrapper(PartitionStatus),
  '/jobs': LayoutWrapper(JobsList),
  '/jobs/:label': LayoutWrapper(JobMetrics),
  '/analyze': LayoutWrapper(GraphAnalysis),
};

if (typeof window !== "undefined") {
    document.addEventListener("DOMContentLoaded", () => {
        // Initialize theme from localStorage
        const savedTheme = localStorage.getItem('theme') || 'databuild-light';
        document.documentElement.setAttribute('data-theme', savedTheme);
        
        // Set up routing
        m.route(document.getElementById('app') as HTMLElement, '/', routes);
    });
}