// @flow
import type { ThemeProps } from '../../../types';
import {
  type SpaceProps,
  getEffectiveSpaceValue,
  getSpacingTop,
  getSpacingLeft,
  getSpacingRight,
  getSpacingBottom,
} from '../../../mixins/spacing';
import { bpMedium, type BreakPoint } from '../../../breakpoints';

const getPaddingAdjustedRadius = (
  theme,
  effectiveSpaceValue,
  getDim1,
  getDim2,
) => {
  if (effectiveSpaceValue == null) {
    return theme.cardBorderRadius;
  }

  const paddingDim1 = getDim1(theme, effectiveSpaceValue, 'p');
  const paddingDim2 = getDim2(theme, effectiveSpaceValue, 'p');

  if (
    (paddingDim1 && paddingDim1 !== '0') ||
    (paddingDim2 && paddingDim2 !== '0')
  ) {
    return 0;
  }

  return theme.cardBorderRadius;
};

export const getBottomBorderRadius = ({ theme }: ThemeProps) =>
  theme.cardBorderRadius;

export const getTopBorderRadius = ({
  theme,
  flatTopCorners,
}: {
  ...ThemeProps,
  flatTopCorners: boolean,
}) => {
  if (flatTopCorners) {
    return 0;
  }

  return theme.cardBorderRadius;
};

export const getItemBorderRadiusTopLeft = ({
  theme,
  spacing,
  flatTopCorners,
  currentBreakpoint,
}: {
  ...ThemeProps,
  ...SpaceProps,
  flatTopCorners: boolean,
  currentBreakpoint: BreakPoint,
}) => {
  if (flatTopCorners) {
    return 0;
  }

  return getPaddingAdjustedRadius(
    theme,
    getEffectiveSpaceValue(spacing, currentBreakpoint),
    getSpacingTop,
    getSpacingLeft,
  );
};

export const getItemBorderRadiusTopRight = ({
  theme,
  spacing,
  flatTopCorners,
  currentBreakpoint,
}: {
  ...ThemeProps,
  ...SpaceProps,
  flatTopCorners: boolean,
  currentBreakpoint: BreakPoint,
}) => {
  if (flatTopCorners) {
    return 0;
  }

  return getPaddingAdjustedRadius(
    theme,
    getEffectiveSpaceValue(spacing, currentBreakpoint),
    getSpacingTop,
    getSpacingRight,
  );
};

export const getItemBorderRadiusBottomLeft = ({
  theme,
  spacing,
  currentBreakpoint,
}: {
  ...ThemeProps,
  ...SpaceProps,
  currentBreakpoint: BreakPoint,
}) =>
  getPaddingAdjustedRadius(
    theme,
    getEffectiveSpaceValue(spacing, currentBreakpoint),
    getSpacingBottom,
    getSpacingLeft,
  );

export const getItemBorderRadiusBottomRight = ({
  theme,
  spacing,
  currentBreakpoint,
}: {
  ...ThemeProps,
  ...SpaceProps,
  currentBreakpoint: BreakPoint,
}) =>
  getPaddingAdjustedRadius(
    theme,
    getEffectiveSpaceValue(spacing, currentBreakpoint),
    getSpacingBottom,
    getSpacingRight,
  );

export const getFullWidthMediaQuery = ({
  hasTargetElement,
}: {
  hasTargetElement: boolean,
}) => {
  if (hasTargetElement) {
    return `
    @media (max-width: ${bpMedium}) {
      left: 0;
      right: 0;
      min-width: auto;
    }
  `;
  }
};
