import type { IIssueDisplayProperties } from "@buzzwaretech/types";
import { observer } from "mobx-react";
import type { ReactNode } from "react";

interface IWithDisplayPropertiesHOC {
  displayProperties: IIssueDisplayProperties;
  shouldRenderProperty?: (
    displayProperties: IIssueDisplayProperties,
  ) => boolean;
  displayPropertyKey:
    | keyof IIssueDisplayProperties
    | (keyof IIssueDisplayProperties)[];
  children: ReactNode;
}

export const WithDisplayPropertiesHOC = observer(
  function WithDisplayPropertiesHOC({
    displayProperties,
    shouldRenderProperty,
    displayPropertyKey,
    children,
  }: IWithDisplayPropertiesHOC) {
    let shouldDisplayPropertyFromFilters = false;
    if (Array.isArray(displayPropertyKey))
      shouldDisplayPropertyFromFilters = displayPropertyKey.every(
        (key) => !!displayProperties[key],
      );
    else
      shouldDisplayPropertyFromFilters =
        !!displayProperties[displayPropertyKey];

    const renderProperty =
      shouldDisplayPropertyFromFilters &&
      (shouldRenderProperty ? shouldRenderProperty(displayProperties) : true);

    if (!renderProperty) return null;

    return <>{children}</>;
  },
);