import React from "react";
import { Row } from "antd/lib/grid";
import classNames from "classnames";

import { FLAGS, useFeatureIsOn } from "@komi-app/flags-sdk";

import ProfileHeaderModule from "./ProfileHeaderModule";
import "./ProfileHeader.scss";

interface ProfileHeaderProps {
  className?: string;
}

const ProfileHeader: React.FC<ProfileHeaderProps> = ({ className }) => {
  const isHeaderFixEnabled = useFeatureIsOn(FLAGS.FIX_GS_107_HEADER_BACKGROUND);

  return (
    <div
      className={classNames(
        isHeaderFixEnabled ? "profile-editor-header" : "profile-header", // Fixes classname collision with @komi-app/components
        className
      )}
    >
      <Row data-testid="profile-header__wrapper">
        <ProfileHeaderModule />
      </Row>
    </div>
  );
};

export default ProfileHeader;
