import {
    ORGANIZATION_HEADER_MODES,
    useOrganizationHeaderStore,
} from "@core/Store/OrganizationHeader.Store";
import style from "./OrganizationContent.module.css";
import classNames from "classnames";

export interface OrganizationContentParams {
    children: React.ReactNode;
}

export default function OrganizationContent(props: OrganizationContentParams) {
    const organizationHeader = useOrganizationHeaderStore();

    const getClassNames = () => {
        const classList: classNames.ArgumentArray = [];

        classList.push(style.organizationContent);

        if (organizationHeader.state === ORGANIZATION_HEADER_MODES.LARGE) {
            classList.push(style.organizationContentLarge);
        } else if (organizationHeader.state === ORGANIZATION_HEADER_MODES.SMALL) {
            classList.push(style.organizationContentSmall);
        }

        return classNames(classList);
    };

    return (
        <>
            <div className={getClassNames()}>
                <div className={style.organizationMargins}>{props.children}</div>
            </div>
        </>
    );
}
