// src/theme.ts
import * as Colours from "@mui/material/colors"
import { createTheme, ThemeOptions } from '@mui/material/styles';
import {
  getPrimaryColour,
  getSecondaryColour,
} from "../services/whiteLabel";

const baseTheme: ThemeOptions = {
  palette: {
    mode: 'light', // default mode; will be overridden by system if needed
    primary: {
      main: '#1976d2',
    },
    background: {
      default: '#ffffff',
      paper: '#f5f5f5',
    },
  },
  typography: {
    fontFamily: [
      "Open Sans",
      "-apple-system",
      "BlinkMacSystemFont",
      '"Segoe UI"',
      '"Helvetica Neue"',
      "Arial",
      "sans-serif",
      '"Apple Color Emoji"',
      '"Segoe UI Emoji"',
      '"Segoe UI Symbol"'
    ].join(",")
  }
  // Add other options if needed
};

function makePaletteColor(name: keyof typeof Colours) {
  if (name.startsWith("#")) {
    return { main: name };
  }
  const ramp = Colours[name] as Record<number, string>; // e.g., blue[500], blue[300], etc.
  return {
    main: ramp[500],
    light: ramp[300],
    dark: ramp[700],
  };
}

export const getTheme = (mode: 'light' | 'dark') =>
  createTheme({
    ...baseTheme,
    palette: {
      ...baseTheme.palette,
      primary: makePaletteColor(getPrimaryColour()),
      secondary: makePaletteColor(getSecondaryColour()),
      mode,
      ...(mode === 'dark'
        ? {
            background: {
              default: '#121212',
              paper: '#1e1e1e',
            },
          }
        : {
          background: {
            default: "#e5e5e5",
            paper: "#f0f0f0",
          },
        }),
    },
  });
