// contexts/WindowManagerContext.tsx

'use client';

import React, { createContext, useContext, useState, useEffect } from 'react';

type WindowData = {
  name: string;
  Component: React.ComponentType;
  windowProps: {
    width?: string;
    height?: string;
  };
};

type WindowState = {
  visible: boolean;
  minimized: boolean;
  maximized: boolean;
  width: number;
  height: number;
  x: number;
  y: number;
  zIndex: number;
  prevWidth?: number;
  prevHeight?: number;
  prevX?: number;
  prevY?: number;
};

type WindowManagerContextType = {
  windows: { [key: string]: WindowData };
  windowStates: { [key: string]: WindowState };
  openWindow: (name: string) => void;
  closeWindow: (name: string) => void;
  minimizeWindow: (name: string) => void;
  restoreWindow: (name: string) => void;
  maximizeWindow: (name: string) => void;
  updateWindowState: (name: string, newState: Partial<WindowState>) => void;
  bringToFront: (name: string) => void;
};

const WindowManagerContext = createContext<WindowManagerContextType | undefined>(undefined);

export const useWindowManager = () => {
  const context = useContext(WindowManagerContext);
  if (!context) {
    throw new Error('useWindowManager must be used within a WindowManagerProvider');
  }
  return context;
};

export const WindowManagerProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
  const [windows, setWindows] = useState<{ [key: string]: WindowData }>({});
  const [windowStates, setWindowStates] = useState<{ [key: string]: WindowState }>({});
  const [nextZIndex, setNextZIndex] = useState(1);

  useEffect(() => {
    // Dynamically import window components
    const importWindows = async () => {
      const windowsContext = require.context('../windows', false, /\.tsx$/);
      const windowFiles = windowsContext.keys();

      let zIndexCounter = 1;

      const windowsDataPromises = windowFiles.map(async (file: string, index: number) => {
        const mod = await windowsContext(file);
        const name = file.replace('./', '').replace('.tsx', '');
        const Component = mod.default;
        const windowProps = mod.windowProps || {};

        // Parse initial size
        const width = windowProps.width
          ? parseSize(windowProps.width, 'width')
          : 0.35 * window.innerWidth;
        const height = windowProps.height
          ? parseSize(windowProps.height, 'height')
          : 0.2 * window.innerHeight;

        const windowData: WindowData = { name, Component, windowProps };
        const windowState: WindowState = {
          visible: true,
          minimized: false,
          maximized: false,
          width,
          height,
          x: 100 + index * 50,
          y: 100 + index * 50,
          zIndex: zIndexCounter++,
        };

        return { windowData, windowState };
      });

      const windowsDataArray = await Promise.all(windowsDataPromises);

      const newWindows: { [key: string]: WindowData } = {};
      const newWindowStates: { [key: string]: WindowState } = {};

      windowsDataArray.forEach(({ windowData, windowState }) => {
        newWindows[windowData.name] = windowData;
        newWindowStates[windowData.name] = windowState;
      });

      setWindows(newWindows);
      setWindowStates(newWindowStates);
      setNextZIndex(zIndexCounter);
    };

    importWindows();
  }, []);

  const bringToFront = (name: string) => {
    setWindowStates((prev) => {
      const maxZ = nextZIndex;
      setNextZIndex(maxZ + 1);
      return {
        ...prev,
        [name]: {
          ...prev[name],
          zIndex: maxZ,
        },
      };
    });
  };

  const openWindow = (name: string) => {
    setWindowStates((prev) => ({
      ...prev,
      [name]: {
        ...prev[name],
        visible: true,
        minimized: false,
      },
    }));
    bringToFront(name);
  };

  const closeWindow = (name: string) => {
    setWindowStates((prev) => ({
      ...prev,
      [name]: {
        ...prev[name],
        visible: false,
        minimized: false,
      },
    }));
  };

  const minimizeWindow = (name: string) => {
    setWindowStates((prev) => ({
      ...prev,
      [name]: {
        ...prev[name],
        minimized: true,
        visible: false,
      },
    }));
  };

  const restoreWindow = (name: string) => {
    setWindowStates((prev) => ({
      ...prev,
      [name]: {
        ...prev[name],
        minimized: false,
        visible: true,
      },
    }));
    bringToFront(name);
  };

  const maximizeWindow = (name: string) => {
    setWindowStates((prev) => {
      const state = prev[name];
      const isMaximized = !state.maximized;

      if (isMaximized) {
        // Store previous size and position
        const prevSizePosition = {
          prevWidth: state.width,
          prevHeight: state.height,
          prevX: state.x,
          prevY: state.y,
        };

        return {
          ...prev,
          [name]: {
            ...state,
            maximized: true,
            ...prevSizePosition,
            x: 0,
            y: 0,
            width: window.innerWidth,
            height: window.innerHeight,
          },
        };
      } else {
        // Restore previous size and position
        return {
          ...prev,
          [name]: {
            ...state,
            maximized: false,
            width: state.prevWidth || state.width,
            height: state.prevHeight || state.height,
            x: state.prevX || state.x,
            y: state.prevY || state.y,
          },
        };
      }
    });
    bringToFront(name);
  };

  const updateWindowState = (name: string, newState: Partial<WindowState>) => {
    setWindowStates((prev) => ({
      ...prev,
      [name]: {
        ...prev[name],
        ...newState,
      },
    }));
  };

  function parseSize(size: string, dimension: 'width' | 'height'): number {
    if (typeof window === 'undefined') return 400;
    if (size.endsWith('%')) {
      const percentage = parseFloat(size) / 100;
      if (dimension === 'width') {
        return percentage * window.innerWidth;
      } else {
        return percentage * window.innerHeight;
      }
    } else if (size.endsWith('px')) {
      return parseFloat(size);
    } else {
      return dimension === 'width' ? 400 : 300;
    }
  }

  return (
    <WindowManagerContext.Provider
      value={{
        windows,
        windowStates,
        openWindow,
        closeWindow,
        minimizeWindow,
        restoreWindow,
        maximizeWindow,
        updateWindowState,
        bringToFront,
      }}
    >
      {children}
    </WindowManagerContext.Provider>
  );
};

ERRORS:

[{
	"resource": "/workspaces/gdrl-dev-testing-1/contexts/WindowManagerContext.tsx",
	"owner": "typescript",
	"code": "2339",
	"severity": 8,
	"message": "Property 'context' does not exist on type 'NodeRequire'.",
	"source": "ts",
	"startLineNumber": 61,
	"startColumn": 38,
	"endLineNumber": 61,
	"endColumn": 45
},{
	"resource": "/workspaces/gdrl-dev-testing-1/contexts/WindowManagerContext.tsx",
	"owner": "typescript",
	"code": "7031",
	"severity": 8,
	"message": "Binding element 'windowData' implicitly has an 'any' type.",
	"source": "ts",
	"startLineNumber": 100,
	"startColumn": 35,
	"endLineNumber": 100,
	"endColumn": 45
},{
	"resource": "/workspaces/gdrl-dev-testing-1/contexts/WindowManagerContext.tsx",
	"owner": "typescript",
	"code": "7031",
	"severity": 8,
	"message": "Binding element 'windowState' implicitly has an 'any' type.",
	"source": "ts",
	"startLineNumber": 100,
	"startColumn": 47,
	"endLineNumber": 100,
	"endColumn": 58
}]

Fix these errors