import { ConfigProvider, Layout, type LayoutProps, theme } from 'antd';
import React from 'react';

const { Content } = Layout;

/** * ThemeWrapper component that wraps the application with Ant Design's ConfigProvider to apply the selected theme
 * @param children - The content to be wrapped by the theme provider
 */
const ThemeWrapper: React.FC<LayoutProps> = ({ children, ...restProps }) => {
  const localTheme = localStorage.getItem('navTheme');
  return (
    <ConfigProvider
      theme={{
        algorithm:
          localTheme === 'realDark'
            ? theme.darkAlgorithm
            : theme.defaultAlgorithm,
      }}
    >
      <Layout>
        <Content {...restProps}>{children}</Content>
      </Layout>
    </ConfigProvider>
  );
};
export default ThemeWrapper;