import { useCurrentBreakpoint } from "../use-current-breakpoint";

import type { BpAware } from "../../../theme/types";

export const useBpAwareProp = <T extends string | number | boolean>(
  prop: BpAware<T> | undefined,
  defaultValue: T
): T => {
  const currentBreakpoint = useCurrentBreakpoint();

  if (prop === undefined) {
    return defaultValue;
  }

  if (typeof prop !== "object") {
    return prop;
  }

  return currentBreakpoint in prop ? (prop[currentBreakpoint] as T) : defaultValue;
};