import React, {ReactNode} from 'react';
import EmptyListSvg from "../../SVG/EmptyListSvg";
import EmptyListSvgDark from "../../SVG/EmptyListSvgDark";
import './empty-list.scss'

type EmptyListProps = {
    children?: ReactNode
}

const EmptyList = ({ children }: EmptyListProps) => {
    const isDarkTheme = document.documentElement.getAttribute('data-theme') === 'dark';
    const SvgComponent = isDarkTheme ? EmptyListSvgDark : EmptyListSvg; // Renamed to SvgComponent for clarity

    return (
        <div id={'empty-list'}>
            <p>
                {children}
            </p>
            <SvgComponent /> {/* Render the SVG component */}
        </div>
    );
};

export default EmptyList;